Skip to content

Commit 9e224a2

Browse files
mskianmskian
committed
UI changes in web view
1 parent c4cb951 commit 9e224a2

File tree

1 file changed

+39
-38
lines changed

1 file changed

+39
-38
lines changed

‎wish.go

Lines changed: 39 additions & 38 deletions
Original file line numberDiff line numberDiff line change
@@ -155,6 +155,7 @@ func wishHTMLHandler(w http.ResponseWriter, r *http.Request) {
155155
body {
156156
font-family: "Roboto Condensed", sans-serif;
157157
background-color: #58B19F;
158+
min-height: 100vh;
158159
}
159160
#quote-container {
160161
margin: 10px auto;
@@ -168,28 +169,31 @@ func wishHTMLHandler(w http.ResponseWriter, r *http.Request) {
168169
color: #333;
169170
}
170171
#quote-card {
171-
margin: 20px auto;
172+
background-color: #D6A2E8; /* White background */
173+
border-radius: 15px; /* Rounded corners */
174+
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Soft shadow */
175+
padding: 20px;
176+
margin-top: 20px;
172177
}
173178
pre {
174179
font-family: monospace;
175180
font-size: 14px;
176-
background-color: #192a56;
177-
color: #fdcb6e;
178-
text-shadow: 0 0 3px #FFC312;
181+
background-color: #3d3d3d;
182+
color: #ecf0f1;
183+
text-shadow: 0 0 3px #ecf0f1;
179184
padding: 20px;
180-
border-radius: 5px;
185+
border-radius: 10px;
181186
word-wrap: break-word;
182187
overflow-x: auto;
183188
line-height: inherit;
184189
position: relative;
185-
white-space: pre-wrap; /* Ensure ASCII art is preserved */
186190
}
187191
.copy-icon {
188192
position: absolute;
189-
top: 10px;
190-
right: 10px;
193+
top: 5px;
194+
right: 5px;
191195
cursor: pointer;
192-
color: #fdcb6e;
196+
color: #ecf0f1;
193197
}
194198
.notification {
195199
font-family: "Roboto Condensed", sans-serif;
@@ -208,7 +212,8 @@ func wishHTMLHandler(w http.ResponseWriter, r *http.Request) {
208212
margin: 20px auto;
209213
padding: 20px;
210214
background-color: #4b4b4b;
211-
border-radius: 5px;
215+
border-radius: 15px;
216+
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
212217
max-width: 500px;
213218
}
214219
.form-container .field {
@@ -218,65 +223,61 @@ func wishHTMLHandler(w http.ResponseWriter, r *http.Request) {
218223
.form-container .input,
219224
.form-container .button {
220225
font-family: "Roboto Condensed", sans-serif;
226+
border-radius: 10px;
221227
width: 100%%;
222228
}
223229
.form-container .button {
224230
font-family: "Roboto Condensed", sans-serif;
225-
background-color: #4a90e2;
231+
background-color: #25d366;
226232
border-color: transparent;
227233
color: #fff;
228234
}
229235
.form-container .button:hover {
230-
background-color: #357abd;
236+
background-color: #1ebd74;
231237
}
232238
</style>
233239
</head>
234240
<body>
235241
236242
<section class="section">
237243
<div class="container">
238-
<div id="quote-card" class="card">
239-
<div id="quote-container">
240-
<div class="container">
241-
<div class="columns is-centered">
242-
<div class="column is-half">
243-
<div class="card">
244-
<div class="card-image">
245-
<figure class="image">
246-
<img src="https://img.sanweb.info/friend/friend?name=%s" alt="Happy Friendship Day" loading="lazy">
247-
</figure>
248-
</div>
249-
</div>
250-
</div>
251-
</div>
252-
<div class="buttons is-centered">
253-
<a class="button is-warning is-rounded" href="https://img.sanweb.info/dl/file?url=https://img.sanweb.info/friend/friend?name=%s" target="_blank" rel="nofollow noopener"><i class="fa fa-download" aria-hidden="true"></i>&nbsp;Download Image</a>
244+
<div class="columns is-centered">
245+
<div class="column is-half">
246+
<div class="card">
247+
<div class="card-image">
248+
<figure class="image">
249+
<img src="https://img.sanweb.info/friend/friend?name=%s" alt="Happy Friendship Day" loading="lazy">
250+
</figure>
254251
</div>
255-
<pre id="ascii-art">
252+
</div>
253+
</div>
254+
</div>
255+
<div class="buttons is-centered">
256+
<a class="button is-warning is-rounded" href="https://img.sanweb.info/dl/file?url=https://img.sanweb.info/friend/friend?name=%s" target="_blank" rel="nofollow noopener">
257+
<i class="fa fa-download" aria-hidden="true"></i>&nbsp;Download Image
258+
</a>
259+
</div>
260+
<pre id="ascii-art">
256261
%s
257262
<span class="icon copy-icon" onclick="copyToClipboard()">
258263
<i class="fas fa-copy"></i>
259264
</span>
260-
</pre>
261-
<br>
262-
</div>
263-
</div>
264-
</div>
265+
</pre>
265266
<br>
266-
<pre>$ curl -G --data-urlencode "name=%s" %s<br><br>$ http -b GET "%s" "name==%s"<br></pre>
267+
<pre>$ curl -G --data-urlencode "name=%s" %s<br><br>$ http -b GET "%s" "name==%s"</pre>
267268
<br>
268269
<div class="form-container">
269270
<h2 class="title is-4 has-text-centered has-text-light">Create Your Greeting</h2>
270271
<form action="/wish/web" method="get" onsubmit="sanitizeInput(event)">
271272
<div class="field">
272-
<label class="label has-text-success has-text-centered" for="name">Your Name</label>
273+
<label class="label has-text-warning has-text-centered" for="name">Your Name</label>
273274
<div class="control">
274-
<input class="input is-rounded" type="text" id="name" name="name" placeholder="Enter your name" minlength="2" maxlength="36" required>
275+
<input class="input" type="text" id="name" name="name" placeholder="Enter your name" minlength="2" maxlength="36" required>
275276
</div>
276277
</div>
277278
<div class="field">
278279
<div class="control">
279-
<button class="button is-primary is-rounded" type="submit">Generate Greeting</button>
280+
<button class="button is-primary" type="submit">Generate Greeting</button>
280281
</div>
281282
</div>
282283
</form>

0 commit comments

Comments
 (0)