lesli_shield 1.1.6 → 1.1.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (56) hide show
  1. checksums.yaml +4 -4
  2. data/Rakefile +3 -0
  3. data/app/assets/stylesheets/lesli_shield/application.css +140 -1
  4. data/app/assets/stylesheets/lesli_shield/confirmations.css +917 -18
  5. data/app/assets/stylesheets/lesli_shield/confirmations.tailwind.css +918 -0
  6. data/app/assets/stylesheets/lesli_shield/passwords.css +872 -18
  7. data/app/assets/stylesheets/lesli_shield/passwords.tailwind.css +873 -0
  8. data/app/assets/stylesheets/lesli_shield/registrations.css +904 -832
  9. data/app/assets/stylesheets/lesli_shield/registrations.tailwind.css +908 -0
  10. data/app/assets/stylesheets/lesli_shield/sessions.css +984 -32
  11. data/app/assets/stylesheets/lesli_shield/sessions.tailwind.css +983 -1
  12. data/app/controllers/lesli_shield/profile/passwords_controller.rb +119 -0
  13. data/app/controllers/lesli_shield/profiles_controller.rb +63 -0
  14. data/app/controllers/lesli_shield/sessions_controller.rb +1 -2
  15. data/app/controllers/users/confirmations_controller.rb +162 -49
  16. data/app/controllers/users/passwords_controller.rb +211 -28
  17. data/app/controllers/users/registrations_controller.rb +108 -83
  18. data/app/controllers/users/sessions_controller.rb +122 -84
  19. data/app/interfaces/lesli_shield/authorization_interface.rb +2 -2
  20. data/app/mailers/lesli_shield/devise_mailer.rb +73 -17
  21. data/app/models/concerns/lesli_shield/user_authentication.rb +54 -0
  22. data/app/models/lesli_shield/account.rb +4 -1
  23. data/app/models/lesli_shield/invite.rb +1 -1
  24. data/app/models/lesli_shield/user/role.rb +1 -1
  25. data/app/models/lesli_shield/user.rb +5 -2
  26. data/app/services/lesli_shield/profile/password_service.rb +47 -0
  27. data/app/services/lesli_shield/profile_service.rb +24 -0
  28. data/app/services/lesli_shield/user_registration_service.rb +41 -74
  29. data/app/services/lesli_shield/user_session_service.rb +1 -1
  30. data/app/services/lesli_shield/user_validator_service.rb +30 -32
  31. data/app/views/devise/confirmations/new.html.erb +58 -12
  32. data/app/views/devise/confirmations/show.html.erb +27 -60
  33. data/app/views/devise/passwords/edit.html.erb +59 -25
  34. data/app/views/devise/passwords/new.html.erb +61 -26
  35. data/app/views/devise/registrations/new.html.erb +80 -53
  36. data/app/views/devise/sessions/new.html.erb +53 -36
  37. data/app/views/devise/shared/_application-devise-simple.erb +18 -19
  38. data/app/views/devise/shared/_demo.html.erb +8 -6
  39. data/app/views/devise/shared/_error_messages.html.erb +45 -10
  40. data/app/views/devise/shared/_links.html.erb +6 -13
  41. data/app/views/lesli_shield/invites/_form.html.erb +1 -1
  42. data/app/views/lesli_shield/invites/index.html.erb +3 -2
  43. data/app/views/lesli_shield/profiles/_password-form.html.erb +68 -0
  44. data/app/views/lesli_shield/profiles/show.html.erb +29 -0
  45. data/app/views/lesli_shield/users/_information-form.html.erb +9 -1
  46. data/config/initializers/devise.rb +52 -328
  47. data/config/locales/translations.en.yml +65 -2
  48. data/config/locales/translations.es.yml +65 -2
  49. data/config/routes.rb +4 -0
  50. data/lib/lesli_shield/engine.rb +38 -4
  51. data/lib/lesli_shield/router.rb +52 -18
  52. data/lib/lesli_shield/version.rb +2 -2
  53. data/readme.md +4 -2
  54. metadata +30 -5
  55. data/app/assets/config/lesli_shield_manifest.js +0 -48
  56. data/app/assets/stylesheets/lesli_shield/application.tailwind.css +0 -2
@@ -1,19 +1,918 @@
1
- /* Error: Can't find stylesheet to import.
2
- * ,
3
- * 48 | @use "../fonts/families";
4
- * | ^^^^^^^^^^^^^^^^^^^^^^^^
5
- * '
6
- * LesliAssets/source/scss/templates/public.scss 48:1 @use
7
- * ../../engines/LesliShield/source/scss/_devise-simple.scss 36:1 @use
8
- * ../../engines/LesliShield/source/scss/confirmations.scss 36:1 root stylesheet */
9
-
10
- body::before {
11
- font-family: "Source Code Pro", "SF Mono", Monaco, Inconsolata, "Fira Mono",
12
- "Droid Sans Mono", monospace, monospace;
13
- white-space: pre;
14
- display: block;
15
- padding: 1em;
16
- margin-bottom: 1em;
17
- border-bottom: 2px solid black;
18
- content: "Error: Can't find stylesheet to import.\a \2577 \a 48 \2502 @use \"../fonts/families\";\a \2502 ^^^^^^^^^^^^^^^^^^^^^^^^\a \2575 \a LesliAssets/source/scss/templates/public.scss 48:1 @use\a ../../engines/LesliShield/source/scss/_devise-simple.scss 36:1 @use\a ../../engines/LesliShield/source/scss/confirmations.scss 36:1 root stylesheet";
1
+ /*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */
2
+ @layer properties;
3
+ @layer theme, utilities;
4
+ @layer theme {
5
+ :root, :host {
6
+ --color-amber-50: oklch(98.7% 0.022 95.277);
7
+ --color-amber-200: oklch(92.4% 0.12 95.746);
8
+ --color-amber-500: oklch(76.9% 0.188 70.08);
9
+ --color-amber-600: oklch(66.6% 0.179 58.318);
10
+ --color-amber-700: oklch(55.5% 0.163 48.998);
11
+ --color-amber-950: oklch(27.9% 0.077 45.635);
12
+ --color-emerald-50: oklch(97.9% 0.021 166.113);
13
+ --color-emerald-200: oklch(90.5% 0.093 164.15);
14
+ --color-emerald-500: oklch(69.6% 0.17 162.48);
15
+ --color-emerald-600: oklch(59.6% 0.145 163.225);
16
+ --color-emerald-700: oklch(50.8% 0.118 165.612);
17
+ --color-emerald-900: oklch(37.8% 0.077 168.94);
18
+ --color-sky-50: oklch(97.7% 0.013 236.62);
19
+ --color-sky-200: oklch(90.1% 0.058 230.902);
20
+ --color-sky-500: oklch(68.5% 0.169 237.323);
21
+ --color-sky-600: oklch(58.8% 0.158 241.966);
22
+ --color-sky-700: oklch(50% 0.134 242.749);
23
+ --color-rose-50: oklch(96.9% 0.015 12.422);
24
+ --color-rose-200: oklch(89.2% 0.058 10.001);
25
+ --color-rose-400: oklch(71.2% 0.194 13.428);
26
+ --color-rose-500: oklch(64.5% 0.246 16.439);
27
+ --color-rose-600: oklch(58.6% 0.253 17.585);
28
+ --color-rose-700: oklch(51.4% 0.222 16.935);
29
+ --color-rose-900: oklch(41% 0.159 10.272);
30
+ --color-slate-50: oklch(98.4% 0.003 247.858);
31
+ --color-slate-100: oklch(96.8% 0.007 247.896);
32
+ --color-slate-200: oklch(92.9% 0.013 255.508);
33
+ --color-slate-300: oklch(86.9% 0.022 252.894);
34
+ --color-slate-400: oklch(70.4% 0.04 256.788);
35
+ --color-slate-500: oklch(55.4% 0.046 257.417);
36
+ --color-slate-600: oklch(44.6% 0.043 257.281);
37
+ --color-slate-700: oklch(37.2% 0.044 257.287);
38
+ --color-slate-800: oklch(27.9% 0.041 260.031);
39
+ --color-slate-900: oklch(20.8% 0.042 265.755);
40
+ --color-white: #fff;
41
+ --spacing: 0.25rem;
42
+ --container-lg: 32rem;
43
+ --text-sm: 0.875rem;
44
+ --text-sm--line-height: calc(1.25 / 0.875);
45
+ --text-lg: 1.125rem;
46
+ --text-lg--line-height: calc(1.75 / 1.125);
47
+ --text-xl: 1.25rem;
48
+ --text-xl--line-height: calc(1.75 / 1.25);
49
+ --text-2xl: 1.5rem;
50
+ --text-2xl--line-height: calc(2 / 1.5);
51
+ --text-5xl: 3rem;
52
+ --text-5xl--line-height: 1;
53
+ --font-weight-medium: 500;
54
+ --font-weight-semibold: 600;
55
+ --tracking-tight: -0.025em;
56
+ --radius-sm: 0.25rem;
57
+ --radius-lg: 0.5rem;
58
+ --radius-xl: 0.75rem;
59
+ --radius-2xl: 1rem;
60
+ --default-transition-duration: 150ms;
61
+ --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
62
+ }
63
+ }
64
+ @layer utilities {
65
+ .mx-auto {
66
+ margin-inline: auto;
67
+ }
68
+ .my-8 {
69
+ margin-block: calc(var(--spacing) * 8);
70
+ }
71
+ .mt-2 {
72
+ margin-top: calc(var(--spacing) * 2);
73
+ }
74
+ .mt-4 {
75
+ margin-top: calc(var(--spacing) * 4);
76
+ }
77
+ .mt-6 {
78
+ margin-top: calc(var(--spacing) * 6);
79
+ }
80
+ .mr-1 {
81
+ margin-right: var(--spacing);
82
+ }
83
+ .mr-2 {
84
+ margin-right: calc(var(--spacing) * 2);
85
+ }
86
+ .mb-4 {
87
+ margin-bottom: calc(var(--spacing) * 4);
88
+ }
89
+ .mb-6 {
90
+ margin-bottom: calc(var(--spacing) * 6);
91
+ }
92
+ .flex {
93
+ display: flex;
94
+ }
95
+ .hidden {
96
+ display: none;
97
+ }
98
+ .inline-flex {
99
+ display: inline-flex;
100
+ }
101
+ .h-auto {
102
+ height: auto;
103
+ }
104
+ .min-h-11 {
105
+ min-height: calc(var(--spacing) * 11);
106
+ }
107
+ .min-h-screen {
108
+ min-height: 100vh;
109
+ }
110
+ .w-auto {
111
+ width: auto;
112
+ }
113
+ .w-full {
114
+ width: 100%;
115
+ }
116
+ .max-w-\[130px\] {
117
+ max-width: 130px;
118
+ }
119
+ .max-w-lg {
120
+ max-width: var(--container-lg);
121
+ }
122
+ .flex-1 {
123
+ flex: 1;
124
+ }
125
+ .shrink-0 {
126
+ flex-shrink: 0;
127
+ }
128
+ .list-disc {
129
+ list-style-type: disc;
130
+ }
131
+ .flex-col {
132
+ flex-direction: column;
133
+ }
134
+ .items-center {
135
+ align-items: center;
136
+ }
137
+ .justify-center {
138
+ justify-content: center;
139
+ }
140
+ :where(.space-y-1 > :not(:last-child)) {
141
+ --tw-space-y-reverse: 0;
142
+ margin-block-start: calc(var(--spacing) * var(--tw-space-y-reverse));
143
+ margin-block-end: calc(var(--spacing) * calc(1 - var(--tw-space-y-reverse)));
144
+ }
145
+ .rounded-lg {
146
+ border-radius: var(--radius-lg);
147
+ }
148
+ .rounded-xl {
149
+ border-radius: var(--radius-xl);
150
+ }
151
+ .border {
152
+ border-style: var(--tw-border-style);
153
+ border-width: 1px;
154
+ }
155
+ .border-t {
156
+ border-top-style: var(--tw-border-style);
157
+ border-top-width: 1px;
158
+ }
159
+ .border-emerald-200 {
160
+ border-color: var(--color-emerald-200);
161
+ }
162
+ .border-rose-200 {
163
+ border-color: var(--color-rose-200);
164
+ }
165
+ .border-slate-200 {
166
+ border-color: var(--color-slate-200);
167
+ }
168
+ .bg-\[var\(--lesli-color-primary\)\] {
169
+ background-color: var(--lesli-color-primary);
170
+ }
171
+ .bg-emerald-50 {
172
+ background-color: var(--color-emerald-50);
173
+ }
174
+ .bg-rose-50 {
175
+ background-color: var(--color-rose-50);
176
+ }
177
+ .bg-slate-50 {
178
+ background-color: var(--color-slate-50);
179
+ }
180
+ .bg-white {
181
+ background-color: var(--color-white);
182
+ }
183
+ .p-8 {
184
+ padding: calc(var(--spacing) * 8);
185
+ }
186
+ .px-4 {
187
+ padding-inline: calc(var(--spacing) * 4);
188
+ }
189
+ .px-5 {
190
+ padding-inline: calc(var(--spacing) * 5);
191
+ }
192
+ .px-6 {
193
+ padding-inline: calc(var(--spacing) * 6);
194
+ }
195
+ .py-2\.5 {
196
+ padding-block: calc(var(--spacing) * 2.5);
197
+ }
198
+ .py-3 {
199
+ padding-block: calc(var(--spacing) * 3);
200
+ }
201
+ .py-8 {
202
+ padding-block: calc(var(--spacing) * 8);
203
+ }
204
+ .pt-16 {
205
+ padding-top: calc(var(--spacing) * 16);
206
+ }
207
+ .pb-10 {
208
+ padding-bottom: calc(var(--spacing) * 10);
209
+ }
210
+ .pl-5 {
211
+ padding-left: calc(var(--spacing) * 5);
212
+ }
213
+ .text-center {
214
+ text-align: center;
215
+ }
216
+ .text-left {
217
+ text-align: left;
218
+ }
219
+ .text-2xl {
220
+ font-size: var(--text-2xl);
221
+ line-height: var(--tw-leading, var(--text-2xl--line-height));
222
+ }
223
+ .text-5xl {
224
+ font-size: var(--text-5xl);
225
+ line-height: var(--tw-leading, var(--text-5xl--line-height));
226
+ }
227
+ .text-sm {
228
+ font-size: var(--text-sm);
229
+ line-height: var(--tw-leading, var(--text-sm--line-height));
230
+ }
231
+ .leading-6 {
232
+ --tw-leading: calc(var(--spacing) * 6);
233
+ line-height: calc(var(--spacing) * 6);
234
+ }
235
+ .font-semibold {
236
+ --tw-font-weight: var(--font-weight-semibold);
237
+ font-weight: var(--font-weight-semibold);
238
+ }
239
+ .tracking-tight {
240
+ --tw-tracking: var(--tracking-tight);
241
+ letter-spacing: var(--tracking-tight);
242
+ }
243
+ .text-\[var\(--lesli-color-primary\)\] {
244
+ color: var(--lesli-color-primary);
245
+ }
246
+ .text-emerald-600 {
247
+ color: var(--color-emerald-600);
248
+ }
249
+ .text-emerald-900 {
250
+ color: var(--color-emerald-900);
251
+ }
252
+ .text-rose-900 {
253
+ color: var(--color-rose-900);
254
+ }
255
+ .text-slate-600 {
256
+ color: var(--color-slate-600);
257
+ }
258
+ .text-white {
259
+ color: var(--color-white);
260
+ }
261
+ .shadow-sm {
262
+ --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
263
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
264
+ }
265
+ .transition-opacity {
266
+ transition-property: opacity;
267
+ transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
268
+ transition-duration: var(--tw-duration, var(--default-transition-duration));
269
+ }
270
+ @media (hover: hover) {
271
+ .hover\:opacity-90:hover {
272
+ opacity: 90%;
273
+ }
274
+ }
275
+ .focus-visible\:outline-2:focus-visible {
276
+ outline-style: var(--tw-outline-style);
277
+ outline-width: 2px;
278
+ }
279
+ .focus-visible\:outline-offset-2:focus-visible {
280
+ outline-offset: 2px;
281
+ }
282
+ .focus-visible\:outline-\[var\(--lesli-color-primary\)\]:focus-visible {
283
+ outline-color: var(--lesli-color-primary);
284
+ }
285
+ @media (width >= 40rem) {
286
+ .sm\:px-6 {
287
+ padding-inline: calc(var(--spacing) * 6);
288
+ }
289
+ .sm\:pt-24 {
290
+ padding-top: calc(var(--spacing) * 24);
291
+ }
292
+ .sm\:pb-12 {
293
+ padding-bottom: calc(var(--spacing) * 12);
294
+ }
295
+ }
296
+ .\[\&\>form\]\:my-6 > form {
297
+ margin-block: calc(var(--spacing) * 6);
298
+ }
299
+ .\[\&\>form\]\:w-full > form {
300
+ width: 100%;
301
+ }
302
+ .\[\&\>form\]\:max-w-lg > form {
303
+ max-width: var(--container-lg);
304
+ }
305
+ .\[\&\>form\]\:rounded-xl > form {
306
+ border-radius: var(--radius-xl);
307
+ }
308
+ .\[\&\>form\]\:border > form {
309
+ border-style: var(--tw-border-style);
310
+ border-width: 1px;
311
+ }
312
+ .\[\&\>form\]\:border-slate-200 > form {
313
+ border-color: var(--color-slate-200);
314
+ }
315
+ .\[\&\>form\]\:bg-white > form {
316
+ background-color: var(--color-white);
317
+ }
318
+ .\[\&\>form\]\:p-6 > form {
319
+ padding: calc(var(--spacing) * 6);
320
+ }
321
+ .\[\&\>form\]\:shadow-sm > form {
322
+ --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
323
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
324
+ }
325
+ @media (width >= 40rem) {
326
+ .sm\:\[\&\>form\]\:my-8 > form {
327
+ margin-block: calc(var(--spacing) * 8);
328
+ }
329
+ .sm\:\[\&\>form\]\:p-10 > form {
330
+ padding: calc(var(--spacing) * 10);
331
+ }
332
+ }
333
+ }
334
+ @layer components {
335
+ .lesli-form-field {
336
+ margin-bottom: calc(var(--spacing) * 4);
337
+ }
338
+ .lesli-form-label-wrapper {
339
+ margin-bottom: calc(var(--spacing) * 2);
340
+ }
341
+ .lesli-form-label {
342
+ display: block;
343
+ font-size: var(--text-sm);
344
+ line-height: var(--tw-leading, var(--text-sm--line-height));
345
+ --tw-leading: calc(var(--spacing) * 5);
346
+ line-height: calc(var(--spacing) * 5);
347
+ --tw-font-weight: var(--font-weight-medium);
348
+ font-weight: var(--font-weight-medium);
349
+ color: var(--color-slate-700);
350
+ }
351
+ .lesli-form-field-body {
352
+ min-width: 0px;
353
+ }
354
+ .lesli-form-control {
355
+ position: relative;
356
+ }
357
+ .lesli-form-input, .lesli-form-select, .lesli-form-control textarea, .lesli-form-control trix-editor {
358
+ display: block;
359
+ width: 100%;
360
+ border-radius: var(--radius-xl);
361
+ border-style: var(--tw-border-style);
362
+ border-width: 1px;
363
+ border-color: var(--color-slate-300);
364
+ background-color: var(--color-white);
365
+ padding-inline: calc(var(--spacing) * 3.5);
366
+ padding-block: calc(var(--spacing) * 2.5);
367
+ font-size: var(--text-sm);
368
+ line-height: var(--tw-leading, var(--text-sm--line-height));
369
+ color: var(--color-slate-900);
370
+ --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
371
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
372
+ transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
373
+ transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
374
+ transition-duration: var(--tw-duration, var(--default-transition-duration));
375
+ --tw-outline-style: none;
376
+ outline-style: none;
377
+ &::placeholder {
378
+ color: var(--color-slate-400);
379
+ }
380
+ &:hover {
381
+ @media (hover: hover) {
382
+ border-color: var(--color-slate-400);
383
+ }
384
+ }
385
+ &:focus {
386
+ border-color: var(--color-sky-500);
387
+ }
388
+ &:focus {
389
+ --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
390
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
391
+ }
392
+ &:focus {
393
+ --tw-ring-color: color-mix(in srgb, oklch(68.5% 0.169 237.323) 10%, transparent);
394
+ @supports (color: color-mix(in lab, red, red)) {
395
+ --tw-ring-color: color-mix(in oklab, var(--color-sky-500) 10%, transparent);
396
+ }
397
+ }
398
+ &:disabled {
399
+ cursor: not-allowed;
400
+ }
401
+ &:disabled {
402
+ background-color: var(--color-slate-100);
403
+ }
404
+ &:disabled {
405
+ color: var(--color-slate-500);
406
+ }
407
+ &:disabled {
408
+ opacity: 75%;
409
+ }
410
+ }
411
+ .lesli-form-input, .lesli-form-select {
412
+ height: calc(var(--spacing) * 11);
413
+ }
414
+ .lesli-form-control textarea, .lesli-form-control trix-editor {
415
+ min-height: calc(var(--spacing) * 32);
416
+ resize: vertical;
417
+ }
418
+ .lesli-form-select-wrapper {
419
+ position: relative;
420
+ }
421
+ .lesli-form-select {
422
+ cursor: pointer;
423
+ appearance: none;
424
+ padding-right: calc(var(--spacing) * 10);
425
+ }
426
+ .lesli-form-select-wrapper::after {
427
+ pointer-events: none;
428
+ position: absolute;
429
+ top: calc(1 / 2 * 100%);
430
+ right: calc(var(--spacing) * 3.5);
431
+ height: calc(var(--spacing) * 2);
432
+ width: calc(var(--spacing) * 2);
433
+ --tw-translate-y: calc(var(--spacing) * -2);
434
+ translate: var(--tw-translate-x) var(--tw-translate-y);
435
+ rotate: 45deg;
436
+ border-right-style: var(--tw-border-style);
437
+ border-right-width: 2px;
438
+ border-bottom-style: var(--tw-border-style);
439
+ border-bottom-width: 2px;
440
+ border-color: var(--color-slate-400);
441
+ --tw-content: '';
442
+ content: var(--tw-content);
443
+ }
444
+ .lesli-form-checkbox {
445
+ height: calc(var(--spacing) * 4);
446
+ width: calc(var(--spacing) * 4);
447
+ cursor: pointer;
448
+ border-radius: 0.25rem;
449
+ border-color: var(--color-slate-300);
450
+ accent-color: var(--color-sky-600);
451
+ &:focus {
452
+ --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
453
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
454
+ }
455
+ &:focus {
456
+ --tw-ring-color: color-mix(in srgb, oklch(68.5% 0.169 237.323) 30%, transparent);
457
+ @supports (color: color-mix(in lab, red, red)) {
458
+ --tw-ring-color: color-mix(in oklab, var(--color-sky-500) 30%, transparent);
459
+ }
460
+ }
461
+ &:focus {
462
+ --tw-ring-offset-width: 2px;
463
+ --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
464
+ }
465
+ &:disabled {
466
+ cursor: not-allowed;
467
+ }
468
+ &:disabled {
469
+ opacity: 50%;
470
+ }
471
+ }
472
+ .lesli-form-checkbox-label {
473
+ display: inline-flex;
474
+ cursor: pointer;
475
+ align-items: center;
476
+ gap: calc(var(--spacing) * 2.5);
477
+ font-size: var(--text-sm);
478
+ line-height: var(--tw-leading, var(--text-sm--line-height));
479
+ color: var(--color-slate-600);
480
+ }
481
+ .lesli-form-control.has-icon .lesli-form-input, .lesli-form-control.has-icon .lesli-form-select {
482
+ padding-left: calc(var(--spacing) * 11);
483
+ }
484
+ .lesli-form-icon {
485
+ pointer-events: none;
486
+ position: absolute;
487
+ top: calc(1 / 2 * 100%);
488
+ left: calc(var(--spacing) * 3.5);
489
+ display: inline-flex;
490
+ height: calc(var(--spacing) * 5);
491
+ width: calc(var(--spacing) * 5);
492
+ --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
493
+ translate: var(--tw-translate-x) var(--tw-translate-y);
494
+ align-items: center;
495
+ justify-content: center;
496
+ color: var(--color-slate-400);
497
+ }
498
+ .lesli-form-icon .material-symbols-outlined {
499
+ font-size: var(--text-xl);
500
+ line-height: var(--tw-leading, var(--text-xl--line-height));
501
+ --tw-leading: 1;
502
+ line-height: 1;
503
+ }
504
+ .lesli-form-help {
505
+ margin-top: calc(var(--spacing) * 2);
506
+ font-size: var(--text-sm);
507
+ line-height: var(--tw-leading, var(--text-sm--line-height));
508
+ --tw-leading: calc(var(--spacing) * 5);
509
+ line-height: calc(var(--spacing) * 5);
510
+ color: var(--color-slate-500);
511
+ }
512
+ .lesli-form-field.is-danger .lesli-form-input, .lesli-form-field.is-danger .lesli-form-select, .lesli-form-field.is-danger textarea, .lesli-form-field.is-danger trix-editor {
513
+ border-color: var(--color-rose-400);
514
+ &:focus {
515
+ border-color: var(--color-rose-500);
516
+ }
517
+ &:focus {
518
+ --tw-ring-color: color-mix(in srgb, oklch(64.5% 0.246 16.439) 10%, transparent);
519
+ @supports (color: color-mix(in lab, red, red)) {
520
+ --tw-ring-color: color-mix(in oklab, var(--color-rose-500) 10%, transparent);
521
+ }
522
+ }
523
+ }
524
+ .lesli-form-help.is-danger {
525
+ color: var(--color-rose-700);
526
+ }
527
+ .lesli-form-help.is-warning {
528
+ color: var(--color-amber-700);
529
+ }
530
+ .lesli-form-help.is-success {
531
+ color: var(--color-emerald-700);
532
+ }
533
+ .lesli-form-help.is-info {
534
+ color: var(--color-sky-700);
535
+ }
536
+ .lesli-form-button {
537
+ display: inline-flex;
538
+ height: calc(var(--spacing) * 11);
539
+ cursor: pointer;
540
+ align-items: center;
541
+ justify-content: center;
542
+ gap: calc(var(--spacing) * 2);
543
+ border-radius: var(--radius-xl);
544
+ border-style: var(--tw-border-style);
545
+ border-width: 1px;
546
+ border-color: transparent;
547
+ padding-inline: calc(var(--spacing) * 4);
548
+ font-size: var(--text-sm);
549
+ line-height: var(--tw-leading, var(--text-sm--line-height));
550
+ --tw-font-weight: var(--font-weight-semibold);
551
+ font-weight: var(--font-weight-semibold);
552
+ --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
553
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
554
+ transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
555
+ transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
556
+ transition-duration: var(--tw-duration, var(--default-transition-duration));
557
+ &:focus {
558
+ --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
559
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
560
+ }
561
+ &:focus {
562
+ --tw-outline-style: none;
563
+ outline-style: none;
564
+ }
565
+ &:disabled {
566
+ pointer-events: none;
567
+ }
568
+ &:disabled {
569
+ cursor: not-allowed;
570
+ }
571
+ &:disabled {
572
+ opacity: 50%;
573
+ }
574
+ }
575
+ .lesli-form-button.is-primary, .lesli-form-button.is-info {
576
+ background-color: var(--color-sky-600);
577
+ color: var(--color-white);
578
+ &:hover {
579
+ @media (hover: hover) {
580
+ background-color: var(--color-sky-700);
581
+ }
582
+ }
583
+ &:focus {
584
+ --tw-ring-color: color-mix(in srgb, oklch(68.5% 0.169 237.323) 20%, transparent);
585
+ @supports (color: color-mix(in lab, red, red)) {
586
+ --tw-ring-color: color-mix(in oklab, var(--color-sky-500) 20%, transparent);
587
+ }
588
+ }
589
+ }
590
+ .lesli-form-button.is-success {
591
+ background-color: var(--color-emerald-600);
592
+ color: var(--color-white);
593
+ &:hover {
594
+ @media (hover: hover) {
595
+ background-color: var(--color-emerald-700);
596
+ }
597
+ }
598
+ &:focus {
599
+ --tw-ring-color: color-mix(in srgb, oklch(69.6% 0.17 162.48) 20%, transparent);
600
+ @supports (color: color-mix(in lab, red, red)) {
601
+ --tw-ring-color: color-mix(in oklab, var(--color-emerald-500) 20%, transparent);
602
+ }
603
+ }
604
+ }
605
+ .lesli-form-button.is-warning {
606
+ background-color: var(--color-amber-500);
607
+ color: var(--color-amber-950);
608
+ &:hover {
609
+ @media (hover: hover) {
610
+ background-color: var(--color-amber-600);
611
+ }
612
+ }
613
+ &:focus {
614
+ --tw-ring-color: color-mix(in srgb, oklch(76.9% 0.188 70.08) 20%, transparent);
615
+ @supports (color: color-mix(in lab, red, red)) {
616
+ --tw-ring-color: color-mix(in oklab, var(--color-amber-500) 20%, transparent);
617
+ }
618
+ }
619
+ }
620
+ .lesli-form-button.is-danger {
621
+ background-color: var(--color-rose-600);
622
+ color: var(--color-white);
623
+ &:hover {
624
+ @media (hover: hover) {
625
+ background-color: var(--color-rose-700);
626
+ }
627
+ }
628
+ &:focus {
629
+ --tw-ring-color: color-mix(in srgb, oklch(64.5% 0.246 16.439) 20%, transparent);
630
+ @supports (color: color-mix(in lab, red, red)) {
631
+ --tw-ring-color: color-mix(in oklab, var(--color-rose-500) 20%, transparent);
632
+ }
633
+ }
634
+ }
635
+ .lesli-form-button.is-fullwidth {
636
+ width: 100%;
637
+ }
638
+ .lesli-form-button-icon {
639
+ display: inline-flex;
640
+ height: calc(var(--spacing) * 5);
641
+ width: calc(var(--spacing) * 5);
642
+ align-items: center;
643
+ justify-content: center;
644
+ }
645
+ .lesli-form-button-icon .material-symbols {
646
+ font-size: var(--text-xl);
647
+ line-height: var(--tw-leading, var(--text-xl--line-height));
648
+ --tw-leading: 1;
649
+ line-height: 1;
650
+ }
651
+ .lesli-form-fieldset {
652
+ margin-bottom: calc(var(--spacing) * 6);
653
+ border-radius: var(--radius-2xl);
654
+ border-style: var(--tw-border-style);
655
+ border-width: 1px;
656
+ border-color: var(--color-slate-200);
657
+ background-color: var(--color-white);
658
+ padding: calc(var(--spacing) * 6);
659
+ --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
660
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
661
+ }
662
+ .lesli-form-legend {
663
+ margin-bottom: calc(var(--spacing) * 5);
664
+ margin-left: calc(var(--spacing) * -1);
665
+ padding-inline: var(--spacing);
666
+ font-size: var(--text-lg);
667
+ line-height: var(--tw-leading, var(--text-lg--line-height));
668
+ --tw-font-weight: var(--font-weight-semibold);
669
+ font-weight: var(--font-weight-semibold);
670
+ color: var(--color-slate-800);
671
+ }
672
+ .lesli-form-fieldset.is-info {
673
+ border-color: var(--color-sky-200);
674
+ background-color: color-mix(in srgb, oklch(97.7% 0.013 236.62) 40%, transparent);
675
+ @supports (color: color-mix(in lab, red, red)) {
676
+ background-color: color-mix(in oklab, var(--color-sky-50) 40%, transparent);
677
+ }
678
+ }
679
+ .lesli-form-fieldset.is-success {
680
+ border-color: var(--color-emerald-200);
681
+ background-color: color-mix(in srgb, oklch(97.9% 0.021 166.113) 40%, transparent);
682
+ @supports (color: color-mix(in lab, red, red)) {
683
+ background-color: color-mix(in oklab, var(--color-emerald-50) 40%, transparent);
684
+ }
685
+ }
686
+ .lesli-form-fieldset.is-warning {
687
+ border-color: var(--color-amber-200);
688
+ background-color: color-mix(in srgb, oklch(98.7% 0.022 95.277) 50%, transparent);
689
+ @supports (color: color-mix(in lab, red, red)) {
690
+ background-color: color-mix(in oklab, var(--color-amber-50) 50%, transparent);
691
+ }
692
+ }
693
+ .lesli-form-fieldset.is-danger {
694
+ border-color: var(--color-rose-200);
695
+ background-color: color-mix(in srgb, oklch(96.9% 0.015 12.422) 40%, transparent);
696
+ @supports (color: color-mix(in lab, red, red)) {
697
+ background-color: color-mix(in oklab, var(--color-rose-50) 40%, transparent);
698
+ }
699
+ }
700
+ @media (min-width: 768px) {
701
+ .lesli-form-field.is-horizontal {
702
+ display: grid;
703
+ grid-template-columns: minmax(8rem,1fr) minmax(0,3fr);
704
+ align-items: flex-start;
705
+ gap: calc(var(--spacing) * 5);
706
+ }
707
+ .lesli-form-field.is-horizontal > .lesli-form-label-wrapper {
708
+ margin-bottom: 0px;
709
+ padding-top: calc(var(--spacing) * 2.5);
710
+ text-align: right;
711
+ }
712
+ .lesli-form-field.is-horizontal > .lesli-form-field-body {
713
+ grid-column-start: 2;
714
+ }
715
+ }
716
+ .links {
717
+ margin-top: calc(var(--spacing) * 5);
718
+ display: flex;
719
+ flex-wrap: wrap;
720
+ align-items: center;
721
+ justify-content: center;
722
+ column-gap: calc(var(--spacing) * 4);
723
+ row-gap: calc(var(--spacing) * 2);
724
+ font-size: var(--text-sm);
725
+ line-height: var(--tw-leading, var(--text-sm--line-height));
726
+ }
727
+ .links > a {
728
+ display: inline-flex;
729
+ align-items: center;
730
+ --tw-font-weight: var(--font-weight-medium);
731
+ font-weight: var(--font-weight-medium);
732
+ color: var(--color-slate-700);
733
+ transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
734
+ transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
735
+ transition-duration: var(--tw-duration, var(--default-transition-duration));
736
+ &:hover {
737
+ @media (hover: hover) {
738
+ color: var(--lesli-color-primary);
739
+ }
740
+ }
741
+ &:focus {
742
+ --tw-outline-style: none;
743
+ outline-style: none;
744
+ }
745
+ &:focus-visible {
746
+ border-radius: var(--radius-sm);
747
+ }
748
+ &:focus-visible {
749
+ outline-style: var(--tw-outline-style);
750
+ outline-width: 2px;
751
+ }
752
+ &:focus-visible {
753
+ outline-offset: 2px;
754
+ }
755
+ &:focus-visible {
756
+ outline-color: var(--lesli-color-primary);
757
+ }
758
+ }
759
+ .links .icon {
760
+ margin-right: 0px;
761
+ display: inline-flex;
762
+ height: calc(var(--spacing) * 7);
763
+ width: calc(var(--spacing) * 7);
764
+ flex-shrink: 0;
765
+ align-items: center;
766
+ justify-content: center;
767
+ }
768
+ .links .icon svg {
769
+ display: block;
770
+ max-height: calc(var(--spacing) * 6);
771
+ max-width: calc(var(--spacing) * 6);
772
+ }
773
+ .links > a > span:not(.icon) {
774
+ font-family: "Domine", "OpenSans", sans-serif;
775
+ }
776
+ }
777
+ @property --tw-space-y-reverse {
778
+ syntax: "*";
779
+ inherits: false;
780
+ initial-value: 0;
781
+ }
782
+ @property --tw-border-style {
783
+ syntax: "*";
784
+ inherits: false;
785
+ initial-value: solid;
786
+ }
787
+ @property --tw-leading {
788
+ syntax: "*";
789
+ inherits: false;
790
+ }
791
+ @property --tw-font-weight {
792
+ syntax: "*";
793
+ inherits: false;
794
+ }
795
+ @property --tw-tracking {
796
+ syntax: "*";
797
+ inherits: false;
798
+ }
799
+ @property --tw-shadow {
800
+ syntax: "*";
801
+ inherits: false;
802
+ initial-value: 0 0 #0000;
803
+ }
804
+ @property --tw-shadow-color {
805
+ syntax: "*";
806
+ inherits: false;
807
+ }
808
+ @property --tw-shadow-alpha {
809
+ syntax: "<percentage>";
810
+ inherits: false;
811
+ initial-value: 100%;
812
+ }
813
+ @property --tw-inset-shadow {
814
+ syntax: "*";
815
+ inherits: false;
816
+ initial-value: 0 0 #0000;
817
+ }
818
+ @property --tw-inset-shadow-color {
819
+ syntax: "*";
820
+ inherits: false;
821
+ }
822
+ @property --tw-inset-shadow-alpha {
823
+ syntax: "<percentage>";
824
+ inherits: false;
825
+ initial-value: 100%;
826
+ }
827
+ @property --tw-ring-color {
828
+ syntax: "*";
829
+ inherits: false;
830
+ }
831
+ @property --tw-ring-shadow {
832
+ syntax: "*";
833
+ inherits: false;
834
+ initial-value: 0 0 #0000;
835
+ }
836
+ @property --tw-inset-ring-color {
837
+ syntax: "*";
838
+ inherits: false;
839
+ }
840
+ @property --tw-inset-ring-shadow {
841
+ syntax: "*";
842
+ inherits: false;
843
+ initial-value: 0 0 #0000;
844
+ }
845
+ @property --tw-ring-inset {
846
+ syntax: "*";
847
+ inherits: false;
848
+ }
849
+ @property --tw-ring-offset-width {
850
+ syntax: "<length>";
851
+ inherits: false;
852
+ initial-value: 0px;
853
+ }
854
+ @property --tw-ring-offset-color {
855
+ syntax: "*";
856
+ inherits: false;
857
+ initial-value: #fff;
858
+ }
859
+ @property --tw-ring-offset-shadow {
860
+ syntax: "*";
861
+ inherits: false;
862
+ initial-value: 0 0 #0000;
863
+ }
864
+ @property --tw-outline-style {
865
+ syntax: "*";
866
+ inherits: false;
867
+ initial-value: solid;
868
+ }
869
+ @property --tw-translate-x {
870
+ syntax: "*";
871
+ inherits: false;
872
+ initial-value: 0;
873
+ }
874
+ @property --tw-translate-y {
875
+ syntax: "*";
876
+ inherits: false;
877
+ initial-value: 0;
878
+ }
879
+ @property --tw-translate-z {
880
+ syntax: "*";
881
+ inherits: false;
882
+ initial-value: 0;
883
+ }
884
+ @property --tw-content {
885
+ syntax: "*";
886
+ inherits: false;
887
+ initial-value: "";
888
+ }
889
+ @layer properties {
890
+ @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
891
+ *, ::before, ::after, ::backdrop {
892
+ --tw-space-y-reverse: 0;
893
+ --tw-border-style: solid;
894
+ --tw-leading: initial;
895
+ --tw-font-weight: initial;
896
+ --tw-tracking: initial;
897
+ --tw-shadow: 0 0 #0000;
898
+ --tw-shadow-color: initial;
899
+ --tw-shadow-alpha: 100%;
900
+ --tw-inset-shadow: 0 0 #0000;
901
+ --tw-inset-shadow-color: initial;
902
+ --tw-inset-shadow-alpha: 100%;
903
+ --tw-ring-color: initial;
904
+ --tw-ring-shadow: 0 0 #0000;
905
+ --tw-inset-ring-color: initial;
906
+ --tw-inset-ring-shadow: 0 0 #0000;
907
+ --tw-ring-inset: initial;
908
+ --tw-ring-offset-width: 0px;
909
+ --tw-ring-offset-color: #fff;
910
+ --tw-ring-offset-shadow: 0 0 #0000;
911
+ --tw-outline-style: solid;
912
+ --tw-translate-x: 0;
913
+ --tw-translate-y: 0;
914
+ --tw-translate-z: 0;
915
+ --tw-content: "";
916
+ }
917
+ }
19
918
  }