selfhostable, read-only reddit client
style: Align and pad form inputs to match background of other elements
+42
+42
src/public/styles.css
+42
src/public/styles.css
···
424
424
color: var(--text-color);
425
425
padding: 5px;
426
426
}
427
+
428
+
input[type="text"],
429
+
input[type="password"],
430
+
input[type="email"],
431
+
textarea {
432
+
width: 100%;
433
+
padding: 10px;
434
+
margin: 10px 0;
435
+
box-sizing: border-box;
436
+
border: 1px solid var(--bg-color-muted);
437
+
border-radius: 4px;
438
+
background-color: var(--bg-color-muted);
439
+
color: var(--text-color);
440
+
}
441
+
442
+
form {
443
+
display: flex;
444
+
flex-direction: column;
445
+
align-items: center;
446
+
}
447
+
448
+
form label {
449
+
width: 100%;
450
+
margin: 5px 0;
451
+
color: var(--text-color);
452
+
}
453
+
454
+
form input[type="submit"] {
455
+
width: auto;
456
+
padding: 10px 20px;
457
+
margin-top: 20px;
458
+
background-color: var(--link-color);
459
+
color: var(--bg-color);
460
+
border: none;
461
+
border-radius: 4px;
462
+
cursor: pointer;
463
+
}
464
+
465
+
form input[type="submit"]:hover {
466
+
background-color: var(--link-color);
467
+
opacity: 0.8;
468
+
}