Skip to content

Commit 182e2b8

Browse files
mathdroidmathdroid
committed
fix placeholder
1 parent 56d8def commit 182e2b8

File tree

1 file changed

+121
-61
lines changed

1 file changed

+121
-61
lines changed

‎static/index.html

+121-61
Original file line numberDiff line numberDiff line change
@@ -1,77 +1,137 @@
11
<!DOCTYPE html>
22
<html lang="en" class="h-full">
3-
<head>
4-
<meta charset="UTF-8">
5-
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6-
<meta http-equiv="X-UA-Compatible" content="ie=edge">
7-
<title>mathdroid's Guestbook</title>
8-
<link href="https://unpkg.com/tailwindcss@^1.0/dist/tailwind.min.css" rel="stylesheet">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
6+
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
7+
<title>mathdroid's Guestbook</title>
8+
<link
9+
href="https://unpkg.com/tailwindcss@^1.0/dist/tailwind.min.css"
10+
rel="stylesheet"
11+
/>
912

10-
<style>
11-
@keyframes spin {
12-
from { transform: rotate(0deg); }
13-
to { transform: rotate(360deg); }
14-
}
13+
<style>
14+
@keyframes spin {
15+
from {
16+
transform: rotate(0deg);
17+
}
18+
to {
19+
transform: rotate(360deg);
20+
}
21+
}
1522

16-
.spinner {
17-
animation: spin infinite 1000ms linear;
18-
}
19-
</style>
20-
</head>
23+
.spinner {
24+
animation: spin infinite 1000ms linear;
25+
}
26+
</style>
27+
</head>
2128

22-
<body class="bg-gray-100 flex justify-center items-center h-full">
23-
<main class="p-6 mx-auto bg-white border mb-6 shadow-xl max-w-full rounded-lg" style="width: 24rem">
24-
<div class="js-logged-out text-center">
25-
<h1 class="text-4xl font-bold mb-6">👋 Hello!</h1>
26-
<p>Login with your GitHub account to sign<br>my guestbook ✨</p>
27-
<button class="js-login-btn mt-6 bg-green-500 hover:bg-green-700 text-white font-bold py-2 px-4 rounded">
28-
<svg class="fill-current inline align-middle mr-1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.013 8.013 0 0016 8c0-4.42-3.58-8-8-8z"></path></svg>
29-
Login
30-
</button>
31-
</div>
32-
33-
<div class="js-logged-in" style="display: none">
34-
<div class="flex items-center justify-center mb-6">
35-
<img class="w-16 h-16 rounded-full js-user-img">
36-
<span class="mx-3">📝</span>
37-
<img class="w-16 h-16 rounded-full" src="https://github.com/mathdroid.png" alt="@mathdroid">
29+
<body class="bg-gray-100 flex justify-center items-center h-full">
30+
<main
31+
class="p-6 mx-auto bg-white border mb-6 shadow-xl max-w-full rounded-lg"
32+
style="width: 24rem;"
33+
>
34+
<div class="js-logged-out text-center">
35+
<h1 class="text-4xl font-bold mb-6">👋 Hello!</h1>
36+
<p>Login with your GitHub account to sign<br />my guestbook ✨</p>
37+
<button
38+
class="js-login-btn mt-6 bg-green-500 hover:bg-green-700 text-white font-bold py-2 px-4 rounded"
39+
>
40+
<svg
41+
class="fill-current inline align-middle mr-1"
42+
xmlns="http://www.w3.org/2000/svg"
43+
viewBox="0 0 16 16"
44+
width="16"
45+
height="16"
46+
>
47+
<path
48+
fill-rule="evenodd"
49+
d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.013 8.013 0 0016 8c0-4.42-3.58-8-8-8z"
50+
></path>
51+
</svg>
52+
Login
53+
</button>
3854
</div>
3955

40-
<h1 class="font-bold mb-3 text-center">Sign my guestbook!</h1>
56+
<div class="js-logged-in" style="display: none;">
57+
<div class="flex items-center justify-center mb-6">
58+
<img class="w-16 h-16 rounded-full js-user-img" />
59+
<span class="mx-3">📝</span>
60+
<img
61+
class="w-16 h-16 rounded-full"
62+
src="https://github.com/mathdroid.png"
63+
alt="@mathdroid"
64+
/>
65+
</div>
4166

42-
<hr class="mb-6">
43-
44-
<form class="js-form">
45-
<input type="hidden" value="" name="name" />
67+
<h1 class="font-bold mb-3 text-center">Sign my guestbook!</h1>
4668

47-
<dl>
48-
<dt><label class="block text-gray-700 text-sm font-bold" for="message">Message <sup class="text-red-500">*</sup></label></dt>
49-
<p class="text-gray-500 text-xs mb-2">Max 150 characters</p>
50-
<dd><textarea placeholder="Hi Jason! Hope you're having a great day!" required maxlength="150" class="appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline" name="message" id="message"></textarea></dd>
51-
</dl>
69+
<hr class="mb-6" />
5270

53-
<button type="submit" class="js-submit-btn mt-3 bg-green-500 hover:bg-green-700 text-white font-bold py-2 px-4 rounded">
54-
Submit
55-
</button>
71+
<form class="js-form">
72+
<input type="hidden" value="" name="name" />
5673

57-
<span class="js-submit-btn-loading mt-3 bg-green-500 opacity-50 text-white font-bold py-2 px-4 rounded" style="display: none;">
58-
<svg class="spinner fill-current inline align-middle mr-1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M8 2.5a5.487 5.487 0 00-4.131 1.869l1.204 1.204A.25.25 0 014.896 6H1.25A.25.25 0 011 5.75V2.104a.25.25 0 01.427-.177l1.38 1.38A7.001 7.001 0 0114.95 7.16a.75.75 0 11-1.49.178A5.501 5.501 0 008 2.5zM1.705 8.005a.75.75 0 01.834.656 5.501 5.501 0 009.592 2.97l-1.204-1.204a.25.25 0 01.177-.427h3.646a.25.25 0 01.25.25v3.646a.25.25 0 01-.427.177l-1.38-1.38A7.001 7.001 0 011.05 8.84a.75.75 0 01.656-.834z"></path></svg>
59-
Loading
60-
</span>
74+
<dl>
75+
<dt>
76+
<label class="block text-gray-700 text-sm font-bold" for="message"
77+
>Message <sup class="text-red-500">*</sup></label
78+
>
79+
</dt>
80+
<p class="text-gray-500 text-xs mb-2">Max 150 characters</p>
81+
<dd>
82+
<textarea
83+
placeholder="Hi Odi! Hope you're having a great day!"
84+
required
85+
maxlength="150"
86+
class="appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline"
87+
name="message"
88+
id="message"
89+
></textarea>
90+
</dd>
91+
</dl>
6192

62-
<span class="js-submit-btn-done mt-3 bg-green-500 opacity-50 text-white font-bold py-2 px-4 rounded" style="display: none;">
63-
Redirecting you...
64-
</span>
65-
</form>
66-
</div>
67-
</main>
93+
<button
94+
type="submit"
95+
class="js-submit-btn mt-3 bg-green-500 hover:bg-green-700 text-white font-bold py-2 px-4 rounded"
96+
>
97+
Submit
98+
</button>
99+
100+
<span
101+
class="js-submit-btn-loading mt-3 bg-green-500 opacity-50 text-white font-bold py-2 px-4 rounded"
102+
style="display: none;"
103+
>
104+
<svg
105+
class="spinner fill-current inline align-middle mr-1"
106+
xmlns="http://www.w3.org/2000/svg"
107+
viewBox="0 0 16 16"
108+
width="16"
109+
height="16"
110+
>
111+
<path
112+
fill-rule="evenodd"
113+
d="M8 2.5a5.487 5.487 0 00-4.131 1.869l1.204 1.204A.25.25 0 014.896 6H1.25A.25.25 0 011 5.75V2.104a.25.25 0 01.427-.177l1.38 1.38A7.001 7.001 0 0114.95 7.16a.75.75 0 11-1.49.178A5.501 5.501 0 008 2.5zM1.705 8.005a.75.75 0 01.834.656 5.501 5.501 0 009.592 2.97l-1.204-1.204a.25.25 0 01.177-.427h3.646a.25.25 0 01.25.25v3.646a.25.25 0 01-.427.177l-1.38-1.38A7.001 7.001 0 011.05 8.84a.75.75 0 01.656-.834z"
114+
></path>
115+
</svg>
116+
Loading
117+
</span>
118+
119+
<span
120+
class="js-submit-btn-done mt-3 bg-green-500 opacity-50 text-white font-bold py-2 px-4 rounded"
121+
style="display: none;"
122+
>
123+
Redirecting you...
124+
</span>
125+
</form>
126+
</div>
127+
</main>
68128

69-
<!-- Firebase App (the core Firebase SDK) is always required and must be listed first -->
70-
<script src="https://www.gstatic.com/firebasejs/7.14.6/firebase-app.js"></script>
129+
<!-- Firebase App (the core Firebase SDK) is always required and must be listed first -->
130+
<script src="https://www.gstatic.com/firebasejs/7.14.6/firebase-app.js"></script>
71131

72-
<!-- Add Firebase products that you want to use -->
73-
<script src="https://www.gstatic.com/firebasejs/7.14.6/firebase-auth.js"></script>
132+
<!-- Add Firebase products that you want to use -->
133+
<script src="https://www.gstatic.com/firebasejs/7.14.6/firebase-auth.js"></script>
74134

75-
<script src="/static/main.js"></script>
76-
</body>
135+
<script src="/static/main.js"></script>
136+
</body>
77137
</html>

0 commit comments

Comments
 (0)