@kofile/gds-foundations 1.4.1 → 1.4.3
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.
- package/build/css/components/badge.module.css +2 -24
- package/build/css/components/checkbox.module.css +0 -11
- package/build/css/components/label.module.css +0 -10
- package/build/minified/badge.module.css +1 -1
- package/build/minified/checkbox.module.css +1 -1
- package/build/minified/label.module.css +1 -1
- package/build/minified/menu.module.css +1 -1
- package/build/minified/navigation.module.css +1 -1
- package/build/minified/tooltip.module.css +1 -1
- package/package.json +1 -1
|
@@ -1,32 +1,10 @@
|
|
|
1
|
-
:root,
|
|
2
|
-
:host {
|
|
3
|
-
--badge-bg-default: var(--color-neutral-200);
|
|
4
|
-
--badge-bg-primary: var(--color-primary-200);
|
|
5
|
-
--badge-bg-success: var(--color-success-200);
|
|
6
|
-
--badge-bg-danger: var(--color-danger-200);
|
|
7
|
-
--badge-bg-warning: var(--color-warning-200);
|
|
8
|
-
--badge-bg-neutral-light: var(--color-neutral-200);
|
|
9
|
-
--badge-text-color: var(--color-neutral-darkest);
|
|
10
|
-
}
|
|
11
|
-
|
|
12
|
-
/* @media (prefers-color-scheme: dark) {
|
|
13
|
-
:root {
|
|
14
|
-
--badge-bg-primary: var(--color-primary-900);
|
|
15
|
-
--badge-bg-success: var(--color-success-900);
|
|
16
|
-
--badge-bg-danger: var(--color-danger-900);
|
|
17
|
-
--badge-bg-warning: var(--color-warning-900);
|
|
18
|
-
--badge-bg-neutral-light: var(--color-neutral-800);
|
|
19
|
-
--badge-text-color: var(--color-neutral-lightest);
|
|
20
|
-
}
|
|
21
|
-
} */
|
|
22
|
-
|
|
23
1
|
.badge {
|
|
24
|
-
background-color: var(--
|
|
2
|
+
background-color: var(--color-neutral-200);
|
|
25
3
|
border-start-start-radius: var(--border-radius-xs);
|
|
26
4
|
border-start-end-radius: var(--border-radius-xs);
|
|
27
5
|
border-end-start-radius: var(--border-radius-xs);
|
|
28
6
|
border-end-end-radius: var(--border-radius-xs);
|
|
29
|
-
color: var(--
|
|
7
|
+
color: var(--color-neutral-darkest);
|
|
30
8
|
font-family: var(--font-families-default);
|
|
31
9
|
font-size: var(--font-size-xs);
|
|
32
10
|
font-weight: var(--font-weights-semibold);
|
|
@@ -1,14 +1,3 @@
|
|
|
1
|
-
:root {
|
|
2
|
-
/* Default to light color-scheme */
|
|
3
|
-
color-scheme: light;
|
|
4
|
-
}
|
|
5
|
-
|
|
6
|
-
/* @media (prefers-color-scheme: dark) {
|
|
7
|
-
:root {
|
|
8
|
-
color-scheme: dark;
|
|
9
|
-
}
|
|
10
|
-
} */
|
|
11
|
-
|
|
12
1
|
/* ------------------------------------------------------------------
|
|
13
2
|
Base (Light) Styles
|
|
14
3
|
------------------------------------------------------------------ */
|
|
@@ -1,13 +1,3 @@
|
|
|
1
|
-
:root {
|
|
2
|
-
color-scheme: light;
|
|
3
|
-
}
|
|
4
|
-
|
|
5
|
-
/* @media (prefers-color-scheme: dark) {
|
|
6
|
-
:root {
|
|
7
|
-
color-scheme: dark;
|
|
8
|
-
}
|
|
9
|
-
} */
|
|
10
|
-
|
|
11
1
|
/* ------------------------------------------------------------------
|
|
12
2
|
Base (Light) Styles
|
|
13
3
|
------------------------------------------------------------------ */
|
|
@@ -1 +1 @@
|
|
|
1
|
-
|
|
1
|
+
.badge{align-items:center;background-color:var(--color-neutral-200);border-end-end-radius:var(--border-radius-xs);border-end-start-radius:var(--border-radius-xs);border-start-end-radius:var(--border-radius-xs);border-start-start-radius:var(--border-radius-xs);color:var(--color-neutral-darkest);display:inline-flex;font-family:var(--font-families-default);font-size:var(--font-size-xs);font-weight:var(--font-weights-semibold);gap:var(--spacing-2xs);height:fit-content;letter-spacing:var(--letter-spacing-xs);line-height:var(--line-heights-xs);padding-block-end:var(--primitive-6);padding-block-start:var(--primitive-6);vertical-align:top;white-space:nowrap;width:fit-content}.badge,.badge[data-size=md]{padding-inline-end:var(--spacing-xs);padding-inline-start:var(--spacing-xs)}.badge[data-size=md]{font-size:var(--font-size-2xs);letter-spacing:var(--letter-spacing-2xs);line-height:var(--line-heights-2xs)}.badge[data-size=md],.badge[data-size=sm]{padding-block-end:var(--spacing-3xs);padding-block-start:var(--spacing-3xs)}.badge[data-size=sm]{font-size:var(--font-size-3xs);letter-spacing:var(--letter-spacing-3xs);line-height:var(--line-heights-3xs);padding-inline-end:var(--spacing-2xs);padding-inline-start:var(--spacing-2xs)}.badge[data-color=neutral-light]{background-color:var(--color-neutral-200)}.badge[data-color=neutral-dark]{background-color:var(--color-neutral-300)}.badge[data-color=primary]{background-color:var(--color-primary-200)}.badge[data-color=success]{background-color:var(--color-success-200)}.badge[data-color=danger]{background-color:var(--color-danger-200)}.badge[data-color=warning]{background-color:var(--color-warning-200)}.badge[data-color=highlight]{background-color:var(--color-highlight-200)}.badge[data-mode=dark]{color:var(--color-neutral-lightest)}.badge[data-color=neutral-light][data-mode=dark]{background-color:var(--color-neutral-800);color:var(--color-neutral-lightest)}.badge[data-color=neutral-dark][data-mode=dark]{background-color:var(--color-neutral-900)}.badge[data-color=primary][data-mode=dark]{background-color:var(--color-primary-900)}.badge[data-color=success][data-mode=dark]{background-color:var(--color-success-900)}.badge[data-color=danger][data-mode=dark]{background-color:var(--color-danger-900)}.badge[data-color=warning][data-mode=dark]{background-color:var(--color-warning-900)}.badge[data-color=highlight][data-mode=dark]{background-color:var(--color-highlight-900)}.action:hover{background-color:transparent!important;border-color:transparent!important}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
|
|
1
|
+
.checkbox,.indicator{display:flex}.checkbox{--checkbox-transition-speed:0.2s;appearance:none;background-color:var(--color-neutral-lightest);border:var(--border-width-sm) solid var(--color-neutral-800);border-radius:var(--spacing-2xs);box-sizing:border-box;cursor:pointer;height:var(--spacing-lg);justify-content:center;min-width:var(--spacing-lg);position:relative;transition:background-color var(--checkbox-transition-speed,.2s) ease;width:var(--spacing-lg)}.checkbox:not([data-disabled]):hover:not([data-state=checked]):not(:indeterminate):before{background-color:var(--color-neutral-400);content:"";height:var(--spacing-xs);left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);transition:opacity .25s ease;width:var(--spacing-xs)}.checkbox[data-state=checked]{background-color:var(--color-primary-600);border-color:var(--color-primary-900)}.checkbox:focus-visible{outline:var(--border-width-lg) solid var(--color-primary-700);outline-offset:var(--spacing-3xs)}.checkbox[data-disabled],.checkbox[data-error=true][data-disabled]{cursor:not-allowed;opacity:var(--opacity-disabled)}.checkbox[data-error=true]{background-color:var(--color-danger-600)}.checkbox[data-error=true]:not([data-disabled]):not([data-state=checked]):hover{background-color:var(--color-neutral-lightest)}.checkbox:indeterminate{background-color:var(--color-primary-600)}.checkbox[data-size=sm]{border-radius:var(--border-radius-2xs);height:var(--spacing-md);min-width:var(--spacing-md);width:var(--spacing-md)}.checkbox[data-size=sm]:not([data-disabled]):hover:not([data-state=checked]):not(:indeterminate):before{height:var(--spacing-xs);width:var(--spacing-xs)}.tile{align-items:center;background-color:var(--color-neutral-lightest);border:var(--border-width-sm) solid var(--color-neutral-300);border-radius:var(--primitive-6);box-sizing:border-box;display:flex;min-height:var(--spacing-3xl);padding-block:var(--spacing-sm);padding-inline:var(--spacing-md)}.tile[data-altbackground=true]{background-color:var(--color-neutral-400);border-color:var(--color-neutral-400)}.tile:has(.root[data-state=checked]){background-color:var(--color-primary-200-alpha)}.tile[data-state=checked]{background-color:var(--color-primary-200-alpha);border-color:var(--color-primary-600)}.tile[data-state=checked][data-error=true]{background-color:var(--color-danger-200);border-color:var(--color-danger-600)}.tile:not([data-state=checked]):hover{background-color:var(--color-neutral-400);border-color:var(--color-neutral-500,#818791)}.checkbox[data-mode=dark]{background-color:var(--color-neutral-darkest);border-color:var(--color-neutral-800)}.checkbox[data-mode=dark]:not([data-disabled]):hover:not([data-state=checked]):not(:indeterminate):before{background-color:var(--color-neutral-700)}.checkbox[data-mode=dark][data-state=checked]{background-color:var(--color-primary-500);border-color:var(--color-primary-500)}.checkbox[data-mode=dark]:focus-visible{outline-color:var(--color-primary-700)}.checkbox[data-mode=dark][data-error=true]{background-color:var(--color-danger-500)}.checkbox[data-mode=dark][data-error=true]:not([data-disabled]):not([data-state=checked]):hover{background-color:var(--color-danger-900)}.checkbox[data-mode=dark][data-error=true][data-state=checked],.checkbox[data-mode=dark][data-error=true][data-state=checked]:hover{background-color:var(--color-danger-500)}.tile[data-mode=dark]{background-color:var(--color-neutral-darkest);border-color:var(--color-neutral-900)}.tile[data-altbackground=true][data-mode=dark]{background-color:var(--color-neutral-700)}.tile[data-mode=dark]:has(.root[data-state=checked]){background-color:var(--color-primary-900)}.tile[data-mode=dark]:hover{background-color:var(--color-neutral-700);border-color:var(--color-neutral-800)}.tile[data-mode=dark][data-state=checked]{background-color:var(--color-primary-900);border-color:var(--color-primary-400)}.tile[data-mode=dark][data-state=checked][data-error=true]{background-color:var(--color-danger-900);border-color:var(--color-danger-400)}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
|
|
1
|
+
.label{all:unset;box-sizing:border-box;color:var(--color-neutral-1000,#121212);cursor:default;font-family:var(--font-families-default);font-size:var(--font-size-md);font-weight:var(--font-weights-regular);letter-spacing:var(--letter-spacing-md);line-height:var(--line-heights-md)}.label[aria-disabled=true]{cursor:not-allowed;opacity:var(--opacity-disabled,.32)}.label[data-size=sm]{font-size:var(--font-size-xs);letter-spacing:var(--letter-spacing-xs);line-height:var(--line-heights-xs)}.label[data-mode=dark]{color:var(--color-neutral-lightest,#fff)}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.trigger{--gds-menu-trigger-width:100%;align-items:center;background-color:var(--color-neutral-200);border-color:var(--color-neutral-500);border-radius:var(--primitive-6);border-style:solid;border-width:var(--border-width-sm);box-sizing:border-box;display:inline-flex;justify-content:space-between;max-height:var(--spacing-3xl);padding-block:var(--spacing-sm);padding-inline:var(--spacing-md);width:var(--gds-select-dropdown-menu-width,100%)}.trigger[data-disabled],.trigger[disabled]{cursor:not-allowed;opacity:var(--opacity-disabled);user-select:none}.trigger[data-altbackground=true]{background-color:var(--color-neutral-lightest)}.trigger[data-error=true]{background-color:var(--color-danger-100);border-color:var(--color-danger-600)}.trigger:focus-visible[data-error=true]{border-color:var(--color-danger-600);box-shadow:0 0 0 .375rem rgba(209,40,40,.16)}.trigger:focus,.trigger:focus-visible{border-color:var(--color-primary-400);box-shadow:0 0 0 .375rem rgba(12,87,205,.16)}.trigger[data-size=md]{max-height:var(--spacing-xl);padding-block:var(--spacing-2xs);padding-inline:var(--spacing-xs)}.trigger[data-size=lg]{max-height:var(--spacing-2xl);padding-block:var(--primitive-6);padding-inline:var(--spacing-sm)}.container,.content{--gds-select-dropdown-menu-width:var(--radix-dropdown-menu-width);background-color:var(--color-neutral-lightest);border-color:var(--color-neutral-300);border-radius:var(--primitive-6);border-style:solid;border-width:var(--border-width-sm);max-width:var(--menu-width);overflow-y:auto;position:relative;text-align:center;width:var(--radix-dropdown-menu-trigger-width)
|
|
1
|
+
.trigger{--gds-menu-trigger-width:100%;align-items:center;background-color:var(--color-neutral-200);border-color:var(--color-neutral-500);border-radius:var(--primitive-6);border-style:solid;border-width:var(--border-width-sm);box-sizing:border-box;display:inline-flex;justify-content:space-between;max-height:var(--spacing-3xl);padding-block:var(--spacing-sm);padding-inline:var(--spacing-md);width:var(--gds-select-dropdown-menu-width,100%)}.trigger[data-disabled],.trigger[disabled]{cursor:not-allowed;opacity:var(--opacity-disabled);user-select:none}.trigger[data-altbackground=true]{background-color:var(--color-neutral-lightest)}.trigger[data-error=true]{background-color:var(--color-danger-100);border-color:var(--color-danger-600)}.trigger:focus-visible[data-error=true]{border-color:var(--color-danger-600);box-shadow:0 0 0 .375rem rgba(209,40,40,.16)}.trigger:focus,.trigger:focus-visible{border-color:var(--color-primary-400);box-shadow:0 0 0 .375rem rgba(12,87,205,.16)}.trigger[data-size=md]{max-height:var(--spacing-xl);padding-block:var(--spacing-2xs);padding-inline:var(--spacing-xs)}.trigger[data-size=lg]{max-height:var(--spacing-2xl);padding-block:var(--primitive-6);padding-inline:var(--spacing-sm)}.container,.content{--gds-select-dropdown-menu-width:var(--radix-dropdown-menu-width);background-color:var(--color-neutral-lightest);border-color:var(--color-neutral-300);border-radius:var(--primitive-6);border-style:solid;border-width:var(--border-width-sm);max-width:var(--menu-width);overflow-y:auto;position:relative;text-align:center;width:var(--radix-dropdown-menu-trigger-width)}.content{z-index:var(--elevation-absolute-top)}.content::-webkit-scrollbar{display:none}.scrollable{max-height:256px;overflow-y:auto}.scrollable::-webkit-scrollbar{background-color:var(--color-neutral-100);border:var(--border-width-sm) solid var(--color-neutral-300);border-radius:var(--primitive-6);border-right:none;width:var(--spacing-sm);will-change:transform}.scrollable::-webkit-scrollbar-thumb{background-color:var(--color-neutral-300);border-color:var(--color-neutral-500);border-radius:var(--primitive-6);border-style:solid;border-width:var(--border-width-sm);max-height:128px}.list{list-style:none;margin:0;padding:0}.item,.list:focus{outline:none}.item{align-items:center;background-color:var(--color-neutral-lightest);display:flex;gap:var(--spacing-xs);padding-block:var(--primitive-6);padding-inline:var(--spacing-sm)}.item[data-disabled]{opacity:var(--opacity-disabled)}.item-checkbox[data-highlighted],.item-radio[data-highlighted],.item:focus,.item:focus-visible,.item:hover,.item[data-highlighted],.sub-trigger[data-highlighted]{background-color:var(--color-neutral-200)}.item[aria-checked=true],.item[data-checked=true],.item[data-state=checked]{background-color:var(--color-primary-200)}.item[aria-checked=true][data-highlighted],.item[data-checked=true][data-highlighted],.item[data-state=checked][data-highlighted]{background-color:var(--color-neutral-200)}.controls{background-color:var(--color-neutral-lightest);border-block-end:var(--border-width-sm) solid var(--color-neutral-300);padding-block-start:var(--spacing-2xs);position:sticky;top:0;width:100%;z-index:1}.controls[data-mode=dark]{background-color:var(--color-neutral-1000);border-block-end:var(--border-width-sm) solid var(--color-neutral-darkest)}.selection{align-items:center;display:flex}.selection[data-mode=dark]{border-bottom:var(--border-width-sm) solid var(--color-neutral-800)}.search{padding:var(--spacing-xs)}.count{align-items:center;display:flex;font-size:var(--font-size-xs);letter-spacing:var(--letter-spacing-xs);line-height:var(--line-heights-xs);margin:0 auto;margin-right:var(--spacing-xs)}.count,.info{color:var(--color-neutral-600);font-family:var(--font-families-default);font-weight:var(--font-weights-regular)}.info{font-size:var(--font-size-2xs);margin:0 0 0 auto;line-heights:var(--line-heights-2xs);letter-spacing:var(--letter-spacing-2xs)}.trigger[data-mode=dark]{background-color:var(--color-neutral-1000);border-color:var(--color-neutral-600)}.trigger[data-mode=dark][data-altbackground=true]{background-color:var(--color-neutral-darkest)}.trigger[data-mode=dark][data-error=true]{background-color:var(--color-danger-1000);border-color:var(--color-danger-600)}.trigger:focus-visible[data-mode=dark][data-error=true]{border-color:var(--color-danger-600);focus-color:0 0 0 .375rem rgba(209,40,40,.24)}.trigger[data-mode=dark]:focus-visible{border-color:var(--color-primary-600);box-shadow:0 0 0 .375rem rgba(12,87,205,.24)}.content[data-mode=dark]{background-color:var(--color-neutral-1000);border-color:var(--color-neutral-800)}.content[data-mode=dark]::-webkit-scrollbar{display:none}.content[data-mode=dark]>.scrollable::-webkit-scrollbar{background-color:var(--color-neutral-900);border-color:var(--color-neutral-800)}.content[data-mode=dark]>.scrollable::-webkit-scrollbar-thumb{background-color:var(--color-neutral-700);border-color:var(--color-neutral-500)}.container[data-mode=dark]{background-color:var(--color-neutral-1000);border-color:var(--color-neutral-800)}.container[data-mode=dark]::-webkit-scrollbar{display:none}.container[data-mode=dark]>.scrollable::-webkit-scrollbar{background-color:var(--color-neutral-900);border-color:var(--color-neutral-800)}.container[data-mode=dark]>.scrollable::-webkit-scrollbar-thumb{background-color:var(--color-neutral-700);border-color:var(--color-neutral-500)}.item[data-mode=dark]{background-color:var(--color-neutral-1000);color:var(--color-neutral-lightest)}.item[data-disabled][data-mode=dark]{opacity:var(--opacity-disabled)}.item-checkbox[data-highlighted][data-mode=dark],.item-radio[data-highlighted][data-mode=dark],.item[data-highlighted][data-mode=dark],.item[data-mode=dark]:focus,.item[data-mode=dark]:hover,.sub-trigger[data-highlighted][data-mode=dark]{background-color:var(--color-neutral-900)}.item[aria-checked=true][data-mode=dark],.item[data-checked=true][data-mode=dark],.item[data-state=checked][data-mode=dark]{background-color:var(--color-primary-900)}.count[data-mode=dark],.info[data-mode=dark]{color:var(--color-neutral-400)}.icon{align-self:baseline;min-height:var(--spacing-lg);min-width:var(--spacing-lg)}.heading{color:var(--color-neutral-600);display:inline-block;font-family:var(--font-families-default);font-size:var(--font-size-xs);font-weight:var(--font-weights-semibold);letter-spacing:var(--letter-spacing-xs);line-height:var(--line-heights-xs);padding-block:var(--primitive-6);padding-inline:var(--spacing-sm)}.heading[data-mode=dark]{color:var(--color-neutral-500)}.label{color:var(--color-neutral-darkest);font-family:var(--font-families-default)}.label,.label[data-mode=dark]{font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-sm);line-height:var(--line-heights-sm)}.label[data-mode=dark]{color:var(--color-neutral-lightest);font-family:var(--font-famililes-default)}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.container{background-color:var(--color-neutral-lightest);border-bottom:1px solid var(--color-neutral-400);height:72px;position:relative}.container,.details{align-items:center;display:flex;width:100%}.details{gap:var(--spacing-sm);height:100%}.govName{font-size:var(--font-size-2xl);font-weight:480;letter-spacing:-1.5%;line-height:28.8px}.appName,.govName{font-family:var(--font-families-default)}.appName{display:flex;font-size:var(--font-size-xl);font-weight:var(--font-weights-semibold);letter-spacing:var(--letter-spacing-xl);line-height:var(--line-heights-xl);margin-block-end:var(--spacing-xs);margin-inline-start:var(--spacing-4xs);width:100%}.divider{background-color:var(--color-neutral-700);display:inline-flex;height:var(--spacing-sm);margin-inline:var(--spacing-2xs);position:relative;top:var(--spacing-3xs)}.footerText{font-family:var(--font-families-default);font-size:var(--font-size-3xs);font-weight:var(--font-weights-regular);letter-spacing:var(--letter-spacing-3xs);line-height:var(--line-heights-3xs)}.footerLinks{display:inline-flex;gap:var(--spacing-xs)}.footerLink{color:var(--color-neutral-700)}.accountName{font-size:var(--font-size-md);font-weight:var(--font-weights-bold);letter-spacing:var(--letter-spacing-md);line-height:var(--line-heights-md);padding-bottom:var(--spacing-4xs);padding-top:var(--spacing-xs)}.accountEmail,.accountFooter,.accountName{background-color:var(--color-neutral-lightest);font-family:var(--font-families-default);margin:0;padding-inline:var(--spacing-md)}.accountEmail,.accountFooter{color:var(--color-neutral-700);font-size:var(--font-size-3xs);font-weight:var(--font-weights-regular);letter-spacing:var(--letter-spacing-3xs);line-height:var(--line-heights-3xs)}.accountEmail{padding-bottom:var(--spacing-xs)}.accountFooter{padding:var(--spacing-xs) var(--spacing-md);text-align:center}.label{font-family:var(--font-families-default);font-size:var(--font-size-sm);font-weight:var(--font-weights-regular);letter-spacing:var(--letter-spacing-sm);line-height:var(--line-heights-sm)}.container:has(.navContainer[data-open=true]){flex-direction:column}.navContainer[data-open=true]{background-color:var(--color-neutral-lightest);bottom:0;display:flex;flex-direction:column;height:calc(100vh - 72px);left:0;overflow:scroll;padding:var(--spacing-md);position:absolute;right:0;top:72px;width:100%;z-index:var(--elevation-499)}.appNavigation{justify-items:flex-end;width:100%}.appNavigation>.list{padding-bottom:var(--spacing-4xs)}.list{display:flex;flex-direction:column;gap:var(--spacing-xs);list-style:none;margin:0;padding:var(--spacing-md);width:100%}.list:nth-child(2){padding-bottom:var(--spacing-2xs)}.item{list-style:none;padding:0}.link{align-items:center;border-radius:var(--border-radius-sm);color:var(--color-neutral-darkest);cursor:pointer;display:inline-flex;font-size:var(--font-size-sm);font-weight:var(--font-weights-semibold);letter-spacing:var(--letter-spacing-sm);line-height:var(--line-heights-sm);padding:var(--spacing-xs) var(--spacing-sm);text-decoration:none;transition:background-color .25s ease-in-out;width:100%}.link:hover{background-color:var(--color-neutral-200)}.link:active{background-color:var(--color-neutral-300)}.link[data-selected=true]{background-color:var(--color-primary-200);border-radius:var(--border-radius-sm);color:var(--color-primary-800)}.close{align-items:center;display:none;position:absolute;right:var(--spacing-md);top:50%;transform:translateY(-50%);z-index:var(--elevation-499)}.poweredByContainer{margin-block-start:var(--spacing-xs)}.sideNavCollapsibleTrigger{align-items:center;border-radius:var(--border-radius-sm);color:var(--color-neutral-darkest);cursor:pointer;display:flex;padding:var(--spacing-xs) var(--spacing-xs);transition:background-color .25s ease-in-out;width:100%}.sideNavCollapsibleTrigger:hover{background-color:var(--color-neutral-200)}.sideNavCollapsibleTrigger>a.link[data-selected=true]{background-color:var(--color-danger-300)}@media (min-width:1024px){.container{gap:var(--spacing-2xs)}.appNavigation{width:fit-content}.navContainer{align-items:center;display:flex;gap:var(--spacing-xs);justify-content:flex-end;width:100%}.navContainer>nav>.list>li>.link{max-height:var(--spacing-2xl)!important}.appName{border-inline-start:1px solid var(--color-neutral-400);font-size:var(--font-size-2xl);letter-spacing:var(--letter-spacing-2xl);line-height:var(--line-heights-2xl);padding-inline-start:var(--spacing-sm);width:fit-content}.list{align-items:center;align-self:center;flex-direction:row;gap:var(--spacing-2xs);padding:0;width:max-content}}@media (max-width:1024px){.navContainer{display:none}.close{display:flex}}.sideNavContainer{--nav-width-expanded:calc(240px - var(--spacing-sm));--nav-width-collapsed:72px;background-color:var(--color-neutral-lightest);border-right:1px solid var(--color-neutral-400);display:flex;flex-direction:column;height:calc(100vh - 72px);justify-content:space-between;left:0;overflow-y:auto;padding:var(--spacing-sm);padding-bottom:var(--spacing-4xs);position:fixed;top:72px;transition:width .25s ease;width:var(--nav-width-expanded,240px)}.sideNavContainer::-webkit-scrollbar{display:none}.sideNavContainer.collapsed{align-items:center;width:var(--nav-width-collapsed,72px)}.sideNavList{list-style:none;margin:0;padding:0}.sideNavItemWrapper{margin-bottom:var(--spacing-xs)}.sideNavContainer.collapsed .sideNavList li{width:fit-content}.sideNavContainer:not(.collapsed) .sideNavList li{width:100%}.sideNavSubList{list-style:none;padding:0}.menu-list .link,.menu-list .link:focus,.menu-list .link:hover,.sideNavSubList .link,.sideNavSubList .link:focus,.sideNavSubList .link:hover{border-radius:var(--border-radius-none)}.sideNavList.collapsed>li>.collapsedLinkWrapper>.link,.sideNavList>li>.link{border-radius:var(--border-radius-sm);height:40px!important}.sideNavList>li>.link:focus,.sideNavList>li>.link:hover{border-radius:var(--border-radius-sm)}.sideNavFooter{backdrop-filter:blur(1px);-webkit-backdrop-filter:blur(1px);background-color:hsla(0,0%,100%,.75);bottom:0;display:flex;justify-content:center;padding:var(--spacing-md) 0 var(--spacing-md) 0;position:sticky;width:100%;z-index:var(--elevation-100)}.badgeInline{margin-left:auto;white-space:nowrap}.collapsedLinkWrapper{position:relative}.badgeCollapsed{position:absolute;right:-16px}.sideNavContainer.collapsed .sideNavList>li[data-selected=true]{background-color:var(--color-primary-200);border-radius:var(--border-radius-sm);color:var(--color-primary-800)}
|
|
1
|
+
.container{background-color:var(--color-neutral-lightest);border-bottom:1px solid var(--color-neutral-400);height:72px;padding-inline:var(--spacing-md);position:relative;z-index:var(--elevation-499)}.container,.details{align-items:center;display:flex;width:100%}.details{gap:var(--spacing-sm);height:100%}.govName{font-size:var(--font-size-2xl);font-weight:480;letter-spacing:-1.5%;line-height:28.8px}.appName,.govName{font-family:var(--font-families-default)}.appName{display:flex;font-size:var(--font-size-xl);font-weight:var(--font-weights-semibold);letter-spacing:var(--letter-spacing-xl);line-height:var(--line-heights-xl);margin-block-end:var(--spacing-xs);margin-inline-start:var(--spacing-4xs);width:100%}.divider{background-color:var(--color-neutral-700);display:inline-flex;height:var(--spacing-sm);margin-inline:var(--spacing-2xs);position:relative;top:var(--spacing-3xs)}.footerText{font-family:var(--font-families-default);font-size:var(--font-size-3xs);font-weight:var(--font-weights-regular);letter-spacing:var(--letter-spacing-3xs);line-height:var(--line-heights-3xs)}.footerLinks{display:inline-flex;gap:var(--spacing-xs)}.footerLink{color:var(--color-neutral-700)}.accountName{font-size:var(--font-size-md);font-weight:var(--font-weights-bold);letter-spacing:var(--letter-spacing-md);line-height:var(--line-heights-md);padding-bottom:var(--spacing-4xs);padding-top:var(--spacing-xs)}.accountEmail,.accountFooter,.accountName{background-color:var(--color-neutral-lightest);font-family:var(--font-families-default);margin:0;padding-inline:var(--spacing-md)}.accountEmail,.accountFooter{color:var(--color-neutral-700);font-size:var(--font-size-3xs);font-weight:var(--font-weights-regular);letter-spacing:var(--letter-spacing-3xs);line-height:var(--line-heights-3xs)}.accountEmail{padding-bottom:var(--spacing-xs)}.accountFooter{padding:var(--spacing-xs) var(--spacing-md);text-align:center}.label{font-family:var(--font-families-default);font-size:var(--font-size-sm);font-weight:var(--font-weights-regular);letter-spacing:var(--letter-spacing-sm);line-height:var(--line-heights-sm)}.container:has(.navContainer[data-open=true]){flex-direction:column}.navContainer[data-open=true]{background-color:var(--color-neutral-lightest);bottom:0;display:flex;flex-direction:column;height:calc(100vh - 72px);left:0;overflow:scroll;padding:var(--spacing-md);position:absolute;right:0;top:72px;width:100%;z-index:var(--elevation-499)}.appNavigation{justify-items:flex-end;width:100%}.appNavigation>.list{padding-bottom:var(--spacing-4xs)}.list{display:flex;flex-direction:column;gap:var(--spacing-xs);list-style:none;margin:0;padding:var(--spacing-md);width:100%}.list:nth-child(2){padding-bottom:var(--spacing-2xs)}.item{list-style:none;padding:0}.link{align-items:center;border-radius:var(--border-radius-sm);color:var(--color-neutral-darkest);cursor:pointer;display:inline-flex;font-size:var(--font-size-sm);font-weight:var(--font-weights-semibold);letter-spacing:var(--letter-spacing-sm);line-height:var(--line-heights-sm);padding:var(--spacing-xs) var(--spacing-sm);text-decoration:none;transition:background-color .25s ease-in-out;width:100%}.link:hover{background-color:var(--color-neutral-200)}.link:active{background-color:var(--color-neutral-300)}.link[data-selected=true]{background-color:var(--color-primary-200);border-radius:var(--border-radius-sm);color:var(--color-primary-800)}.close{align-items:center;display:none;position:absolute;right:var(--spacing-md);top:50%;transform:translateY(-50%);z-index:var(--elevation-499)}.poweredByContainer{margin-block-start:var(--spacing-xs)}.sideNavCollapsibleTrigger{align-items:center;border-radius:var(--border-radius-sm);color:var(--color-neutral-darkest);cursor:pointer;display:flex;padding:var(--spacing-xs) var(--spacing-xs);transition:background-color .25s ease-in-out;width:100%}.sideNavCollapsibleTrigger:hover{background-color:var(--color-neutral-200)}.sideNavCollapsibleTrigger>a.link[data-selected=true]{background-color:var(--color-danger-300)}@media (min-width:1024px){.container{gap:var(--spacing-2xs)}.appNavigation{width:fit-content}.navContainer{align-items:center;display:flex;gap:var(--spacing-xs);justify-content:flex-end;width:100%}.navContainer>nav>.list>li>.link{max-height:var(--spacing-2xl)!important}.appName{border-inline-start:1px solid var(--color-neutral-400);font-size:var(--font-size-2xl);letter-spacing:var(--letter-spacing-2xl);line-height:var(--line-heights-2xl);padding-inline-start:var(--spacing-sm);width:fit-content}.list{align-items:center;align-self:center;flex-direction:row;gap:var(--spacing-2xs);padding:0;width:max-content}}@media (max-width:1024px){.navContainer{display:none}.close{display:flex}}.sideNavContainer{--nav-width-expanded:calc(240px - var(--spacing-sm));--nav-width-collapsed:72px;background-color:var(--color-neutral-lightest);border-right:1px solid var(--color-neutral-400);display:flex;flex-direction:column;height:calc(100vh - 72px);justify-content:space-between;left:0;overflow-y:auto;padding:var(--spacing-sm);padding-bottom:var(--spacing-4xs);position:fixed;top:72px;transition:width .25s ease;width:var(--nav-width-expanded,240px)}.sideNavContainer::-webkit-scrollbar{display:none}.sideNavContainer.collapsed{align-items:center;width:var(--nav-width-collapsed,72px)}.sideNavList{list-style:none;margin:0;padding:0}.sideNavItemWrapper{margin-bottom:var(--spacing-xs)}.sideNavContainer.collapsed .sideNavList li{width:fit-content}.sideNavContainer:not(.collapsed) .sideNavList li{width:100%}.sideNavSubList{list-style:none;padding:0}.menu-list .link,.menu-list .link:focus,.menu-list .link:hover,.sideNavSubList .link,.sideNavSubList .link:focus,.sideNavSubList .link:hover{border-radius:var(--border-radius-none)}.sideNavList.collapsed>li>.collapsedLinkWrapper>.link,.sideNavList>li>.link{border-radius:var(--border-radius-sm);height:40px!important}.sideNavList>li>.link:focus,.sideNavList>li>.link:hover{border-radius:var(--border-radius-sm)}.sideNavFooter{backdrop-filter:blur(1px);-webkit-backdrop-filter:blur(1px);background-color:hsla(0,0%,100%,.75);bottom:0;display:flex;justify-content:center;padding:var(--spacing-md) 0 var(--spacing-md) 0;position:sticky;width:100%;z-index:var(--elevation-100)}.badgeInline{margin-left:auto;white-space:nowrap}.collapsedLinkWrapper{position:relative}.badgeCollapsed{position:absolute;right:-16px}.sideNavContainer.collapsed .sideNavList>li[data-selected=true]{background-color:var(--color-primary-200);border-radius:var(--border-radius-sm);color:var(--color-primary-800)}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
button{all:unset}.content{--gds-tooltip-width:fit-content;--radix-tooltip-trigger-width:var(--gds-tooltip-width);animation-duration:.4s;animation-timing-function:cubic-bezier(.16,1,.3,1);background-color:var(--color-neutral-darkest);border-radius:var(--border-radius-sm);box-shadow:var(--shadow-sm);color:var(--color-neutral-lightest);font-size:var(--font-size-xs);line-height:var(--line-heights-xs);max-width:var(--gds-tooltip-width);padding:var(--spacing-xs) var(--spacing-sm);user-select:none;width:var(--radix-tooltip-content-available-width);will-change:transform,opacity}.content[data-state=delayed-open][data-side=top]{animation-name:slideDownAndFade}.content[data-state=delayed-open][data-side=right]{animation-name:slideLeftAndFade}.content[data-state=delayed-open][data-side=bottom]{animation-name:slideUpAndFade}.content[data-state=delayed-open][data-side=left]{animation-name:slideRightAndFade}.arrow{fill:var(--color-neutral-darkest)}@keyframes slideUpAndFade{0%{opacity:0;transform:translateY(2px)}to{opacity:1;transform:translateY(0)}}@keyframes slideRightAndFade{0%{opacity:0;transform:translateX(-2px)}to{opacity:1;transform:translateX(0)}}@keyframes slideDownAndFade{0%{opacity:0;transform:translateY(-2px)}to{opacity:1;transform:translateY(0)}}@keyframes slideLeftAndFade{0%{opacity:0;transform:translateX(2px)}to{opacity:1;transform:translateX(0)}}
|
|
1
|
+
button{all:unset}.content{--gds-tooltip-width:fit-content;--radix-tooltip-trigger-width:var(--gds-tooltip-width);animation-duration:.4s;animation-timing-function:cubic-bezier(.16,1,.3,1);background-color:var(--color-neutral-darkest);border-radius:var(--border-radius-sm);box-shadow:var(--shadow-sm);color:var(--color-neutral-lightest);font-size:var(--font-size-xs);line-height:var(--line-heights-xs);max-width:var(--gds-tooltip-width);padding:var(--spacing-xs) var(--spacing-sm);user-select:none;width:var(--radix-tooltip-content-available-width);will-change:transform,opacity;z-index:var(--elevation-absolute-top)}.content[data-state=delayed-open][data-side=top]{animation-name:slideDownAndFade}.content[data-state=delayed-open][data-side=right]{animation-name:slideLeftAndFade}.content[data-state=delayed-open][data-side=bottom]{animation-name:slideUpAndFade}.content[data-state=delayed-open][data-side=left]{animation-name:slideRightAndFade}.arrow{fill:var(--color-neutral-darkest)}@keyframes slideUpAndFade{0%{opacity:0;transform:translateY(2px)}to{opacity:1;transform:translateY(0)}}@keyframes slideRightAndFade{0%{opacity:0;transform:translateX(-2px)}to{opacity:1;transform:translateX(0)}}@keyframes slideDownAndFade{0%{opacity:0;transform:translateY(-2px)}to{opacity:1;transform:translateY(0)}}@keyframes slideLeftAndFade{0%{opacity:0;transform:translateX(2px)}to{opacity:1;transform:translateX(0)}}
|