|
1 | | -.election{ |
2 | | - &__section{ |
3 | | - &-title{ |
| 1 | +.election { |
| 2 | + &__section { |
| 3 | + &-title { |
4 | 4 | @apply flex gap-1 items-center; |
5 | 5 |
|
6 | | - svg{ |
| 6 | + svg { |
7 | 7 | @apply w-6 h-6 text-tertiary fill-current; |
8 | 8 | } |
9 | 9 | } |
10 | 10 |
|
11 | | - &-desc{ |
| 11 | + &-desc { |
12 | 12 | @apply text-gray-2 my-6; |
13 | 13 | } |
14 | 14 | } |
15 | 15 |
|
16 | | - &__accordion{ |
| 16 | + &__accordion { |
17 | 17 | @apply border-4 border-background rounded px-3 py-2; |
18 | 18 |
|
19 | | - &-trigger{ |
| 19 | + &-trigger { |
20 | 20 | @apply flex justify-between items-center w-full font-bold text-secondary hover:underline focus:outline-none focus:underline; |
21 | 21 |
|
22 | | - > :last-child{ |
| 22 | + > :last-child { |
23 | 23 | @apply flex-none; |
24 | 24 | } |
25 | 25 |
|
26 | | - svg{ |
| 26 | + svg { |
27 | 27 | @apply w-8 h-8 text-secondary fill-current first:block last:hidden; |
28 | 28 | } |
29 | 29 |
|
30 | | - &[role="button"][aria-expanded="true"] svg{ |
| 30 | + &[role="button"][aria-expanded="true"] svg { |
31 | 31 | @apply first:hidden last:block; |
32 | 32 | } |
33 | 33 | } |
34 | 34 |
|
35 | | - &-panel{ |
| 35 | + &-panel { |
36 | 36 | @apply border-t border-gray-3 mt-4 pt-4 space-y-4; |
37 | 37 |
|
38 | | - ul{ |
| 38 | + ul { |
39 | 39 | @apply list-decimal px-4; |
40 | 40 | } |
41 | 41 | } |
42 | 42 | } |
43 | 43 |
|
44 | | - &__aside{ |
45 | | - &-heading{ |
| 44 | + &__aside { |
| 45 | + &-heading { |
46 | 46 | @apply uppercase font-semibold text-gray-2 text-sm; |
47 | 47 | } |
48 | 48 |
|
49 | | - &-link{ |
| 49 | + &-link { |
50 | 50 | @apply flex items-center gap-2 text-sm; |
51 | 51 |
|
52 | | - svg{ |
| 52 | + svg { |
53 | 53 | @apply w-4 h-4 flex-none text-gray fill-current; |
54 | 54 | } |
55 | 55 |
|
56 | | - a{ |
| 56 | + a { |
57 | 57 | @apply text-md text-secondary; |
58 | 58 | } |
59 | 59 | } |
60 | 60 | } |
61 | 61 | } |
62 | 62 |
|
63 | | -.election-log{ |
64 | | - &__entry{ |
| 63 | +.election-log { |
| 64 | + &__entry { |
65 | 65 | @apply flex flex-col gap-2 rounded border-4 border-background p-4 mb-8 last:mb-0 text-gray-2; |
66 | 66 | } |
67 | 67 |
|
68 | 68 | &__hash, |
69 | | - &__time{ |
| 69 | + &__time { |
70 | 70 | @apply text-sm empty:hidden; |
71 | 71 | } |
72 | 72 |
|
73 | | - &__pre{ |
| 73 | + &__pre { |
74 | 74 | @apply bg-background p-2 rounded; |
75 | 75 | } |
76 | 76 | } |
77 | 77 |
|
78 | | -.election-question{ |
| 78 | +.election-question { |
79 | 79 | @apply block rounded p-4 border-4 border-background flex items-center text-lg text-gray-2 hover:border-tertiary focus:border-tertiary cursor-pointer; |
80 | 80 |
|
81 | | - &[aria-disabled="true"]{ |
| 81 | + &[aria-disabled="true"] { |
82 | 82 | @apply text-gray cursor-not-allowed hover:border-background focus:border-background; |
83 | 83 | } |
84 | 84 |
|
85 | | - &__counter{ |
| 85 | + &__counter { |
86 | 86 | @apply font-semibold text-black text-lg bg-tertiary inline-block; |
87 | 87 | } |
88 | 88 |
|
89 | 89 | /* overwrite default accordion styles */ |
90 | | - [id^="step"][aria-hidden="true"]{ |
| 90 | + [id^="step"][aria-hidden="true"] { |
91 | 91 | @apply hidden; |
92 | 92 | } |
93 | 93 |
|
94 | | - &__container{ |
| 94 | + &__container { |
95 | 95 | @apply space-y-4 mb-8; |
96 | 96 | } |
97 | 97 |
|
98 | | - &__intro{ |
| 98 | + &__intro { |
99 | 99 | @apply py-8 border-t-2 border-background space-y-4; |
100 | 100 | } |
101 | 101 |
|
102 | | - &__description{ |
| 102 | + &__description { |
103 | 103 | @apply text-gray-2 text-lg; |
104 | 104 | } |
105 | 105 |
|
106 | | - &__maxselections{ |
| 106 | + &__maxselections { |
107 | 107 | @apply flex items-center justify-between gap-2 text-gray-2; |
108 | 108 | } |
109 | 109 |
|
110 | | - &__answer{ |
| 110 | + &__answer { |
111 | 111 | @apply flex flex-col items-start gap-4 py-8 text-gray-2 border-t-2 border-background; |
112 | 112 |
|
113 | | - &-option{ |
| 113 | + &-option { |
114 | 114 | @apply flex items-center justify-between w-full text-lg; |
115 | 115 | } |
116 | 116 | } |
117 | 117 |
|
118 | | - &__ballot{ |
| 118 | + &__ballot { |
119 | 119 | @apply flex flex-col items-start gap-2 py-8 border-t-2 border-background text-lg text-gray-2; |
120 | 120 | } |
121 | 121 |
|
122 | | - &__modal{ |
123 | | - &-explanation{ |
| 122 | + &__modal { |
| 123 | + &-explanation { |
124 | 124 | @apply space-y-4; |
125 | 125 | } |
126 | 126 |
|
127 | | - &-grid{ |
| 127 | + &-grid { |
128 | 128 | @apply grid grid-cols-2 gap-4; |
129 | 129 | } |
130 | 130 |
|
131 | | - img{ |
| 131 | + img { |
132 | 132 | @apply aspect-video object-cover h-full w-full; |
133 | 133 | } |
134 | 134 |
|
135 | | - ul{ |
| 135 | + ul { |
136 | 136 | @apply list-disc; |
137 | 137 | } |
138 | 138 |
|
139 | | - li{ |
| 139 | + li { |
140 | 140 | @apply ml-4; |
141 | 141 | } |
142 | 142 |
|
143 | | - a{ |
| 143 | + a { |
144 | 144 | @apply text-secondary; |
145 | 145 | } |
146 | 146 | } |
147 | 147 | } |
148 | 148 |
|
149 | | -.election-trustee{ |
150 | | - &__container{ |
| 149 | +.election-trustee { |
| 150 | + &__container { |
151 | 151 | @apply space-y-6 [&_p]:text-gray-2; |
152 | 152 | } |
153 | 153 |
|
154 | | - &__list{ |
| 154 | + &__list { |
155 | 155 | @apply list-disc pl-4 text-gray-2; |
156 | 156 | } |
157 | 157 |
|
158 | | - &__table{ |
| 158 | + &__table { |
159 | 159 | @apply text-left w-full border-2 border-background; |
160 | 160 |
|
161 | 161 | th, |
162 | | - td{ |
| 162 | + td { |
163 | 163 | @apply px-4 py-2; |
164 | 164 | } |
165 | 165 |
|
166 | | - th{ |
| 166 | + th { |
167 | 167 | @apply bg-background; |
168 | 168 | } |
169 | 169 |
|
170 | | - tr:nth-child(even) td{ |
| 170 | + tr:nth-child(even) td { |
171 | 171 | @apply bg-gray-3; |
172 | 172 | } |
173 | 173 |
|
174 | | - a{ |
| 174 | + a { |
175 | 175 | @apply text-secondary underline; |
176 | 176 | } |
177 | 177 |
|
178 | | - .step_status{ |
179 | | - span{ |
| 178 | + .step_status { |
| 179 | + span { |
180 | 180 | @apply hidden; |
181 | 181 | } |
182 | 182 |
|
183 | 183 | &[data-step-status="pending"] .pending, |
184 | 184 | &[data-step-status="processing"] .processing, |
185 | | - &[data-step-status="completed"] .completed{ |
| 185 | + &[data-step-status="completed"] .completed { |
186 | 186 | @apply block; |
187 | 187 | } |
188 | 188 | } |
189 | 189 | } |
190 | 190 |
|
191 | | - &__submit{ |
| 191 | + &__submit { |
192 | 192 | @apply p-4 border-4 border-background space-y-4 rounded; |
193 | 193 | } |
194 | 194 |
|
195 | | - &__buttons{ |
| 195 | + &__buttons { |
196 | 196 | @apply flex items-center gap-4; |
197 | 197 |
|
198 | | - [hidden]{ |
| 198 | + [hidden] { |
199 | 199 | @apply hidden; |
200 | 200 | } |
201 | 201 | } |
|
0 commit comments