This repository has been archived by the owner on Jul 4, 2023. It is now read-only.
-
-
Notifications
You must be signed in to change notification settings - Fork 9
/
Copy pathindex.html
131 lines (123 loc) · 6.09 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>LinkFree Profile Generator</title>
<meta name="description" content="LinkFree Profile JSON Generator">
<meta name="author" content="Tom Schmelzer">
<meta property="og:title" content="LinkFree Profile Generator">
<meta property="og:type" content="A website that allows you to generate profile JSON schema for FREE!">
<meta property="og:image" content="media/og-icon.png">
<meta property="og:url" content="https://schmelto.github.io/LinkFree_generator/">
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-0evHe/X+R7YkIZDRvuzKMRqM+OrBnVFBL6DOitfPri4tjfHxaWutUpFmBp4vmVor" crossorigin="anonymous">
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<main class="container py-5 w-75 mx-auto">
<div class="text-center">
<h1>LinkFree Profile Generator</h1>
<a href="https://github.com/schmelto/LinkFree_generator">
<small id="app-version" class="badge text-bg-success">app-version</small>
</a>
</div>
<hr>
<form method="post" id="form-generator" class="needs-validation" novalidate>
<div class="input-group mb-3">
<span class="input-group-text">@</span>
<input id="username" type="text" class="form-control" placeholder="GitHub username"
aria-label="Username" aria-describedby="username" required>
<div class="valid-feedback">Looks good!</div>
<div class="invalid-feedback">Please fill your Github Username!</div>
</div>
<div class="input-group mb-3">
<span class="input-group-text" id="">First and Last Name</span>
<input type="text" id="firstname" class="form-control" placeholder="Max" required>
<input type="text" id="lastname" class="form-control" placeholder="Mustermann" required>
<div class="valid-feedback">Looks good!</div>
<div class="invalid-feedback">Please fill your Firstname and Lastname!</div>
</div>
<div class="input-group mb-3">
<label class="input-group-text" for="type">Profile Type</label>
<select class="form-select" id="type" required>
<option value="personal" selected>Personal</option>
<option value="community">Community</option>
</select>
<div class="valid-feedback">Looks good!</div>
<div class="invalid-feedback">Please select type of profile!</div>
</div>
<div class="input-group mb-3">
<span class="input-group-text">Bio</span>
<textarea class="form-control" id="bio" aria-label="Bio" placeholder="I am Street Programmer"
required></textarea>
<div class="valid-feedback">Looks good!</div>
<div class="invalid-feedback">Please fill your short bio!</div>
</div>
<h2>Links</h2>
<div class="card">
<div class="card-body">
<table id="myTable" class="table order-list">
<thead>
<tr>
<td>Name</td>
<td>URL</td>
<td>Icon</td>
<td> </td>
</tr>
</thead>
<tbody>
</tbody>
</table>
<div class="d-grid">
<button type="button" class="btn btn-primary" id="addrow">Add Row</button>
</div>
</div>
</div>
</div>
<br>
<h2>Milestones</h2>
<div class="card">
<div class="card-body">
<table id="milestones" class="table order-list2">
<thead>
<tr>
<td>Title</td>
<td>Date</td>
<td>Icon</td>
<td>Color</td>
<td>Description</td>
<td>URL</td>
<td> </td>
</tr>
</thead>
<tbody>
</tbody>
</table>
<div class="d-grid">
<button type="button" class="btn btn-primary" id="addrowmilestone">Add Row</button>
</div>
</div>
</div>
<br>
<div class="d-grid">
<button type="submit" id="generate_json" class="btn btn-dark">{ Generate JSON }</button>
</div>
</form>
<div id="json-container" class="d-none">
<button type="button" id="copyToClipboard" class="btn btn-light shadow-sm"
onclick="CopyToClipboard('json-output')">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor"
class="bi bi-clipboard" viewBox="0 0 16 16">
<path
d="M4 1.5H3a2 2 0 0 0-2 2V14a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V3.5a2 2 0 0 0-2-2h-1v1h1a1 1 0 0 1 1 1V14a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V3.5a1 1 0 0 1 1-1h1v-1z" />
<path
d="M9.5 1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-3a.5.5 0 0 1-.5-.5v-1a.5.5 0 0 1 .5-.5h3zm-3-1A1.5 1.5 0 0 0 5 1.5v1A1.5 1.5 0 0 0 6.5 4h3A1.5 1.5 0 0 0 11 2.5v-1A1.5 1.5 0 0 0 9.5 0h-3z" />
</svg> <span id="text-helper-clipboard">Copy to Clipboard</span>
</button>
<pre id="json-output" class="mt-3"></pre>
</div>
</main>
<script src="https://code.jquery.com/jquery-1.11.1.min.js"></script>
<script src="js/scripts.js"></script>
</body>
</html>