1:root {
2 --zinc-700: rgb(66, 71, 81);
3 --success: rgb(0, 166, 110);
4 --danger: rgb(155, 35, 24);
5}
6
7body {
8 display: flex;
9 flex-direction: column;
10}
11
12main {
13}
14
15.margin-top-sm {
16 margin-top: 2em;
17}
18
19.margin-top-md {
20 margin-top: 2.5em;
21}
22
23.margin-bottom-xs {
24 margin-bottom: 1.5em;
25}
26
27.centered-body {
28 min-height: 100vh;
29 justify-content: center;
30}
31
32.base-container {
33 border: 1px solid var(--zinc-700);
34 border-radius: 10px;
35 padding: 1.75em 1.2em;
36}
37
38.box-shadow-container {
39 box-shadow: 1px 1px 52px 2px rgba(0, 0, 0, 0.42);
40}
41
42.login-container {
43 max-width: 50ch;
44 form :last-child {
45 margin-bottom: 0;
46 }
47 form button {
48 float: right;
49 }
50}
51
52.authorize-container {
53 max-width: 100ch;
54}
55
56button {
57 width: unset;
58 min-width: 16ch;
59}
60
61.button-row {
62 display: flex;
63 gap: 1ch;
64 justify-content: end;
65}
66
67.alert {
68 border: 1px solid var(--zinc-700);
69 border-radius: 10px;
70 padding: 1em 1em;
71 p {
72 color: white;
73 margin-bottom: unset;
74 }
75}
76
77.alert-success {
78 background-color: var(--success);
79}
80
81.alert-danger {
82 background-color: var(--danger);
83}