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,32 +1,984 @@
1
- @charset "UTF-8";
2
- /*
3
-
4
- Lesli
5
-
6
- Copyright (c) 2026, Lesli Technologies, S. A.
7
-
8
- This program is free software: you can redistribute it and/or modify
9
- it under the terms of the GNU General Public License as published by
10
- the Free Software Foundation, either version 3 of the License, or
11
- (at your option) any later version.
12
-
13
- This program is distributed in the hope that it will be useful,
14
- but WITHOUT ANY WARRANTY; without even the implied warranty of
15
- MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
16
- GNU General Public License for more details.
17
-
18
- You should have received a copy of the GNU General Public License
19
- along with this program. If not, see http://www.gnu.org/licenses/.
20
-
21
- Lesli · Ruby on Rails SaaS Development Framework.
22
-
23
- Made with ♥ by LesliTech
24
- Building a better future, one line of code at a time.
25
-
26
- @contact hello@lesli.tech
27
- @website https://www.lesli.tech
28
- @license GPLv3 http://www.gnu.org/licenses/gpl-3.0.en.html
29
-
30
- // · ~·~ ~·~ ~·~ ~·~ ~·~ ~·~ ~·~ ~·~ ~·~
31
- // ·
32
- */
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-sky-50: oklch(97.7% 0.013 236.62);
18
+ --color-sky-200: oklch(90.1% 0.058 230.902);
19
+ --color-sky-500: oklch(68.5% 0.169 237.323);
20
+ --color-sky-600: oklch(58.8% 0.158 241.966);
21
+ --color-sky-700: oklch(50% 0.134 242.749);
22
+ --color-sky-800: oklch(44.3% 0.11 240.79);
23
+ --color-sky-900: oklch(39.1% 0.09 240.876);
24
+ --color-sky-950: oklch(29.3% 0.066 243.157);
25
+ --color-rose-50: oklch(96.9% 0.015 12.422);
26
+ --color-rose-200: oklch(89.2% 0.058 10.001);
27
+ --color-rose-400: oklch(71.2% 0.194 13.428);
28
+ --color-rose-500: oklch(64.5% 0.246 16.439);
29
+ --color-rose-600: oklch(58.6% 0.253 17.585);
30
+ --color-rose-700: oklch(51.4% 0.222 16.935);
31
+ --color-slate-50: oklch(98.4% 0.003 247.858);
32
+ --color-slate-100: oklch(96.8% 0.007 247.896);
33
+ --color-slate-200: oklch(92.9% 0.013 255.508);
34
+ --color-slate-300: oklch(86.9% 0.022 252.894);
35
+ --color-slate-400: oklch(70.4% 0.04 256.788);
36
+ --color-slate-500: oklch(55.4% 0.046 257.417);
37
+ --color-slate-600: oklch(44.6% 0.043 257.281);
38
+ --color-slate-700: oklch(37.2% 0.044 257.287);
39
+ --color-slate-800: oklch(27.9% 0.041 260.031);
40
+ --color-slate-900: oklch(20.8% 0.042 265.755);
41
+ --color-slate-950: oklch(12.9% 0.042 264.695);
42
+ --color-white: #fff;
43
+ --spacing: 0.25rem;
44
+ --container-md: 28rem;
45
+ --container-lg: 32rem;
46
+ --text-sm: 0.875rem;
47
+ --text-sm--line-height: calc(1.25 / 0.875);
48
+ --text-lg: 1.125rem;
49
+ --text-lg--line-height: calc(1.75 / 1.125);
50
+ --text-xl: 1.25rem;
51
+ --text-xl--line-height: calc(1.75 / 1.25);
52
+ --text-3xl: 1.875rem;
53
+ --text-3xl--line-height: calc(2.25 / 1.875);
54
+ --font-weight-medium: 500;
55
+ --font-weight-semibold: 600;
56
+ --tracking-tight: -0.025em;
57
+ --leading-tight: 1.25;
58
+ --radius-lg: 0.5rem;
59
+ --radius-xl: 0.75rem;
60
+ --radius-2xl: 1rem;
61
+ --default-transition-duration: 150ms;
62
+ --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
63
+ }
64
+ }
65
+ @layer utilities {
66
+ .absolute {
67
+ position: absolute;
68
+ }
69
+ .relative {
70
+ position: relative;
71
+ }
72
+ .inset-0 {
73
+ inset: 0px;
74
+ }
75
+ .inset-x-0 {
76
+ inset-inline: 0px;
77
+ }
78
+ .bottom-0 {
79
+ bottom: 0px;
80
+ }
81
+ .mx-auto {
82
+ margin-inline: auto;
83
+ }
84
+ .mt-1 {
85
+ margin-top: var(--spacing);
86
+ }
87
+ .mt-4 {
88
+ margin-top: calc(var(--spacing) * 4);
89
+ }
90
+ .mr-1 {
91
+ margin-right: var(--spacing);
92
+ }
93
+ .mr-2 {
94
+ margin-right: calc(var(--spacing) * 2);
95
+ }
96
+ .mb-6 {
97
+ margin-bottom: calc(var(--spacing) * 6);
98
+ }
99
+ .mb-8 {
100
+ margin-bottom: calc(var(--spacing) * 8);
101
+ }
102
+ .flex {
103
+ display: flex;
104
+ }
105
+ .grid {
106
+ display: grid;
107
+ }
108
+ .hidden {
109
+ display: none;
110
+ }
111
+ .inline-flex {
112
+ display: inline-flex;
113
+ }
114
+ .h-5 {
115
+ height: calc(var(--spacing) * 5);
116
+ }
117
+ .h-auto {
118
+ height: auto;
119
+ }
120
+ .max-h-20 {
121
+ max-height: calc(var(--spacing) * 20);
122
+ }
123
+ .min-h-screen {
124
+ min-height: 100vh;
125
+ }
126
+ .w-5 {
127
+ width: calc(var(--spacing) * 5);
128
+ }
129
+ .w-auto {
130
+ width: auto;
131
+ }
132
+ .w-full {
133
+ width: 100%;
134
+ }
135
+ .max-w-\[220px\] {
136
+ max-width: 220px;
137
+ }
138
+ .max-w-lg {
139
+ max-width: var(--container-lg);
140
+ }
141
+ .max-w-md {
142
+ max-width: var(--container-md);
143
+ }
144
+ .flex-1 {
145
+ flex: 1;
146
+ }
147
+ .grid-cols-\[auto_1fr\] {
148
+ grid-template-columns: auto 1fr;
149
+ }
150
+ .flex-col {
151
+ flex-direction: column;
152
+ }
153
+ .items-center {
154
+ align-items: center;
155
+ }
156
+ .justify-center {
157
+ justify-content: center;
158
+ }
159
+ .gap-2 {
160
+ gap: calc(var(--spacing) * 2);
161
+ }
162
+ .gap-x-3 {
163
+ column-gap: calc(var(--spacing) * 3);
164
+ }
165
+ .gap-y-1 {
166
+ row-gap: var(--spacing);
167
+ }
168
+ .overflow-hidden {
169
+ overflow: hidden;
170
+ }
171
+ .rounded-lg {
172
+ border-radius: var(--radius-lg);
173
+ }
174
+ .rounded-xl {
175
+ border-radius: var(--radius-xl);
176
+ }
177
+ .border {
178
+ border-style: var(--tw-border-style);
179
+ border-width: 1px;
180
+ }
181
+ .border-sky-200 {
182
+ border-color: var(--color-sky-200);
183
+ }
184
+ .bg-sky-50 {
185
+ background-color: var(--color-sky-50);
186
+ }
187
+ .bg-slate-50 {
188
+ background-color: var(--color-slate-50);
189
+ }
190
+ .bg-white {
191
+ background-color: var(--color-white);
192
+ }
193
+ .bg-gradient-to-t {
194
+ --tw-gradient-position: to top in oklab;
195
+ background-image: linear-gradient(var(--tw-gradient-stops));
196
+ }
197
+ .from-slate-950\/70 {
198
+ --tw-gradient-from: color-mix(in srgb, oklch(12.9% 0.042 264.695) 70%, transparent);
199
+ @supports (color: color-mix(in lab, red, red)) {
200
+ --tw-gradient-from: color-mix(in oklab, var(--color-slate-950) 70%, transparent);
201
+ }
202
+ --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
203
+ }
204
+ .via-slate-900\/10 {
205
+ --tw-gradient-via: color-mix(in srgb, oklch(20.8% 0.042 265.755) 10%, transparent);
206
+ @supports (color: color-mix(in lab, red, red)) {
207
+ --tw-gradient-via: color-mix(in oklab, var(--color-slate-900) 10%, transparent);
208
+ }
209
+ --tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-via) var(--tw-gradient-via-position), var(--tw-gradient-to) var(--tw-gradient-to-position);
210
+ --tw-gradient-stops: var(--tw-gradient-via-stops);
211
+ }
212
+ .to-transparent {
213
+ --tw-gradient-to: transparent;
214
+ --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
215
+ }
216
+ .p-12 {
217
+ padding: calc(var(--spacing) * 12);
218
+ }
219
+ .px-2 {
220
+ padding-inline: calc(var(--spacing) * 2);
221
+ }
222
+ .px-4 {
223
+ padding-inline: calc(var(--spacing) * 4);
224
+ }
225
+ .px-6 {
226
+ padding-inline: calc(var(--spacing) * 6);
227
+ }
228
+ .py-10 {
229
+ padding-block: calc(var(--spacing) * 10);
230
+ }
231
+ .pt-6 {
232
+ padding-top: calc(var(--spacing) * 6);
233
+ }
234
+ .pb-4 {
235
+ padding-bottom: calc(var(--spacing) * 4);
236
+ }
237
+ .text-center {
238
+ text-align: center;
239
+ }
240
+ .text-3xl {
241
+ font-size: var(--text-3xl);
242
+ line-height: var(--tw-leading, var(--text-3xl--line-height));
243
+ }
244
+ .text-sm {
245
+ font-size: var(--text-sm);
246
+ line-height: var(--tw-leading, var(--text-sm--line-height));
247
+ }
248
+ .leading-tight {
249
+ --tw-leading: var(--leading-tight);
250
+ line-height: var(--leading-tight);
251
+ }
252
+ .font-medium {
253
+ --tw-font-weight: var(--font-weight-medium);
254
+ font-weight: var(--font-weight-medium);
255
+ }
256
+ .font-semibold {
257
+ --tw-font-weight: var(--font-weight-semibold);
258
+ font-weight: var(--font-weight-semibold);
259
+ }
260
+ .tracking-tight {
261
+ --tw-tracking: var(--tracking-tight);
262
+ letter-spacing: var(--tracking-tight);
263
+ }
264
+ .break-all {
265
+ word-break: break-all;
266
+ }
267
+ .text-sky-700 {
268
+ color: var(--color-sky-700);
269
+ }
270
+ .text-sky-800 {
271
+ color: var(--color-sky-800);
272
+ }
273
+ .text-sky-950 {
274
+ color: var(--color-sky-950);
275
+ }
276
+ .text-slate-600 {
277
+ color: var(--color-slate-600);
278
+ }
279
+ .text-slate-900 {
280
+ color: var(--color-slate-900);
281
+ }
282
+ .text-white {
283
+ color: var(--color-white);
284
+ }
285
+ .transition {
286
+ 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;
287
+ transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
288
+ transition-duration: var(--tw-duration, var(--default-transition-duration));
289
+ }
290
+ @media (hover: hover) {
291
+ .hover\:text-sky-900:hover {
292
+ color: var(--color-sky-900);
293
+ }
294
+ }
295
+ .focus\:ring-2:focus {
296
+ --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
297
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
298
+ }
299
+ .focus\:ring-sky-500\/30:focus {
300
+ --tw-ring-color: color-mix(in srgb, oklch(68.5% 0.169 237.323) 30%, transparent);
301
+ @supports (color: color-mix(in lab, red, red)) {
302
+ --tw-ring-color: color-mix(in oklab, var(--color-sky-500) 30%, transparent);
303
+ }
304
+ }
305
+ .focus\:ring-offset-4:focus {
306
+ --tw-ring-offset-width: 4px;
307
+ --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
308
+ }
309
+ .focus\:outline-none:focus {
310
+ --tw-outline-style: none;
311
+ outline-style: none;
312
+ }
313
+ @media (width >= 40rem) {
314
+ .sm\:px-10 {
315
+ padding-inline: calc(var(--spacing) * 10);
316
+ }
317
+ .sm\:pt-8 {
318
+ padding-top: calc(var(--spacing) * 8);
319
+ }
320
+ }
321
+ @media (width >= 64rem) {
322
+ .lg\:col-span-2 {
323
+ grid-column: span 2 / span 2;
324
+ }
325
+ .lg\:block {
326
+ display: block;
327
+ }
328
+ .lg\:grid {
329
+ display: grid;
330
+ }
331
+ .lg\:grid-cols-3 {
332
+ grid-template-columns: repeat(3, minmax(0, 1fr));
333
+ }
334
+ .lg\:px-16 {
335
+ padding-inline: calc(var(--spacing) * 16);
336
+ }
337
+ }
338
+ }
339
+ @layer components {
340
+ .lesli-form-field {
341
+ margin-bottom: calc(var(--spacing) * 4);
342
+ }
343
+ .lesli-form-label-wrapper {
344
+ margin-bottom: calc(var(--spacing) * 2);
345
+ }
346
+ .lesli-form-label {
347
+ display: block;
348
+ font-size: var(--text-sm);
349
+ line-height: var(--tw-leading, var(--text-sm--line-height));
350
+ --tw-leading: calc(var(--spacing) * 5);
351
+ line-height: calc(var(--spacing) * 5);
352
+ --tw-font-weight: var(--font-weight-medium);
353
+ font-weight: var(--font-weight-medium);
354
+ color: var(--color-slate-700);
355
+ }
356
+ .lesli-form-field-body {
357
+ min-width: 0px;
358
+ }
359
+ .lesli-form-control {
360
+ position: relative;
361
+ }
362
+ .lesli-form-input, .lesli-form-select, .lesli-form-control textarea, .lesli-form-control trix-editor {
363
+ display: block;
364
+ width: 100%;
365
+ border-radius: var(--radius-xl);
366
+ border-style: var(--tw-border-style);
367
+ border-width: 1px;
368
+ border-color: var(--color-slate-300);
369
+ background-color: var(--color-white);
370
+ padding-inline: calc(var(--spacing) * 3.5);
371
+ padding-block: calc(var(--spacing) * 2.5);
372
+ font-size: var(--text-sm);
373
+ line-height: var(--tw-leading, var(--text-sm--line-height));
374
+ color: var(--color-slate-900);
375
+ --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));
376
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
377
+ 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;
378
+ transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
379
+ transition-duration: var(--tw-duration, var(--default-transition-duration));
380
+ --tw-outline-style: none;
381
+ outline-style: none;
382
+ &::placeholder {
383
+ color: var(--color-slate-400);
384
+ }
385
+ &:hover {
386
+ @media (hover: hover) {
387
+ border-color: var(--color-slate-400);
388
+ }
389
+ }
390
+ &:focus {
391
+ border-color: var(--color-sky-500);
392
+ }
393
+ &:focus {
394
+ --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
395
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
396
+ }
397
+ &:focus {
398
+ --tw-ring-color: color-mix(in srgb, oklch(68.5% 0.169 237.323) 10%, transparent);
399
+ @supports (color: color-mix(in lab, red, red)) {
400
+ --tw-ring-color: color-mix(in oklab, var(--color-sky-500) 10%, transparent);
401
+ }
402
+ }
403
+ &:disabled {
404
+ cursor: not-allowed;
405
+ }
406
+ &:disabled {
407
+ background-color: var(--color-slate-100);
408
+ }
409
+ &:disabled {
410
+ color: var(--color-slate-500);
411
+ }
412
+ &:disabled {
413
+ opacity: 75%;
414
+ }
415
+ }
416
+ .lesli-form-input, .lesli-form-select {
417
+ height: calc(var(--spacing) * 11);
418
+ }
419
+ .lesli-form-control textarea, .lesli-form-control trix-editor {
420
+ min-height: calc(var(--spacing) * 32);
421
+ resize: vertical;
422
+ }
423
+ .lesli-form-select-wrapper {
424
+ position: relative;
425
+ }
426
+ .lesli-form-select {
427
+ cursor: pointer;
428
+ appearance: none;
429
+ padding-right: calc(var(--spacing) * 10);
430
+ }
431
+ .lesli-form-select-wrapper::after {
432
+ pointer-events: none;
433
+ position: absolute;
434
+ top: calc(1 / 2 * 100%);
435
+ right: calc(var(--spacing) * 3.5);
436
+ height: calc(var(--spacing) * 2);
437
+ width: calc(var(--spacing) * 2);
438
+ --tw-translate-y: calc(var(--spacing) * -2);
439
+ translate: var(--tw-translate-x) var(--tw-translate-y);
440
+ rotate: 45deg;
441
+ border-right-style: var(--tw-border-style);
442
+ border-right-width: 2px;
443
+ border-bottom-style: var(--tw-border-style);
444
+ border-bottom-width: 2px;
445
+ border-color: var(--color-slate-400);
446
+ --tw-content: '';
447
+ content: var(--tw-content);
448
+ }
449
+ .lesli-form-checkbox {
450
+ height: calc(var(--spacing) * 4);
451
+ width: calc(var(--spacing) * 4);
452
+ cursor: pointer;
453
+ border-radius: 0.25rem;
454
+ border-color: var(--color-slate-300);
455
+ accent-color: var(--color-sky-600);
456
+ &:focus {
457
+ --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
458
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
459
+ }
460
+ &:focus {
461
+ --tw-ring-color: color-mix(in srgb, oklch(68.5% 0.169 237.323) 30%, transparent);
462
+ @supports (color: color-mix(in lab, red, red)) {
463
+ --tw-ring-color: color-mix(in oklab, var(--color-sky-500) 30%, transparent);
464
+ }
465
+ }
466
+ &:focus {
467
+ --tw-ring-offset-width: 2px;
468
+ --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
469
+ }
470
+ &:disabled {
471
+ cursor: not-allowed;
472
+ }
473
+ &:disabled {
474
+ opacity: 50%;
475
+ }
476
+ }
477
+ .lesli-form-checkbox-label {
478
+ display: inline-flex;
479
+ cursor: pointer;
480
+ align-items: center;
481
+ gap: calc(var(--spacing) * 2.5);
482
+ font-size: var(--text-sm);
483
+ line-height: var(--tw-leading, var(--text-sm--line-height));
484
+ color: var(--color-slate-600);
485
+ }
486
+ .lesli-form-control.has-icon .lesli-form-input, .lesli-form-control.has-icon .lesli-form-select {
487
+ padding-left: calc(var(--spacing) * 11);
488
+ }
489
+ .lesli-form-icon {
490
+ pointer-events: none;
491
+ position: absolute;
492
+ top: calc(1 / 2 * 100%);
493
+ left: calc(var(--spacing) * 3.5);
494
+ display: inline-flex;
495
+ height: calc(var(--spacing) * 5);
496
+ width: calc(var(--spacing) * 5);
497
+ --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
498
+ translate: var(--tw-translate-x) var(--tw-translate-y);
499
+ align-items: center;
500
+ justify-content: center;
501
+ color: var(--color-slate-400);
502
+ }
503
+ .lesli-form-icon .material-symbols-outlined {
504
+ font-size: var(--text-xl);
505
+ line-height: var(--tw-leading, var(--text-xl--line-height));
506
+ --tw-leading: 1;
507
+ line-height: 1;
508
+ }
509
+ .lesli-form-help {
510
+ margin-top: calc(var(--spacing) * 2);
511
+ font-size: var(--text-sm);
512
+ line-height: var(--tw-leading, var(--text-sm--line-height));
513
+ --tw-leading: calc(var(--spacing) * 5);
514
+ line-height: calc(var(--spacing) * 5);
515
+ color: var(--color-slate-500);
516
+ }
517
+ .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 {
518
+ border-color: var(--color-rose-400);
519
+ &:focus {
520
+ border-color: var(--color-rose-500);
521
+ }
522
+ &:focus {
523
+ --tw-ring-color: color-mix(in srgb, oklch(64.5% 0.246 16.439) 10%, transparent);
524
+ @supports (color: color-mix(in lab, red, red)) {
525
+ --tw-ring-color: color-mix(in oklab, var(--color-rose-500) 10%, transparent);
526
+ }
527
+ }
528
+ }
529
+ .lesli-form-help.is-danger {
530
+ color: var(--color-rose-700);
531
+ }
532
+ .lesli-form-help.is-warning {
533
+ color: var(--color-amber-700);
534
+ }
535
+ .lesli-form-help.is-success {
536
+ color: var(--color-emerald-700);
537
+ }
538
+ .lesli-form-help.is-info {
539
+ color: var(--color-sky-700);
540
+ }
541
+ .lesli-form-button {
542
+ display: inline-flex;
543
+ height: calc(var(--spacing) * 11);
544
+ cursor: pointer;
545
+ align-items: center;
546
+ justify-content: center;
547
+ gap: calc(var(--spacing) * 2);
548
+ border-radius: var(--radius-xl);
549
+ border-style: var(--tw-border-style);
550
+ border-width: 1px;
551
+ border-color: transparent;
552
+ padding-inline: calc(var(--spacing) * 4);
553
+ font-size: var(--text-sm);
554
+ line-height: var(--tw-leading, var(--text-sm--line-height));
555
+ --tw-font-weight: var(--font-weight-semibold);
556
+ font-weight: var(--font-weight-semibold);
557
+ --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));
558
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
559
+ 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;
560
+ transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
561
+ transition-duration: var(--tw-duration, var(--default-transition-duration));
562
+ &:focus {
563
+ --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
564
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
565
+ }
566
+ &:focus {
567
+ --tw-outline-style: none;
568
+ outline-style: none;
569
+ }
570
+ &:disabled {
571
+ pointer-events: none;
572
+ }
573
+ &:disabled {
574
+ cursor: not-allowed;
575
+ }
576
+ &:disabled {
577
+ opacity: 50%;
578
+ }
579
+ }
580
+ .lesli-form-button.is-primary, .lesli-form-button.is-info {
581
+ background-color: var(--color-sky-600);
582
+ color: var(--color-white);
583
+ &:hover {
584
+ @media (hover: hover) {
585
+ background-color: var(--color-sky-700);
586
+ }
587
+ }
588
+ &:focus {
589
+ --tw-ring-color: color-mix(in srgb, oklch(68.5% 0.169 237.323) 20%, transparent);
590
+ @supports (color: color-mix(in lab, red, red)) {
591
+ --tw-ring-color: color-mix(in oklab, var(--color-sky-500) 20%, transparent);
592
+ }
593
+ }
594
+ }
595
+ .lesli-form-button.is-success {
596
+ background-color: var(--color-emerald-600);
597
+ color: var(--color-white);
598
+ &:hover {
599
+ @media (hover: hover) {
600
+ background-color: var(--color-emerald-700);
601
+ }
602
+ }
603
+ &:focus {
604
+ --tw-ring-color: color-mix(in srgb, oklch(69.6% 0.17 162.48) 20%, transparent);
605
+ @supports (color: color-mix(in lab, red, red)) {
606
+ --tw-ring-color: color-mix(in oklab, var(--color-emerald-500) 20%, transparent);
607
+ }
608
+ }
609
+ }
610
+ .lesli-form-button.is-warning {
611
+ background-color: var(--color-amber-500);
612
+ color: var(--color-amber-950);
613
+ &:hover {
614
+ @media (hover: hover) {
615
+ background-color: var(--color-amber-600);
616
+ }
617
+ }
618
+ &:focus {
619
+ --tw-ring-color: color-mix(in srgb, oklch(76.9% 0.188 70.08) 20%, transparent);
620
+ @supports (color: color-mix(in lab, red, red)) {
621
+ --tw-ring-color: color-mix(in oklab, var(--color-amber-500) 20%, transparent);
622
+ }
623
+ }
624
+ }
625
+ .lesli-form-button.is-danger {
626
+ background-color: var(--color-rose-600);
627
+ color: var(--color-white);
628
+ &:hover {
629
+ @media (hover: hover) {
630
+ background-color: var(--color-rose-700);
631
+ }
632
+ }
633
+ &:focus {
634
+ --tw-ring-color: color-mix(in srgb, oklch(64.5% 0.246 16.439) 20%, transparent);
635
+ @supports (color: color-mix(in lab, red, red)) {
636
+ --tw-ring-color: color-mix(in oklab, var(--color-rose-500) 20%, transparent);
637
+ }
638
+ }
639
+ }
640
+ .lesli-form-button.is-fullwidth {
641
+ width: 100%;
642
+ }
643
+ .lesli-form-button-icon {
644
+ display: inline-flex;
645
+ height: calc(var(--spacing) * 5);
646
+ width: calc(var(--spacing) * 5);
647
+ align-items: center;
648
+ justify-content: center;
649
+ }
650
+ .lesli-form-button-icon .material-symbols {
651
+ font-size: var(--text-xl);
652
+ line-height: var(--tw-leading, var(--text-xl--line-height));
653
+ --tw-leading: 1;
654
+ line-height: 1;
655
+ }
656
+ .lesli-form-fieldset {
657
+ margin-bottom: calc(var(--spacing) * 6);
658
+ border-radius: var(--radius-2xl);
659
+ border-style: var(--tw-border-style);
660
+ border-width: 1px;
661
+ border-color: var(--color-slate-200);
662
+ background-color: var(--color-white);
663
+ padding: calc(var(--spacing) * 6);
664
+ --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));
665
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
666
+ }
667
+ .lesli-form-legend {
668
+ margin-bottom: calc(var(--spacing) * 5);
669
+ margin-left: calc(var(--spacing) * -1);
670
+ padding-inline: var(--spacing);
671
+ font-size: var(--text-lg);
672
+ line-height: var(--tw-leading, var(--text-lg--line-height));
673
+ --tw-font-weight: var(--font-weight-semibold);
674
+ font-weight: var(--font-weight-semibold);
675
+ color: var(--color-slate-800);
676
+ }
677
+ .lesli-form-fieldset.is-info {
678
+ border-color: var(--color-sky-200);
679
+ background-color: color-mix(in srgb, oklch(97.7% 0.013 236.62) 40%, transparent);
680
+ @supports (color: color-mix(in lab, red, red)) {
681
+ background-color: color-mix(in oklab, var(--color-sky-50) 40%, transparent);
682
+ }
683
+ }
684
+ .lesli-form-fieldset.is-success {
685
+ border-color: var(--color-emerald-200);
686
+ background-color: color-mix(in srgb, oklch(97.9% 0.021 166.113) 40%, transparent);
687
+ @supports (color: color-mix(in lab, red, red)) {
688
+ background-color: color-mix(in oklab, var(--color-emerald-50) 40%, transparent);
689
+ }
690
+ }
691
+ .lesli-form-fieldset.is-warning {
692
+ border-color: var(--color-amber-200);
693
+ background-color: color-mix(in srgb, oklch(98.7% 0.022 95.277) 50%, transparent);
694
+ @supports (color: color-mix(in lab, red, red)) {
695
+ background-color: color-mix(in oklab, var(--color-amber-50) 50%, transparent);
696
+ }
697
+ }
698
+ .lesli-form-fieldset.is-danger {
699
+ border-color: var(--color-rose-200);
700
+ background-color: color-mix(in srgb, oklch(96.9% 0.015 12.422) 40%, transparent);
701
+ @supports (color: color-mix(in lab, red, red)) {
702
+ background-color: color-mix(in oklab, var(--color-rose-50) 40%, transparent);
703
+ }
704
+ }
705
+ @media (min-width: 768px) {
706
+ .lesli-form-field.is-horizontal {
707
+ display: grid;
708
+ grid-template-columns: minmax(8rem,1fr) minmax(0,3fr);
709
+ align-items: flex-start;
710
+ gap: calc(var(--spacing) * 5);
711
+ }
712
+ .lesli-form-field.is-horizontal > .lesli-form-label-wrapper {
713
+ margin-bottom: 0px;
714
+ padding-top: calc(var(--spacing) * 2.5);
715
+ text-align: right;
716
+ }
717
+ .lesli-form-field.is-horizontal > .lesli-form-field-body {
718
+ grid-column-start: 2;
719
+ }
720
+ }
721
+ .links {
722
+ margin-top: calc(var(--spacing) * 5);
723
+ overflow: hidden;
724
+ border-radius: var(--radius-xl);
725
+ border-style: var(--tw-border-style);
726
+ border-width: 1px;
727
+ border-color: var(--color-slate-200);
728
+ background-color: var(--color-white);
729
+ }
730
+ .links > a {
731
+ display: flex;
732
+ width: 100%;
733
+ align-items: center;
734
+ gap: calc(var(--spacing) * 3);
735
+ padding-inline: calc(var(--spacing) * 4);
736
+ padding-block: calc(var(--spacing) * 3);
737
+ font-size: var(--text-sm);
738
+ line-height: var(--tw-leading, var(--text-sm--line-height));
739
+ --tw-font-weight: var(--font-weight-medium);
740
+ font-weight: var(--font-weight-medium);
741
+ color: var(--color-slate-700);
742
+ transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
743
+ transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
744
+ transition-duration: var(--tw-duration, var(--default-transition-duration));
745
+ &:hover {
746
+ @media (hover: hover) {
747
+ background-color: var(--color-slate-50);
748
+ }
749
+ }
750
+ &:hover {
751
+ @media (hover: hover) {
752
+ color: var(--color-sky-700);
753
+ }
754
+ }
755
+ &:focus {
756
+ --tw-outline-style: none;
757
+ outline-style: none;
758
+ }
759
+ &:focus-visible {
760
+ background-color: var(--color-sky-50);
761
+ }
762
+ &:focus-visible {
763
+ --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
764
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
765
+ }
766
+ &:focus-visible {
767
+ --tw-ring-color: color-mix(in srgb, oklch(68.5% 0.169 237.323) 30%, transparent);
768
+ @supports (color: color-mix(in lab, red, red)) {
769
+ --tw-ring-color: color-mix(in oklab, var(--color-sky-500) 30%, transparent);
770
+ }
771
+ }
772
+ &:focus-visible {
773
+ --tw-ring-inset: inset;
774
+ }
775
+ }
776
+ .links > a:not(:last-child) {
777
+ border-bottom-style: var(--tw-border-style);
778
+ border-bottom-width: 1px;
779
+ border-color: var(--color-slate-200);
780
+ }
781
+ .links .icon {
782
+ margin-right: 0px;
783
+ display: inline-flex;
784
+ height: calc(var(--spacing) * 7);
785
+ width: calc(var(--spacing) * 7);
786
+ flex-shrink: 0;
787
+ align-items: center;
788
+ justify-content: center;
789
+ }
790
+ .links .icon svg {
791
+ display: block;
792
+ max-height: calc(var(--spacing) * 6);
793
+ max-width: calc(var(--spacing) * 6);
794
+ }
795
+ .links > a > span:not(.icon) {
796
+ font-family: "Domine", "OpenSans", sans-serif;
797
+ }
798
+ .lesli-auth-visual {
799
+ background: linear-gradient(0deg, rgba(49, 106, 255, 0.4), rgba(49, 106, 255, 0.4)), url("/lesli_shield/login-background.jpg");
800
+ background-position: center;
801
+ background-size: cover;
802
+ }
803
+ }
804
+ @property --tw-border-style {
805
+ syntax: "*";
806
+ inherits: false;
807
+ initial-value: solid;
808
+ }
809
+ @property --tw-gradient-position {
810
+ syntax: "*";
811
+ inherits: false;
812
+ }
813
+ @property --tw-gradient-from {
814
+ syntax: "<color>";
815
+ inherits: false;
816
+ initial-value: #0000;
817
+ }
818
+ @property --tw-gradient-via {
819
+ syntax: "<color>";
820
+ inherits: false;
821
+ initial-value: #0000;
822
+ }
823
+ @property --tw-gradient-to {
824
+ syntax: "<color>";
825
+ inherits: false;
826
+ initial-value: #0000;
827
+ }
828
+ @property --tw-gradient-stops {
829
+ syntax: "*";
830
+ inherits: false;
831
+ }
832
+ @property --tw-gradient-via-stops {
833
+ syntax: "*";
834
+ inherits: false;
835
+ }
836
+ @property --tw-gradient-from-position {
837
+ syntax: "<length-percentage>";
838
+ inherits: false;
839
+ initial-value: 0%;
840
+ }
841
+ @property --tw-gradient-via-position {
842
+ syntax: "<length-percentage>";
843
+ inherits: false;
844
+ initial-value: 50%;
845
+ }
846
+ @property --tw-gradient-to-position {
847
+ syntax: "<length-percentage>";
848
+ inherits: false;
849
+ initial-value: 100%;
850
+ }
851
+ @property --tw-leading {
852
+ syntax: "*";
853
+ inherits: false;
854
+ }
855
+ @property --tw-font-weight {
856
+ syntax: "*";
857
+ inherits: false;
858
+ }
859
+ @property --tw-tracking {
860
+ syntax: "*";
861
+ inherits: false;
862
+ }
863
+ @property --tw-shadow {
864
+ syntax: "*";
865
+ inherits: false;
866
+ initial-value: 0 0 #0000;
867
+ }
868
+ @property --tw-shadow-color {
869
+ syntax: "*";
870
+ inherits: false;
871
+ }
872
+ @property --tw-shadow-alpha {
873
+ syntax: "<percentage>";
874
+ inherits: false;
875
+ initial-value: 100%;
876
+ }
877
+ @property --tw-inset-shadow {
878
+ syntax: "*";
879
+ inherits: false;
880
+ initial-value: 0 0 #0000;
881
+ }
882
+ @property --tw-inset-shadow-color {
883
+ syntax: "*";
884
+ inherits: false;
885
+ }
886
+ @property --tw-inset-shadow-alpha {
887
+ syntax: "<percentage>";
888
+ inherits: false;
889
+ initial-value: 100%;
890
+ }
891
+ @property --tw-ring-color {
892
+ syntax: "*";
893
+ inherits: false;
894
+ }
895
+ @property --tw-ring-shadow {
896
+ syntax: "*";
897
+ inherits: false;
898
+ initial-value: 0 0 #0000;
899
+ }
900
+ @property --tw-inset-ring-color {
901
+ syntax: "*";
902
+ inherits: false;
903
+ }
904
+ @property --tw-inset-ring-shadow {
905
+ syntax: "*";
906
+ inherits: false;
907
+ initial-value: 0 0 #0000;
908
+ }
909
+ @property --tw-ring-inset {
910
+ syntax: "*";
911
+ inherits: false;
912
+ }
913
+ @property --tw-ring-offset-width {
914
+ syntax: "<length>";
915
+ inherits: false;
916
+ initial-value: 0px;
917
+ }
918
+ @property --tw-ring-offset-color {
919
+ syntax: "*";
920
+ inherits: false;
921
+ initial-value: #fff;
922
+ }
923
+ @property --tw-ring-offset-shadow {
924
+ syntax: "*";
925
+ inherits: false;
926
+ initial-value: 0 0 #0000;
927
+ }
928
+ @property --tw-translate-x {
929
+ syntax: "*";
930
+ inherits: false;
931
+ initial-value: 0;
932
+ }
933
+ @property --tw-translate-y {
934
+ syntax: "*";
935
+ inherits: false;
936
+ initial-value: 0;
937
+ }
938
+ @property --tw-translate-z {
939
+ syntax: "*";
940
+ inherits: false;
941
+ initial-value: 0;
942
+ }
943
+ @property --tw-content {
944
+ syntax: "*";
945
+ inherits: false;
946
+ initial-value: "";
947
+ }
948
+ @layer properties {
949
+ @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
950
+ *, ::before, ::after, ::backdrop {
951
+ --tw-border-style: solid;
952
+ --tw-gradient-position: initial;
953
+ --tw-gradient-from: #0000;
954
+ --tw-gradient-via: #0000;
955
+ --tw-gradient-to: #0000;
956
+ --tw-gradient-stops: initial;
957
+ --tw-gradient-via-stops: initial;
958
+ --tw-gradient-from-position: 0%;
959
+ --tw-gradient-via-position: 50%;
960
+ --tw-gradient-to-position: 100%;
961
+ --tw-leading: initial;
962
+ --tw-font-weight: initial;
963
+ --tw-tracking: initial;
964
+ --tw-shadow: 0 0 #0000;
965
+ --tw-shadow-color: initial;
966
+ --tw-shadow-alpha: 100%;
967
+ --tw-inset-shadow: 0 0 #0000;
968
+ --tw-inset-shadow-color: initial;
969
+ --tw-inset-shadow-alpha: 100%;
970
+ --tw-ring-color: initial;
971
+ --tw-ring-shadow: 0 0 #0000;
972
+ --tw-inset-ring-color: initial;
973
+ --tw-inset-ring-shadow: 0 0 #0000;
974
+ --tw-ring-inset: initial;
975
+ --tw-ring-offset-width: 0px;
976
+ --tw-ring-offset-color: #fff;
977
+ --tw-ring-offset-shadow: 0 0 #0000;
978
+ --tw-translate-x: 0;
979
+ --tw-translate-y: 0;
980
+ --tw-translate-z: 0;
981
+ --tw-content: "";
982
+ }
983
+ }
984
+ }