@byline/host-tanstack-start 6.10.1 → 6.11.0

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 (59) hide show
  1. package/dist/admin-shell/admin-activity/list_module.css +47 -43
  2. package/dist/admin-shell/admin-roles/container_module.css +75 -71
  3. package/dist/admin-shell/admin-roles/delete_module.css +31 -27
  4. package/dist/admin-shell/admin-roles/list_module.css +95 -91
  5. package/dist/admin-shell/admin-users/container_module.css +112 -108
  6. package/dist/admin-shell/admin-users/delete_module.css +31 -27
  7. package/dist/admin-shell/admin-users/list_module.css +92 -88
  8. package/dist/admin-shell/chrome/admin-app-bar_module.css +53 -49
  9. package/dist/admin-shell/chrome/admin-drawer-toggle_module.css +20 -16
  10. package/dist/admin-shell/chrome/admin-layout_module.css +10 -6
  11. package/dist/admin-shell/chrome/admin-menu-drawer_module.css +149 -145
  12. package/dist/admin-shell/chrome/branding_module.css +12 -8
  13. package/dist/admin-shell/chrome/breadcrumbs/breadcrumbs_module.css +179 -175
  14. package/dist/admin-shell/chrome/content_module.css +12 -8
  15. package/dist/admin-shell/chrome/dashboard_module.css +203 -199
  16. package/dist/admin-shell/chrome/hamburger_module.css +9 -5
  17. package/dist/admin-shell/chrome/route-error_module.css +78 -74
  18. package/dist/admin-shell/chrome/route-progress-bar_module.css +25 -21
  19. package/dist/admin-shell/chrome/session-change-boundary_module.css +72 -68
  20. package/dist/admin-shell/chrome/sign-in-page_module.css +65 -61
  21. package/dist/admin-shell/chrome/th-sortable_module.css +45 -41
  22. package/dist/admin-shell/collections/api_module.css +37 -33
  23. package/dist/admin-shell/collections/document-history_module.css +25 -21
  24. package/dist/admin-shell/collections/history_module.css +169 -165
  25. package/dist/admin-shell/collections/list_module.css +136 -132
  26. package/dist/admin-shell/collections/restore-version-modal_module.css +28 -24
  27. package/dist/admin-shell/collections/tree-list_module.css +119 -115
  28. package/dist/admin-shell/collections/view-menu_module.css +46 -42
  29. package/dist/admin-shell/scheduled-publications/list_module.css +99 -95
  30. package/package.json +10 -10
  31. package/src/admin-shell/admin-activity/list.module.css +60 -44
  32. package/src/admin-shell/admin-roles/container.module.css +105 -89
  33. package/src/admin-shell/admin-roles/delete.module.css +50 -34
  34. package/src/admin-shell/admin-roles/list.module.css +134 -118
  35. package/src/admin-shell/admin-users/container.module.css +157 -141
  36. package/src/admin-shell/admin-users/delete.module.css +50 -34
  37. package/src/admin-shell/admin-users/list.module.css +131 -115
  38. package/src/admin-shell/chrome/admin-app-bar.module.css +72 -56
  39. package/src/admin-shell/chrome/admin-drawer-toggle.module.css +36 -20
  40. package/src/admin-shell/chrome/admin-layout.module.css +22 -9
  41. package/src/admin-shell/chrome/admin-menu-drawer.module.css +213 -197
  42. package/src/admin-shell/chrome/branding.module.css +26 -10
  43. package/src/admin-shell/chrome/breadcrumbs/breadcrumbs.module.css +161 -145
  44. package/src/admin-shell/chrome/content.module.css +25 -9
  45. package/src/admin-shell/chrome/dashboard.module.css +270 -254
  46. package/src/admin-shell/chrome/hamburger.module.css +22 -6
  47. package/src/admin-shell/chrome/route-error.module.css +99 -83
  48. package/src/admin-shell/chrome/route-progress-bar.module.css +44 -28
  49. package/src/admin-shell/chrome/session-change-boundary.module.css +98 -82
  50. package/src/admin-shell/chrome/sign-in-page.module.css +86 -70
  51. package/src/admin-shell/chrome/th-sortable.module.css +54 -38
  52. package/src/admin-shell/collections/api.module.css +56 -40
  53. package/src/admin-shell/collections/document-history.module.css +43 -27
  54. package/src/admin-shell/collections/history.module.css +208 -192
  55. package/src/admin-shell/collections/list.module.css +162 -146
  56. package/src/admin-shell/collections/restore-version-modal.module.css +46 -30
  57. package/src/admin-shell/collections/tree-list.module.css +142 -126
  58. package/src/admin-shell/collections/view-menu.module.css +70 -57
  59. package/src/admin-shell/scheduled-publications/list.module.css +116 -100
@@ -1,81 +1,85 @@
1
- :is(.main-MNvpLI, .byline-session-change) {
2
- justify-content: center;
3
- align-items: center;
4
- min-height: 100dvh;
5
- padding: 1.5rem 1.5rem calc(1.5rem + 12vh);
6
- display: flex;
7
- }
1
+ @layer base, byline-base, theme, byline-theme, byline-functional, byline-typography, components, byline-components, overrides, byline-utilities, utilities, byline-components.primitives;
8
2
 
9
- :is(.card-BMYD6l, .byline-session-change-card) {
10
- border: var(--border-width-thin) var(--border-style-solid) var(--gray-100);
11
- border-radius: var(--border-radius-md);
12
- background-color: var(--canvas-25);
13
- flex-direction: column;
14
- gap: .75rem;
15
- width: 100%;
16
- max-width: 30rem;
17
- padding: 1.5rem;
18
- display: flex;
19
- }
3
+ @layer byline-components.cms {
4
+ :is(.main-MNvpLI, .byline-session-change) {
5
+ justify-content: center;
6
+ align-items: center;
7
+ min-height: 100dvh;
8
+ padding: 1.5rem 1.5rem calc(1.5rem + 12vh);
9
+ display: flex;
10
+ }
20
11
 
21
- :is(:is([data-theme="dark"], .dark) .card-BMYD6l, :is([data-theme="dark"], .dark) .byline-session-change-card) {
22
- border-color: var(--gray-700);
23
- background-color: var(--canvas-800);
24
- }
12
+ :is(.card-BMYD6l, .byline-session-change-card) {
13
+ border: var(--border-width-thin) var(--border-style-solid) var(--gray-100);
14
+ border-radius: var(--border-radius-md);
15
+ background-color: var(--canvas-25);
16
+ flex-direction: column;
17
+ gap: .75rem;
18
+ width: 100%;
19
+ max-width: 30rem;
20
+ padding: 1.5rem;
21
+ display: flex;
22
+ }
25
23
 
26
- :is(.title-N8HIe4, .byline-session-change-title) {
27
- font-size: var(--font-size-xl);
28
- font-weight: var(--font-weight-semibold);
29
- line-height: var(--line-height-snug);
30
- letter-spacing: var(--letter-spacing-tight);
31
- color: var(--gray-900);
32
- margin: 0;
33
- }
24
+ :is(:is([data-theme="dark"], .dark) .card-BMYD6l, :is([data-theme="dark"], .dark) .byline-session-change-card) {
25
+ border-color: var(--gray-700);
26
+ background-color: var(--canvas-800);
27
+ }
34
28
 
35
- :is(:is([data-theme="dark"], .dark) .title-N8HIe4, :is([data-theme="dark"], .dark) .byline-session-change-title) {
36
- color: var(--gray-100);
37
- }
29
+ :is(.title-N8HIe4, .byline-session-change-title) {
30
+ font-size: var(--font-size-xl);
31
+ font-weight: var(--font-weight-semibold);
32
+ line-height: var(--line-height-snug);
33
+ letter-spacing: var(--letter-spacing-tight);
34
+ color: var(--gray-900);
35
+ margin: 0;
36
+ }
38
37
 
39
- :is(.body-WE9gi2, .byline-session-change-body) {
40
- font-size: var(--font-size-sm);
41
- line-height: var(--line-height-relaxed);
42
- color: var(--gray-700);
43
- margin: 0;
44
- }
38
+ :is(:is([data-theme="dark"], .dark) .title-N8HIe4, :is([data-theme="dark"], .dark) .byline-session-change-title) {
39
+ color: var(--gray-100);
40
+ }
45
41
 
46
- :is(:is([data-theme="dark"], .dark) .body-WE9gi2, :is([data-theme="dark"], .dark) .byline-session-change-body) {
47
- color: var(--gray-400);
48
- }
42
+ :is(.body-WE9gi2, .byline-session-change-body) {
43
+ font-size: var(--font-size-sm);
44
+ line-height: var(--line-height-relaxed);
45
+ color: var(--gray-700);
46
+ margin: 0;
47
+ }
49
48
 
50
- :is(.account-ZFcz_R, .byline-session-change-account) {
51
- font-size: var(--font-size-sm);
52
- font-weight: var(--font-weight-medium);
53
- line-height: var(--line-height-normal);
54
- color: var(--gray-900);
55
- overflow-wrap: anywhere;
56
- margin: 0;
57
- }
49
+ :is(:is([data-theme="dark"], .dark) .body-WE9gi2, :is([data-theme="dark"], .dark) .byline-session-change-body) {
50
+ color: var(--gray-400);
51
+ }
58
52
 
59
- :is(:is([data-theme="dark"], .dark) .account-ZFcz_R, :is([data-theme="dark"], .dark) .byline-session-change-account) {
60
- color: var(--gray-100);
61
- }
53
+ :is(.account-ZFcz_R, .byline-session-change-account) {
54
+ font-size: var(--font-size-sm);
55
+ font-weight: var(--font-weight-medium);
56
+ line-height: var(--line-height-normal);
57
+ color: var(--gray-900);
58
+ overflow-wrap: anywhere;
59
+ margin: 0;
60
+ }
62
61
 
63
- :is(.error-GXrBRW, .byline-session-change-error) {
64
- font-size: var(--font-size-sm);
65
- line-height: var(--line-height-relaxed);
66
- color: var(--red-600);
67
- margin: 0;
68
- }
62
+ :is(:is([data-theme="dark"], .dark) .account-ZFcz_R, :is([data-theme="dark"], .dark) .byline-session-change-account) {
63
+ color: var(--gray-100);
64
+ }
69
65
 
70
- :is(:is([data-theme="dark"], .dark) .error-GXrBRW, :is([data-theme="dark"], .dark) .byline-session-change-error) {
71
- color: var(--red-400);
72
- }
66
+ :is(.error-GXrBRW, .byline-session-change-error) {
67
+ font-size: var(--font-size-sm);
68
+ line-height: var(--line-height-relaxed);
69
+ color: var(--red-600);
70
+ margin: 0;
71
+ }
72
+
73
+ :is(:is([data-theme="dark"], .dark) .error-GXrBRW, :is([data-theme="dark"], .dark) .byline-session-change-error) {
74
+ color: var(--red-400);
75
+ }
73
76
 
74
- :is(.actions-O152EZ, .byline-session-change-actions) {
75
- flex-wrap: wrap;
76
- align-items: center;
77
- gap: .75rem;
78
- margin-top: .25rem;
79
- display: flex;
77
+ :is(.actions-O152EZ, .byline-session-change-actions) {
78
+ flex-wrap: wrap;
79
+ align-items: center;
80
+ gap: .75rem;
81
+ margin-top: .25rem;
82
+ display: flex;
83
+ }
80
84
  }
81
85
 
@@ -1,78 +1,82 @@
1
- :is(.main-Mz7TWj, .byline-sign-in-page) {
2
- flex-direction: column;
3
- flex: 1;
4
- align-items: stretch;
5
- padding: 1.5rem;
6
- display: flex;
7
- }
1
+ @layer base, byline-base, theme, byline-theme, byline-functional, byline-typography, components, byline-components, overrides, byline-utilities, utilities, byline-components.primitives;
8
2
 
9
- :is(.bar-uO4D8B, .byline-sign-in-page-bar) {
10
- justify-content: flex-end;
11
- align-items: center;
12
- min-height: 1.75rem;
13
- display: flex;
14
- }
3
+ @layer byline-components.cms {
4
+ :is(.main-Mz7TWj, .byline-sign-in-page) {
5
+ flex-direction: column;
6
+ flex: 1;
7
+ align-items: stretch;
8
+ padding: 1.5rem;
9
+ display: flex;
10
+ }
15
11
 
16
- :is(.inner-iPyHJh, .byline-sign-in-page-inner) {
17
- flex-direction: column;
18
- align-items: center;
19
- width: 100%;
20
- margin-top: 8vh;
21
- display: flex;
22
- }
12
+ :is(.bar-uO4D8B, .byline-sign-in-page-bar) {
13
+ justify-content: flex-end;
14
+ align-items: center;
15
+ min-height: 1.75rem;
16
+ display: flex;
17
+ }
23
18
 
24
- @media (min-width: 40rem) {
25
19
  :is(.inner-iPyHJh, .byline-sign-in-page-inner) {
26
- margin-top: 14vh;
20
+ flex-direction: column;
21
+ align-items: center;
22
+ width: 100%;
23
+ margin-top: 8vh;
24
+ display: flex;
27
25
  }
28
- }
29
26
 
30
- :is(.checking-GccoM3, .byline-sign-in-page-checking) {
31
- color: inherit;
32
- opacity: .6;
33
- justify-content: center;
34
- align-items: center;
35
- padding: 2rem 0;
36
- display: flex;
37
- }
27
+ @media (min-width: 40rem) {
28
+ :is(.inner-iPyHJh, .byline-sign-in-page-inner) {
29
+ margin-top: 14vh;
30
+ }
31
+ }
38
32
 
39
- .srOnly-zH8cgE {
40
- clip: rect(0, 0, 0, 0);
41
- white-space: nowrap;
42
- border: 0;
43
- width: 1px;
44
- height: 1px;
45
- margin: -1px;
46
- padding: 0;
47
- position: absolute;
48
- overflow: hidden;
49
- }
33
+ :is(.checking-GccoM3, .byline-sign-in-page-checking) {
34
+ color: inherit;
35
+ opacity: .6;
36
+ justify-content: center;
37
+ align-items: center;
38
+ padding: 2rem 0;
39
+ display: flex;
40
+ }
50
41
 
51
- :is(.card-TwlYhw, .byline-sign-in-page-card) {
52
- width: 100%;
53
- }
42
+ .srOnly-zH8cgE {
43
+ clip: rect(0, 0, 0, 0);
44
+ white-space: nowrap;
45
+ border: 0;
46
+ width: 1px;
47
+ height: 1px;
48
+ margin: -1px;
49
+ padding: 0;
50
+ position: absolute;
51
+ overflow: hidden;
52
+ }
54
53
 
55
- @media (min-width: 40rem) {
56
54
  :is(.card-TwlYhw, .byline-sign-in-page-card) {
57
- max-width: 380px;
55
+ width: 100%;
58
56
  }
59
- }
60
57
 
61
- :is(.alert-mFCzan, .byline-sign-in-page-alert) {
62
- width: 100%;
63
- margin-top: var(--spacing-12);
64
- }
58
+ @media (min-width: 40rem) {
59
+ :is(.card-TwlYhw, .byline-sign-in-page-card) {
60
+ max-width: 380px;
61
+ }
62
+ }
65
63
 
66
- @media (min-width: 40rem) {
67
- :is(noscript > .alert-mFCzan, noscript > .byline-sign-in-page-alert) {
68
- max-width: 380px;
64
+ :is(.alert-mFCzan, .byline-sign-in-page-alert) {
65
+ width: 100%;
66
+ margin-top: var(--spacing-12);
67
+ }
68
+
69
+ @media (min-width: 40rem) {
70
+ :is(noscript > .alert-mFCzan, noscript > .byline-sign-in-page-alert) {
71
+ max-width: 380px;
72
+ }
69
73
  }
70
- }
71
74
 
72
- :is(.actions-d9wIp6, .byline-sign-in-page-actions) {
73
- padding-top: var(--spacing-8);
74
- margin-bottom: var(--spacing-8);
75
- justify-content: flex-end;
76
- display: flex;
75
+ :is(.actions-d9wIp6, .byline-sign-in-page-actions) {
76
+ padding-top: var(--spacing-8);
77
+ margin-bottom: var(--spacing-8);
78
+ justify-content: flex-end;
79
+ display: flex;
80
+ }
77
81
  }
78
82
 
@@ -1,43 +1,47 @@
1
- :is(.button-fIg9yu, .byline-th-sortable-button) {
2
- gap: .25rem;
3
- padding-left: 2px;
4
- padding-right: 6px;
5
- font-weight: 700;
6
- display: flex;
7
- }
8
-
9
- .button-fIg9yu:hover {
10
- text-decoration: underline;
11
- }
12
-
13
- .byline-th-sortable-button:hover {
14
- text-decoration: underline;
15
- }
16
-
17
- :is(.alignLeft-Iv86mR, .byline-th-align-left) {
18
- text-align: left;
19
- }
20
-
21
- :is(.alignCenter-ZjCYCh, .byline-th-align-center) {
22
- text-align: center;
23
- }
24
-
25
- :is(.alignRight-xHLJB2, .byline-th-align-right) {
26
- text-align: right;
27
- }
28
-
29
- :is(.alignRightAuto-szPOES, .byline-th-align-right-auto) {
30
- margin-left: auto;
31
- }
32
-
33
- :is(.icon-Ms_S5R, .byline-th-icon) {
34
- width: 1.5rem;
35
- height: 1.5rem;
36
- }
37
-
38
- .byline-sort-icon {
39
- flex-shrink: 0;
40
- width: 1.25rem;
41
- height: 1.25rem;
1
+ @layer base, byline-base, theme, byline-theme, byline-functional, byline-typography, components, byline-components, overrides, byline-utilities, utilities, byline-components.primitives;
2
+
3
+ @layer byline-components.cms {
4
+ :is(.button-fIg9yu, .byline-th-sortable-button) {
5
+ gap: .25rem;
6
+ padding-left: 2px;
7
+ padding-right: 6px;
8
+ font-weight: 700;
9
+ display: flex;
10
+ }
11
+
12
+ .button-fIg9yu:hover {
13
+ text-decoration: underline;
14
+ }
15
+
16
+ .byline-th-sortable-button:hover {
17
+ text-decoration: underline;
18
+ }
19
+
20
+ :is(.alignLeft-Iv86mR, .byline-th-align-left) {
21
+ text-align: left;
22
+ }
23
+
24
+ :is(.alignCenter-ZjCYCh, .byline-th-align-center) {
25
+ text-align: center;
26
+ }
27
+
28
+ :is(.alignRight-xHLJB2, .byline-th-align-right) {
29
+ text-align: right;
30
+ }
31
+
32
+ :is(.alignRightAuto-szPOES, .byline-th-align-right-auto) {
33
+ margin-left: auto;
34
+ }
35
+
36
+ :is(.icon-Ms_S5R, .byline-th-icon) {
37
+ width: 1.5rem;
38
+ height: 1.5rem;
39
+ }
40
+
41
+ .byline-sort-icon {
42
+ flex-shrink: 0;
43
+ width: 1.25rem;
44
+ height: 1.25rem;
45
+ }
42
46
  }
43
47
 
@@ -1,42 +1,46 @@
1
- :is(.section-u7I9H_, .byline-api-section, .container-TgnoN4, .byline-api-container) {
2
- flex-direction: column;
3
- flex: 1 1 0;
4
- min-height: 0;
5
- display: flex;
6
- }
1
+ @layer base, byline-base, theme, byline-theme, byline-functional, byline-typography, components, byline-components, overrides, byline-utilities, utilities, byline-components.primitives;
7
2
 
8
- :is(.head-WfZce5, .byline-api-head) {
9
- margin-bottom: var(--spacing-8);
10
- flex-direction: column;
11
- justify-content: flex-start;
12
- display: flex;
13
- }
3
+ @layer byline-components.cms {
4
+ :is(.section-u7I9H_, .byline-api-section, .container-TgnoN4, .byline-api-container) {
5
+ flex-direction: column;
6
+ flex: 1 1 0;
7
+ min-height: 0;
8
+ display: flex;
9
+ }
14
10
 
15
- @media (min-width: 40rem) {
16
11
  :is(.head-WfZce5, .byline-api-head) {
17
- flex-direction: row;
18
- justify-content: space-between;
12
+ margin-bottom: var(--spacing-8);
13
+ flex-direction: column;
14
+ justify-content: flex-start;
15
+ display: flex;
19
16
  }
20
- }
21
17
 
22
- :is(.title-ljh9Ot, .byline-api-title) {
23
- margin-bottom: var(--spacing-8);
24
- }
18
+ @media (min-width: 40rem) {
19
+ :is(.head-WfZce5, .byline-api-head) {
20
+ flex-direction: row;
21
+ justify-content: space-between;
22
+ }
23
+ }
25
24
 
26
- :is(.viewer-PnNKnk, .byline-api-viewer) {
27
- min-height: 0;
28
- padding: var(--spacing-4);
29
- border: var(--border-width-thin) var(--border-style-solid) var(--gray-300);
30
- border-radius: var(--border-radius-sm);
31
- background-color: var(--canvas-800);
32
- font-family: var(--font-family-mono);
33
- font-size: var(--font-size-sm);
34
- font-weight: var(--font-weight-normal);
35
- flex: 1 1 0;
36
- overflow-y: auto;
37
- }
25
+ :is(.title-ljh9Ot, .byline-api-title) {
26
+ margin-bottom: var(--spacing-8);
27
+ }
38
28
 
39
- :is(:is([data-theme="dark"], .dark) .viewer-PnNKnk, :is([data-theme="dark"], .dark) .byline-api-viewer) {
40
- border-color: var(--gray-700);
29
+ :is(.viewer-PnNKnk, .byline-api-viewer) {
30
+ min-height: 0;
31
+ padding: var(--spacing-4);
32
+ border: var(--border-width-thin) var(--border-style-solid) var(--gray-300);
33
+ border-radius: var(--border-radius-sm);
34
+ background-color: var(--canvas-800);
35
+ font-family: var(--font-family-mono);
36
+ font-size: var(--font-size-sm);
37
+ font-weight: var(--font-weight-normal);
38
+ flex: 1 1 0;
39
+ overflow-y: auto;
40
+ }
41
+
42
+ :is(:is([data-theme="dark"], .dark) .viewer-PnNKnk, :is([data-theme="dark"], .dark) .byline-api-viewer) {
43
+ border-color: var(--gray-700);
44
+ }
41
45
  }
42
46
 
@@ -1,28 +1,32 @@
1
- :is(.empty-qolSIa, .byline-coll-dochistory-empty) {
2
- color: var(--gray-500);
3
- margin: 1.5rem 0;
4
- font-size: .875rem;
5
- }
1
+ @layer base, byline-base, theme, byline-theme, byline-functional, byline-typography, components, byline-components, overrides, byline-utilities, utilities, byline-components.primitives;
6
2
 
7
- :is(:is([data-theme="dark"], .dark) .empty-qolSIa, :is([data-theme="dark"], .dark) .byline-coll-dochistory-empty) {
8
- color: var(--gray-400);
9
- }
3
+ @layer byline-components.cms {
4
+ :is(.empty-qolSIa, .byline-coll-dochistory-empty) {
5
+ color: var(--gray-500);
6
+ margin: 1.5rem 0;
7
+ font-size: .875rem;
8
+ }
10
9
 
11
- :is(.tableWrap-Cil1ih, .byline-coll-dochistory-table-wrap) {
12
- margin-top: .5rem;
13
- margin-bottom: .75rem;
14
- }
10
+ :is(:is([data-theme="dark"], .dark) .empty-qolSIa, :is([data-theme="dark"], .dark) .byline-coll-dochistory-empty) {
11
+ color: var(--gray-400);
12
+ }
15
13
 
16
- :is(.when-biWgEw, .byline-coll-dochistory-when) {
17
- white-space: nowrap;
18
- font-variant-numeric: tabular-nums;
19
- }
14
+ :is(.tableWrap-Cil1ih, .byline-coll-dochistory-table-wrap) {
15
+ margin-top: .5rem;
16
+ margin-bottom: .75rem;
17
+ }
20
18
 
21
- :is(.change-xCTn7o, .byline-coll-dochistory-change) {
22
- font-variant-numeric: tabular-nums;
23
- }
19
+ :is(.when-biWgEw, .byline-coll-dochistory-when) {
20
+ white-space: nowrap;
21
+ font-variant-numeric: tabular-nums;
22
+ }
23
+
24
+ :is(.change-xCTn7o, .byline-coll-dochistory-change) {
25
+ font-variant-numeric: tabular-nums;
26
+ }
24
27
 
25
- :is(.arrow-e1mpOz, .byline-coll-dochistory-arrow) {
26
- color: var(--gray-400);
28
+ :is(.arrow-e1mpOz, .byline-coll-dochistory-arrow) {
29
+ color: var(--gray-400);
30
+ }
27
31
  }
28
32