@navikt/ds-css 8.10.5 → 8.10.6
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/dist/component/alert.css +5 -1
- package/dist/component/alert.min.css +1 -1
- package/dist/components.css +5 -1
- package/dist/components.min.css +1 -1
- package/dist/global/tokens.css +1 -1
- package/dist/global/tokens.min.css +1 -1
- package/dist/index.css +6 -2
- package/dist/index.min.css +1 -1
- package/package.json +3 -3
- package/src/alert.css +7 -3
- package/src/data-table.css +39 -24
package/dist/component/alert.css
CHANGED
|
@@ -199,7 +199,7 @@
|
|
|
199
199
|
color: var(--ax-text-default);
|
|
200
200
|
align-items: flex-start;
|
|
201
201
|
gap: var(--ax-space-8);
|
|
202
|
-
padding: var(--ax-space-
|
|
202
|
+
padding: var(--ax-space-16) var(--ax-space-20);
|
|
203
203
|
display: flex;
|
|
204
204
|
}
|
|
205
205
|
|
|
@@ -207,6 +207,10 @@
|
|
|
207
207
|
margin-top: var(--ax-space-2);
|
|
208
208
|
}
|
|
209
209
|
|
|
210
|
+
.aksel-base-alert[data-size="small"] .aksel-base-alert__message {
|
|
211
|
+
padding: var(--ax-space-12) var(--ax-space-16);
|
|
212
|
+
}
|
|
213
|
+
|
|
210
214
|
.aksel-base-alert[data-size="small"] .aksel-base-alert__message > .aksel-base-alert__icon {
|
|
211
215
|
margin-top: 0;
|
|
212
216
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
@layer aksel.reset,aksel.theming,aksel.baseline,aksel.print,aksel.typography,aksel.components.core,aksel.components.core.loader,aksel.components.core.button,aksel.components.form;@layer aksel.components.modules{.aksel-alert{border-radius:var(--ax-radius-12);padding:var(--ax-space-16) var(--ax-space-20);gap:var(--ax-space-12);border:1px solid;border-color:var(--ax-border-default);background-color:var(--ax-bg-moderate);align-items:center;display:flex}.aksel-alert>.aksel-alert__icon{color:var(--ax-text-decoration)}@media(forced-colors:active){.aksel-alert{color:canvastext;background-color:canvas;border:1px solid canvastext}}.aksel-alert__wrapper--maxwidth{max-width:43.5rem}.aksel-alert__icon{height:var(--ax-font-line-height-xlarge);flex-shrink:0;align-self:flex-start;font-size:1.5rem}.aksel-alert--small{padding:var(--ax-space-12) var(--ax-space-16);gap:var(--ax-space-8)}.aksel-alert--small>.aksel-alert__icon{height:var(--ax-font-line-height-large);margin-block-start:0}.aksel-alert--full-width{border-radius:0}.aksel-alert--inline{background-color:#0000;border:none;padding:0}.aksel-alert__button-wrapper{flex-flow:row;flex:1;justify-content:flex-end;align-self:flex-start;display:flex}.aksel-alert--close-button>.aksel-alert__wrapper,.aksel-alert--close-button>.aksel-alert__icon{margin-block-start:var(--ax-space-2)}.aksel-alert--close-button.aksel-alert--small{align-items:flex-start}.aksel-alert--close-button.aksel-alert--small>.aksel-alert__wrapper,.aksel-alert--close-button.aksel-alert--small>.aksel-alert__icon{margin-block-start:var(--ax-space-4)}.aksel-base-alert{border-radius:var(--ax-radius-12);--__axc-base-alert-pi: var(--ax-space-20);--__axc-base-alert-content-p: var(--ax-space-12) var(--__axc-base-alert-pi) var(--ax-space-16) var(--__axc-base-alert-pi);--__axc-base-alert-header-max-width: 37.5rem;--__axc-base-alert-header-icon-margin-block-start: var(--ax-space-8);--__axc-base-alert-header-close-button-margin-block-start: var(--ax-space-4);--__axc-global-alert-alignment: max(var(--__axc-base-alert-pi), calc((100% - var(--__axc-base-alert-header-max-width)) / 2));height:fit-content;display:grid;overflow:clip}.aksel-base-alert[data-centered=false]{--__axc-global-alert-alignment: var(--ax-space-20)}.aksel-base-alert[data-size=small]{--__axc-base-alert-content-p: var(--ax-space-8) var(--ax-space-16) var(--ax-space-12) var(--ax-space-16);--__axc-base-alert-header-icon-margin-block-start: var(--ax-space-6);--__axc-base-alert-header-close-button-margin-block-start: var(--ax-space-2)}.aksel-base-alert[data-size=small][data-centered=false]{--__axc-global-alert-alignment: var(--ax-space-16)}.aksel-base-alert[data-variant=moderate]{outline:1px solid var(--ax-border-default);outline-offset:-1px}.aksel-base-alert[data-variant=moderate][data-size=small]{--__axc-base-alert-pi: var(--ax-space-16)}.aksel-base-alert[data-variant=strong]{outline:2px solid var(--ax-border-default);outline-offset:-2px}.aksel-base-alert[data-variant=strong][data-color=neutral]{outline-color:var(--ax-border-strong)}.aksel-base-alert[data-global=true]{border-radius:0}.aksel-base-alert__header{align-items:flex-start;gap:var(--ax-space-8);padding:0 var(--__axc-base-alert-pi);border-bottom:1px solid;display:flex}.aksel-base-alert[data-global=true] .aksel-base-alert__header{padding-inline:var(--__axc-global-alert-alignment)}.aksel-base-alert[data-variant=moderate] .aksel-base-alert__header{background:var(--ax-bg-moderate);color:var(--ax-text-default);border-color:var(--ax-border-subtleA);padding-top:var(--ax-space-1)}.aksel-base-alert[data-variant=strong] .aksel-base-alert__header{background:var(--ax-bg-strong);color:var(--ax-text-contrast);border-bottom:none}.aksel-base-alert__header:only-child{border-bottom:none}.aksel-base-alert__icon{margin-top:var(--__axc-base-alert-header-icon-margin-block-start);font-size:1.5rem;display:grid}.aksel-base-alert__title{padding-block:var(--ax-space-6)}.aksel-base-alert__content{padding:var(--__axc-base-alert-content-p);background-color:var(--ax-bg-default)}.aksel-base-alert__content[data-color]{color:var(--ax-text-neutral)}.aksel-base-alert[data-global=true] .aksel-base-alert__content{padding-inline:var(--__axc-global-alert-alignment)}.aksel-base-alert__close-button{margin-left:auto;z-index:1;margin-block-start:var(--__axc-base-alert-header-close-button-margin-block-start)}.aksel-base-alert__close-button:focus-visible{outline-color:var(--ax-bg-default)}.aksel-base-alert__close-button.aksel-base-alert__close-button.aksel-base-alert__close-button{color:var(--ax-text-neutral-contrast)}.aksel-base-alert__message{border-radius:var(--ax-radius-12);outline:1px solid var(--ax-border-default);outline-offset:-1px;background:var(--ax-bg-moderate);height:fit-content;color:var(--ax-text-default);align-items:flex-start;gap:var(--ax-space-8);padding:var(--ax-space-
|
|
1
|
+
@layer aksel.reset,aksel.theming,aksel.baseline,aksel.print,aksel.typography,aksel.components.core,aksel.components.core.loader,aksel.components.core.button,aksel.components.form;@layer aksel.components.modules{.aksel-alert{border-radius:var(--ax-radius-12);padding:var(--ax-space-16) var(--ax-space-20);gap:var(--ax-space-12);border:1px solid;border-color:var(--ax-border-default);background-color:var(--ax-bg-moderate);align-items:center;display:flex}.aksel-alert>.aksel-alert__icon{color:var(--ax-text-decoration)}@media(forced-colors:active){.aksel-alert{color:canvastext;background-color:canvas;border:1px solid canvastext}}.aksel-alert__wrapper--maxwidth{max-width:43.5rem}.aksel-alert__icon{height:var(--ax-font-line-height-xlarge);flex-shrink:0;align-self:flex-start;font-size:1.5rem}.aksel-alert--small{padding:var(--ax-space-12) var(--ax-space-16);gap:var(--ax-space-8)}.aksel-alert--small>.aksel-alert__icon{height:var(--ax-font-line-height-large);margin-block-start:0}.aksel-alert--full-width{border-radius:0}.aksel-alert--inline{background-color:#0000;border:none;padding:0}.aksel-alert__button-wrapper{flex-flow:row;flex:1;justify-content:flex-end;align-self:flex-start;display:flex}.aksel-alert--close-button>.aksel-alert__wrapper,.aksel-alert--close-button>.aksel-alert__icon{margin-block-start:var(--ax-space-2)}.aksel-alert--close-button.aksel-alert--small{align-items:flex-start}.aksel-alert--close-button.aksel-alert--small>.aksel-alert__wrapper,.aksel-alert--close-button.aksel-alert--small>.aksel-alert__icon{margin-block-start:var(--ax-space-4)}.aksel-base-alert{border-radius:var(--ax-radius-12);--__axc-base-alert-pi: var(--ax-space-20);--__axc-base-alert-content-p: var(--ax-space-12) var(--__axc-base-alert-pi) var(--ax-space-16) var(--__axc-base-alert-pi);--__axc-base-alert-header-max-width: 37.5rem;--__axc-base-alert-header-icon-margin-block-start: var(--ax-space-8);--__axc-base-alert-header-close-button-margin-block-start: var(--ax-space-4);--__axc-global-alert-alignment: max(var(--__axc-base-alert-pi), calc((100% - var(--__axc-base-alert-header-max-width)) / 2));height:fit-content;display:grid;overflow:clip}.aksel-base-alert[data-centered=false]{--__axc-global-alert-alignment: var(--ax-space-20)}.aksel-base-alert[data-size=small]{--__axc-base-alert-content-p: var(--ax-space-8) var(--ax-space-16) var(--ax-space-12) var(--ax-space-16);--__axc-base-alert-header-icon-margin-block-start: var(--ax-space-6);--__axc-base-alert-header-close-button-margin-block-start: var(--ax-space-2)}.aksel-base-alert[data-size=small][data-centered=false]{--__axc-global-alert-alignment: var(--ax-space-16)}.aksel-base-alert[data-variant=moderate]{outline:1px solid var(--ax-border-default);outline-offset:-1px}.aksel-base-alert[data-variant=moderate][data-size=small]{--__axc-base-alert-pi: var(--ax-space-16)}.aksel-base-alert[data-variant=strong]{outline:2px solid var(--ax-border-default);outline-offset:-2px}.aksel-base-alert[data-variant=strong][data-color=neutral]{outline-color:var(--ax-border-strong)}.aksel-base-alert[data-global=true]{border-radius:0}.aksel-base-alert__header{align-items:flex-start;gap:var(--ax-space-8);padding:0 var(--__axc-base-alert-pi);border-bottom:1px solid;display:flex}.aksel-base-alert[data-global=true] .aksel-base-alert__header{padding-inline:var(--__axc-global-alert-alignment)}.aksel-base-alert[data-variant=moderate] .aksel-base-alert__header{background:var(--ax-bg-moderate);color:var(--ax-text-default);border-color:var(--ax-border-subtleA);padding-top:var(--ax-space-1)}.aksel-base-alert[data-variant=strong] .aksel-base-alert__header{background:var(--ax-bg-strong);color:var(--ax-text-contrast);border-bottom:none}.aksel-base-alert__header:only-child{border-bottom:none}.aksel-base-alert__icon{margin-top:var(--__axc-base-alert-header-icon-margin-block-start);font-size:1.5rem;display:grid}.aksel-base-alert__title{padding-block:var(--ax-space-6)}.aksel-base-alert__content{padding:var(--__axc-base-alert-content-p);background-color:var(--ax-bg-default)}.aksel-base-alert__content[data-color]{color:var(--ax-text-neutral)}.aksel-base-alert[data-global=true] .aksel-base-alert__content{padding-inline:var(--__axc-global-alert-alignment)}.aksel-base-alert__close-button{margin-left:auto;z-index:1;margin-block-start:var(--__axc-base-alert-header-close-button-margin-block-start)}.aksel-base-alert__close-button:focus-visible{outline-color:var(--ax-bg-default)}.aksel-base-alert__close-button.aksel-base-alert__close-button.aksel-base-alert__close-button{color:var(--ax-text-neutral-contrast)}.aksel-base-alert__message{border-radius:var(--ax-radius-12);outline:1px solid var(--ax-border-default);outline-offset:-1px;background:var(--ax-bg-moderate);height:fit-content;color:var(--ax-text-default);align-items:flex-start;gap:var(--ax-space-8);padding:var(--ax-space-16) var(--ax-space-20);display:flex}.aksel-base-alert__message>.aksel-base-alert__icon{margin-top:var(--ax-space-2)}.aksel-base-alert[data-size=small] .aksel-base-alert__message{padding:var(--ax-space-12) var(--ax-space-16)}.aksel-base-alert[data-size=small] .aksel-base-alert__message>.aksel-base-alert__icon{margin-top:0}}@layer aksel.layout;
|
package/dist/components.css
CHANGED
|
@@ -3067,7 +3067,7 @@
|
|
|
3067
3067
|
color: var(--ax-text-default);
|
|
3068
3068
|
align-items: flex-start;
|
|
3069
3069
|
gap: var(--ax-space-8);
|
|
3070
|
-
padding: var(--ax-space-
|
|
3070
|
+
padding: var(--ax-space-16) var(--ax-space-20);
|
|
3071
3071
|
display: flex;
|
|
3072
3072
|
}
|
|
3073
3073
|
|
|
@@ -3075,6 +3075,10 @@
|
|
|
3075
3075
|
margin-top: var(--ax-space-2);
|
|
3076
3076
|
}
|
|
3077
3077
|
|
|
3078
|
+
.aksel-base-alert[data-size="small"] .aksel-base-alert__message {
|
|
3079
|
+
padding: var(--ax-space-12) var(--ax-space-16);
|
|
3080
|
+
}
|
|
3081
|
+
|
|
3078
3082
|
.aksel-base-alert[data-size="small"] .aksel-base-alert__message > .aksel-base-alert__icon {
|
|
3079
3083
|
margin-top: 0;
|
|
3080
3084
|
}
|