@postenbring/hedwig-css 0.0.4 → 0.0.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/accordion.css +2 -0
- package/dist/accordion.css.map +1 -0
- package/dist/badge.css +2 -0
- package/dist/badge.css.map +1 -0
- package/dist/base.css +1 -1
- package/dist/base.css.map +1 -1
- package/dist/box.css +2 -0
- package/dist/box.css.map +1 -0
- package/dist/button.css +2 -0
- package/dist/button.css.map +1 -0
- package/dist/classnames.d.ts +64 -31
- package/dist/description-list.css +2 -0
- package/dist/description-list.css.map +1 -0
- package/dist/index.css +2 -2
- package/dist/index.css.map +1 -1
- package/dist/input.css +2 -0
- package/dist/input.css.map +1 -0
- package/dist/link.css +2 -0
- package/dist/link.css.map +1 -0
- package/dist/list.css +2 -0
- package/dist/list.css.map +1 -0
- package/dist/message.css +2 -0
- package/dist/message.css.map +1 -0
- package/dist/reset.css +2 -2
- package/dist/reset.css.map +1 -1
- package/dist/scoped.css +1 -2
- package/dist/{typography/typography.css → typography.css} +1 -1
- package/dist/typography.css.map +1 -0
- package/package.json +23 -27
- package/typed-classname/build.mjs +44 -0
- package/typed-classname/index.d.mts +14 -0
- package/typed-classname/index.mjs +11 -0
- package/dist/badge/badge.css +0 -2
- package/dist/badge/badge.css.map +0 -1
- package/dist/button/button.css +0 -2
- package/dist/button/button.css.map +0 -1
- package/dist/link/link.css +0 -2
- package/dist/link/link.css.map +0 -1
- package/dist/scoped.css.map +0 -1
- package/dist/typography/typography.css.map +0 -1
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
.hds-accordion{--hds-accordion-icon-dimension:24px;--hds-component-accordion-trigger-spacing-between:var(--hds-spacing-small-4);--hds-component-accordion-content-spacing:var(--hds-spacing-medium-3);border:none;border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-light-grey-fill);font:var(--hds-typography-body);fill:var(--hds-ui-colors-black);color:var(--hds-ui-colors-black);list-style:none;display:block}@media (min-width:720px){.hds-accordion{--hds-component-accordion-content-spacing:var(--hds-spacing-large-1);--hds-component-accordion-trigger-spacing-between:var(--hds-spacing-medium-2)}}.hds-accordion .hds-accordion-item{overflow:hidden}.hds-accordion .hds-accordion-item.hds-accordion-item__expanded .hds-accordion-item-trigger{color:var(--hds-brand-colors-dark)}.hds-accordion .hds-accordion-item:first-child .hds-accordion-item-trigger{border:0}.hds-accordion .hds-accordion-item .hds-accordion-item-trigger{padding:var(--hds-component-accordion-trigger-spacing-between)0;border:0;border-top:var(--hds-stroke-thick)solid var(--hds-ui-colors-light-grey-fill);text-align:left;font:var(--hds-typography-body);background-color:transparent;width:100%;display:block;position:relative}.hds-accordion .hds-accordion-item .hds-accordion-item-trigger:hover{color:var(--hds-brand-colors-dark);outline:0}.hds-accordion .hds-accordion-item .hds-accordion-item-trigger .hds-accordion-item-trigger--icon{color:var(--hds-brand-colors-dark);margin-right:var(--hds-spacing-small-4);width:var(--hds-accordion-icon-dimension);height:var(--hds-accordion-icon-dimension);display:inline-block}.hds-accordion .hds-accordion-item .hds-accordion-item-content{padding:0 0 var(--hds-component-accordion-content-spacing)var(--hds-spacing-medium-4);font:var(--hds-typography-body-small)}.hds-accordion .hds-accordion-item .hds-accordion-item-content.hds-accordion-item-content--closed{display:none}
|
|
2
|
+
/*# sourceMappingURL=./dist/accordion.css.map */
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"mappings":"AAAA,iaAKE,yBAA2B,mKAa3B,mDAGE,+HAIA,oFAIA,6UAWE,kHAKA,sRASF,2LAIE","sources":["src/accordion/accordion.css"],"sourcesContent":[".hds-accordion {\n --hds-accordion-icon-dimension: 24px;\n --hds-component-accordion-trigger-spacing-between: var(--hds-spacing-small-4);\n --hds-component-accordion-content-spacing: var(--hds-spacing-medium-3);\n\n @media (min-width: 720px) {\n --hds-component-accordion-content-spacing: var(--hds-spacing-large-1);\n --hds-component-accordion-trigger-spacing-between: var(--hds-spacing-medium-2);\n }\n\n display: block;\n list-style: none;\n border: none;\n border-bottom: var(--hds-stroke-thick) solid var(--hds-ui-colors-light-grey-fill);\n font: var(--hds-typography-body);\n fill: var(--hds-ui-colors-black);\n color: var(--hds-ui-colors-black);\n\n .hds-accordion-item {\n overflow: hidden;\n\n &.hds-accordion-item__expanded .hds-accordion-item-trigger {\n color: var(--hds-brand-colors-dark);\n }\n\n &:first-child .hds-accordion-item-trigger {\n border: 0 none;\n }\n\n .hds-accordion-item-trigger {\n position: relative;\n display: block;\n width: 100%;\n padding: var(--hds-component-accordion-trigger-spacing-between) 0;\n border: 0;\n border-top: var(--hds-stroke-thick) solid var(--hds-ui-colors-light-grey-fill);\n text-align: left;\n background-color: transparent;\n font: var(--hds-typography-body);\n\n &:hover {\n color: var(--hds-brand-colors-dark);\n outline: 0;\n }\n\n .hds-accordion-item-trigger--icon {\n display: inline-block;\n color: var(--hds-brand-colors-dark);\n margin-right: var(--hds-spacing-small-4);\n width: var(--hds-accordion-icon-dimension);\n height: var(--hds-accordion-icon-dimension);\n }\n }\n\n .hds-accordion-item-content {\n padding: 0 0 var(--hds-component-accordion-content-spacing) var(--hds-spacing-medium-4);\n font: var(--hds-typography-body-small);\n\n &.hds-accordion-item-content--closed {\n display: none;\n }\n }\n }\n}\n"],"names":[]}
|
package/dist/badge.css
ADDED
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
.hds-badge{border:var(--hds-stroke-default)solid var(--hds-brand-colors-lighter);border-radius:var(--hds-border-radius);text-transform:uppercase;font-size:12px;line-height:1.1;font-family:var(--hds-fonts-posten-sans-medium);-moz-osx-font-smoothing:subpixel-antialiased;-webkit-font-smoothing:subpixel-antialiased;vertical-align:10%;display:inline-block}.hds-badge{padding:var(--hds-spacing-small-1)var(--hds-spacing-small-2)}.hds-badge.hds-badge--small{padding:var(--hds-spacing-small-1)var(--hds-spacing-small-2)}.hds-badge.hds-badge--smaller{padding:2px var(--hds-spacing-small-1)}.hds-badge{background-color:var(--hds-brand-colors-lighter);border-color:var(--hds-brand-colors-lighter);color:var(--hds-brand-colors-dark)}.hds-badge.hds-badge--primary{background-color:var(--hds-brand-colors-lighter);border-color:var(--hds-brand-colors-lighter);color:var(--hds-brand-colors-dark)}.hds-badge.hds-badge--dark{background-color:var(--hds-brand-colors-darker);border-color:var(--hds-brand-colors-darker);color:var(--hds-ui-colors-white)}.hds-badge.hds-badge--white{background-color:var(--hds-ui-colors-white);border-color:var(--hds-ui-colors-white);color:var(--hds-brand-colors-dark)}.hds-badge.hds-badge--warning{background-color:var(--hds-ui-colors-warning-yellow);border-color:var(--hds-ui-colors-warning-yellow);color:var(--hds-brand-link-colors-text)}
|
|
2
|
+
/*# sourceMappingURL=./dist/badge.css.map */
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"mappings":"AAIA,iWAcE,wEAAA,yFAKA,qEAMA,4IAAA,+JAOA,wJAMA,mJAMA","sources":["src/badge/badge.css"],"sourcesContent":["/**\n * Block\n */\n\n.hds-badge {\n display: inline-block;\n border: var(--hds-stroke-default) solid var(--hds-brand-colors-lighter);\n border-radius: var(--hds-border-radius);\n text-transform: uppercase;\n line-height: 1.1;\n font-size: 12px; /* For now, this might be changed later */\n font-family: var(--hds-fonts-posten-sans-medium);\n -moz-osx-font-smoothing: subpixel-antialiased;\n -webkit-font-smoothing: subpixel-antialiased;\n vertical-align: 10%;\n\n /* Size variations */\n\n &, /* Default */\n &.hds-badge--small {\n padding: var(--hds-spacing-small-1) var(--hds-spacing-small-2);\n }\n\n &.hds-badge--smaller {\n padding: 2px var(--hds-spacing-small-1);\n }\n\n /* Color variations */\n\n &, /* Default */\n &.hds-badge--primary {\n background-color: var(--hds-brand-colors-lighter);\n border-color: var(--hds-brand-colors-lighter);\n color: var(--hds-brand-colors-dark);\n }\n\n &.hds-badge--dark {\n background-color: var(--hds-brand-colors-darker);\n border-color: var(--hds-brand-colors-darker);\n color: var(--hds-ui-colors-white);\n }\n\n &.hds-badge--white {\n background-color: var(--hds-ui-colors-white);\n border-color: var(--hds-ui-colors-white);\n color: var(--hds-brand-colors-dark);\n }\n\n &.hds-badge--warning {\n background-color: var(--hds-ui-colors-warning-yellow);\n border-color: var(--hds-ui-colors-warning-yellow);\n color: var(--hds-brand-link-colors-text);\n }\n}\n"],"names":[]}
|
package/dist/base.css
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
.hds-theme-posten,.hds-theme-bring{box-sizing:border-box;font:var(--hds-typography-body);fill:var(--hds-ui-colors-black);color:var(--hds-ui-colors-black);cursor:auto;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;line-height:1.4}:is(.hds-theme-posten,.hds-theme-bring) body{background:var(--hds-ui-colors-white)}
|
|
2
|
-
/*# sourceMappingURL
|
|
2
|
+
/*# sourceMappingURL=./dist/base.css.map */
|
package/dist/base.css.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"
|
|
1
|
+
{"version":3,"mappings":"AAOA,2PAWE","sources":["src/base.css"],"sourcesContent":["/*\n * Based on hedwig global css\n * https://github.com/bring/hedwig/blob/master/src/shared/base/body.css\n *\n * Scoped to the theme selectors, this way the global effects are only applied\n * where they are wanted\n */\n.hds-theme-posten,\n.hds-theme-bring {\n box-sizing: border-box;\n font: var(--hds-typography-body);\n fill: var(--hds-ui-colors-black);\n color: var(--hds-ui-colors-black);\n line-height: 1.4;\n cursor: auto;\n -moz-osx-font-smoothing: grayscale;\n -webkit-font-smoothing: antialiased;\n\n & body {\n background: var(--hds-ui-colors-white);\n }\n}\n"],"names":[]}
|
package/dist/box.css
ADDED
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
.hds-box{--hds-component-box-padding:var(--hds-spacing-medium-2);padding:var(--hds-component-box-padding);position:relative}.hds-box{background-color:var(--hds-ui-colors-light-grey-fill)}.hds-box.hds-box--light-grey{background-color:var(--hds-ui-colors-light-grey-fill)}.hds-box.hds-box--lighter{background-color:var(--hds-brand-colors-lighter)}.hds-box.hds-box--white{background-color:var(--hds-ui-colors-white);box-shadow:var(--hds-shadow-default)}.hds-box.hds-box--warning{background-color:var(--hds-ui-colors-warning-yellow)}@media (min-width:720px){.hds-box{--hds-component-box-padding:var(--hds-spacing-medium-3)}}.hds-box.hds-box--closed{display:none}.hds-box .hds-box__close-button{top:var(--hds-spacing-small-4);right:var(--hds-spacing-small-4);cursor:pointer;transition:filter var(--hds-micro-animation-duration-quick)var(--hds-micro-animation-easing-normal);background:url("data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M13.1602 12.25L16.7812 8.66406L17.5195 7.92578C17.625 7.82031 17.625 7.64453 17.5195 7.50391L16.7461 6.73047C16.6055 6.625 16.4297 6.625 16.3242 6.73047L12 11.0898L7.64062 6.73047C7.53516 6.625 7.35938 6.625 7.21875 6.73047L6.44531 7.50391C6.33984 7.64453 6.33984 7.82031 6.44531 7.92578L10.8047 12.25L6.44531 16.6094C6.33984 16.7148 6.33984 16.8906 6.44531 17.0312L7.21875 17.8047C7.35938 17.9102 7.53516 17.9102 7.64062 17.8047L12 13.4453L15.5859 17.0664L16.3242 17.8047C16.4297 17.9102 16.6055 17.9102 16.7461 17.8047L17.5195 17.0312C17.625 16.8906 17.625 16.7148 17.5195 16.6094L13.1602 12.25Z\" fill=\"black\"/></svg>");border:none;width:24px;height:24px;padding:0;position:absolute}.hds-box .hds-box__close-button:hover{-webkit-filter:invert(40%);filter:invert(40%)}.hds-box .hds-box__close-button:focus{box-shadow:0 0 0 2px var(--hds-ui-colors-black-hover);outline:none}
|
|
2
|
+
/*# sourceMappingURL=./dist/box.css.map */
|
package/dist/box.css.map
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"mappings":"AAAA,4HAGE,+DAAA,mFAKA,2EAIA,yGAKA,+EAOA,yBAA2B,kEAO3B,sCASF,yhCAmBE,oFAKA","sources":["src/box/box.css"],"sourcesContent":[".hds-box {\n position: relative;\n\n &, /* Default */\n &.hds-box--light-grey {\n background-color: var(--hds-ui-colors-light-grey-fill);\n }\n\n &.hds-box--lighter {\n background-color: var(--hds-brand-colors-lighter);\n }\n\n &.hds-box--white {\n background-color: var(--hds-ui-colors-white);\n box-shadow: var(--hds-shadow-default);\n }\n\n &.hds-box--warning {\n background-color: var(--hds-ui-colors-warning-yellow);\n }\n\n /* Padding */\n --hds-component-box-padding: var(--hds-spacing-medium-2);\n\n @media (min-width: 720px) {\n --hds-component-box-padding: var(--hds-spacing-medium-3);\n }\n\n padding: var(--hds-component-box-padding);\n\n /* Closed state */\n &.hds-box--closed {\n display: none;\n }\n}\n\n/**\n * Close button\n * TODO: Styling for the hover and focus effect can be improved upon\n */\n.hds-box .hds-box__close-button {\n /* Icon */\n width: 24px;\n height: 24px;\n background: transparent;\n background-image: url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M13.1602 12.25L16.7812 8.66406L17.5195 7.92578C17.625 7.82031 17.625 7.64453 17.5195 7.50391L16.7461 6.73047C16.6055 6.625 16.4297 6.625 16.3242 6.73047L12 11.0898L7.64062 6.73047C7.53516 6.625 7.35938 6.625 7.21875 6.73047L6.44531 7.50391C6.33984 7.64453 6.33984 7.82031 6.44531 7.92578L10.8047 12.25L6.44531 16.6094C6.33984 16.7148 6.33984 16.8906 6.44531 17.0312L7.21875 17.8047C7.35938 17.9102 7.53516 17.9102 7.64062 17.8047L12 13.4453L15.5859 17.0664L16.3242 17.8047C16.4297 17.9102 16.6055 17.9102 16.7461 17.8047L17.5195 17.0312C17.625 16.8906 17.625 16.7148 17.5195 16.6094L13.1602 12.25Z\" fill=\"black\"/></svg>');\n\n /* Positioning */\n position: absolute;\n top: var(--hds-spacing-small-4);\n right: var(--hds-spacing-small-4);\n padding: 0;\n border: none;\n cursor: pointer;\n\n /* Hover effect */\n transition: filter var(--hds-micro-animation-duration-quick)\n var(--hds-micro-animation-easing-normal);\n\n &:hover {\n filter: invert(40%);\n }\n\n /* Focus effect */\n &:focus {\n outline: none;\n box-shadow: 0 0 0 2px var(--hds-ui-colors-black-hover);\n }\n}\n"],"names":[]}
|
package/dist/button.css
ADDED
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
.hds-button{--hds-component-button-border-width:0px;-webkit-font-smoothing:antialiased;-webkit-appearance:button;box-sizing:border-box;border-radius:var(--hds-border-radius);border-style:solid;border-width:var(--hds-component-button-border-width);transition:all var(--hds-micro-animation-duration-quick)var(--hds-micro-animation-easing-normal);cursor:pointer;word-break:normal;font:var(--hds-typography-body-small-title);display:inline-block}.hds-button.hds-button--small{font-size:var(--hds-font-size-technical-title-max);line-height:var(--hds-line-height-technical-title-max);padding:calc(var(--hds-spacing-small-3) - var(--hds-component-button-border-width))calc(var(--hds-spacing-small-4) - var(--hds-component-button-border-width));height:calc(var(--hds-line-height-technical-title-max) + var(--hds-spacing-small-3)*2)}.hds-button.hds-button--medium{font-size:var(--hds-font-size-body-small-title-max);line-height:var(--hds-line-height-body-small-title-max);padding:calc(var(--hds-spacing-small-3) - var(--hds-component-button-border-width))calc(var(--hds-spacing-medium-1) - var(--hds-component-button-border-width));height:calc(var(--hds-line-height-body-small-title-max) + var(--hds-spacing-small-3)*2)}.hds-button.hds-button--large{font-size:var(--hds-font-size-body-small-title-max);line-height:var(--hds-line-height-body-small-title-max);padding:calc(var(--hds-spacing-small-4) - var(--hds-component-button-border-width))calc(var(--hds-spacing-medium-2) - var(--hds-component-button-border-width));height:calc(var(--hds-line-height-body-small-title-max) + var(--hds-spacing-small-4)*2)}.hds-button.hds-button--full{width:100%}.hds-button.hds-button--mobile-full{width:100%}@media (min-width:720px){.hds-button.hds-button--mobile-full{width:unset}}.hds-button.hds-button--primary{background-color:var(--hds-brand-colors-signature);color:var(--hds-brand-button-colors-text);fill:var(--hds-brand-button-colors-text)}.hds-button.hds-button--primary:hover{background-color:var(--hds-brand-colors-signature-hover);outline:0 solid var(--hds-brand-colors-signature-hover)}.hds-button.hds-button--primary:active{background-color:var(--hds-brand-colors-signature);outline:0 solid var(--hds-brand-colors-signature-hover)}.hds-button.hds-button--secondary{background-color:var(--hds-brand-colors-darker);color:var(--hds-ui-colors-white);fill:var(--hds-ui-colors-white)}.hds-button.hds-button--secondary:hover{background-color:var(--hds-ui-colors-black);outline:0 solid var(--hds-ui-colors-black)}.hds-button.hds-button--secondary:active{background-color:var(--hds-brand-colors-darker);outline:0 solid var(--hds-ui-colors-black)}.hds-button.hds-button--outline-primary{--hds-component-button-border-width:var(--hds-stroke-thick);border-color:var(--hds-brand-colors-signature);color:var(--hds-ui-colors-black);fill:var(--hds-ui-colors-black);outline-offset:3px;background-color:transparent}.hds-button.hds-button--outline-primary:hover{color:var(--hds-brand-colors-dark);fill:var(--hds-brand-colors-dark);border-color:var(--hds-brand-colors-dark)}.hds-button.hds-button--outline-primary:active{color:var(--hds-brand-colors-dark);fill:var(--hds-brand-colors-dark);border-color:var(--hds-brand-colors-dark)}.hds-button.hds-button--outline-secondary{--hds-component-button-border-width:var(--hds-stroke-thick);border-color:var(--hds-brand-colors-darker);color:var(--hds-brand-colors-darker);fill:var(--hds-brand-colors-darker);outline-offset:3px;background-color:transparent}.hds-button.hds-button--outline-secondary:hover{color:var(--hds-ui-colors-black);fill:var(--hds-ui-colors-black);border-color:var(--hds-ui-colors-black)}.hds-button.hds-button--outline-secondary:active{color:var(--hds-ui-colors-black);fill:var(--hds-ui-colors-black);border-color:var(--hds-ui-colors-black)}.hds-button.hds-button--outline-white{--hds-component-button-border-width:var(--hds-stroke-thick);border-color:var(--hds-brand-colors-light);color:var(--hds-ui-colors-white);fill:var(--hds-ui-colors-white);outline-offset:3px;background-color:transparent}.hds-button.hds-button--outline-white:hover{color:var(--hds-brand-colors-light);fill:var(--hds-brand-colors-light)}.hds-button.hds-button--outline-white:active{color:var(--hds-brand-colors-light);fill:var(--hds-brand-colors-light)}.hds-button:disabled.hds-button--primary{color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);background-color:var(--hds-ui-colors-grey);border-color:var(--hds-ui-colors-grey);box-shadow:none;cursor:default;outline:0}.hds-button:disabled.hds-button--secondary{color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);background-color:var(--hds-ui-colors-grey);border-color:var(--hds-ui-colors-grey);box-shadow:none;cursor:default;outline:0}.hds-button:disabled.hds-button--outline-primary{border-color:var(--hds-ui-colors-grey);color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);cursor:default;background-color:transparent}.hds-button:disabled.hds-button--outline-secondary{border-color:var(--hds-ui-colors-grey);color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);cursor:default;background-color:transparent}.hds-button[disabled].hds-button--primary{color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);background-color:var(--hds-ui-colors-grey);border-color:var(--hds-ui-colors-grey);box-shadow:none;cursor:default;outline:0}.hds-button[disabled].hds-button--secondary{color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);background-color:var(--hds-ui-colors-grey);border-color:var(--hds-ui-colors-grey);box-shadow:none;cursor:default;outline:0}.hds-button[disabled].hds-button--outline-primary{border-color:var(--hds-ui-colors-grey);color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);cursor:default;background-color:transparent}.hds-button[disabled].hds-button--outline-secondary{border-color:var(--hds-ui-colors-grey);color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);cursor:default;background-color:transparent}.hds-button[disabled]:active.hds-button--primary{color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);background-color:var(--hds-ui-colors-grey);border-color:var(--hds-ui-colors-grey);box-shadow:none;cursor:default;outline:0}.hds-button[disabled]:active.hds-button--secondary{color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);background-color:var(--hds-ui-colors-grey);border-color:var(--hds-ui-colors-grey);box-shadow:none;cursor:default;outline:0}.hds-button[disabled]:active.hds-button--outline-primary{border-color:var(--hds-ui-colors-grey);color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);cursor:default;background-color:transparent}.hds-button[disabled]:active.hds-button--outline-secondary{border-color:var(--hds-ui-colors-grey);color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);cursor:default;background-color:transparent}
|
|
2
|
+
/*# sourceMappingURL=./dist/button.css.map */
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"mappings":"AAAA,0bAmBE,8XAQA,mYAQA,kYAYA,wCAIA,+CAGE,yBAA2B,iDAS7B,sKAKE,uJAKA,kJAMF,mJAKE,+HAKA,oIAMF,oQASE,6JAAA,8JAQF,2QASE,yJAAA,0JAQF,8PASE,mHAAA,oHAcA,6OAAA,+OAWA,6MAAA,+MAXA,8OAAA,gPAWA,8MAAA,gNAXA,qPAAA,uPAWA,qNAAA","sources":["src/button/button.css"],"sourcesContent":[".hds-button {\n --hds-component-button-border-width: 0px;\n\n -webkit-font-smoothing: antialiased;\n /* stylelint-disable-next-line property-no-vendor-prefix -- Not sure if we need this or not 🤷 */\n -webkit-appearance: button;\n box-sizing: border-box;\n display: inline-block;\n border-style: solid;\n border-radius: var(--hds-border-radius);\n border-width: var(--hds-component-button-border-width);\n transition: all var(--hds-micro-animation-duration-quick) var(--hds-micro-animation-easing-normal);\n cursor: pointer;\n word-break: normal;\n font: var(--hds-typography-body-small-title);\n\n /**\n * Modifiers: sizes\n */\n &.hds-button--small {\n font-size: var(--hds-font-size-technical-title-max);\n line-height: var(--hds-line-height-technical-title-max);\n padding: calc(var(--hds-spacing-small-3) - var(--hds-component-button-border-width))\n calc(var(--hds-spacing-small-4) - var(--hds-component-button-border-width));\n height: calc(var(--hds-line-height-technical-title-max) + var(--hds-spacing-small-3) * 2);\n }\n\n &.hds-button--medium {\n font-size: var(--hds-font-size-body-small-title-max);\n line-height: var(--hds-line-height-body-small-title-max);\n padding: calc(var(--hds-spacing-small-3) - var(--hds-component-button-border-width))\n calc(var(--hds-spacing-medium-1) - var(--hds-component-button-border-width));\n height: calc(var(--hds-line-height-body-small-title-max) + var(--hds-spacing-small-3) * 2);\n }\n\n &.hds-button--large {\n font-size: var(--hds-font-size-body-small-title-max);\n line-height: var(--hds-line-height-body-small-title-max);\n padding: calc(var(--hds-spacing-small-4) - var(--hds-component-button-border-width))\n calc(var(--hds-spacing-medium-2) - var(--hds-component-button-border-width));\n height: calc(var(--hds-line-height-body-small-title-max) + var(--hds-spacing-small-4) * 2);\n }\n\n /**\n * Modifiers: Width\n */\n\n &.hds-button--full {\n width: 100%;\n }\n\n &.hds-button--mobile-full {\n width: 100%;\n\n @media (min-width: 720px) {\n width: unset;\n }\n }\n\n /**\n * Modifiers: Variants\n */\n\n &.hds-button--primary {\n background-color: var(--hds-brand-colors-signature);\n color: var(--hds-brand-button-colors-text);\n fill: var(--hds-brand-button-colors-text);\n\n &:hover {\n background-color: var(--hds-brand-colors-signature-hover);\n outline: 0 solid var(--hds-brand-colors-signature-hover);\n }\n\n &:active {\n background-color: var(--hds-brand-colors-signature);\n outline: 0 solid var(--hds-brand-colors-signature-hover);\n }\n }\n\n &.hds-button--secondary {\n background-color: var(--hds-brand-colors-darker);\n color: var(--hds-ui-colors-white);\n fill: var(--hds-ui-colors-white);\n\n &:hover {\n background-color: var(--hds-ui-colors-black);\n outline: 0 solid var(--hds-ui-colors-black);\n }\n\n &:active {\n background-color: var(--hds-brand-colors-darker);\n outline: 0 solid var(--hds-ui-colors-black);\n }\n }\n\n &.hds-button--outline-primary {\n --hds-component-button-border-width: var(--hds-stroke-thick);\n\n background-color: transparent;\n border-color: var(--hds-brand-colors-signature);\n color: var(--hds-ui-colors-black);\n fill: var(--hds-ui-colors-black);\n outline-offset: 3px;\n\n &:hover,\n &:active {\n color: var(--hds-brand-colors-dark);\n fill: var(--hds-brand-colors-dark);\n border-color: var(--hds-brand-colors-dark);\n }\n }\n\n &.hds-button--outline-secondary {\n --hds-component-button-border-width: var(--hds-stroke-thick);\n\n background-color: transparent;\n border-color: var(--hds-brand-colors-darker);\n color: var(--hds-brand-colors-darker);\n fill: var(--hds-brand-colors-darker);\n outline-offset: 3px;\n\n &:hover,\n &:active {\n color: var(--hds-ui-colors-black);\n fill: var(--hds-ui-colors-black);\n border-color: var(--hds-ui-colors-black);\n }\n }\n\n &.hds-button--outline-white {\n --hds-component-button-border-width: var(--hds-stroke-thick);\n\n background-color: transparent;\n border-color: var(--hds-brand-colors-light);\n color: var(--hds-ui-colors-white);\n fill: var(--hds-ui-colors-white);\n outline-offset: 3px;\n\n &:hover,\n &:active {\n color: var(--hds-brand-colors-light);\n fill: var(--hds-brand-colors-light);\n }\n }\n\n /**\n * State: Disabled\n */\n\n &:disabled,\n &[disabled],\n &[disabled]:active {\n &.hds-button--primary,\n &.hds-button--secondary {\n color: var(--hds-ui-colors-dark-grey);\n fill: var(--hds-ui-colors-dark-grey);\n background-color: var(--hds-ui-colors-grey);\n border-color: var(--hds-ui-colors-grey);\n outline: 0;\n box-shadow: none;\n cursor: default;\n }\n\n &.hds-button--outline-primary,\n &.hds-button--outline-secondary {\n border-color: var(--hds-ui-colors-grey);\n color: var(--hds-ui-colors-dark-grey);\n fill: var(--hds-ui-colors-dark-grey);\n background-color: transparent;\n cursor: default;\n }\n }\n}\n"],"names":[]}
|
package/dist/classnames.d.ts
CHANGED
|
@@ -1,52 +1,85 @@
|
|
|
1
|
-
//
|
|
1
|
+
// Autogenerated file, do not edit
|
|
2
2
|
|
|
3
3
|
export type ClassNames =
|
|
4
|
-
| "hds-
|
|
5
|
-
| "hds-
|
|
6
|
-
| "hds-badge--primary"
|
|
7
|
-
| "hds-badge--small"
|
|
8
|
-
| "hds-badge--smaller"
|
|
9
|
-
| "hds-badge--warning"
|
|
10
|
-
| "hds-badge--white"
|
|
4
|
+
| "hds-theme-posten"
|
|
5
|
+
| "hds-theme-bring"
|
|
11
6
|
| "hds-button"
|
|
12
|
-
| "hds-button--
|
|
13
|
-
| "hds-button--large"
|
|
7
|
+
| "hds-button--small"
|
|
14
8
|
| "hds-button--medium"
|
|
9
|
+
| "hds-button--large"
|
|
10
|
+
| "hds-button--full"
|
|
15
11
|
| "hds-button--mobile-full"
|
|
16
|
-
| "hds-button--
|
|
17
|
-
| "hds-button--
|
|
12
|
+
| "hds-button--primary"
|
|
13
|
+
| "hds-button--secondary"
|
|
18
14
|
| "hds-button--outline-primary"
|
|
19
15
|
| "hds-button--outline-secondary"
|
|
20
16
|
| "hds-button--outline-white"
|
|
21
|
-
| "hds-button--primary"
|
|
22
|
-
| "hds-button--secondary"
|
|
23
|
-
| "hds-button--small"
|
|
24
17
|
| "hds-link"
|
|
18
|
+
| "hds-link__text"
|
|
25
19
|
| "hds-link--inverted"
|
|
20
|
+
| "hds-link--small"
|
|
26
21
|
| "hds-link--large"
|
|
27
22
|
| "hds-link--no-underline"
|
|
28
|
-
| "hds-link--small"
|
|
29
23
|
| "hds-link--solid"
|
|
30
|
-
| "hds-
|
|
31
|
-
| "hds-
|
|
32
|
-
| "hds-
|
|
33
|
-
| "hds-
|
|
34
|
-
| "hds-
|
|
35
|
-
| "hds-
|
|
36
|
-
| "hds-
|
|
37
|
-
| "hds-
|
|
38
|
-
| "hds-
|
|
39
|
-
| "hds-
|
|
40
|
-
| "hds-
|
|
41
|
-
| "hds-
|
|
24
|
+
| "hds-badge"
|
|
25
|
+
| "hds-badge--small"
|
|
26
|
+
| "hds-badge--smaller"
|
|
27
|
+
| "hds-badge--primary"
|
|
28
|
+
| "hds-badge--dark"
|
|
29
|
+
| "hds-badge--white"
|
|
30
|
+
| "hds-badge--warning"
|
|
31
|
+
| "hds-description-list"
|
|
32
|
+
| "hds-description-list--horizontal"
|
|
33
|
+
| "hds-list"
|
|
34
|
+
| "hds-list--small"
|
|
35
|
+
| "hds-list--medium"
|
|
36
|
+
| "hds-list--large"
|
|
37
|
+
| "hds-list--style-hidden"
|
|
38
|
+
| "hds-typography-h2-display"
|
|
42
39
|
| "hds-typography-h1"
|
|
43
40
|
| "hds-typography-h1--spacing"
|
|
44
41
|
| "hds-typography-h2"
|
|
45
42
|
| "hds-typography-h2--spacing"
|
|
46
|
-
| "hds-typography-h2-display"
|
|
47
43
|
| "hds-typography-h3"
|
|
48
|
-
| "hds-typography-h3--spacing"
|
|
49
44
|
| "hds-typography-h3--title"
|
|
45
|
+
| "hds-typography-h3--spacing"
|
|
46
|
+
| "hds-typography-body"
|
|
47
|
+
| "hds-typography-body--title"
|
|
48
|
+
| "hds-typography-body--spacing"
|
|
49
|
+
| "hds-typography-body-small"
|
|
50
|
+
| "hds-typography-body-small--title"
|
|
51
|
+
| "hds-typography-body-small--spacing"
|
|
52
|
+
| "hds-typography-caption"
|
|
53
|
+
| "hds-typography-caption--title"
|
|
54
|
+
| "hds-typography-caption--spacing"
|
|
50
55
|
| "hds-typography-technical"
|
|
56
|
+
| "hds-typography-technical--title"
|
|
51
57
|
| "hds-typography-technical--spacing"
|
|
52
|
-
| "hds-
|
|
58
|
+
| "hds-box"
|
|
59
|
+
| "hds-box--light-grey"
|
|
60
|
+
| "hds-box--lighter"
|
|
61
|
+
| "hds-box--white"
|
|
62
|
+
| "hds-box--warning"
|
|
63
|
+
| "hds-box--closed"
|
|
64
|
+
| "hds-box__close-button"
|
|
65
|
+
| "hds-message"
|
|
66
|
+
| "hds-message--success"
|
|
67
|
+
| "hds-message--attention"
|
|
68
|
+
| "hds-message--warning"
|
|
69
|
+
| "hds-message--neutral"
|
|
70
|
+
| "hds-message--neutral__icon"
|
|
71
|
+
| "hds-input"
|
|
72
|
+
| "hds-input--error"
|
|
73
|
+
| "hds-input__input"
|
|
74
|
+
| "hds-input--lined"
|
|
75
|
+
| "hds-input--default"
|
|
76
|
+
| "hds-input--white"
|
|
77
|
+
| "hds-input__label"
|
|
78
|
+
| "hds-input__error-message"
|
|
79
|
+
| "hds-accordion"
|
|
80
|
+
| "hds-accordion-item"
|
|
81
|
+
| "hds-accordion-item__expanded"
|
|
82
|
+
| "hds-accordion-item-trigger"
|
|
83
|
+
| "hds-accordion-item-trigger--icon"
|
|
84
|
+
| "hds-accordion-item-content"
|
|
85
|
+
| "hds-accordion-item-content--closed";
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
.hds-description-list{font:var(--hds-typography-body);margin:0;padding-left:0;list-style:none}.hds-description-list dt{font-family:var(--hds-fonts-posten-sans-bold)}.hds-description-list dd{margin-left:0;margin-bottom:var(--hds-spacing-small-3)}.hds-description-list.hds-description-list--horizontal dt{margin-right:var(--hds-spacing-small-1);margin-bottom:var(--hds-spacing-small-2);display:inline-block}.hds-description-list.hds-description-list--horizontal dt:after{content:"\a ";white-space:pre}.hds-description-list.hds-description-list--horizontal dd{display:inline}.hds-description-list.hds-description-list--horizontal dd:after{content:"\a ";white-space:pre}
|
|
2
|
+
/*# sourceMappingURL=./dist/description-list.css.map */
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"mappings":"AAAA,8FAME,uEAIA,gFAME,gKAKE,8FAMF,yEAGE","sources":["src/list/description-list.css"],"sourcesContent":[".hds-description-list {\n list-style: none;\n margin: 0;\n padding-left: 0;\n font: var(--hds-typography-body);\n\n & dt {\n font-family: var(--hds-fonts-posten-sans-bold);\n }\n\n & dd {\n margin-left: 0;\n margin-bottom: var(--hds-spacing-small-3);\n }\n\n &.hds-description-list--horizontal {\n & dt {\n display: inline-block;\n margin-right: var(--hds-spacing-small-1);\n margin-bottom: var(--hds-spacing-small-2);\n\n &::after {\n content: \"\\a\";\n white-space: pre;\n }\n }\n\n & dd {\n display: inline;\n\n &::after {\n content: \"\\a\";\n white-space: pre;\n }\n }\n }\n}\n"],"names":[]}
|
package/dist/index.css
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
.hds-theme-posten,.hds-theme-bring{box-sizing:border-box;font:var(--hds-typography-body);fill:var(--hds-ui-colors-black);color:var(--hds-ui-colors-black);cursor:auto;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;line-height:1.4}:is(.hds-theme-posten,.hds-theme-bring) body{background:var(--hds-ui-colors-white)}.hds-button{-webkit-font-smoothing:antialiased;-webkit-appearance:button;box-sizing:border-box;padding:var(--hds-spacing-small-3)var(--hds-spacing-medium-2);border-radius:var(--hds-border-radius);background:var(--hds-ui-colors-grey);border-width:0;border-color:var(--hds-ui-colors-grey);color:var(--hds-brand-button-colors-text);fill:var(--hds-brand-button-colors-text);font:var(--hds-typography-body-title);transition:all var(--hds-micro-animation-duration-quick)var(--hds-micro-animation-easing-normal);text-align:center;cursor:pointer;word-break:normal;display:inline-block}.hds-button:disabled,.hds-button[disabled],.hds-button[disabled]:active{cursor:default;color:var(--hds-ui-colors-dark-grey)!important;fill:var(--hds-ui-colors-dark-grey)!important;background:var(--hds-ui-colors-grey)!important;border-color:var(--hds-ui-colors-grey)!important;box-shadow:none!important;outline:0!important}.hds-button--large{height:58px;padding:16px 24px;font-size:18px;line-height:26px}.hds-button--large i,.hds-button--large svg{margin-right:12px}.hds-button--medium{height:50px;padding:12px 20px;font-size:18px;line-height:26px}.hds-button--medium i,.hds-button--medium svg{margin-right:10px}.hds-button--small{height:48px;padding:12px 16px;font-size:16px;line-height:24px}.hds-button--small i,.hds-button--small svg{margin-right:8px}.hds-button--full{width:100%}@media (max-width:720px){.hds-button--mobile-full{width:100%}}.hds-button--primary{background:var(--hds-brand-colors-signature);border-color:var(--hds-brand-colors-signature);color:var(--hds-brand-button-colors-text);fill:var(--hds-brand-button-colors-text)}.hds-button--primary:hover,.hds-button--primary:active{background:var(--hds-brand-colors-signature-hover);border-color:var(--hds-brand-colors-signature);outline:0 solid var(--hds-brand-colors-signature-hover)}.hds-button--primary:active{background:var(--hds-brand-colors-signature)!important}.hds-button--secondary{background:var(--hds-brand-colors-darker);border-color:var(--hds-brand-colors-darker);color:var(--hds-ui-colors-white);fill:var(--hds-ui-colors-white)}.hds-button--secondary:hover,.hds-button--secondary:active{background:var(--hds-ui-colors-black);outline:0 solid var(--hds-ui-colors-black)}.hds-button--secondary:active{background:var(--hds-brand-colors-darker)!important}.hds-button--outline{color:var(--hds-brand-colors-dark);fill:var(--hds-brand-colors-dark);border:var(--hds-stroke-thick)solid var(--hds-brand-colors-dark);background:0 0}.hds-button--outline:disabled,.hds-button--outline[disabled],.hds-button--outline[disabled]:active{background:0 0!important}.hds-button--outline:hover,.hds-button--outline:active{color:var(--hds-ui-colors-black);fill:var(--hds-ui-colors-black);border-color:var(--hds-ui-colors-black);background:0 0}.hds-button--outline:active{border-color:var(--hds-ui-colors-dark-grey)}.hds-button--outline-white{border:var(--hds-stroke-thick)solid var(--hds-brand-colors-light);color:var(--hds-ui-colors-white);fill:var(--hds-ui-colors-white);outline-offset:3px;background:0 0}.hds-button--outline-white:hover,.hds-button--outline-white:active{color:var(--hds-brand-colors-light);fill:var(--hds-brand-colors-light)}.hds-button--outline-primary{border:var(--hds-stroke-thick)solid var(--hds-brand-colors-signature);color:var(--hds-ui-colors-black);fill:var(--hds-ui-colors-black);outline-offset:3px;background:0 0}.hds-button--outline-primary:hover,.hds-button--outline-primary:active{color:var(--hds-brand-colors-dark);fill:var(--hds-brand-colors-dark);border:var(--hds-stroke-thick)solid var(--hds-brand-colors-dark)}.hds-button--outline-primary:disabled,.hds-button--outline-primary[disabled],.hds-button--outline-primary[disabled]:active{border:var(--hds-stroke-thick)solid var(--hds-ui-colors-grey);color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);background:0 0!important}.hds-button--outline-secondary,.hds-button--outline-dark{border:var(--hds-stroke-thick)solid var(--hds-brand-colors-darker);color:var(--hds-brand-colors-darker);fill:var(--hds-brand-colors-darker);outline-offset:3px;background:0 0}.hds-button--outline-secondary:hover,.hds-button--outline-secondary:active,.hds-button--outline-dark:hover,.hds-button--outline-dark:active{color:var(--hds-ui-colors-black);fill:var(--hds-ui-colors-black);border:var(--hds-stroke-thick)solid var(--hds-ui-colors-black)}.hds-button--outline-secondary:disabled,.hds-button--outline-secondary[disabled],.hds-button--outline-secondary[disabled]:active,.hds-button--outline-dark:disabled,.hds-button--outline-dark[disabled],.hds-button--outline-dark[disabled]:active{border:var(--hds-stroke-thick)solid var(--hds-ui-colors-grey);color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);background:0 0!important}.hds-link{border-bottom:var(--hds-stroke-default)solid var(--hds-brand-link-colors-underline);fill:var(--hds-brand-link-colors-text);color:var(--hds-brand-link-colors-text);cursor:pointer;text-decoration:none;transition:all .1s}.hds-link:hover,.hds-link:active{color:var(--hds-brand-link-colors-hover);fill:var(--hds-brand-link-colors-hover);border-color:var(--hds-brand-link-colors-underline-hover)}.hds-link:hover .hds-link__text,.hds-link:active .hds-link__text{border-color:var(--hds-brand-link-colors-underline-hover)}.hds-link--inverted{color:var(--hds-ui-colors-white);-webkit-text-decoration-color:var(--hds-brand-colors-signature);-webkit-text-decoration-color:var(--hds-brand-colors-signature);text-decoration-color:var(--hds-brand-colors-signature);border-color:currentColor}.hds-link--inverted:hover,.hds-link--inverted:active{color:var(--hds-brand-colors-light);border-color:currentColor}.hds-link--inverted:disabled{color:var(--hds-ui-colors-dark-grey);fill:currentColor;cursor:default;border-color:currentColor;box-shadow:none!important;outline:0!important}.hds-link--small{font:var(--hds-typography-body-small)}.hds-link--large{font:var(--hds-typography-header-h3)}.hds-link--no-underline{font:var(--hds-fonts-posten-sans-medium);color:var(--hds-brand-colors-dark);border-bottom:none;text-decoration:none}.hds-link--no-underline:hover{color:var(--hds-brand-colors-dark);text-decoration:underline;-webkit-text-decoration-color:var(--hds-brand-colors-dark);-webkit-text-decoration-color:var(--hds-brand-colors-dark);text-decoration-color:var(--hds-brand-colors-dark);border-bottom:none}.hds-link--solid{color:var(--hds-ui-colors-black);border-color:var(--hds-ui-colors-black)}.hds-link--solid:hover,.hds-link--solid:active{color:var(--hds-ui-colors-black-hover);border-color:var(--hds-ui-colors-black-hover)}.hds-badge{background-color:var(--hds-brand-colors-lighter);border:var(--hds-stroke-default)solid var(--hds-brand-colors-lighter);border-radius:var(--hds-border-radius);padding:var(--hds-spacing-small-1)var(--hds-spacing-small-2);color:var(--hds-brand-colors-dark);text-transform:uppercase;font-size:12px;line-height:1.1;font-family:var(--hds-fonts-posten-sans-medium);-moz-osx-font-smoothing:subpixel-antialiased;-webkit-font-smoothing:subpixel-antialiased;vertical-align:10%;display:inline-block}.hds-badge--small{padding:var(--hds-spacing-small-1)var(--hds-spacing-small-2)}.hds-badge--smaller{padding:2px var(--hds-spacing-small-1)}.hds-badge--primary{background-color:var(--hds-brand-colors-lighter);border-color:var(--hds-brand-colors-lighter);color:var(--hds-brand-colors-dark)}.hds-badge--dark{background-color:var(--hds-brand-colors-darker);border-color:var(--hds-brand-colors-darker);color:var(--hds-ui-colors-white)}.hds-badge--white{background-color:var(--hds-ui-colors-white);border-color:var(--hds-ui-colors-white);color:var(--hds-brand-colors-dark)}.hds-badge--warning{background-color:var(--hds-ui-colors-warning-yellow);border-color:var(--hds-ui-colors-warning-yellow);color:var(--hds-brand-link-colors-text)}.hds-typography-h2-display{font:var(--hds-brand-typography-h1-display)}.hds-typography-h1{font:var(--hds-brand-typography-h1)}.hds-typography-h1.hds-typography-h1--spacing{margin-top:var(--hds-spacing-large-2)}.hds-typography-h2{font:var(--hds-brand-typography-h2)}.hds-typography-h2.hds-typography-h2--spacing{margin-top:var(--hds-spacing-large-2)}.hds-typography-h1~.hds-typography-h2.hds-typography-h2--spacing{margin-top:var(--hds-spacing-medium-3)}.hds-typography-h3{font:var(--hds-typography-header-h3)}.hds-typography-h3.hds-typography-h3--title{font:var(--hds-typography-header-h3-title)}.hds-typography-h3.hds-typography-h3--spacing{margin-top:var(--hds-spacing-large-2)}.hds-typography-body{font:var(--hds-typography-body)}.hds-typography-body.hds-typography-body--title{font:var(--hds-typography-body-title)}.hds-typography-body.hds-typography-body--spacing{margin-top:var(--hds-spacing-medium-2)}.hds-typography-body-small{font:var(--hds-typography-body-small)}.hds-typography-body-small.hds-typography-body-small--title{font:var(--hds-typography-body-small-title)}.hds-typography-body-small.hds-typography-body-small--spacing{margin-top:var(--hds-spacing-medium-2)}.hds-typography-caption{font:var(--hds-typography-caption)}.hds-typography-caption.hds-typography-caption--title{font:var(--hds-typography-caption-title)}.hds-typography-caption.hds-typography-caption--spacing{margin-top:var(--hds-spacing-medium-2)}.hds-typography-technical{font:var(--hds-typography-technical)}.hds-typography-technical.hds-typography-technical--title{font:var(--hds-typography-technical-title)}.hds-typography-technical.hds-typography-technical--spacing{margin-top:var(--hds-spacing-small-1)}@media (min-width:940px){.hds-typography-technical.hds-typography-technical--spacing{margin-top:var(--hds-spacing-small-2)}}
|
|
2
|
-
/*# sourceMappingURL
|
|
1
|
+
.hds-theme-posten,.hds-theme-bring{box-sizing:border-box;font:var(--hds-typography-body);fill:var(--hds-ui-colors-black);color:var(--hds-ui-colors-black);cursor:auto;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;line-height:1.4}:is(.hds-theme-posten,.hds-theme-bring) body{background:var(--hds-ui-colors-white)}.hds-button{--hds-component-button-border-width:0px;-webkit-font-smoothing:antialiased;-webkit-appearance:button;box-sizing:border-box;border-radius:var(--hds-border-radius);border-style:solid;border-width:var(--hds-component-button-border-width);transition:all var(--hds-micro-animation-duration-quick)var(--hds-micro-animation-easing-normal);cursor:pointer;word-break:normal;font:var(--hds-typography-body-small-title);display:inline-block}.hds-button.hds-button--small{font-size:var(--hds-font-size-technical-title-max);line-height:var(--hds-line-height-technical-title-max);padding:calc(var(--hds-spacing-small-3) - var(--hds-component-button-border-width))calc(var(--hds-spacing-small-4) - var(--hds-component-button-border-width));height:calc(var(--hds-line-height-technical-title-max) + var(--hds-spacing-small-3)*2)}.hds-button.hds-button--medium{font-size:var(--hds-font-size-body-small-title-max);line-height:var(--hds-line-height-body-small-title-max);padding:calc(var(--hds-spacing-small-3) - var(--hds-component-button-border-width))calc(var(--hds-spacing-medium-1) - var(--hds-component-button-border-width));height:calc(var(--hds-line-height-body-small-title-max) + var(--hds-spacing-small-3)*2)}.hds-button.hds-button--large{font-size:var(--hds-font-size-body-small-title-max);line-height:var(--hds-line-height-body-small-title-max);padding:calc(var(--hds-spacing-small-4) - var(--hds-component-button-border-width))calc(var(--hds-spacing-medium-2) - var(--hds-component-button-border-width));height:calc(var(--hds-line-height-body-small-title-max) + var(--hds-spacing-small-4)*2)}.hds-button.hds-button--full{width:100%}.hds-button.hds-button--mobile-full{width:100%}@media (min-width:720px){.hds-button.hds-button--mobile-full{width:unset}}.hds-button.hds-button--primary{background-color:var(--hds-brand-colors-signature);color:var(--hds-brand-button-colors-text);fill:var(--hds-brand-button-colors-text)}.hds-button.hds-button--primary:hover{background-color:var(--hds-brand-colors-signature-hover);outline:0 solid var(--hds-brand-colors-signature-hover)}.hds-button.hds-button--primary:active{background-color:var(--hds-brand-colors-signature);outline:0 solid var(--hds-brand-colors-signature-hover)}.hds-button.hds-button--secondary{background-color:var(--hds-brand-colors-darker);color:var(--hds-ui-colors-white);fill:var(--hds-ui-colors-white)}.hds-button.hds-button--secondary:hover{background-color:var(--hds-ui-colors-black);outline:0 solid var(--hds-ui-colors-black)}.hds-button.hds-button--secondary:active{background-color:var(--hds-brand-colors-darker);outline:0 solid var(--hds-ui-colors-black)}.hds-button.hds-button--outline-primary{--hds-component-button-border-width:var(--hds-stroke-thick);border-color:var(--hds-brand-colors-signature);color:var(--hds-ui-colors-black);fill:var(--hds-ui-colors-black);outline-offset:3px;background-color:transparent}.hds-button.hds-button--outline-primary:hover{color:var(--hds-brand-colors-dark);fill:var(--hds-brand-colors-dark);border-color:var(--hds-brand-colors-dark)}.hds-button.hds-button--outline-primary:active{color:var(--hds-brand-colors-dark);fill:var(--hds-brand-colors-dark);border-color:var(--hds-brand-colors-dark)}.hds-button.hds-button--outline-secondary{--hds-component-button-border-width:var(--hds-stroke-thick);border-color:var(--hds-brand-colors-darker);color:var(--hds-brand-colors-darker);fill:var(--hds-brand-colors-darker);outline-offset:3px;background-color:transparent}.hds-button.hds-button--outline-secondary:hover{color:var(--hds-ui-colors-black);fill:var(--hds-ui-colors-black);border-color:var(--hds-ui-colors-black)}.hds-button.hds-button--outline-secondary:active{color:var(--hds-ui-colors-black);fill:var(--hds-ui-colors-black);border-color:var(--hds-ui-colors-black)}.hds-button.hds-button--outline-white{--hds-component-button-border-width:var(--hds-stroke-thick);border-color:var(--hds-brand-colors-light);color:var(--hds-ui-colors-white);fill:var(--hds-ui-colors-white);outline-offset:3px;background-color:transparent}.hds-button.hds-button--outline-white:hover{color:var(--hds-brand-colors-light);fill:var(--hds-brand-colors-light)}.hds-button.hds-button--outline-white:active{color:var(--hds-brand-colors-light);fill:var(--hds-brand-colors-light)}.hds-button:disabled.hds-button--primary{color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);background-color:var(--hds-ui-colors-grey);border-color:var(--hds-ui-colors-grey);box-shadow:none;cursor:default;outline:0}.hds-button:disabled.hds-button--secondary{color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);background-color:var(--hds-ui-colors-grey);border-color:var(--hds-ui-colors-grey);box-shadow:none;cursor:default;outline:0}.hds-button:disabled.hds-button--outline-primary{border-color:var(--hds-ui-colors-grey);color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);cursor:default;background-color:transparent}.hds-button:disabled.hds-button--outline-secondary{border-color:var(--hds-ui-colors-grey);color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);cursor:default;background-color:transparent}.hds-button[disabled].hds-button--primary{color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);background-color:var(--hds-ui-colors-grey);border-color:var(--hds-ui-colors-grey);box-shadow:none;cursor:default;outline:0}.hds-button[disabled].hds-button--secondary{color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);background-color:var(--hds-ui-colors-grey);border-color:var(--hds-ui-colors-grey);box-shadow:none;cursor:default;outline:0}.hds-button[disabled].hds-button--outline-primary{border-color:var(--hds-ui-colors-grey);color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);cursor:default;background-color:transparent}.hds-button[disabled].hds-button--outline-secondary{border-color:var(--hds-ui-colors-grey);color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);cursor:default;background-color:transparent}.hds-button[disabled]:active.hds-button--primary{color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);background-color:var(--hds-ui-colors-grey);border-color:var(--hds-ui-colors-grey);box-shadow:none;cursor:default;outline:0}.hds-button[disabled]:active.hds-button--secondary{color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);background-color:var(--hds-ui-colors-grey);border-color:var(--hds-ui-colors-grey);box-shadow:none;cursor:default;outline:0}.hds-button[disabled]:active.hds-button--outline-primary{border-color:var(--hds-ui-colors-grey);color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);cursor:default;background-color:transparent}.hds-button[disabled]:active.hds-button--outline-secondary{border-color:var(--hds-ui-colors-grey);color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);cursor:default;background-color:transparent}.hds-link{border-bottom:var(--hds-stroke-default)solid var(--hds-brand-link-colors-underline);fill:var(--hds-brand-link-colors-text);color:var(--hds-brand-link-colors-text);transition:all var(--hds-micro-animation-duration-quick)var(--hds-micro-animation-easing-normal);cursor:pointer;text-decoration:none}.hds-link:hover{color:var(--hds-brand-link-colors-hover);fill:var(--hds-brand-link-colors-hover);border-color:var(--hds-brand-link-colors-underline-hover)}.hds-link:hover .hds-link__text{border-color:var(--hds-brand-link-colors-underline-hover)}.hds-link:active{color:var(--hds-brand-link-colors-hover);fill:var(--hds-brand-link-colors-hover);border-color:var(--hds-brand-link-colors-underline-hover)}.hds-link:active .hds-link__text{border-color:var(--hds-brand-link-colors-underline-hover)}.hds-link.hds-link--inverted{color:var(--hds-ui-colors-white);-webkit-text-decoration-color:var(--hds-brand-colors-signature);text-decoration-color:var(--hds-brand-colors-signature);border-color:currentColor}.hds-link.hds-link--inverted:hover{color:var(--hds-brand-colors-light);border-color:currentColor}.hds-link.hds-link--inverted:active{color:var(--hds-brand-colors-light);border-color:currentColor}.hds-link.hds-link--inverted:disabled{color:var(--hds-ui-colors-dark-grey);fill:currentColor;cursor:default;border-color:currentColor;box-shadow:none!important;outline:0!important}.hds-link.hds-link--small{font:var(--hds-typography-body-small)}.hds-link.hds-link--large{font:var(--hds-typography-header-h3)}.hds-link.hds-link--no-underline{font-family:var(--hds-fonts-posten-sans-medium);color:var(--hds-brand-colors-dark);border-bottom:none;text-decoration:none}.hds-link.hds-link--no-underline:hover{color:var(--hds-brand-colors-dark);text-decoration:underline;-webkit-text-decoration-color:var(--hds-brand-colors-dark);text-decoration-color:var(--hds-brand-colors-dark);border-bottom:none}.hds-link.hds-link--solid{color:var(--hds-ui-colors-black);border-color:var(--hds-ui-colors-black)}.hds-link.hds-link--solid:hover{color:var(--hds-ui-colors-black-hover);border-color:var(--hds-ui-colors-black-hover)}.hds-link.hds-link--solid:active{color:var(--hds-ui-colors-black-hover);border-color:var(--hds-ui-colors-black-hover)}.hds-badge{border:var(--hds-stroke-default)solid var(--hds-brand-colors-lighter);border-radius:var(--hds-border-radius);text-transform:uppercase;font-size:12px;line-height:1.1;font-family:var(--hds-fonts-posten-sans-medium);-moz-osx-font-smoothing:subpixel-antialiased;-webkit-font-smoothing:subpixel-antialiased;vertical-align:10%;display:inline-block}.hds-badge{padding:var(--hds-spacing-small-1)var(--hds-spacing-small-2)}.hds-badge.hds-badge--small{padding:var(--hds-spacing-small-1)var(--hds-spacing-small-2)}.hds-badge.hds-badge--smaller{padding:2px var(--hds-spacing-small-1)}.hds-badge{background-color:var(--hds-brand-colors-lighter);border-color:var(--hds-brand-colors-lighter);color:var(--hds-brand-colors-dark)}.hds-badge.hds-badge--primary{background-color:var(--hds-brand-colors-lighter);border-color:var(--hds-brand-colors-lighter);color:var(--hds-brand-colors-dark)}.hds-badge.hds-badge--dark{background-color:var(--hds-brand-colors-darker);border-color:var(--hds-brand-colors-darker);color:var(--hds-ui-colors-white)}.hds-badge.hds-badge--white{background-color:var(--hds-ui-colors-white);border-color:var(--hds-ui-colors-white);color:var(--hds-brand-colors-dark)}.hds-badge.hds-badge--warning{background-color:var(--hds-ui-colors-warning-yellow);border-color:var(--hds-ui-colors-warning-yellow);color:var(--hds-brand-link-colors-text)}.hds-description-list{font:var(--hds-typography-body);margin:0;padding-left:0;list-style:none}.hds-description-list dt{font-family:var(--hds-fonts-posten-sans-bold)}.hds-description-list dd{margin-left:0;margin-bottom:var(--hds-spacing-small-3)}.hds-description-list.hds-description-list--horizontal dt{margin-right:var(--hds-spacing-small-1);margin-bottom:var(--hds-spacing-small-2);display:inline-block}.hds-description-list.hds-description-list--horizontal dt:after{content:"\a ";white-space:pre}.hds-description-list.hds-description-list--horizontal dd{display:inline}.hds-description-list.hds-description-list--horizontal dd:after{content:"\a ";white-space:pre}.hds-list{padding-left:var(--hds-spacing-medium-2);margin:0}.hds-list li{margin-bottom:var(--hds-spacing-small-3);position:relative}.hds-list ul{list-style:none}.hds-list ul li:before{content:"";background:var(--hds-brand-colors-dark);border-radius:50%;width:6px;height:6px;margin-left:-22px;position:absolute;top:11px}.hds-list.hds-list--small{font:var(--hds-typography-body-small);padding-left:var(--hds-spacing-medium-1);line-height:1.8}.hds-list.hds-list--small li{margin-bottom:0}.hds-list.hds-list--small li:before{width:5px;height:5px;margin-top:3px;margin-left:-18px;top:9px}.hds-list.hds-list--medium{font:var(--hds-typography-body)}.hds-list.hds-list--large{font:var(--hds-typography-header-h3)}.hds-list.hds-list--large li{margin-bottom:9px}.hds-list.hds-list--large li:before{width:8px;height:8px;margin-left:-24px;top:10px}.hds-list.hds-list--style-hidden{padding-left:0;list-style:none}.hds-typography-h2-display{font:var(--hds-brand-typography-h1-display)}.hds-typography-h1{font:var(--hds-brand-typography-h1)}.hds-typography-h1.hds-typography-h1--spacing{margin-top:var(--hds-spacing-large-2)}.hds-typography-h2{font:var(--hds-brand-typography-h2)}.hds-typography-h2.hds-typography-h2--spacing{margin-top:var(--hds-spacing-large-2)}.hds-typography-h1~.hds-typography-h2.hds-typography-h2--spacing{margin-top:var(--hds-spacing-medium-3)}.hds-typography-h3{font:var(--hds-typography-header-h3)}.hds-typography-h3.hds-typography-h3--title{font:var(--hds-typography-header-h3-title)}.hds-typography-h3.hds-typography-h3--spacing{margin-top:var(--hds-spacing-large-2)}.hds-typography-body{font:var(--hds-typography-body)}.hds-typography-body.hds-typography-body--title{font:var(--hds-typography-body-title)}.hds-typography-body.hds-typography-body--spacing{margin-top:var(--hds-spacing-medium-2)}.hds-typography-body-small{font:var(--hds-typography-body-small)}.hds-typography-body-small.hds-typography-body-small--title{font:var(--hds-typography-body-small-title)}.hds-typography-body-small.hds-typography-body-small--spacing{margin-top:var(--hds-spacing-medium-2)}.hds-typography-caption{font:var(--hds-typography-caption)}.hds-typography-caption.hds-typography-caption--title{font:var(--hds-typography-caption-title)}.hds-typography-caption.hds-typography-caption--spacing{margin-top:var(--hds-spacing-medium-2)}.hds-typography-technical{font:var(--hds-typography-technical)}.hds-typography-technical.hds-typography-technical--title{font:var(--hds-typography-technical-title)}.hds-typography-technical.hds-typography-technical--spacing{margin-top:var(--hds-spacing-small-1)}@media (min-width:940px){.hds-typography-technical.hds-typography-technical--spacing{margin-top:var(--hds-spacing-small-2)}}.hds-box{--hds-component-box-padding:var(--hds-spacing-medium-2);padding:var(--hds-component-box-padding);position:relative}.hds-box{background-color:var(--hds-ui-colors-light-grey-fill)}.hds-box.hds-box--light-grey{background-color:var(--hds-ui-colors-light-grey-fill)}.hds-box.hds-box--lighter{background-color:var(--hds-brand-colors-lighter)}.hds-box.hds-box--white{background-color:var(--hds-ui-colors-white);box-shadow:var(--hds-shadow-default)}.hds-box.hds-box--warning{background-color:var(--hds-ui-colors-warning-yellow)}@media (min-width:720px){.hds-box{--hds-component-box-padding:var(--hds-spacing-medium-3)}}.hds-box.hds-box--closed{display:none}.hds-box .hds-box__close-button{top:var(--hds-spacing-small-4);right:var(--hds-spacing-small-4);cursor:pointer;transition:filter var(--hds-micro-animation-duration-quick)var(--hds-micro-animation-easing-normal);background:url("data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M13.1602 12.25L16.7812 8.66406L17.5195 7.92578C17.625 7.82031 17.625 7.64453 17.5195 7.50391L16.7461 6.73047C16.6055 6.625 16.4297 6.625 16.3242 6.73047L12 11.0898L7.64062 6.73047C7.53516 6.625 7.35938 6.625 7.21875 6.73047L6.44531 7.50391C6.33984 7.64453 6.33984 7.82031 6.44531 7.92578L10.8047 12.25L6.44531 16.6094C6.33984 16.7148 6.33984 16.8906 6.44531 17.0312L7.21875 17.8047C7.35938 17.9102 7.53516 17.9102 7.64062 17.8047L12 13.4453L15.5859 17.0664L16.3242 17.8047C16.4297 17.9102 16.6055 17.9102 16.7461 17.8047L17.5195 17.0312C17.625 16.8906 17.625 16.7148 17.5195 16.6094L13.1602 12.25Z\" fill=\"black\"/></svg>");border:none;width:24px;height:24px;padding:0;position:absolute}.hds-box .hds-box__close-button:hover{-webkit-filter:invert(40%);filter:invert(40%)}.hds-box .hds-box__close-button:focus{box-shadow:0 0 0 2px var(--hds-ui-colors-black-hover);outline:none}.hds-box.hds-message{--hds-component-message-icon-width:var(--hds-spacing-medium-3);--hds-component-message-spacing-between:var(--hds-spacing-small-4);--hds-component-message-padding:var(--hds-component-box-padding);padding-left:calc(var(--hds-component-message-padding) + var(--hds-component-message-icon-width) + var(--hds-component-message-spacing-between))}@media (min-width:720px){.hds-box.hds-message{--hds-component-message-spacing-between:var(--hds-spacing-medium-2)}}.hds-box.hds-message:before{content:"";top:var(--hds-component-message-padding);left:var(--hds-component-message-padding);width:var(--hds-component-message-icon-width);height:var(--hds-component-message-icon-width);position:absolute}.hds-box.hds-message.hds-message--success{background-color:var(--hds-ui-colors-light-grey-fill)}.hds-box.hds-message.hds-message--success:before{background-image:url("data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"32\" height=\"32\" viewBox=\"0 0 32 32\" fill=\"none\"><path d=\"M27.6412 7.54758C28.3713 8.22153 28.3713 9.40094 27.6412 10.0749L13.2636 24.4524C12.5897 25.1825 11.4103 25.1825 10.7363 24.4524L3.54758 17.2637C2.81747 16.5897 2.81747 15.4103 3.54758 14.7363C4.22153 14.0062 5.40094 14.0062 6.07488 14.7363L11.9719 20.6334L25.1139 7.54758C25.7878 6.81747 26.9672 6.81747 27.6412 7.54758Z\" fill=\"%237BC144\"/></svg>")}.hds-box.hds-message.hds-message--attention{background-color:var(--hds-ui-colors-warning-yellow-light-fill)}.hds-box.hds-message.hds-message--attention:before{background-image:url("data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"32\" height=\"32\" viewBox=\"0 0 32 32\" fill=\"none\"><path d=\"M29.0323 23.7656C29.8537 25.2031 28.8269 27 27.1327 27H5.21084C3.51664 27 2.48986 25.2031 3.25994 23.7656L14.2466 5.07812C14.7086 4.35938 15.4274 4 16.1974 4C16.9162 4 17.6349 4.35938 18.097 5.07812L29.0323 23.7656ZM5.72423 24.5357H26.6193L16.1461 6.72098L5.72423 24.5357ZM16.1974 19.7098C17.0702 19.7098 17.789 20.4286 17.789 21.3013C17.789 22.1741 17.0702 22.8929 16.1974 22.8929C15.2733 22.8929 14.5546 22.1741 14.5546 21.3013C14.5546 20.4286 15.2733 19.7098 16.1974 19.7098ZM14.9653 11.8036C14.9653 11.1362 15.4787 10.5714 16.1974 10.5714C16.8649 10.5714 17.4296 11.1362 17.4296 11.8036V16.7321C17.4296 17.4509 16.8649 17.9643 16.1974 17.9643C15.4787 17.9643 14.9653 17.4509 14.9653 16.7321V11.8036Z\" fill=\"black\"/></svg>")}.hds-box.hds-message.hds-message--warning{background-color:var(--hds-ui-colors-warning-yellow)}.hds-box.hds-message.hds-message--warning:before{background-image:url("data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"32\" height=\"32\" viewBox=\"0 0 32 32\" fill=\"none\"><rect x=\"12\" y=\"10\" width=\"8\" height=\"14.6667\" rx=\"4\" fill=\"%23FDBB2F\"/><path d=\"M29.0094 24.7656C29.8308 26.2031 28.804 28 27.1098 28H5.18794C3.49374 28 2.46695 26.2031 3.28838 24.7656L14.275 6.07812C15.0964 4.64062 17.2013 4.64062 18.0741 6.07812L29.0094 24.7656ZM14.9424 11.9821V18.5536C14.9424 19.2723 15.5585 19.7857 16.1745 19.7857C16.842 19.7857 17.4067 19.2723 17.4067 18.5536V11.9821C17.4067 11.3147 16.842 10.75 16.1745 10.75C15.4558 10.75 14.9424 11.3147 14.9424 11.9821ZM16.1745 24.7143C17.0473 24.7143 17.7661 23.9955 17.7661 23.1228C17.7661 22.25 17.0473 21.5312 16.1745 21.5312C15.2504 21.5312 14.5317 22.25 14.5317 23.1228C14.5317 23.9955 15.2504 24.7143 16.1745 24.7143Z\" fill=\"black\"/></svg>")}.hds-box.hds-message.hds-message--neutral{background-color:var(--hds-ui-colors-light-grey-fill)}.hds-box.hds-message.hds-message--neutral .hds-message--neutral__icon{top:var(--hds-component-message-padding);left:var(--hds-component-message-padding);width:var(--hds-component-message-icon-width);position:absolute}.hds-input{gap:var(--hds-spacing-small-1);flex-flow:column;display:flex}.hds-input.hds-input--error .hds-input__input{border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-warning-yellow);margin-bottom:calc(var(--hds-stroke-thick) - var(--hds-stroke-default));position:relative}.hds-input.hds-input--error .hds-input__input:focus{border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-warning-yellow);margin-bottom:calc(var(--hds-stroke-thick) - var(--hds-stroke-default));position:relative}.hds-input.hds-input--lined.hds-input--error .hds-input__input{border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-warning-yellow);margin-bottom:calc(var(--hds-stroke-thick) - var(--hds-stroke-default));position:relative}.hds-input.hds-input--lined.hds-input--error .hds-input__input:focus{border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-warning-yellow);margin-bottom:calc(var(--hds-stroke-thick) - var(--hds-stroke-default));position:relative}.hds-input.hds-input--default .hds-input__input{background-color:var(--hds-ui-colors-light-grey-fill)}.hds-input.hds-input--white .hds-input__input{background-color:var(--hds-ui-colors-white)}.hds-input.hds-input--lined .hds-input__input{border-bottom:var(--hds-stroke-default)solid var(--hds-ui-colors-grey);padding-left:0;padding-top:var(--hds-spacing-small-1);padding-bottom:var(--hds-spacing-small-3);background:0 0;border-radius:0}.hds-input:focus-within .hds-input__label{color:var(--hds-brand-colors-darker)}.hds-input .hds-input__label{transition:color var(--hds-micro-animation-duration-normal)var(--hds-micro-animation-easing-normal);font:var(--hds-typography-caption);order:1}.hds-input .hds-input__input{color:var(--hds-ui-colors-black);padding:var(--hds-spacing-small-4);font:var(--hds-typography-body-small);border:var(--hds-stroke-default)solid transparent;border-radius:var(--hds-border-radius);transition:border margin var(--hds-micro-animation-duration-normal)var(--hds-micro-animation-easing-normal);box-sizing:border-box;order:2;width:100%;line-height:normal;position:relative}.hds-input .hds-input__input::-webkit-input-placeholder{color:var(--hds-ui-colors-dark-grey);opacity:1}.hds-input .hds-input__input::-ms-input-placeholder{color:var(--hds-ui-colors-dark-grey);opacity:1}.hds-input .hds-input__input::placeholder{color:var(--hds-ui-colors-dark-grey);opacity:1}.hds-input .hds-input__input:focus{border-bottom:var(--hds-stroke-default)solid var(--hds-brand-colors-darker);outline:0}.hds-input .hds-input__input:focus::-webkit-input-placeholder{color:var(--hds-ui-colors-grey)}.hds-input .hds-input__input:focus::-ms-input-placeholder{color:var(--hds-ui-colors-grey)}.hds-input .hds-input__input:focus::placeholder{color:var(--hds-ui-colors-grey)}.hds-input .hds-input__input:disabled{color:var(--hds-ui-colors-dark-grey);background-color:var(--hds-ui-colors-grey);border:var(--hds-stroke-default)solid var(--hds-ui-colors-grey)}.hds-input .hds-input__input:read-only{color:var(--hds-ui-colors-dark-grey);background-color:var(--hds-ui-colors-grey);border:var(--hds-stroke-default)solid var(--hds-ui-colors-grey)}.hds-input .hds-input__input:read-only:focus{border-bottom-color:var(--hds-brand-colors-darker)}.hds-input .hds-input__error-message{font:var(--hds-typography-caption-title);color:var(--hds-ui-colors-dark-grey);padding:var(--hds-spacing-small-1)0 0 var(--hds-spacing-small-4);order:3}.hds-accordion{--hds-accordion-icon-dimension:24px;--hds-component-accordion-trigger-spacing-between:var(--hds-spacing-small-4);--hds-component-accordion-content-spacing:var(--hds-spacing-medium-3);border:none;border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-light-grey-fill);font:var(--hds-typography-body);fill:var(--hds-ui-colors-black);color:var(--hds-ui-colors-black);list-style:none;display:block}@media (min-width:720px){.hds-accordion{--hds-component-accordion-content-spacing:var(--hds-spacing-large-1);--hds-component-accordion-trigger-spacing-between:var(--hds-spacing-medium-2)}}.hds-accordion .hds-accordion-item{overflow:hidden}.hds-accordion .hds-accordion-item.hds-accordion-item__expanded .hds-accordion-item-trigger{color:var(--hds-brand-colors-dark)}.hds-accordion .hds-accordion-item:first-child .hds-accordion-item-trigger{border:0}.hds-accordion .hds-accordion-item .hds-accordion-item-trigger{padding:var(--hds-component-accordion-trigger-spacing-between)0;border:0;border-top:var(--hds-stroke-thick)solid var(--hds-ui-colors-light-grey-fill);text-align:left;font:var(--hds-typography-body);background-color:transparent;width:100%;display:block;position:relative}.hds-accordion .hds-accordion-item .hds-accordion-item-trigger:hover{color:var(--hds-brand-colors-dark);outline:0}.hds-accordion .hds-accordion-item .hds-accordion-item-trigger .hds-accordion-item-trigger--icon{color:var(--hds-brand-colors-dark);margin-right:var(--hds-spacing-small-4);width:var(--hds-accordion-icon-dimension);height:var(--hds-accordion-icon-dimension);display:inline-block}.hds-accordion .hds-accordion-item .hds-accordion-item-content{padding:0 0 var(--hds-component-accordion-content-spacing)var(--hds-spacing-medium-4);font:var(--hds-typography-body-small)}.hds-accordion .hds-accordion-item .hds-accordion-item-content.hds-accordion-item-content--closed{display:none}
|
|
2
|
+
/*# sourceMappingURL=./dist/index.css.map */
|
package/dist/index.css.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"ACOA,2PAWE,mFClBF,ikBAmBE,kUAgBA,iFAME,8DAMF,kFAME,gEAMF,iFAME,6DAMF,6BAYE,yBAJF,qCAaA,oMAME,iNAOA,mFAKF,8KAME,4IAMA,kFAKF,0KAME,4HAMA,+KAQA,wEAKF,gMAOE,0IAOF,sMAOE,6MAOA,2RAUF,uOAQE,4QASA,mZC3MJ,oOAQE,4KAME,2HASF,uQAKE,mHAMA,2KAUF,uDAIA,sDAIA,4IAME,uRAQF,0FAIE,oICtEJ,kfAuBE,+EAIA,2DAMA,qJAOA,8IAMA,yIAMA,kKCxDF,uEAIA,uDAGE,oFAKF,uDAGE,oFAIA,wGAKF,wDAGE,uFAIA,oFAKF,qDAGE,sFAIA,yFAKF,iEAGE,wGAIA,qGAKF,2DAGE,+FAIA,+FAKF,+DAGE,qGAIA,kGAIA,yBACE","sources":["index.css","packages/css/src/base.css","packages/css/src/button/button.scss","packages/css/src/link/link.scss","packages/css/src/badge/badge.scss","packages/css/src/typography/typography.css","packages/css/src/index.css"],"sourcesContent":[".hds-theme-posten, .hds-theme-bring {\n box-sizing: border-box;\n font: var(--hds-typography-body);\n fill: var(--hds-ui-colors-black);\n color: var(--hds-ui-colors-black);\n cursor: auto;\n -moz-osx-font-smoothing: grayscale;\n -webkit-font-smoothing: antialiased;\n line-height: 1.4;\n}\n\n:is(.hds-theme-posten, .hds-theme-bring) body {\n background: var(--hds-ui-colors-white);\n}\n\n.hds-button {\n -webkit-font-smoothing: antialiased;\n -webkit-appearance: button;\n box-sizing: border-box;\n padding: var(--hds-spacing-small-3) var(--hds-spacing-medium-2);\n border-radius: var(--hds-border-radius);\n background: var(--hds-ui-colors-grey);\n border-width: 0;\n border-color: var(--hds-ui-colors-grey);\n color: var(--hds-brand-button-colors-text);\n fill: var(--hds-brand-button-colors-text);\n font: var(--hds-typography-body-title);\n transition: all var(--hds-micro-animation-duration-quick) var(--hds-micro-animation-easing-normal);\n text-align: center;\n cursor: pointer;\n word-break: normal;\n display: inline-block;\n}\n\n.hds-button:disabled, .hds-button[disabled], .hds-button[disabled]:active {\n cursor: default;\n color: var(--hds-ui-colors-dark-grey) !important;\n fill: var(--hds-ui-colors-dark-grey) !important;\n background: var(--hds-ui-colors-grey) !important;\n border-color: var(--hds-ui-colors-grey) !important;\n box-shadow: none !important;\n outline: 0 !important;\n}\n\n.hds-button--large {\n height: 58px;\n padding: 16px 24px;\n font-size: 18px;\n line-height: 26px;\n}\n\n.hds-button--large i, .hds-button--large svg {\n margin-right: 12px;\n}\n\n.hds-button--medium {\n height: 50px;\n padding: 12px 20px;\n font-size: 18px;\n line-height: 26px;\n}\n\n.hds-button--medium i, .hds-button--medium svg {\n margin-right: 10px;\n}\n\n.hds-button--small {\n height: 48px;\n padding: 12px 16px;\n font-size: 16px;\n line-height: 24px;\n}\n\n.hds-button--small i, .hds-button--small svg {\n margin-right: 8px;\n}\n\n.hds-button--full {\n width: 100%;\n}\n\n@media (max-width: 720px) {\n .hds-button--mobile-full {\n width: 100%;\n }\n}\n\n.hds-button--primary {\n background: var(--hds-brand-colors-signature);\n border-color: var(--hds-brand-colors-signature);\n color: var(--hds-brand-button-colors-text);\n fill: var(--hds-brand-button-colors-text);\n}\n\n.hds-button--primary:hover, .hds-button--primary:active {\n background: var(--hds-brand-colors-signature-hover);\n border-color: var(--hds-brand-colors-signature);\n outline: 0 solid var(--hds-brand-colors-signature-hover);\n}\n\n.hds-button--primary:active {\n background: var(--hds-brand-colors-signature) !important;\n}\n\n.hds-button--secondary {\n background: var(--hds-brand-colors-darker);\n border-color: var(--hds-brand-colors-darker);\n color: var(--hds-ui-colors-white);\n fill: var(--hds-ui-colors-white);\n}\n\n.hds-button--secondary:hover, .hds-button--secondary:active {\n background: var(--hds-ui-colors-black);\n outline: 0 solid var(--hds-ui-colors-black);\n}\n\n.hds-button--secondary:active {\n background: var(--hds-brand-colors-darker) !important;\n}\n\n.hds-button--outline {\n color: var(--hds-brand-colors-dark);\n fill: var(--hds-brand-colors-dark);\n border: var(--hds-stroke-thick) solid var(--hds-brand-colors-dark);\n background: none;\n}\n\n.hds-button--outline:disabled, .hds-button--outline[disabled], .hds-button--outline[disabled]:active {\n background: none !important;\n}\n\n.hds-button--outline:hover, .hds-button--outline:active {\n color: var(--hds-ui-colors-black);\n fill: var(--hds-ui-colors-black);\n border-color: var(--hds-ui-colors-black);\n background: none;\n}\n\n.hds-button--outline:active {\n border-color: var(--hds-ui-colors-dark-grey);\n}\n\n.hds-button--outline-white {\n border: var(--hds-stroke-thick) solid var(--hds-brand-colors-light);\n color: var(--hds-ui-colors-white);\n fill: var(--hds-ui-colors-white);\n outline-offset: 3px;\n background: none;\n}\n\n.hds-button--outline-white:hover, .hds-button--outline-white:active {\n color: var(--hds-brand-colors-light);\n fill: var(--hds-brand-colors-light);\n}\n\n.hds-button--outline-primary {\n border: var(--hds-stroke-thick) solid var(--hds-brand-colors-signature);\n color: var(--hds-ui-colors-black);\n fill: var(--hds-ui-colors-black);\n outline-offset: 3px;\n background: none;\n}\n\n.hds-button--outline-primary:hover, .hds-button--outline-primary:active {\n color: var(--hds-brand-colors-dark);\n fill: var(--hds-brand-colors-dark);\n border: var(--hds-stroke-thick) solid var(--hds-brand-colors-dark);\n}\n\n.hds-button--outline-primary:disabled, .hds-button--outline-primary[disabled], .hds-button--outline-primary[disabled]:active {\n border: var(--hds-stroke-thick) solid var(--hds-ui-colors-grey);\n color: var(--hds-ui-colors-dark-grey);\n fill: var(--hds-ui-colors-dark-grey);\n background: none !important;\n}\n\n.hds-button--outline-secondary, .hds-button--outline-dark {\n border: var(--hds-stroke-thick) solid var(--hds-brand-colors-darker);\n color: var(--hds-brand-colors-darker);\n fill: var(--hds-brand-colors-darker);\n outline-offset: 3px;\n background: none;\n}\n\n.hds-button--outline-secondary:hover, .hds-button--outline-secondary:active, .hds-button--outline-dark:hover, .hds-button--outline-dark:active {\n color: var(--hds-ui-colors-black);\n fill: var(--hds-ui-colors-black);\n border: var(--hds-stroke-thick) solid var(--hds-ui-colors-black);\n}\n\n.hds-button--outline-secondary:disabled, .hds-button--outline-secondary[disabled], .hds-button--outline-secondary[disabled]:active, .hds-button--outline-dark:disabled, .hds-button--outline-dark[disabled], .hds-button--outline-dark[disabled]:active {\n border: var(--hds-stroke-thick) solid var(--hds-ui-colors-grey);\n color: var(--hds-ui-colors-dark-grey);\n fill: var(--hds-ui-colors-dark-grey);\n background: none !important;\n}\n\n.hds-link {\n border-bottom: var(--hds-stroke-default) solid var(--hds-brand-link-colors-underline);\n fill: var(--hds-brand-link-colors-text);\n color: var(--hds-brand-link-colors-text);\n cursor: pointer;\n text-decoration: none;\n transition: all .1s;\n}\n\n.hds-link:hover, .hds-link:active {\n color: var(--hds-brand-link-colors-hover);\n fill: var(--hds-brand-link-colors-hover);\n border-color: var(--hds-brand-link-colors-underline-hover);\n}\n\n.hds-link:hover .hds-link__text, .hds-link:active .hds-link__text {\n border-color: var(--hds-brand-link-colors-underline-hover);\n}\n\n.hds-link--inverted {\n color: var(--hds-ui-colors-white);\n -webkit-text-decoration-color: var(--hds-brand-colors-signature);\n text-decoration-color: var(--hds-brand-colors-signature);\n border-color: currentColor;\n}\n\n.hds-link--inverted:hover, .hds-link--inverted:active {\n color: var(--hds-brand-colors-light);\n border-color: currentColor;\n}\n\n.hds-link--inverted:disabled {\n color: var(--hds-ui-colors-dark-grey);\n fill: currentColor;\n cursor: default;\n border-color: currentColor;\n box-shadow: none !important;\n outline: 0 !important;\n}\n\n.hds-link--small {\n font: var(--hds-typography-body-small);\n}\n\n.hds-link--large {\n font: var(--hds-typography-header-h3);\n}\n\n.hds-link--no-underline {\n font: var(--hds-fonts-posten-sans-medium);\n color: var(--hds-brand-colors-dark);\n border-bottom: none;\n text-decoration: none;\n}\n\n.hds-link--no-underline:hover {\n color: var(--hds-brand-colors-dark);\n text-decoration: underline;\n -webkit-text-decoration-color: var(--hds-brand-colors-dark);\n text-decoration-color: var(--hds-brand-colors-dark);\n border-bottom: none;\n}\n\n.hds-link--solid {\n color: var(--hds-ui-colors-black);\n border-color: var(--hds-ui-colors-black);\n}\n\n.hds-link--solid:hover, .hds-link--solid:active {\n color: var(--hds-ui-colors-black-hover);\n border-color: var(--hds-ui-colors-black-hover);\n}\n\n.hds-badge {\n background-color: var(--hds-brand-colors-lighter);\n border: var(--hds-stroke-default) solid var(--hds-brand-colors-lighter);\n border-radius: var(--hds-border-radius);\n padding: var(--hds-spacing-small-1) var(--hds-spacing-small-2);\n color: var(--hds-brand-colors-dark);\n text-transform: uppercase;\n font-size: 12px;\n line-height: 1.1;\n font-family: var(--hds-fonts-posten-sans-medium);\n -moz-osx-font-smoothing: subpixel-antialiased;\n -webkit-font-smoothing: subpixel-antialiased;\n vertical-align: 10%;\n display: inline-block;\n}\n\n.hds-badge--small {\n padding: var(--hds-spacing-small-1) var(--hds-spacing-small-2);\n}\n\n.hds-badge--smaller {\n padding: 2px var(--hds-spacing-small-1);\n}\n\n.hds-badge--primary {\n background-color: var(--hds-brand-colors-lighter);\n border-color: var(--hds-brand-colors-lighter);\n color: var(--hds-brand-colors-dark);\n}\n\n.hds-badge--dark {\n background-color: var(--hds-brand-colors-darker);\n border-color: var(--hds-brand-colors-darker);\n color: var(--hds-ui-colors-white);\n}\n\n.hds-badge--white {\n background-color: var(--hds-ui-colors-white);\n border-color: var(--hds-ui-colors-white);\n color: var(--hds-brand-colors-dark);\n}\n\n.hds-badge--warning {\n background-color: var(--hds-ui-colors-warning-yellow);\n border-color: var(--hds-ui-colors-warning-yellow);\n color: var(--hds-brand-link-colors-text);\n}\n\n.hds-typography-h2-display {\n font: var(--hds-brand-typography-h1-display);\n}\n\n.hds-typography-h1 {\n font: var(--hds-brand-typography-h1);\n}\n\n.hds-typography-h1.hds-typography-h1--spacing {\n margin-top: var(--hds-spacing-large-2);\n}\n\n.hds-typography-h2 {\n font: var(--hds-brand-typography-h2);\n}\n\n.hds-typography-h2.hds-typography-h2--spacing {\n margin-top: var(--hds-spacing-large-2);\n}\n\n.hds-typography-h1 ~ .hds-typography-h2.hds-typography-h2--spacing {\n margin-top: var(--hds-spacing-medium-3);\n}\n\n.hds-typography-h3 {\n font: var(--hds-typography-header-h3);\n}\n\n.hds-typography-h3.hds-typography-h3--title {\n font: var(--hds-typography-header-h3-title);\n}\n\n.hds-typography-h3.hds-typography-h3--spacing {\n margin-top: var(--hds-spacing-large-2);\n}\n\n.hds-typography-body {\n font: var(--hds-typography-body);\n}\n\n.hds-typography-body.hds-typography-body--title {\n font: var(--hds-typography-body-title);\n}\n\n.hds-typography-body.hds-typography-body--spacing {\n margin-top: var(--hds-spacing-medium-2);\n}\n\n.hds-typography-body-small {\n font: var(--hds-typography-body-small);\n}\n\n.hds-typography-body-small.hds-typography-body-small--title {\n font: var(--hds-typography-body-small-title);\n}\n\n.hds-typography-body-small.hds-typography-body-small--spacing {\n margin-top: var(--hds-spacing-medium-2);\n}\n\n.hds-typography-caption {\n font: var(--hds-typography-caption);\n}\n\n.hds-typography-caption.hds-typography-caption--title {\n font: var(--hds-typography-caption-title);\n}\n\n.hds-typography-caption.hds-typography-caption--spacing {\n margin-top: var(--hds-spacing-medium-2);\n}\n\n.hds-typography-technical {\n font: var(--hds-typography-technical);\n}\n\n.hds-typography-technical.hds-typography-technical--title {\n font: var(--hds-typography-technical-title);\n}\n\n.hds-typography-technical.hds-typography-technical--spacing {\n margin-top: var(--hds-spacing-small-1);\n}\n\n@media (min-width: 940px) {\n .hds-typography-technical.hds-typography-technical--spacing {\n margin-top: var(--hds-spacing-small-2);\n }\n}\n\n\n\n/*# sourceMappingURL=index.css.map */\n","/*\n * Based on hedwig global css\n * https://github.com/bring/hedwig/blob/master/src/shared/base/body.css\n *\n * Scoped to the theme selectors, this way the global effects are only applied\n * where they are wanted\n */\n.hds-theme-posten,\n.hds-theme-bring {\n box-sizing: border-box;\n font: var(--hds-typography-body);\n fill: var(--hds-ui-colors-black);\n color: var(--hds-ui-colors-black);\n line-height: 1.4;\n cursor: auto;\n -moz-osx-font-smoothing: grayscale;\n -webkit-font-smoothing: antialiased;\n\n & body {\n background: var(--hds-ui-colors-white);\n }\n}\n",".hds-button {\n -webkit-font-smoothing: antialiased;\n /* stylelint-disable-next-line property-no-vendor-prefix -- Not sure if we need this or not 🤷 */\n -webkit-appearance: button;\n box-sizing: border-box;\n display: inline-block;\n padding: var(--hds-spacing-small-3) var(--hds-spacing-medium-2);\n border-radius: var(--hds-border-radius);\n border-width: 0;\n background: var(--hds-ui-colors-grey);\n border-color: var(--hds-ui-colors-grey);\n color: var(--hds-brand-button-colors-text);\n fill: var(--hds-brand-button-colors-text);\n font: var(--hds-typography-body-title);\n transition: all var(--hds-micro-animation-duration-quick) var(--hds-micro-animation-easing-normal);\n text-align: center; /* Center text when this is an <a> */\n cursor: pointer;\n word-break: normal;\n\n &:disabled,\n &[disabled],\n &[disabled]:active {\n color: var(--hds-ui-colors-dark-grey) !important;\n fill: var(--hds-ui-colors-dark-grey) !important;\n background: var(--hds-ui-colors-grey) !important;\n border-color: var(--hds-ui-colors-grey) !important;\n outline: 0 !important;\n box-shadow: none !important;\n cursor: default;\n }\n\n /**\n * Modifiers: sizes\n */\n\n &--large {\n font-size: 18px; /* TODO Token: typography-body minimum value */\n line-height: 26px;\n height: 58px;\n padding: 16px 24px;\n\n i,\n svg {\n margin-right: 12px;\n }\n }\n\n &--medium {\n font-size: 18px; /* TODO Token: typography-body minimum value */\n line-height: 26px;\n height: 50px;\n padding: 12px 20px;\n\n i,\n svg {\n margin-right: 10px;\n }\n }\n\n &--small {\n font-size: 16px; /* TODO Token: typography-body-small minimum value */\n line-height: 24px;\n height: 48px;\n padding: 12px 16px;\n\n i,\n svg {\n margin-right: 8px;\n }\n }\n\n &--full {\n width: 100%;\n }\n\n /**\n * Responsive modifiers\n */\n\n &--mobile-full {\n // TODO: Currently hardcoded due to css variables not available in media queries\n // Would be: --hds-breakpoints-medium\n // 🤷\n @media (max-width: 720px) {\n width: 100%;\n }\n }\n\n /**\n * Modifiers: types\n */\n\n &--primary {\n background: var(--hds-brand-colors-signature);\n border-color: var(--hds-brand-colors-signature);\n color: var(--hds-brand-button-colors-text);\n fill: var(--hds-brand-button-colors-text);\n\n &:hover,\n &:active {\n background: var(--hds-brand-colors-signature-hover);\n border-color: var(--hds-brand-colors-signature);\n outline: 0 solid var(--hds-brand-colors-signature-hover);\n }\n\n &:active {\n background: var(--hds-brand-colors-signature) !important;\n }\n }\n\n &--secondary {\n background: var(--hds-brand-colors-darker);\n border-color: var(--hds-brand-colors-darker);\n color: var(--hds-ui-colors-white);\n fill: var(--hds-ui-colors-white);\n\n &:hover,\n &:active {\n background: var(--hds-ui-colors-black);\n outline: 0 solid var(--hds-ui-colors-black);\n }\n\n &:active {\n background: var(--hds-brand-colors-darker) !important;\n }\n }\n\n &--outline {\n background: transparent;\n color: var(--hds-brand-colors-dark);\n fill: var(--hds-brand-colors-dark);\n border: var(--hds-stroke-thick) solid var(--hds-brand-colors-dark);\n\n &:disabled,\n &[disabled],\n &[disabled]:active {\n background: none !important;\n }\n\n &:hover,\n &:active {\n color: var(--hds-ui-colors-black);\n fill: var(--hds-ui-colors-black);\n border-color: var(--hds-ui-colors-black);\n background: none;\n }\n\n &:active {\n border-color: var(--hds-ui-colors-dark-grey);\n }\n }\n\n &--outline-white {\n background: transparent;\n border: var(--hds-stroke-thick) solid var(--hds-brand-colors-light);\n color: var(--hds-ui-colors-white);\n fill: var(--hds-ui-colors-white);\n outline-offset: 3px;\n\n &:hover,\n &:active {\n color: var(--hds-brand-colors-light);\n fill: var(--hds-brand-colors-light);\n }\n }\n\n &--outline-primary {\n background: transparent;\n border: var(--hds-stroke-thick) solid var(--hds-brand-colors-signature);\n color: var(--hds-ui-colors-black);\n fill: var(--hds-ui-colors-black);\n outline-offset: 3px;\n\n &:hover,\n &:active {\n color: var(--hds-brand-colors-dark);\n fill: var(--hds-brand-colors-dark);\n border: var(--hds-stroke-thick) solid var(--hds-brand-colors-dark);\n }\n\n &:disabled,\n &[disabled],\n &[disabled]:active {\n border: var(--hds-stroke-thick) solid var(--hds-ui-colors-grey);\n color: var(--hds-ui-colors-dark-grey);\n fill: var(--hds-ui-colors-dark-grey);\n background: transparent !important;\n }\n }\n\n &--outline-secondary,\n &--outline-dark {\n background: transparent;\n border: var(--hds-stroke-thick) solid var(--hds-brand-colors-darker);\n color: var(--hds-brand-colors-darker);\n fill: var(--hds-brand-colors-darker);\n outline-offset: 3px;\n\n &:hover,\n &:active {\n color: var(--hds-ui-colors-black);\n fill: var(--hds-ui-colors-black);\n border: var(--hds-stroke-thick) solid var(--hds-ui-colors-black);\n\n /* outline: 0px solid var(--hds-ui-colors-white); */\n }\n\n &:disabled,\n &[disabled],\n &[disabled]:active {\n border: var(--hds-stroke-thick) solid var(--hds-ui-colors-grey);\n color: var(--hds-ui-colors-dark-grey);\n fill: var(--hds-ui-colors-dark-grey);\n background: transparent !important;\n }\n }\n}\n","/**\n * Block\n */\n\n.hds-link {\n text-decoration: none;\n border-bottom: var(--hds-stroke-default) solid var(--hds-brand-link-colors-underline);\n fill: var(--hds-brand-link-colors-text);\n color: var(--hds-brand-link-colors-text);\n transition: all 0.1s ease;\n cursor: pointer;\n\n &:hover,\n &:active {\n color: var(--hds-brand-link-colors-hover);\n fill: var(--hds-brand-link-colors-hover);\n border-color: var(--hds-brand-link-colors-underline-hover);\n\n & .hds-link__text {\n border-color: var(--hds-brand-link-colors-underline-hover);\n }\n }\n\n /**\n * Modifers\n */\n\n &--inverted {\n color: var(--hds-ui-colors-white);\n text-decoration-color: var(--hds-brand-colors-signature);\n border-color: currentcolor;\n\n &:hover,\n &:active {\n color: var(--hds-brand-colors-light);\n border-color: currentcolor;\n }\n\n &:disabled {\n color: var(--hds-ui-colors-dark-grey);\n fill: currentcolor;\n border-color: currentcolor;\n outline: 0 !important;\n box-shadow: none !important;\n cursor: default;\n }\n }\n\n &--small {\n font: var(--hds-typography-body-small);\n }\n\n &--large {\n font: var(--hds-typography-header-h3);\n }\n\n &--no-underline {\n font: var(--hds-fonts-posten-sans-medium);\n color: var(--hds-brand-colors-dark);\n text-decoration: none;\n border-bottom: none;\n\n &:hover {\n color: var(--hds-brand-colors-dark);\n text-decoration: underline;\n text-decoration-color: var(--hds-brand-colors-dark);\n border-bottom: none;\n }\n }\n\n &--solid {\n color: var(--hds-ui-colors-black);\n border-color: var(--hds-ui-colors-black);\n\n &:hover,\n &:active {\n color: var(--hds-ui-colors-black-hover);\n border-color: var(--hds-ui-colors-black-hover);\n }\n }\n}\n","/**\n * Block\n */\n\n.hds-badge {\n display: inline-block;\n background-color: var(--hds-brand-colors-lighter);\n border: var(--hds-stroke-default) solid var(--hds-brand-colors-lighter);\n border-radius: var(--hds-border-radius);\n padding: var(--hds-spacing-small-1) var(--hds-spacing-small-2);\n color: var(--hds-brand-colors-dark);\n text-transform: uppercase;\n line-height: 1.1;\n font-size: 12px; /* For now, this might be changed later */\n font-family: var(--hds-fonts-posten-sans-medium);\n -moz-osx-font-smoothing: subpixel-antialiased;\n -webkit-font-smoothing: subpixel-antialiased;\n vertical-align: 10%;\n\n /**\n * Modifiers\n */\n\n /* Variations */\n\n /* Size variations */\n\n &--small {\n padding: var(--hds-spacing-small-1) var(--hds-spacing-small-2);\n }\n\n &--smaller {\n padding: 2px var(--hds-spacing-small-1);\n }\n\n /* Color variations */\n\n &--primary {\n /* Default */\n background-color: var(--hds-brand-colors-lighter);\n border-color: var(--hds-brand-colors-lighter);\n color: var(--hds-brand-colors-dark);\n }\n\n &--dark {\n background-color: var(--hds-brand-colors-darker);\n border-color: var(--hds-brand-colors-darker);\n color: var(--hds-ui-colors-white);\n }\n\n &--white {\n background-color: var(--hds-ui-colors-white);\n border-color: var(--hds-ui-colors-white);\n color: var(--hds-brand-colors-dark);\n }\n\n &--warning {\n background-color: var(--hds-ui-colors-warning-yellow);\n border-color: var(--hds-ui-colors-warning-yellow);\n color: var(--hds-brand-link-colors-text);\n }\n}\n",".hds-typography-h2-display {\n font: var(--hds-brand-typography-h1-display);\n}\n\n.hds-typography-h1 {\n font: var(--hds-brand-typography-h1);\n\n &.hds-typography-h1--spacing {\n margin-top: var(--hds-spacing-large-2);\n }\n}\n\n.hds-typography-h2 {\n font: var(--hds-brand-typography-h2);\n\n &.hds-typography-h2--spacing {\n margin-top: var(--hds-spacing-large-2);\n }\n\n .hds-typography-h1 ~ &.hds-typography-h2--spacing {\n margin-top: var(--hds-spacing-medium-3);\n }\n}\n\n.hds-typography-h3 {\n font: var(--hds-typography-header-h3);\n\n &.hds-typography-h3--title {\n font: var(--hds-typography-header-h3-title);\n }\n\n &.hds-typography-h3--spacing {\n margin-top: var(--hds-spacing-large-2);\n }\n}\n\n.hds-typography-body {\n font: var(--hds-typography-body);\n\n &.hds-typography-body--title {\n font: var(--hds-typography-body-title);\n }\n\n &.hds-typography-body--spacing {\n margin-top: var(--hds-spacing-medium-2);\n }\n}\n\n.hds-typography-body-small {\n font: var(--hds-typography-body-small);\n\n &.hds-typography-body-small--title {\n font: var(--hds-typography-body-small-title);\n }\n\n &.hds-typography-body-small--spacing {\n margin-top: var(--hds-spacing-medium-2);\n }\n}\n\n.hds-typography-caption {\n font: var(--hds-typography-caption);\n\n &.hds-typography-caption--title {\n font: var(--hds-typography-caption-title);\n }\n\n &.hds-typography-caption--spacing {\n margin-top: var(--hds-spacing-medium-2);\n }\n}\n\n.hds-typography-technical {\n font: var(--hds-typography-technical);\n\n &.hds-typography-technical--title {\n font: var(--hds-typography-technical-title);\n }\n\n &.hds-typography-technical--spacing {\n margin-top: var(--hds-spacing-small-1);\n }\n\n @media (min-width: 940px) {\n &.hds-typography-technical--spacing {\n margin-top: var(--hds-spacing-small-2);\n }\n }\n}\n","@import url(\"base.css\");\n@import url(\"button/button.scss\");\n@import url(\"link/link.scss\");\n@import url(\"badge/badge.scss\");\n@import url(\"typography/typography.css\");\n"],"names":[],"version":3,"file":"index.css.map"}
|
|
1
|
+
{"version":3,"mappings":"ACOA,2PAWE,mFClBF,0bAmBE,8XAQA,mYAQA,kYAYA,wCAIA,+CAGE,yBAA2B,iDAS7B,sKAKE,uJAKA,kJAMF,mJAKE,+HAKA,oIAMF,oQASE,6JAAA,8JAQF,2QASE,yJAAA,0JAQF,8PASE,mHAAA,oHAcA,6OAAA,+OAWA,6MAAA,+MAXA,8OAAA,gPAWA,8MAAA,gNAXA,qPAAA,uPAWA,qNAAA,uNC/JJ,kTAQE,2JAME,0FANF,4JAME,2FASF,gNAKE,iGAAA,kGAMA,oLAUF,gEAIA,+DAIA,4JAME,qOAQF,mGAIE,qHAAA,sHCtEJ,iWAcE,wEAAA,yFAKA,qEAMA,4IAAA,+JAOA,wJAMA,mJAMA,4KChDF,8FAME,uEAIA,gFAME,gKAKE,8FAMF,yEAGE,8FC9BN,4DAIE,wEAKA,6BAII,8JAaJ,yHAKE,6CAGE,kGAUJ,2DAIA,+DAGE,+CAGE,oFASJ,gEC/DF,uEAIA,uDAGE,oFAKF,uDAGE,oFAIA,wGAKF,wDAGE,uFAIA,oFAKF,qDAGE,sFAIA,yFAKF,iEAGE,wGAIA,qGAKF,2DAGE,+FAIA,+FAKF,+DAGE,qGAIA,kGAIA,yBACE,mGCpFJ,4HAGE,+DAAA,mFAKA,2EAIA,yGAKA,+EAOA,yBAA2B,kEAO3B,sCASF,yhCAmBE,oFAKA,yGChEF,yWAIE,yBAA2B,0FAa3B,yOASA,gGAGE,8iBAKF,4GAGE,06BAKF,+FAGE,25BAKF,gGAIE,yNCtDJ,wEAOI,uNAAA,6NAAA,wOAAA,8OASA,sGAMA,0FAMA,oPAUF,+EAIA,4KAOA,0ZAgBE,uGAAA,mGAAA,yFAKA,yHAIE,8FAAA,0FAAA,gFAKF,sLAAA,uLASA,gGAKF,4LC7FF,iaAKE,yBAA2B,mKAa3B,mDAGE,+HAIA,oFAIA,6UAWE,kHAKA,sRASF,2LAIE","sources":["src/index.css","src/base.css","src/button/button.css","src/link/link.css","src/badge/badge.css","src/list/description-list.css","src/list/list.css","src/typography/typography.css","src/box/box.css","src/message/message.css","src/input/input.css","src/accordion/accordion.css"],"sourcesContent":["@import url(\"base.css\");\n@import url(\"button/button.css\");\n@import url(\"link/link.css\");\n@import url(\"badge/badge.css\");\n@import url(\"list/description-list.css\");\n@import url(\"list/list.css\");\n@import url(\"typography/typography.css\");\n@import url(\"box/box.css\");\n@import url(\"message/message.css\");\n@import url(\"input/input.css\");\n@import url(\"accordion/accordion.css\");\n","/*\n * Based on hedwig global css\n * https://github.com/bring/hedwig/blob/master/src/shared/base/body.css\n *\n * Scoped to the theme selectors, this way the global effects are only applied\n * where they are wanted\n */\n.hds-theme-posten,\n.hds-theme-bring {\n box-sizing: border-box;\n font: var(--hds-typography-body);\n fill: var(--hds-ui-colors-black);\n color: var(--hds-ui-colors-black);\n line-height: 1.4;\n cursor: auto;\n -moz-osx-font-smoothing: grayscale;\n -webkit-font-smoothing: antialiased;\n\n & body {\n background: var(--hds-ui-colors-white);\n }\n}\n",".hds-button {\n --hds-component-button-border-width: 0px;\n\n -webkit-font-smoothing: antialiased;\n /* stylelint-disable-next-line property-no-vendor-prefix -- Not sure if we need this or not 🤷 */\n -webkit-appearance: button;\n box-sizing: border-box;\n display: inline-block;\n border-style: solid;\n border-radius: var(--hds-border-radius);\n border-width: var(--hds-component-button-border-width);\n transition: all var(--hds-micro-animation-duration-quick) var(--hds-micro-animation-easing-normal);\n cursor: pointer;\n word-break: normal;\n font: var(--hds-typography-body-small-title);\n\n /**\n * Modifiers: sizes\n */\n &.hds-button--small {\n font-size: var(--hds-font-size-technical-title-max);\n line-height: var(--hds-line-height-technical-title-max);\n padding: calc(var(--hds-spacing-small-3) - var(--hds-component-button-border-width))\n calc(var(--hds-spacing-small-4) - var(--hds-component-button-border-width));\n height: calc(var(--hds-line-height-technical-title-max) + var(--hds-spacing-small-3) * 2);\n }\n\n &.hds-button--medium {\n font-size: var(--hds-font-size-body-small-title-max);\n line-height: var(--hds-line-height-body-small-title-max);\n padding: calc(var(--hds-spacing-small-3) - var(--hds-component-button-border-width))\n calc(var(--hds-spacing-medium-1) - var(--hds-component-button-border-width));\n height: calc(var(--hds-line-height-body-small-title-max) + var(--hds-spacing-small-3) * 2);\n }\n\n &.hds-button--large {\n font-size: var(--hds-font-size-body-small-title-max);\n line-height: var(--hds-line-height-body-small-title-max);\n padding: calc(var(--hds-spacing-small-4) - var(--hds-component-button-border-width))\n calc(var(--hds-spacing-medium-2) - var(--hds-component-button-border-width));\n height: calc(var(--hds-line-height-body-small-title-max) + var(--hds-spacing-small-4) * 2);\n }\n\n /**\n * Modifiers: Width\n */\n\n &.hds-button--full {\n width: 100%;\n }\n\n &.hds-button--mobile-full {\n width: 100%;\n\n @media (min-width: 720px) {\n width: unset;\n }\n }\n\n /**\n * Modifiers: Variants\n */\n\n &.hds-button--primary {\n background-color: var(--hds-brand-colors-signature);\n color: var(--hds-brand-button-colors-text);\n fill: var(--hds-brand-button-colors-text);\n\n &:hover {\n background-color: var(--hds-brand-colors-signature-hover);\n outline: 0 solid var(--hds-brand-colors-signature-hover);\n }\n\n &:active {\n background-color: var(--hds-brand-colors-signature);\n outline: 0 solid var(--hds-brand-colors-signature-hover);\n }\n }\n\n &.hds-button--secondary {\n background-color: var(--hds-brand-colors-darker);\n color: var(--hds-ui-colors-white);\n fill: var(--hds-ui-colors-white);\n\n &:hover {\n background-color: var(--hds-ui-colors-black);\n outline: 0 solid var(--hds-ui-colors-black);\n }\n\n &:active {\n background-color: var(--hds-brand-colors-darker);\n outline: 0 solid var(--hds-ui-colors-black);\n }\n }\n\n &.hds-button--outline-primary {\n --hds-component-button-border-width: var(--hds-stroke-thick);\n\n background-color: transparent;\n border-color: var(--hds-brand-colors-signature);\n color: var(--hds-ui-colors-black);\n fill: var(--hds-ui-colors-black);\n outline-offset: 3px;\n\n &:hover,\n &:active {\n color: var(--hds-brand-colors-dark);\n fill: var(--hds-brand-colors-dark);\n border-color: var(--hds-brand-colors-dark);\n }\n }\n\n &.hds-button--outline-secondary {\n --hds-component-button-border-width: var(--hds-stroke-thick);\n\n background-color: transparent;\n border-color: var(--hds-brand-colors-darker);\n color: var(--hds-brand-colors-darker);\n fill: var(--hds-brand-colors-darker);\n outline-offset: 3px;\n\n &:hover,\n &:active {\n color: var(--hds-ui-colors-black);\n fill: var(--hds-ui-colors-black);\n border-color: var(--hds-ui-colors-black);\n }\n }\n\n &.hds-button--outline-white {\n --hds-component-button-border-width: var(--hds-stroke-thick);\n\n background-color: transparent;\n border-color: var(--hds-brand-colors-light);\n color: var(--hds-ui-colors-white);\n fill: var(--hds-ui-colors-white);\n outline-offset: 3px;\n\n &:hover,\n &:active {\n color: var(--hds-brand-colors-light);\n fill: var(--hds-brand-colors-light);\n }\n }\n\n /**\n * State: Disabled\n */\n\n &:disabled,\n &[disabled],\n &[disabled]:active {\n &.hds-button--primary,\n &.hds-button--secondary {\n color: var(--hds-ui-colors-dark-grey);\n fill: var(--hds-ui-colors-dark-grey);\n background-color: var(--hds-ui-colors-grey);\n border-color: var(--hds-ui-colors-grey);\n outline: 0;\n box-shadow: none;\n cursor: default;\n }\n\n &.hds-button--outline-primary,\n &.hds-button--outline-secondary {\n border-color: var(--hds-ui-colors-grey);\n color: var(--hds-ui-colors-dark-grey);\n fill: var(--hds-ui-colors-dark-grey);\n background-color: transparent;\n cursor: default;\n }\n }\n}\n","/**\n * Block\n */\n\n.hds-link {\n text-decoration: none;\n border-bottom: var(--hds-stroke-default) solid var(--hds-brand-link-colors-underline);\n fill: var(--hds-brand-link-colors-text);\n color: var(--hds-brand-link-colors-text);\n transition: all var(--hds-micro-animation-duration-quick) var(--hds-micro-animation-easing-normal);\n cursor: pointer;\n\n &:hover,\n &:active {\n color: var(--hds-brand-link-colors-hover);\n fill: var(--hds-brand-link-colors-hover);\n border-color: var(--hds-brand-link-colors-underline-hover);\n\n & .hds-link__text {\n border-color: var(--hds-brand-link-colors-underline-hover);\n }\n }\n\n /**\n * Modifers\n */\n\n &.hds-link--inverted {\n color: var(--hds-ui-colors-white);\n text-decoration-color: var(--hds-brand-colors-signature);\n border-color: currentcolor;\n\n &:hover,\n &:active {\n color: var(--hds-brand-colors-light);\n border-color: currentcolor;\n }\n\n &:disabled {\n color: var(--hds-ui-colors-dark-grey);\n fill: currentcolor;\n border-color: currentcolor;\n outline: 0 !important;\n box-shadow: none !important;\n cursor: default;\n }\n }\n\n &.hds-link--small {\n font: var(--hds-typography-body-small);\n }\n\n &.hds-link--large {\n font: var(--hds-typography-header-h3);\n }\n\n &.hds-link--no-underline {\n font-family: var(--hds-fonts-posten-sans-medium);\n color: var(--hds-brand-colors-dark);\n text-decoration: none;\n border-bottom: none;\n\n &:hover {\n color: var(--hds-brand-colors-dark);\n text-decoration: underline;\n text-decoration-color: var(--hds-brand-colors-dark);\n border-bottom: none;\n }\n }\n\n &.hds-link--solid {\n color: var(--hds-ui-colors-black);\n border-color: var(--hds-ui-colors-black);\n\n &:hover,\n &:active {\n color: var(--hds-ui-colors-black-hover);\n border-color: var(--hds-ui-colors-black-hover);\n }\n }\n}\n","/**\n * Block\n */\n\n.hds-badge {\n display: inline-block;\n border: var(--hds-stroke-default) solid var(--hds-brand-colors-lighter);\n border-radius: var(--hds-border-radius);\n text-transform: uppercase;\n line-height: 1.1;\n font-size: 12px; /* For now, this might be changed later */\n font-family: var(--hds-fonts-posten-sans-medium);\n -moz-osx-font-smoothing: subpixel-antialiased;\n -webkit-font-smoothing: subpixel-antialiased;\n vertical-align: 10%;\n\n /* Size variations */\n\n &, /* Default */\n &.hds-badge--small {\n padding: var(--hds-spacing-small-1) var(--hds-spacing-small-2);\n }\n\n &.hds-badge--smaller {\n padding: 2px var(--hds-spacing-small-1);\n }\n\n /* Color variations */\n\n &, /* Default */\n &.hds-badge--primary {\n background-color: var(--hds-brand-colors-lighter);\n border-color: var(--hds-brand-colors-lighter);\n color: var(--hds-brand-colors-dark);\n }\n\n &.hds-badge--dark {\n background-color: var(--hds-brand-colors-darker);\n border-color: var(--hds-brand-colors-darker);\n color: var(--hds-ui-colors-white);\n }\n\n &.hds-badge--white {\n background-color: var(--hds-ui-colors-white);\n border-color: var(--hds-ui-colors-white);\n color: var(--hds-brand-colors-dark);\n }\n\n &.hds-badge--warning {\n background-color: var(--hds-ui-colors-warning-yellow);\n border-color: var(--hds-ui-colors-warning-yellow);\n color: var(--hds-brand-link-colors-text);\n }\n}\n",".hds-description-list {\n list-style: none;\n margin: 0;\n padding-left: 0;\n font: var(--hds-typography-body);\n\n & dt {\n font-family: var(--hds-fonts-posten-sans-bold);\n }\n\n & dd {\n margin-left: 0;\n margin-bottom: var(--hds-spacing-small-3);\n }\n\n &.hds-description-list--horizontal {\n & dt {\n display: inline-block;\n margin-right: var(--hds-spacing-small-1);\n margin-bottom: var(--hds-spacing-small-2);\n\n &::after {\n content: \"\\a\";\n white-space: pre;\n }\n }\n\n & dd {\n display: inline;\n\n &::after {\n content: \"\\a\";\n white-space: pre;\n }\n }\n }\n}\n",".hds-list {\n margin: 0;\n padding-left: var(--hds-spacing-medium-2);\n\n & li {\n margin-bottom: var(--hds-spacing-small-3);\n position: relative;\n }\n\n & ul {\n list-style: none;\n\n & li {\n &::before {\n content: \"\";\n position: absolute;\n background: var(--hds-brand-colors-dark);\n width: 6px;\n height: 6px;\n margin-left: -22px;\n border-radius: 50%;\n top: 11px;\n }\n }\n }\n\n &.hds-list--small {\n font: var(--hds-typography-body-small);\n line-height: 1.8;\n padding-left: var(--hds-spacing-medium-1);\n\n & li {\n margin-bottom: 0;\n\n &::before {\n width: 5px;\n height: 5px;\n margin-left: -18px;\n margin-top: 3px;\n top: 9px;\n }\n }\n }\n\n &.hds-list--medium {\n font: var(--hds-typography-body);\n }\n\n &.hds-list--large {\n font: var(--hds-typography-header-h3);\n\n & li {\n margin-bottom: 9px;\n\n &::before {\n width: 8px;\n height: 8px;\n margin-left: -24px;\n top: 10px;\n }\n }\n }\n\n &.hds-list--style-hidden {\n list-style: none;\n padding-left: 0;\n }\n}\n",".hds-typography-h2-display {\n font: var(--hds-brand-typography-h1-display);\n}\n\n.hds-typography-h1 {\n font: var(--hds-brand-typography-h1);\n\n &.hds-typography-h1--spacing {\n margin-top: var(--hds-spacing-large-2);\n }\n}\n\n.hds-typography-h2 {\n font: var(--hds-brand-typography-h2);\n\n &.hds-typography-h2--spacing {\n margin-top: var(--hds-spacing-large-2);\n }\n\n .hds-typography-h1 ~ &.hds-typography-h2--spacing {\n margin-top: var(--hds-spacing-medium-3);\n }\n}\n\n.hds-typography-h3 {\n font: var(--hds-typography-header-h3);\n\n &.hds-typography-h3--title {\n font: var(--hds-typography-header-h3-title);\n }\n\n &.hds-typography-h3--spacing {\n margin-top: var(--hds-spacing-large-2);\n }\n}\n\n.hds-typography-body {\n font: var(--hds-typography-body);\n\n &.hds-typography-body--title {\n font: var(--hds-typography-body-title);\n }\n\n &.hds-typography-body--spacing {\n margin-top: var(--hds-spacing-medium-2);\n }\n}\n\n.hds-typography-body-small {\n font: var(--hds-typography-body-small);\n\n &.hds-typography-body-small--title {\n font: var(--hds-typography-body-small-title);\n }\n\n &.hds-typography-body-small--spacing {\n margin-top: var(--hds-spacing-medium-2);\n }\n}\n\n.hds-typography-caption {\n font: var(--hds-typography-caption);\n\n &.hds-typography-caption--title {\n font: var(--hds-typography-caption-title);\n }\n\n &.hds-typography-caption--spacing {\n margin-top: var(--hds-spacing-medium-2);\n }\n}\n\n.hds-typography-technical {\n font: var(--hds-typography-technical);\n\n &.hds-typography-technical--title {\n font: var(--hds-typography-technical-title);\n }\n\n &.hds-typography-technical--spacing {\n margin-top: var(--hds-spacing-small-1);\n }\n\n @media (min-width: 940px) {\n &.hds-typography-technical--spacing {\n margin-top: var(--hds-spacing-small-2);\n }\n }\n}\n",".hds-box {\n position: relative;\n\n &, /* Default */\n &.hds-box--light-grey {\n background-color: var(--hds-ui-colors-light-grey-fill);\n }\n\n &.hds-box--lighter {\n background-color: var(--hds-brand-colors-lighter);\n }\n\n &.hds-box--white {\n background-color: var(--hds-ui-colors-white);\n box-shadow: var(--hds-shadow-default);\n }\n\n &.hds-box--warning {\n background-color: var(--hds-ui-colors-warning-yellow);\n }\n\n /* Padding */\n --hds-component-box-padding: var(--hds-spacing-medium-2);\n\n @media (min-width: 720px) {\n --hds-component-box-padding: var(--hds-spacing-medium-3);\n }\n\n padding: var(--hds-component-box-padding);\n\n /* Closed state */\n &.hds-box--closed {\n display: none;\n }\n}\n\n/**\n * Close button\n * TODO: Styling for the hover and focus effect can be improved upon\n */\n.hds-box .hds-box__close-button {\n /* Icon */\n width: 24px;\n height: 24px;\n background: transparent;\n background-image: url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M13.1602 12.25L16.7812 8.66406L17.5195 7.92578C17.625 7.82031 17.625 7.64453 17.5195 7.50391L16.7461 6.73047C16.6055 6.625 16.4297 6.625 16.3242 6.73047L12 11.0898L7.64062 6.73047C7.53516 6.625 7.35938 6.625 7.21875 6.73047L6.44531 7.50391C6.33984 7.64453 6.33984 7.82031 6.44531 7.92578L10.8047 12.25L6.44531 16.6094C6.33984 16.7148 6.33984 16.8906 6.44531 17.0312L7.21875 17.8047C7.35938 17.9102 7.53516 17.9102 7.64062 17.8047L12 13.4453L15.5859 17.0664L16.3242 17.8047C16.4297 17.9102 16.6055 17.9102 16.7461 17.8047L17.5195 17.0312C17.625 16.8906 17.625 16.7148 17.5195 16.6094L13.1602 12.25Z\" fill=\"black\"/></svg>');\n\n /* Positioning */\n position: absolute;\n top: var(--hds-spacing-small-4);\n right: var(--hds-spacing-small-4);\n padding: 0;\n border: none;\n cursor: pointer;\n\n /* Hover effect */\n transition: filter var(--hds-micro-animation-duration-quick)\n var(--hds-micro-animation-easing-normal);\n\n &:hover {\n filter: invert(40%);\n }\n\n /* Focus effect */\n &:focus {\n outline: none;\n box-shadow: 0 0 0 2px var(--hds-ui-colors-black-hover);\n }\n}\n",".hds-box.hds-message {\n --hds-component-message-icon-width: var(--hds-spacing-medium-3);\n --hds-component-message-spacing-between: var(--hds-spacing-small-4);\n\n @media (min-width: 720px) {\n --hds-component-message-spacing-between: var(--hds-spacing-medium-2);\n }\n\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties -- Comes from `box.css` */\n --hds-component-message-padding: var(--hds-component-box-padding);\n\n padding-left: calc(\n var(--hds-component-message-padding) + var(--hds-component-message-icon-width) +\n var(--hds-component-message-spacing-between)\n );\n\n /* Icon placement */\n &::before {\n content: \"\";\n position: absolute;\n top: var(--hds-component-message-padding);\n left: var(--hds-component-message-padding);\n width: var(--hds-component-message-icon-width);\n height: var(--hds-component-message-icon-width);\n }\n\n &.hds-message--success {\n background-color: var(--hds-ui-colors-light-grey-fill);\n\n &::before {\n background-image: url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"32\" height=\"32\" viewBox=\"0 0 32 32\" fill=\"none\"><path d=\"M27.6412 7.54758C28.3713 8.22153 28.3713 9.40094 27.6412 10.0749L13.2636 24.4524C12.5897 25.1825 11.4103 25.1825 10.7363 24.4524L3.54758 17.2637C2.81747 16.5897 2.81747 15.4103 3.54758 14.7363C4.22153 14.0062 5.40094 14.0062 6.07488 14.7363L11.9719 20.6334L25.1139 7.54758C25.7878 6.81747 26.9672 6.81747 27.6412 7.54758Z\" fill=\"%237BC144\"/></svg>');\n }\n }\n\n &.hds-message--attention {\n background-color: var(--hds-ui-colors-warning-yellow-light-fill);\n\n &::before {\n background-image: url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"32\" height=\"32\" viewBox=\"0 0 32 32\" fill=\"none\"><path d=\"M29.0323 23.7656C29.8537 25.2031 28.8269 27 27.1327 27H5.21084C3.51664 27 2.48986 25.2031 3.25994 23.7656L14.2466 5.07812C14.7086 4.35938 15.4274 4 16.1974 4C16.9162 4 17.6349 4.35938 18.097 5.07812L29.0323 23.7656ZM5.72423 24.5357H26.6193L16.1461 6.72098L5.72423 24.5357ZM16.1974 19.7098C17.0702 19.7098 17.789 20.4286 17.789 21.3013C17.789 22.1741 17.0702 22.8929 16.1974 22.8929C15.2733 22.8929 14.5546 22.1741 14.5546 21.3013C14.5546 20.4286 15.2733 19.7098 16.1974 19.7098ZM14.9653 11.8036C14.9653 11.1362 15.4787 10.5714 16.1974 10.5714C16.8649 10.5714 17.4296 11.1362 17.4296 11.8036V16.7321C17.4296 17.4509 16.8649 17.9643 16.1974 17.9643C15.4787 17.9643 14.9653 17.4509 14.9653 16.7321V11.8036Z\" fill=\"black\"/></svg>');\n }\n }\n\n &.hds-message--warning {\n background-color: var(--hds-ui-colors-warning-yellow);\n\n &::before {\n background-image: url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"32\" height=\"32\" viewBox=\"0 0 32 32\" fill=\"none\"><rect x=\"12\" y=\"10\" width=\"8\" height=\"14.6667\" rx=\"4\" fill=\"%23FDBB2F\"/><path d=\"M29.0094 24.7656C29.8308 26.2031 28.804 28 27.1098 28H5.18794C3.49374 28 2.46695 26.2031 3.28838 24.7656L14.275 6.07812C15.0964 4.64062 17.2013 4.64062 18.0741 6.07812L29.0094 24.7656ZM14.9424 11.9821V18.5536C14.9424 19.2723 15.5585 19.7857 16.1745 19.7857C16.842 19.7857 17.4067 19.2723 17.4067 18.5536V11.9821C17.4067 11.3147 16.842 10.75 16.1745 10.75C15.4558 10.75 14.9424 11.3147 14.9424 11.9821ZM16.1745 24.7143C17.0473 24.7143 17.7661 23.9955 17.7661 23.1228C17.7661 22.25 17.0473 21.5312 16.1745 21.5312C15.2504 21.5312 14.5317 22.25 14.5317 23.1228C14.5317 23.9955 15.2504 24.7143 16.1745 24.7143Z\" fill=\"black\"/></svg>');\n }\n }\n\n &.hds-message--neutral {\n background-color: var(--hds-ui-colors-light-grey-fill);\n\n /* stylelint-disable-next-line selector-class-pattern -- Custom icon is only available for the neutral variant */\n .hds-message--neutral__icon {\n position: absolute;\n top: var(--hds-component-message-padding);\n left: var(--hds-component-message-padding);\n width: var(--hds-component-message-icon-width);\n }\n }\n}\n",".hds-input {\n display: flex;\n flex-flow: column nowrap;\n gap: var(--hds-spacing-small-1);\n\n &.hds-input--error,\n &.hds-input--lined.hds-input--error {\n .hds-input__input,\n .hds-input__input:focus {\n position: relative;\n border-bottom: var(--hds-stroke-thick) solid var(--hds-ui-colors-warning-yellow);\n margin-bottom: calc(var(--hds-stroke-thick) - var(--hds-stroke-default));\n }\n }\n\n &.hds-input--default {\n .hds-input__input {\n background-color: var(--hds-ui-colors-light-grey-fill);\n }\n }\n\n &.hds-input--white {\n .hds-input__input {\n background-color: var(--hds-ui-colors-white);\n }\n }\n\n &.hds-input--lined {\n .hds-input__input {\n background: transparent;\n border-bottom: var(--hds-stroke-default) solid var(--hds-ui-colors-grey);\n padding-left: 0;\n padding-top: var(--hds-spacing-small-1);\n padding-bottom: var(--hds-spacing-small-3);\n border-radius: 0;\n }\n }\n\n &:focus-within .hds-input__label {\n color: var(--hds-brand-colors-darker);\n }\n\n & .hds-input__label {\n transition: color var(--hds-micro-animation-duration-normal)\n var(--hds-micro-animation-easing-normal);\n font: var(--hds-typography-caption);\n order: 1;\n }\n\n & .hds-input__input {\n color: var(--hds-ui-colors-black);\n position: relative;\n width: 100%;\n\n /* height: var(--hwc-input-field-height); */\n padding: var(--hds-spacing-small-4);\n font: var(--hds-typography-body-small);\n line-height: normal;\n border: var(--hds-stroke-default) solid transparent;\n border-radius: var(--hds-border-radius);\n transition: border margin var(--hds-micro-animation-duration-normal)\n var(--hds-micro-animation-easing-normal);\n box-sizing: border-box;\n order: 2;\n\n &::placeholder {\n color: var(--hds-ui-colors-dark-grey);\n opacity: 1;\n }\n\n &:focus {\n border-bottom: var(--hds-stroke-default) solid var(--hds-brand-colors-darker);\n outline: 0;\n\n &::placeholder {\n color: var(--hds-ui-colors-grey);\n }\n }\n\n &:disabled,\n &:read-only {\n color: var(--hds-ui-colors-dark-grey);\n background-color: var(--hds-ui-colors-grey);\n border: var(--hds-stroke-default) solid var(--hds-ui-colors-grey);\n }\n\n /* Fiks grå label når readonly, bruk :has */\n\n &:read-only:focus {\n border-bottom-color: var(--hds-brand-colors-darker);\n }\n }\n\n & .hds-input__error-message {\n font: var(--hds-typography-caption-title);\n color: var(--hds-ui-colors-dark-grey);\n padding: var(--hds-spacing-small-1) 0 0 var(--hds-spacing-small-4);\n order: 3;\n }\n}\n",".hds-accordion {\n --hds-accordion-icon-dimension: 24px;\n --hds-component-accordion-trigger-spacing-between: var(--hds-spacing-small-4);\n --hds-component-accordion-content-spacing: var(--hds-spacing-medium-3);\n\n @media (min-width: 720px) {\n --hds-component-accordion-content-spacing: var(--hds-spacing-large-1);\n --hds-component-accordion-trigger-spacing-between: var(--hds-spacing-medium-2);\n }\n\n display: block;\n list-style: none;\n border: none;\n border-bottom: var(--hds-stroke-thick) solid var(--hds-ui-colors-light-grey-fill);\n font: var(--hds-typography-body);\n fill: var(--hds-ui-colors-black);\n color: var(--hds-ui-colors-black);\n\n .hds-accordion-item {\n overflow: hidden;\n\n &.hds-accordion-item__expanded .hds-accordion-item-trigger {\n color: var(--hds-brand-colors-dark);\n }\n\n &:first-child .hds-accordion-item-trigger {\n border: 0 none;\n }\n\n .hds-accordion-item-trigger {\n position: relative;\n display: block;\n width: 100%;\n padding: var(--hds-component-accordion-trigger-spacing-between) 0;\n border: 0;\n border-top: var(--hds-stroke-thick) solid var(--hds-ui-colors-light-grey-fill);\n text-align: left;\n background-color: transparent;\n font: var(--hds-typography-body);\n\n &:hover {\n color: var(--hds-brand-colors-dark);\n outline: 0;\n }\n\n .hds-accordion-item-trigger--icon {\n display: inline-block;\n color: var(--hds-brand-colors-dark);\n margin-right: var(--hds-spacing-small-4);\n width: var(--hds-accordion-icon-dimension);\n height: var(--hds-accordion-icon-dimension);\n }\n }\n\n .hds-accordion-item-content {\n padding: 0 0 var(--hds-component-accordion-content-spacing) var(--hds-spacing-medium-4);\n font: var(--hds-typography-body-small);\n\n &.hds-accordion-item-content--closed {\n display: none;\n }\n }\n }\n}\n"],"names":[]}
|
package/dist/input.css
ADDED
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
.hds-input{gap:var(--hds-spacing-small-1);flex-flow:column;display:flex}.hds-input.hds-input--error .hds-input__input{border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-warning-yellow);margin-bottom:calc(var(--hds-stroke-thick) - var(--hds-stroke-default));position:relative}.hds-input.hds-input--error .hds-input__input:focus{border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-warning-yellow);margin-bottom:calc(var(--hds-stroke-thick) - var(--hds-stroke-default));position:relative}.hds-input.hds-input--lined.hds-input--error .hds-input__input{border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-warning-yellow);margin-bottom:calc(var(--hds-stroke-thick) - var(--hds-stroke-default));position:relative}.hds-input.hds-input--lined.hds-input--error .hds-input__input:focus{border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-warning-yellow);margin-bottom:calc(var(--hds-stroke-thick) - var(--hds-stroke-default));position:relative}.hds-input.hds-input--default .hds-input__input{background-color:var(--hds-ui-colors-light-grey-fill)}.hds-input.hds-input--white .hds-input__input{background-color:var(--hds-ui-colors-white)}.hds-input.hds-input--lined .hds-input__input{border-bottom:var(--hds-stroke-default)solid var(--hds-ui-colors-grey);padding-left:0;padding-top:var(--hds-spacing-small-1);padding-bottom:var(--hds-spacing-small-3);background:0 0;border-radius:0}.hds-input:focus-within .hds-input__label{color:var(--hds-brand-colors-darker)}.hds-input .hds-input__label{transition:color var(--hds-micro-animation-duration-normal)var(--hds-micro-animation-easing-normal);font:var(--hds-typography-caption);order:1}.hds-input .hds-input__input{color:var(--hds-ui-colors-black);padding:var(--hds-spacing-small-4);font:var(--hds-typography-body-small);border:var(--hds-stroke-default)solid transparent;border-radius:var(--hds-border-radius);transition:border margin var(--hds-micro-animation-duration-normal)var(--hds-micro-animation-easing-normal);box-sizing:border-box;order:2;width:100%;line-height:normal;position:relative}.hds-input .hds-input__input::-webkit-input-placeholder{color:var(--hds-ui-colors-dark-grey);opacity:1}.hds-input .hds-input__input::-ms-input-placeholder{color:var(--hds-ui-colors-dark-grey);opacity:1}.hds-input .hds-input__input::placeholder{color:var(--hds-ui-colors-dark-grey);opacity:1}.hds-input .hds-input__input:focus{border-bottom:var(--hds-stroke-default)solid var(--hds-brand-colors-darker);outline:0}.hds-input .hds-input__input:focus::-webkit-input-placeholder{color:var(--hds-ui-colors-grey)}.hds-input .hds-input__input:focus::-ms-input-placeholder{color:var(--hds-ui-colors-grey)}.hds-input .hds-input__input:focus::placeholder{color:var(--hds-ui-colors-grey)}.hds-input .hds-input__input:disabled{color:var(--hds-ui-colors-dark-grey);background-color:var(--hds-ui-colors-grey);border:var(--hds-stroke-default)solid var(--hds-ui-colors-grey)}.hds-input .hds-input__input:read-only{color:var(--hds-ui-colors-dark-grey);background-color:var(--hds-ui-colors-grey);border:var(--hds-stroke-default)solid var(--hds-ui-colors-grey)}.hds-input .hds-input__input:read-only:focus{border-bottom-color:var(--hds-brand-colors-darker)}.hds-input .hds-input__error-message{font:var(--hds-typography-caption-title);color:var(--hds-ui-colors-dark-grey);padding:var(--hds-spacing-small-1)0 0 var(--hds-spacing-small-4);order:3}
|
|
2
|
+
/*# sourceMappingURL=./dist/input.css.map */
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"mappings":"AAAA,wEAOI,uNAAA,6NAAA,wOAAA,8OASA,sGAMA,0FAMA,oPAUF,+EAIA,4KAOA,0ZAgBE,uGAAA,mGAAA,yFAKA,yHAIE,8FAAA,0FAAA,gFAKF,sLAAA,uLASA,gGAKF","sources":["src/input/input.css"],"sourcesContent":[".hds-input {\n display: flex;\n flex-flow: column nowrap;\n gap: var(--hds-spacing-small-1);\n\n &.hds-input--error,\n &.hds-input--lined.hds-input--error {\n .hds-input__input,\n .hds-input__input:focus {\n position: relative;\n border-bottom: var(--hds-stroke-thick) solid var(--hds-ui-colors-warning-yellow);\n margin-bottom: calc(var(--hds-stroke-thick) - var(--hds-stroke-default));\n }\n }\n\n &.hds-input--default {\n .hds-input__input {\n background-color: var(--hds-ui-colors-light-grey-fill);\n }\n }\n\n &.hds-input--white {\n .hds-input__input {\n background-color: var(--hds-ui-colors-white);\n }\n }\n\n &.hds-input--lined {\n .hds-input__input {\n background: transparent;\n border-bottom: var(--hds-stroke-default) solid var(--hds-ui-colors-grey);\n padding-left: 0;\n padding-top: var(--hds-spacing-small-1);\n padding-bottom: var(--hds-spacing-small-3);\n border-radius: 0;\n }\n }\n\n &:focus-within .hds-input__label {\n color: var(--hds-brand-colors-darker);\n }\n\n & .hds-input__label {\n transition: color var(--hds-micro-animation-duration-normal)\n var(--hds-micro-animation-easing-normal);\n font: var(--hds-typography-caption);\n order: 1;\n }\n\n & .hds-input__input {\n color: var(--hds-ui-colors-black);\n position: relative;\n width: 100%;\n\n /* height: var(--hwc-input-field-height); */\n padding: var(--hds-spacing-small-4);\n font: var(--hds-typography-body-small);\n line-height: normal;\n border: var(--hds-stroke-default) solid transparent;\n border-radius: var(--hds-border-radius);\n transition: border margin var(--hds-micro-animation-duration-normal)\n var(--hds-micro-animation-easing-normal);\n box-sizing: border-box;\n order: 2;\n\n &::placeholder {\n color: var(--hds-ui-colors-dark-grey);\n opacity: 1;\n }\n\n &:focus {\n border-bottom: var(--hds-stroke-default) solid var(--hds-brand-colors-darker);\n outline: 0;\n\n &::placeholder {\n color: var(--hds-ui-colors-grey);\n }\n }\n\n &:disabled,\n &:read-only {\n color: var(--hds-ui-colors-dark-grey);\n background-color: var(--hds-ui-colors-grey);\n border: var(--hds-stroke-default) solid var(--hds-ui-colors-grey);\n }\n\n /* Fiks grå label når readonly, bruk :has */\n\n &:read-only:focus {\n border-bottom-color: var(--hds-brand-colors-darker);\n }\n }\n\n & .hds-input__error-message {\n font: var(--hds-typography-caption-title);\n color: var(--hds-ui-colors-dark-grey);\n padding: var(--hds-spacing-small-1) 0 0 var(--hds-spacing-small-4);\n order: 3;\n }\n}\n"],"names":[]}
|
package/dist/link.css
ADDED
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
.hds-link{border-bottom:var(--hds-stroke-default)solid var(--hds-brand-link-colors-underline);fill:var(--hds-brand-link-colors-text);color:var(--hds-brand-link-colors-text);transition:all var(--hds-micro-animation-duration-quick)var(--hds-micro-animation-easing-normal);cursor:pointer;text-decoration:none}.hds-link:hover{color:var(--hds-brand-link-colors-hover);fill:var(--hds-brand-link-colors-hover);border-color:var(--hds-brand-link-colors-underline-hover)}.hds-link:hover .hds-link__text{border-color:var(--hds-brand-link-colors-underline-hover)}.hds-link:active{color:var(--hds-brand-link-colors-hover);fill:var(--hds-brand-link-colors-hover);border-color:var(--hds-brand-link-colors-underline-hover)}.hds-link:active .hds-link__text{border-color:var(--hds-brand-link-colors-underline-hover)}.hds-link.hds-link--inverted{color:var(--hds-ui-colors-white);-webkit-text-decoration-color:var(--hds-brand-colors-signature);text-decoration-color:var(--hds-brand-colors-signature);border-color:currentColor}.hds-link.hds-link--inverted:hover{color:var(--hds-brand-colors-light);border-color:currentColor}.hds-link.hds-link--inverted:active{color:var(--hds-brand-colors-light);border-color:currentColor}.hds-link.hds-link--inverted:disabled{color:var(--hds-ui-colors-dark-grey);fill:currentColor;cursor:default;border-color:currentColor;box-shadow:none!important;outline:0!important}.hds-link.hds-link--small{font:var(--hds-typography-body-small)}.hds-link.hds-link--large{font:var(--hds-typography-header-h3)}.hds-link.hds-link--no-underline{font-family:var(--hds-fonts-posten-sans-medium);color:var(--hds-brand-colors-dark);border-bottom:none;text-decoration:none}.hds-link.hds-link--no-underline:hover{color:var(--hds-brand-colors-dark);text-decoration:underline;-webkit-text-decoration-color:var(--hds-brand-colors-dark);text-decoration-color:var(--hds-brand-colors-dark);border-bottom:none}.hds-link.hds-link--solid{color:var(--hds-ui-colors-black);border-color:var(--hds-ui-colors-black)}.hds-link.hds-link--solid:hover{color:var(--hds-ui-colors-black-hover);border-color:var(--hds-ui-colors-black-hover)}.hds-link.hds-link--solid:active{color:var(--hds-ui-colors-black-hover);border-color:var(--hds-ui-colors-black-hover)}
|
|
2
|
+
/*# sourceMappingURL=./dist/link.css.map */
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"mappings":"AAIA,kTAQE,2JAME,0FANF,4JAME,2FASF,gNAKE,iGAAA,kGAMA,oLAUF,gEAIA,+DAIA,4JAME,qOAQF,mGAIE,qHAAA","sources":["src/link/link.css"],"sourcesContent":["/**\n * Block\n */\n\n.hds-link {\n text-decoration: none;\n border-bottom: var(--hds-stroke-default) solid var(--hds-brand-link-colors-underline);\n fill: var(--hds-brand-link-colors-text);\n color: var(--hds-brand-link-colors-text);\n transition: all var(--hds-micro-animation-duration-quick) var(--hds-micro-animation-easing-normal);\n cursor: pointer;\n\n &:hover,\n &:active {\n color: var(--hds-brand-link-colors-hover);\n fill: var(--hds-brand-link-colors-hover);\n border-color: var(--hds-brand-link-colors-underline-hover);\n\n & .hds-link__text {\n border-color: var(--hds-brand-link-colors-underline-hover);\n }\n }\n\n /**\n * Modifers\n */\n\n &.hds-link--inverted {\n color: var(--hds-ui-colors-white);\n text-decoration-color: var(--hds-brand-colors-signature);\n border-color: currentcolor;\n\n &:hover,\n &:active {\n color: var(--hds-brand-colors-light);\n border-color: currentcolor;\n }\n\n &:disabled {\n color: var(--hds-ui-colors-dark-grey);\n fill: currentcolor;\n border-color: currentcolor;\n outline: 0 !important;\n box-shadow: none !important;\n cursor: default;\n }\n }\n\n &.hds-link--small {\n font: var(--hds-typography-body-small);\n }\n\n &.hds-link--large {\n font: var(--hds-typography-header-h3);\n }\n\n &.hds-link--no-underline {\n font-family: var(--hds-fonts-posten-sans-medium);\n color: var(--hds-brand-colors-dark);\n text-decoration: none;\n border-bottom: none;\n\n &:hover {\n color: var(--hds-brand-colors-dark);\n text-decoration: underline;\n text-decoration-color: var(--hds-brand-colors-dark);\n border-bottom: none;\n }\n }\n\n &.hds-link--solid {\n color: var(--hds-ui-colors-black);\n border-color: var(--hds-ui-colors-black);\n\n &:hover,\n &:active {\n color: var(--hds-ui-colors-black-hover);\n border-color: var(--hds-ui-colors-black-hover);\n }\n }\n}\n"],"names":[]}
|
package/dist/list.css
ADDED
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
.hds-list{padding-left:var(--hds-spacing-medium-2);margin:0}.hds-list li{margin-bottom:var(--hds-spacing-small-3);position:relative}.hds-list ul{list-style:none}.hds-list ul li:before{content:"";background:var(--hds-brand-colors-dark);border-radius:50%;width:6px;height:6px;margin-left:-22px;position:absolute;top:11px}.hds-list.hds-list--small{font:var(--hds-typography-body-small);padding-left:var(--hds-spacing-medium-1);line-height:1.8}.hds-list.hds-list--small li{margin-bottom:0}.hds-list.hds-list--small li:before{width:5px;height:5px;margin-top:3px;margin-left:-18px;top:9px}.hds-list.hds-list--medium{font:var(--hds-typography-body)}.hds-list.hds-list--large{font:var(--hds-typography-header-h3)}.hds-list.hds-list--large li{margin-bottom:9px}.hds-list.hds-list--large li:before{width:8px;height:8px;margin-left:-24px;top:10px}.hds-list.hds-list--style-hidden{padding-left:0;list-style:none}
|
|
2
|
+
/*# sourceMappingURL=./dist/list.css.map */
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"mappings":"AAAA,4DAIE,wEAKA,6BAII,8JAaJ,yHAKE,6CAGE,kGAUJ,2DAIA,+DAGE,+CAGE,oFASJ","sources":["src/list/list.css"],"sourcesContent":[".hds-list {\n margin: 0;\n padding-left: var(--hds-spacing-medium-2);\n\n & li {\n margin-bottom: var(--hds-spacing-small-3);\n position: relative;\n }\n\n & ul {\n list-style: none;\n\n & li {\n &::before {\n content: \"\";\n position: absolute;\n background: var(--hds-brand-colors-dark);\n width: 6px;\n height: 6px;\n margin-left: -22px;\n border-radius: 50%;\n top: 11px;\n }\n }\n }\n\n &.hds-list--small {\n font: var(--hds-typography-body-small);\n line-height: 1.8;\n padding-left: var(--hds-spacing-medium-1);\n\n & li {\n margin-bottom: 0;\n\n &::before {\n width: 5px;\n height: 5px;\n margin-left: -18px;\n margin-top: 3px;\n top: 9px;\n }\n }\n }\n\n &.hds-list--medium {\n font: var(--hds-typography-body);\n }\n\n &.hds-list--large {\n font: var(--hds-typography-header-h3);\n\n & li {\n margin-bottom: 9px;\n\n &::before {\n width: 8px;\n height: 8px;\n margin-left: -24px;\n top: 10px;\n }\n }\n }\n\n &.hds-list--style-hidden {\n list-style: none;\n padding-left: 0;\n }\n}\n"],"names":[]}
|
package/dist/message.css
ADDED
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
.hds-box.hds-message{--hds-component-message-icon-width:var(--hds-spacing-medium-3);--hds-component-message-spacing-between:var(--hds-spacing-small-4);--hds-component-message-padding:var(--hds-component-box-padding);padding-left:calc(var(--hds-component-message-padding) + var(--hds-component-message-icon-width) + var(--hds-component-message-spacing-between))}@media (min-width:720px){.hds-box.hds-message{--hds-component-message-spacing-between:var(--hds-spacing-medium-2)}}.hds-box.hds-message:before{content:"";top:var(--hds-component-message-padding);left:var(--hds-component-message-padding);width:var(--hds-component-message-icon-width);height:var(--hds-component-message-icon-width);position:absolute}.hds-box.hds-message.hds-message--success{background-color:var(--hds-ui-colors-light-grey-fill)}.hds-box.hds-message.hds-message--success:before{background-image:url("data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"32\" height=\"32\" viewBox=\"0 0 32 32\" fill=\"none\"><path d=\"M27.6412 7.54758C28.3713 8.22153 28.3713 9.40094 27.6412 10.0749L13.2636 24.4524C12.5897 25.1825 11.4103 25.1825 10.7363 24.4524L3.54758 17.2637C2.81747 16.5897 2.81747 15.4103 3.54758 14.7363C4.22153 14.0062 5.40094 14.0062 6.07488 14.7363L11.9719 20.6334L25.1139 7.54758C25.7878 6.81747 26.9672 6.81747 27.6412 7.54758Z\" fill=\"%237BC144\"/></svg>")}.hds-box.hds-message.hds-message--attention{background-color:var(--hds-ui-colors-warning-yellow-light-fill)}.hds-box.hds-message.hds-message--attention:before{background-image:url("data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"32\" height=\"32\" viewBox=\"0 0 32 32\" fill=\"none\"><path d=\"M29.0323 23.7656C29.8537 25.2031 28.8269 27 27.1327 27H5.21084C3.51664 27 2.48986 25.2031 3.25994 23.7656L14.2466 5.07812C14.7086 4.35938 15.4274 4 16.1974 4C16.9162 4 17.6349 4.35938 18.097 5.07812L29.0323 23.7656ZM5.72423 24.5357H26.6193L16.1461 6.72098L5.72423 24.5357ZM16.1974 19.7098C17.0702 19.7098 17.789 20.4286 17.789 21.3013C17.789 22.1741 17.0702 22.8929 16.1974 22.8929C15.2733 22.8929 14.5546 22.1741 14.5546 21.3013C14.5546 20.4286 15.2733 19.7098 16.1974 19.7098ZM14.9653 11.8036C14.9653 11.1362 15.4787 10.5714 16.1974 10.5714C16.8649 10.5714 17.4296 11.1362 17.4296 11.8036V16.7321C17.4296 17.4509 16.8649 17.9643 16.1974 17.9643C15.4787 17.9643 14.9653 17.4509 14.9653 16.7321V11.8036Z\" fill=\"black\"/></svg>")}.hds-box.hds-message.hds-message--warning{background-color:var(--hds-ui-colors-warning-yellow)}.hds-box.hds-message.hds-message--warning:before{background-image:url("data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"32\" height=\"32\" viewBox=\"0 0 32 32\" fill=\"none\"><rect x=\"12\" y=\"10\" width=\"8\" height=\"14.6667\" rx=\"4\" fill=\"%23FDBB2F\"/><path d=\"M29.0094 24.7656C29.8308 26.2031 28.804 28 27.1098 28H5.18794C3.49374 28 2.46695 26.2031 3.28838 24.7656L14.275 6.07812C15.0964 4.64062 17.2013 4.64062 18.0741 6.07812L29.0094 24.7656ZM14.9424 11.9821V18.5536C14.9424 19.2723 15.5585 19.7857 16.1745 19.7857C16.842 19.7857 17.4067 19.2723 17.4067 18.5536V11.9821C17.4067 11.3147 16.842 10.75 16.1745 10.75C15.4558 10.75 14.9424 11.3147 14.9424 11.9821ZM16.1745 24.7143C17.0473 24.7143 17.7661 23.9955 17.7661 23.1228C17.7661 22.25 17.0473 21.5312 16.1745 21.5312C15.2504 21.5312 14.5317 22.25 14.5317 23.1228C14.5317 23.9955 15.2504 24.7143 16.1745 24.7143Z\" fill=\"black\"/></svg>")}.hds-box.hds-message.hds-message--neutral{background-color:var(--hds-ui-colors-light-grey-fill)}.hds-box.hds-message.hds-message--neutral .hds-message--neutral__icon{top:var(--hds-component-message-padding);left:var(--hds-component-message-padding);width:var(--hds-component-message-icon-width);position:absolute}
|
|
2
|
+
/*# sourceMappingURL=./dist/message.css.map */
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"mappings":"AAAA,yWAIE,yBAA2B,0FAa3B,yOASA,gGAGE,8iBAKF,4GAGE,06BAKF,+FAGE,25BAKF,gGAIE","sources":["src/message/message.css"],"sourcesContent":[".hds-box.hds-message {\n --hds-component-message-icon-width: var(--hds-spacing-medium-3);\n --hds-component-message-spacing-between: var(--hds-spacing-small-4);\n\n @media (min-width: 720px) {\n --hds-component-message-spacing-between: var(--hds-spacing-medium-2);\n }\n\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties -- Comes from `box.css` */\n --hds-component-message-padding: var(--hds-component-box-padding);\n\n padding-left: calc(\n var(--hds-component-message-padding) + var(--hds-component-message-icon-width) +\n var(--hds-component-message-spacing-between)\n );\n\n /* Icon placement */\n &::before {\n content: \"\";\n position: absolute;\n top: var(--hds-component-message-padding);\n left: var(--hds-component-message-padding);\n width: var(--hds-component-message-icon-width);\n height: var(--hds-component-message-icon-width);\n }\n\n &.hds-message--success {\n background-color: var(--hds-ui-colors-light-grey-fill);\n\n &::before {\n background-image: url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"32\" height=\"32\" viewBox=\"0 0 32 32\" fill=\"none\"><path d=\"M27.6412 7.54758C28.3713 8.22153 28.3713 9.40094 27.6412 10.0749L13.2636 24.4524C12.5897 25.1825 11.4103 25.1825 10.7363 24.4524L3.54758 17.2637C2.81747 16.5897 2.81747 15.4103 3.54758 14.7363C4.22153 14.0062 5.40094 14.0062 6.07488 14.7363L11.9719 20.6334L25.1139 7.54758C25.7878 6.81747 26.9672 6.81747 27.6412 7.54758Z\" fill=\"%237BC144\"/></svg>');\n }\n }\n\n &.hds-message--attention {\n background-color: var(--hds-ui-colors-warning-yellow-light-fill);\n\n &::before {\n background-image: url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"32\" height=\"32\" viewBox=\"0 0 32 32\" fill=\"none\"><path d=\"M29.0323 23.7656C29.8537 25.2031 28.8269 27 27.1327 27H5.21084C3.51664 27 2.48986 25.2031 3.25994 23.7656L14.2466 5.07812C14.7086 4.35938 15.4274 4 16.1974 4C16.9162 4 17.6349 4.35938 18.097 5.07812L29.0323 23.7656ZM5.72423 24.5357H26.6193L16.1461 6.72098L5.72423 24.5357ZM16.1974 19.7098C17.0702 19.7098 17.789 20.4286 17.789 21.3013C17.789 22.1741 17.0702 22.8929 16.1974 22.8929C15.2733 22.8929 14.5546 22.1741 14.5546 21.3013C14.5546 20.4286 15.2733 19.7098 16.1974 19.7098ZM14.9653 11.8036C14.9653 11.1362 15.4787 10.5714 16.1974 10.5714C16.8649 10.5714 17.4296 11.1362 17.4296 11.8036V16.7321C17.4296 17.4509 16.8649 17.9643 16.1974 17.9643C15.4787 17.9643 14.9653 17.4509 14.9653 16.7321V11.8036Z\" fill=\"black\"/></svg>');\n }\n }\n\n &.hds-message--warning {\n background-color: var(--hds-ui-colors-warning-yellow);\n\n &::before {\n background-image: url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"32\" height=\"32\" viewBox=\"0 0 32 32\" fill=\"none\"><rect x=\"12\" y=\"10\" width=\"8\" height=\"14.6667\" rx=\"4\" fill=\"%23FDBB2F\"/><path d=\"M29.0094 24.7656C29.8308 26.2031 28.804 28 27.1098 28H5.18794C3.49374 28 2.46695 26.2031 3.28838 24.7656L14.275 6.07812C15.0964 4.64062 17.2013 4.64062 18.0741 6.07812L29.0094 24.7656ZM14.9424 11.9821V18.5536C14.9424 19.2723 15.5585 19.7857 16.1745 19.7857C16.842 19.7857 17.4067 19.2723 17.4067 18.5536V11.9821C17.4067 11.3147 16.842 10.75 16.1745 10.75C15.4558 10.75 14.9424 11.3147 14.9424 11.9821ZM16.1745 24.7143C17.0473 24.7143 17.7661 23.9955 17.7661 23.1228C17.7661 22.25 17.0473 21.5312 16.1745 21.5312C15.2504 21.5312 14.5317 22.25 14.5317 23.1228C14.5317 23.9955 15.2504 24.7143 16.1745 24.7143Z\" fill=\"black\"/></svg>');\n }\n }\n\n &.hds-message--neutral {\n background-color: var(--hds-ui-colors-light-grey-fill);\n\n /* stylelint-disable-next-line selector-class-pattern -- Custom icon is only available for the neutral variant */\n .hds-message--neutral__icon {\n position: absolute;\n top: var(--hds-component-message-padding);\n left: var(--hds-component-message-padding);\n width: var(--hds-component-message-icon-width);\n }\n }\n}\n"],"names":[]}
|
package/dist/reset.css
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
*,:before,:after{box-sizing:border-box;background-repeat:no-repeat}:before,:after{-webkit-text-decoration:inherit
|
|
2
|
-
/*# sourceMappingURL
|
|
1
|
+
*,:before,:after{box-sizing:border-box;background-repeat:no-repeat}:before,:after{-webkit-text-decoration:inherit;text-decoration:inherit;vertical-align:inherit}:where(:root){cursor:default;overflow-wrap:break-word;tab-size:4;-webkit-tap-highlight-color:transparent;-webkit-text-size-adjust:100%;line-height:1.5}:where(body){margin:0}:where(h1){margin:.67em 0;font-size:2em}:where(dl,ol,ul) :where(dl,ol,ul){margin:0}:where(hr){color:inherit;height:0}:where(nav) :where(ol,ul){padding:0;list-style-type:none}:where(nav li):before{content:"";float:left}:where(pre){font-family:monospace;font-size:1em;overflow:auto}:where(abbr[title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}:where(b,strong){font-weight:bolder}:where(code,kbd,samp){font-family:monospace;font-size:1em}:where(small){font-size:80%}:where(audio,canvas,iframe,img,svg,video){vertical-align:middle}:where(iframe){border-style:none}:where(svg:not([fill])){fill:currentColor}:where(table){border-collapse:collapse;border-color:inherit;text-indent:0}:where(button,input,select){margin:0}:where(button,[type=button i],[type=reset i],[type=submit i]){-webkit-appearance:button}:where(fieldset){border:1px solid #a0a0a0}:where(progress){vertical-align:baseline}:where(textarea){resize:vertical;margin:0}:where([type=search i]){-webkit-appearance:textfield;outline-offset:-2px}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}::-webkit-input-placeholder{color:inherit;opacity:.54}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}:where(dialog){color:#000;height:-moz-fit-content;width:-moz-fit-content;height:fit-content;background-color:#fff;border:solid;width:fit-content;margin:auto;padding:1em;position:absolute;left:0;right:0}:where(dialog:not([open])){display:none}:where(details>summary:first-of-type){display:list-item}:where([aria-busy=true i]){cursor:progress}:where([aria-controls]){cursor:pointer}:where([aria-disabled=true i],[disabled]){cursor:not-allowed}:where([aria-hidden=false i][hidden]){display:initial}:where([aria-hidden=false i][hidden]:not(:focus)){clip:rect(0,0,0,0);position:absolute}
|
|
2
|
+
/*# sourceMappingURL=./dist/reset.css.map */
|
package/dist/reset.css.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"ACQA,mEAYA,8HAeA,uJAiBA,sBASA,wCAYA,2CASA,kCASA,yDASA,+CAWA,8DAaA,8FASA,oCASA,0DASA,4BAWA,gEAQA,iCAQA,0CAaA,0EAaA,qCAQA,wFAQA,0CAQA,yCASA,0CAUA,yEASA,wCAAA,wCASA,sDASA,oDASA,oEAYA,0MAeA,wCAQA,wDAWA,2CAQA,uCASA,6DASA,sDAIA","sources":["reset.css","node_modules/sanitize.css/sanitize.css","packages/css/src/reset.css"],"sourcesContent":["*, :before, :after {\n box-sizing: border-box;\n background-repeat: no-repeat;\n}\n\n:before, :after {\n -webkit-text-decoration: inherit;\n text-decoration: inherit;\n vertical-align: inherit;\n}\n\n:where(:root) {\n cursor: default;\n overflow-wrap: break-word;\n tab-size: 4;\n -webkit-tap-highlight-color: transparent;\n -webkit-text-size-adjust: 100%;\n line-height: 1.5;\n}\n\n:where(body) {\n margin: 0;\n}\n\n:where(h1) {\n margin: .67em 0;\n font-size: 2em;\n}\n\n:where(dl, ol, ul) :where(dl, ol, ul) {\n margin: 0;\n}\n\n:where(hr) {\n color: inherit;\n height: 0;\n}\n\n:where(nav) :where(ol, ul) {\n padding: 0;\n list-style-type: none;\n}\n\n:where(nav li):before {\n content: \"\";\n float: left;\n}\n\n:where(pre) {\n font-family: monospace;\n font-size: 1em;\n overflow: auto;\n}\n\n:where(abbr[title]) {\n -webkit-text-decoration: underline dotted;\n text-decoration: underline dotted;\n}\n\n:where(b, strong) {\n font-weight: bolder;\n}\n\n:where(code, kbd, samp) {\n font-family: monospace;\n font-size: 1em;\n}\n\n:where(small) {\n font-size: 80%;\n}\n\n:where(audio, canvas, iframe, img, svg, video) {\n vertical-align: middle;\n}\n\n:where(iframe) {\n border-style: none;\n}\n\n:where(svg:not([fill])) {\n fill: currentColor;\n}\n\n:where(table) {\n border-collapse: collapse;\n border-color: inherit;\n text-indent: 0;\n}\n\n:where(button, input, select) {\n margin: 0;\n}\n\n:where(button, [type=\"button\" i], [type=\"reset\" i], [type=\"submit\" i]) {\n -webkit-appearance: button;\n}\n\n:where(fieldset) {\n border: 1px solid #a0a0a0;\n}\n\n:where(progress) {\n vertical-align: baseline;\n}\n\n:where(textarea) {\n resize: vertical;\n margin: 0;\n}\n\n:where([type=\"search\" i]) {\n -webkit-appearance: textfield;\n outline-offset: -2px;\n}\n\n::-webkit-inner-spin-button {\n height: auto;\n}\n\n::-webkit-outer-spin-button {\n height: auto;\n}\n\n::-webkit-input-placeholder {\n color: inherit;\n opacity: .54;\n}\n\n::-webkit-search-decoration {\n -webkit-appearance: none;\n}\n\n::-webkit-file-upload-button {\n -webkit-appearance: button;\n font: inherit;\n}\n\n:where(dialog) {\n color: #000;\n background-color: #fff;\n border: solid;\n width: -moz-fit-content;\n width: fit-content;\n height: -moz-fit-content;\n height: fit-content;\n margin: auto;\n padding: 1em;\n position: absolute;\n left: 0;\n right: 0;\n}\n\n:where(dialog:not([open])) {\n display: none;\n}\n\n:where(details > summary:first-of-type) {\n display: list-item;\n}\n\n:where([aria-busy=\"true\" i]) {\n cursor: progress;\n}\n\n:where([aria-controls]) {\n cursor: pointer;\n}\n\n:where([aria-disabled=\"true\" i], [disabled]) {\n cursor: not-allowed;\n}\n\n:where([aria-hidden=\"false\" i][hidden]) {\n display: initial;\n}\n\n:where([aria-hidden=\"false\" i][hidden]:not(:focus)) {\n clip: rect(0, 0, 0, 0);\n position: absolute;\n}\n\n\n\n/*# sourceMappingURL=reset.css.map */\n","/* Document\n * ========================================================================== */\n\n/**\n * 1. Add border box sizing in all browsers (opinionated).\n * 2. Backgrounds do not repeat by default (opinionated).\n */\n\n*,\n::before,\n::after {\n box-sizing: border-box; /* 1 */\n background-repeat: no-repeat; /* 2 */\n}\n\n/**\n * 1. Add text decoration inheritance in all browsers (opinionated).\n * 2. Add vertical alignment inheritance in all browsers (opinionated).\n */\n\n::before,\n::after {\n text-decoration: inherit; /* 1 */\n vertical-align: inherit; /* 2 */\n}\n\n/**\n * 1. Use the default cursor in all browsers (opinionated).\n * 2. Change the line height in all browsers (opinionated).\n * 3. Breaks words to prevent overflow in all browsers (opinionated).\n * 4. Use a 4-space tab width in all browsers (opinionated).\n * 5. Remove the grey highlight on links in iOS (opinionated).\n * 6. Prevent adjustments of font size after orientation changes in iOS.\n */\n\n:where(:root) {\n cursor: default; /* 1 */\n line-height: 1.5; /* 2 */\n overflow-wrap: break-word; /* 3 */\n -moz-tab-size: 4; /* 4 */\n tab-size: 4; /* 4 */\n -webkit-tap-highlight-color: transparent; /* 5 */\n -webkit-text-size-adjust: 100%; /* 6 */\n}\n\n/* Sections\n * ========================================================================== */\n\n/**\n * Remove the margin in all browsers (opinionated).\n */\n\n:where(body) {\n margin: 0;\n}\n\n/**\n * Correct the font size and margin on `h1` elements within `section` and\n * `article` contexts in Chrome, Edge, Firefox, and Safari.\n */\n\n:where(h1) {\n font-size: 2em;\n margin: 0.67em 0;\n}\n\n/* Grouping content\n * ========================================================================== */\n\n/**\n * Remove the margin on nested lists in Chrome, Edge, and Safari.\n */\n\n:where(dl, ol, ul) :where(dl, ol, ul) {\n margin: 0;\n}\n\n/**\n * 1. Correct the inheritance of border color in Firefox.\n * 2. Add the correct box sizing in Firefox.\n */\n\n:where(hr) {\n color: inherit; /* 1 */\n height: 0; /* 2 */\n}\n\n/**\n * Remove the list style on navigation lists in all browsers (opinionated).\n */\n\n:where(nav) :where(ol, ul) {\n list-style-type: none;\n padding: 0;\n}\n\n/**\n * Prevent VoiceOver from ignoring list semantics in Safari (opinionated).\n */\n\n:where(nav li)::before {\n content: \"\\200B\";\n float: left;\n}\n\n/**\n * 1. Correct the inheritance and scaling of font size in all browsers.\n * 2. Correct the odd `em` font sizing in all browsers.\n * 3. Prevent overflow of the container in all browsers (opinionated).\n */\n\n:where(pre) {\n font-family: monospace, monospace; /* 1 */\n font-size: 1em; /* 2 */\n overflow: auto; /* 3 */\n}\n\n/* Text-level semantics\n * ========================================================================== */\n\n/**\n * Add the correct text decoration in Safari.\n */\n\n:where(abbr[title]) {\n text-decoration: underline;\n text-decoration: underline dotted;\n}\n\n/**\n * Add the correct font weight in Chrome, Edge, and Safari.\n */\n\n:where(b, strong) {\n font-weight: bolder;\n}\n\n/**\n * 1. Correct the inheritance and scaling of font size in all browsers.\n * 2. Correct the odd `em` font sizing in all browsers.\n */\n\n:where(code, kbd, samp) {\n font-family: monospace, monospace; /* 1 */\n font-size: 1em; /* 2 */\n}\n\n/**\n * Add the correct font size in all browsers.\n */\n\n:where(small) {\n font-size: 80%;\n}\n\n/* Embedded content\n * ========================================================================== */\n\n/*\n * Change the alignment on media elements in all browsers (opinionated).\n */\n\n:where(audio, canvas, iframe, img, svg, video) {\n vertical-align: middle;\n}\n\n/**\n * Remove the border on iframes in all browsers (opinionated).\n */\n\n:where(iframe) {\n border-style: none;\n}\n\n/**\n * Change the fill color to match the text color in all browsers (opinionated).\n */\n\n:where(svg:not([fill])) {\n fill: currentColor;\n}\n\n/* Tabular data\n * ========================================================================== */\n\n/**\n * 1. Collapse border spacing in all browsers (opinionated).\n * 2. Correct table border color inheritance in all Chrome, Edge, and Safari.\n * 3. Remove text indentation from table contents in Chrome, Edge, and Safari.\n */\n\n:where(table) {\n border-collapse: collapse; /* 1 */\n border-color: inherit; /* 2 */\n text-indent: 0; /* 3 */\n}\n\n/* Forms\n * ========================================================================== */\n\n/**\n * Remove the margin on controls in Safari.\n */\n\n:where(button, input, select) {\n margin: 0;\n}\n\n/**\n * Correct the inability to style buttons in iOS and Safari.\n */\n\n:where(button, [type=\"button\" i], [type=\"reset\" i], [type=\"submit\" i]) {\n -webkit-appearance: button;\n}\n\n/**\n * Change the inconsistent appearance in all browsers (opinionated).\n */\n\n:where(fieldset) {\n border: 1px solid #a0a0a0;\n}\n\n/**\n * Add the correct vertical alignment in Chrome, Edge, and Firefox.\n */\n\n:where(progress) {\n vertical-align: baseline;\n}\n\n/**\n * 1. Remove the margin in Firefox and Safari.\n * 3. Change the resize direction in all browsers (opinionated).\n */\n\n:where(textarea) {\n margin: 0; /* 1 */\n resize: vertical; /* 3 */\n}\n\n/**\n * 1. Correct the odd appearance in Chrome, Edge, and Safari.\n * 2. Correct the outline style in Safari.\n */\n\n:where([type=\"search\" i]) {\n -webkit-appearance: textfield; /* 1 */\n outline-offset: -2px; /* 2 */\n}\n\n/**\n * Correct the cursor style of increment and decrement buttons in Safari.\n */\n\n::-webkit-inner-spin-button,\n::-webkit-outer-spin-button {\n height: auto;\n}\n\n/**\n * Correct the text style of placeholders in Chrome, Edge, and Safari.\n */\n\n::-webkit-input-placeholder {\n color: inherit;\n opacity: 0.54;\n}\n\n/**\n * Remove the inner padding in Chrome, Edge, and Safari on macOS.\n */\n\n::-webkit-search-decoration {\n -webkit-appearance: none;\n}\n\n/**\n * 1. Correct the inability to style upload buttons in iOS and Safari.\n * 2. Change font properties to `inherit` in Safari.\n */\n\n::-webkit-file-upload-button {\n -webkit-appearance: button; /* 1 */\n font: inherit; /* 2 */\n}\n\n/* Interactive\n * ========================================================================== */\n\n/*\n * Add the correct styles in Safari.\n */\n\n:where(dialog) {\n background-color: white;\n border: solid;\n color: black;\n height: -moz-fit-content;\n height: fit-content;\n left: 0;\n margin: auto;\n padding: 1em;\n position: absolute;\n right: 0;\n width: -moz-fit-content;\n width: fit-content;\n}\n\n:where(dialog:not([open])) {\n display: none;\n}\n\n/*\n * Add the correct display in Safari.\n */\n\n:where(details > summary:first-of-type) {\n display: list-item;\n}\n\n/* Accessibility\n * ========================================================================== */\n\n/**\n * Change the cursor on busy elements in all browsers (opinionated).\n */\n\n:where([aria-busy=\"true\" i]) {\n cursor: progress;\n}\n\n/*\n * Change the cursor on control elements in all browsers (opinionated).\n */\n\n:where([aria-controls]) {\n cursor: pointer;\n}\n\n/*\n * Change the cursor on disabled, not-editable, or otherwise\n * inoperable elements in all browsers (opinionated).\n */\n\n:where([aria-disabled=\"true\" i], [disabled]) {\n cursor: not-allowed;\n}\n\n/*\n * Change the display on visually hidden accessible elements\n * in all browsers (opinionated).\n */\n\n:where([aria-hidden=\"false\" i][hidden]) {\n display: initial;\n}\n\n:where([aria-hidden=\"false\" i][hidden]:not(:focus)) {\n clip: rect(0, 0, 0, 0);\n position: absolute;\n}\n","@import url(\"../../../node_modules/sanitize.css/sanitize\");\n"],"names":[],"version":3,"file":"reset.css.map"}
|
|
1
|
+
{"version":3,"mappings":"ACQA,mEAYA,8FAeA,uJAiBA,sBASA,wCAYA,2CASA,kCASA,yDASA,+CAWA,8DAaA,8FASA,oCASA,0DASA,4BAWA,gEAQA,iCAQA,0CAaA,0EAaA,qCAQA,wFAQA,0CAQA,yCASA,0CAUA,yEASA,wCAAA,wCASA,sDASA,oDASA,oEAYA,0MAeA,wCAQA,wDAWA,2CAQA,uCASA,6DASA,sDAIA","sources":["src/reset.css","src/../../../node_modules/.pnpm/node_modules/sanitize.css/sanitize.css"],"sourcesContent":["/**\n * CSS Reset to get consistent styling across browsers.\n * Many ways to do this, sanitize.css is the one being used in hedwig legacy.\n */\n@import url(\"../../../node_modules/.pnpm/node_modules/sanitize.css/sanitize.css\");\n","/* Document\n * ========================================================================== */\n\n/**\n * 1. Add border box sizing in all browsers (opinionated).\n * 2. Backgrounds do not repeat by default (opinionated).\n */\n\n*,\n::before,\n::after {\n box-sizing: border-box; /* 1 */\n background-repeat: no-repeat; /* 2 */\n}\n\n/**\n * 1. Add text decoration inheritance in all browsers (opinionated).\n * 2. Add vertical alignment inheritance in all browsers (opinionated).\n */\n\n::before,\n::after {\n text-decoration: inherit; /* 1 */\n vertical-align: inherit; /* 2 */\n}\n\n/**\n * 1. Use the default cursor in all browsers (opinionated).\n * 2. Change the line height in all browsers (opinionated).\n * 3. Breaks words to prevent overflow in all browsers (opinionated).\n * 4. Use a 4-space tab width in all browsers (opinionated).\n * 5. Remove the grey highlight on links in iOS (opinionated).\n * 6. Prevent adjustments of font size after orientation changes in iOS.\n */\n\n:where(:root) {\n cursor: default; /* 1 */\n line-height: 1.5; /* 2 */\n overflow-wrap: break-word; /* 3 */\n -moz-tab-size: 4; /* 4 */\n tab-size: 4; /* 4 */\n -webkit-tap-highlight-color: transparent; /* 5 */\n -webkit-text-size-adjust: 100%; /* 6 */\n}\n\n/* Sections\n * ========================================================================== */\n\n/**\n * Remove the margin in all browsers (opinionated).\n */\n\n:where(body) {\n margin: 0;\n}\n\n/**\n * Correct the font size and margin on `h1` elements within `section` and\n * `article` contexts in Chrome, Edge, Firefox, and Safari.\n */\n\n:where(h1) {\n font-size: 2em;\n margin: 0.67em 0;\n}\n\n/* Grouping content\n * ========================================================================== */\n\n/**\n * Remove the margin on nested lists in Chrome, Edge, and Safari.\n */\n\n:where(dl, ol, ul) :where(dl, ol, ul) {\n margin: 0;\n}\n\n/**\n * 1. Correct the inheritance of border color in Firefox.\n * 2. Add the correct box sizing in Firefox.\n */\n\n:where(hr) {\n color: inherit; /* 1 */\n height: 0; /* 2 */\n}\n\n/**\n * Remove the list style on navigation lists in all browsers (opinionated).\n */\n\n:where(nav) :where(ol, ul) {\n list-style-type: none;\n padding: 0;\n}\n\n/**\n * Prevent VoiceOver from ignoring list semantics in Safari (opinionated).\n */\n\n:where(nav li)::before {\n content: \"\\200B\";\n float: left;\n}\n\n/**\n * 1. Correct the inheritance and scaling of font size in all browsers.\n * 2. Correct the odd `em` font sizing in all browsers.\n * 3. Prevent overflow of the container in all browsers (opinionated).\n */\n\n:where(pre) {\n font-family: monospace, monospace; /* 1 */\n font-size: 1em; /* 2 */\n overflow: auto; /* 3 */\n}\n\n/* Text-level semantics\n * ========================================================================== */\n\n/**\n * Add the correct text decoration in Safari.\n */\n\n:where(abbr[title]) {\n text-decoration: underline;\n text-decoration: underline dotted;\n}\n\n/**\n * Add the correct font weight in Chrome, Edge, and Safari.\n */\n\n:where(b, strong) {\n font-weight: bolder;\n}\n\n/**\n * 1. Correct the inheritance and scaling of font size in all browsers.\n * 2. Correct the odd `em` font sizing in all browsers.\n */\n\n:where(code, kbd, samp) {\n font-family: monospace, monospace; /* 1 */\n font-size: 1em; /* 2 */\n}\n\n/**\n * Add the correct font size in all browsers.\n */\n\n:where(small) {\n font-size: 80%;\n}\n\n/* Embedded content\n * ========================================================================== */\n\n/*\n * Change the alignment on media elements in all browsers (opinionated).\n */\n\n:where(audio, canvas, iframe, img, svg, video) {\n vertical-align: middle;\n}\n\n/**\n * Remove the border on iframes in all browsers (opinionated).\n */\n\n:where(iframe) {\n border-style: none;\n}\n\n/**\n * Change the fill color to match the text color in all browsers (opinionated).\n */\n\n:where(svg:not([fill])) {\n fill: currentColor;\n}\n\n/* Tabular data\n * ========================================================================== */\n\n/**\n * 1. Collapse border spacing in all browsers (opinionated).\n * 2. Correct table border color inheritance in all Chrome, Edge, and Safari.\n * 3. Remove text indentation from table contents in Chrome, Edge, and Safari.\n */\n\n:where(table) {\n border-collapse: collapse; /* 1 */\n border-color: inherit; /* 2 */\n text-indent: 0; /* 3 */\n}\n\n/* Forms\n * ========================================================================== */\n\n/**\n * Remove the margin on controls in Safari.\n */\n\n:where(button, input, select) {\n margin: 0;\n}\n\n/**\n * Correct the inability to style buttons in iOS and Safari.\n */\n\n:where(button, [type=\"button\" i], [type=\"reset\" i], [type=\"submit\" i]) {\n -webkit-appearance: button;\n}\n\n/**\n * Change the inconsistent appearance in all browsers (opinionated).\n */\n\n:where(fieldset) {\n border: 1px solid #a0a0a0;\n}\n\n/**\n * Add the correct vertical alignment in Chrome, Edge, and Firefox.\n */\n\n:where(progress) {\n vertical-align: baseline;\n}\n\n/**\n * 1. Remove the margin in Firefox and Safari.\n * 3. Change the resize direction in all browsers (opinionated).\n */\n\n:where(textarea) {\n margin: 0; /* 1 */\n resize: vertical; /* 3 */\n}\n\n/**\n * 1. Correct the odd appearance in Chrome, Edge, and Safari.\n * 2. Correct the outline style in Safari.\n */\n\n:where([type=\"search\" i]) {\n -webkit-appearance: textfield; /* 1 */\n outline-offset: -2px; /* 2 */\n}\n\n/**\n * Correct the cursor style of increment and decrement buttons in Safari.\n */\n\n::-webkit-inner-spin-button,\n::-webkit-outer-spin-button {\n height: auto;\n}\n\n/**\n * Correct the text style of placeholders in Chrome, Edge, and Safari.\n */\n\n::-webkit-input-placeholder {\n color: inherit;\n opacity: 0.54;\n}\n\n/**\n * Remove the inner padding in Chrome, Edge, and Safari on macOS.\n */\n\n::-webkit-search-decoration {\n -webkit-appearance: none;\n}\n\n/**\n * 1. Correct the inability to style upload buttons in iOS and Safari.\n * 2. Change font properties to `inherit` in Safari.\n */\n\n::-webkit-file-upload-button {\n -webkit-appearance: button; /* 1 */\n font: inherit; /* 2 */\n}\n\n/* Interactive\n * ========================================================================== */\n\n/*\n * Add the correct styles in Safari.\n */\n\n:where(dialog) {\n background-color: white;\n border: solid;\n color: black;\n height: -moz-fit-content;\n height: fit-content;\n left: 0;\n margin: auto;\n padding: 1em;\n position: absolute;\n right: 0;\n width: -moz-fit-content;\n width: fit-content;\n}\n\n:where(dialog:not([open])) {\n display: none;\n}\n\n/*\n * Add the correct display in Safari.\n */\n\n:where(details > summary:first-of-type) {\n display: list-item;\n}\n\n/* Accessibility\n * ========================================================================== */\n\n/**\n * Change the cursor on busy elements in all browsers (opinionated).\n */\n\n:where([aria-busy=\"true\" i]) {\n cursor: progress;\n}\n\n/*\n * Change the cursor on control elements in all browsers (opinionated).\n */\n\n:where([aria-controls]) {\n cursor: pointer;\n}\n\n/*\n * Change the cursor on disabled, not-editable, or otherwise\n * inoperable elements in all browsers (opinionated).\n */\n\n:where([aria-disabled=\"true\" i], [disabled]) {\n cursor: not-allowed;\n}\n\n/*\n * Change the display on visually hidden accessible elements\n * in all browsers (opinionated).\n */\n\n:where([aria-hidden=\"false\" i][hidden]) {\n display: initial;\n}\n\n:where([aria-hidden=\"false\" i][hidden]:not(:focus)) {\n clip: rect(0, 0, 0, 0);\n position: absolute;\n}\n"],"names":[]}
|
package/dist/scoped.css
CHANGED
|
@@ -1,2 +1 @@
|
|
|
1
|
-
.kp-decorator-header-and-footer .hds-button{-webkit-font-smoothing:antialiased;-webkit-appearance:button;box-sizing:border-box;padding:var(--hds-spacing-small-3)var(--hds-spacing-medium-2);border-radius:var(--hds-border-radius);background:var(--hds-ui-colors-grey);border-width:0;border-color:var(--hds-ui-colors-grey);color:var(--hds-brand-button-colors-text);fill:var(--hds-brand-button-colors-text);font:var(--hds-typography-body-title);transition:all var(--hds-micro-animation-duration-quick)var(--hds-micro-animation-easing-normal);text-align:center;cursor:pointer;word-break:normal;display:inline-block}.kp-decorator-header-and-footer .hds-button:disabled,.kp-decorator-header-and-footer .hds-button[disabled],.kp-decorator-header-and-footer .hds-button[disabled]:active{cursor:default;color:var(--hds-ui-colors-dark-grey)!important;fill:var(--hds-ui-colors-dark-grey)!important;background:var(--hds-ui-colors-grey)!important;border-color:var(--hds-ui-colors-grey)!important;box-shadow:none!important;outline:0!important}.kp-decorator-header-and-footer .hds-button--large{height:58px;padding:16px 24px;font-size:18px;line-height:26px}.kp-decorator-header-and-footer .hds-button--large i,.kp-decorator-header-and-footer .hds-button--large svg{margin-right:12px}.kp-decorator-header-and-footer .hds-button--medium{height:50px;padding:12px 20px;font-size:18px;line-height:26px}.kp-decorator-header-and-footer .hds-button--medium i,.kp-decorator-header-and-footer .hds-button--medium svg{margin-right:10px}.kp-decorator-header-and-footer .hds-button--small{height:48px;padding:12px 16px;font-size:16px;line-height:24px}.kp-decorator-header-and-footer .hds-button--small i,.kp-decorator-header-and-footer .hds-button--small svg{margin-right:8px}.kp-decorator-header-and-footer .hds-button--full{width:100%}@media (max-width:720px){.kp-decorator-header-and-footer .hds-button--mobile-full{width:100%}}.kp-decorator-header-and-footer .hds-button--primary{background:var(--hds-brand-colors-signature);border-color:var(--hds-brand-colors-signature);color:var(--hds-brand-button-colors-text);fill:var(--hds-brand-button-colors-text)}.kp-decorator-header-and-footer .hds-button--primary:hover,.kp-decorator-header-and-footer .hds-button--primary:active{background:var(--hds-brand-colors-signature-hover);border-color:var(--hds-brand-colors-signature);outline:0 solid var(--hds-brand-colors-signature-hover)}.kp-decorator-header-and-footer .hds-button--primary:active{background:var(--hds-brand-colors-signature)!important}.kp-decorator-header-and-footer .hds-button--secondary{background:var(--hds-brand-colors-darker);border-color:var(--hds-brand-colors-darker);color:var(--hds-ui-colors-white);fill:var(--hds-ui-colors-white)}.kp-decorator-header-and-footer .hds-button--secondary:hover,.kp-decorator-header-and-footer .hds-button--secondary:active{background:var(--hds-ui-colors-black);outline:0 solid var(--hds-ui-colors-black)}.kp-decorator-header-and-footer .hds-button--secondary:active{background:var(--hds-brand-colors-darker)!important}.kp-decorator-header-and-footer .hds-button--outline{color:var(--hds-brand-colors-dark);fill:var(--hds-brand-colors-dark);border:var(--hds-stroke-thick)solid var(--hds-brand-colors-dark);background:0 0}.kp-decorator-header-and-footer .hds-button--outline:disabled,.kp-decorator-header-and-footer .hds-button--outline[disabled],.kp-decorator-header-and-footer .hds-button--outline[disabled]:active{background:0 0!important}.kp-decorator-header-and-footer .hds-button--outline:hover,.kp-decorator-header-and-footer .hds-button--outline:active{color:var(--hds-ui-colors-black);fill:var(--hds-ui-colors-black);border-color:var(--hds-ui-colors-black);background:0 0}.kp-decorator-header-and-footer .hds-button--outline:active{border-color:var(--hds-ui-colors-dark-grey)}.kp-decorator-header-and-footer .hds-button--outline-white{border:var(--hds-stroke-thick)solid var(--hds-brand-colors-light);color:var(--hds-ui-colors-white);fill:var(--hds-ui-colors-white);outline-offset:3px;background:0 0}.kp-decorator-header-and-footer .hds-button--outline-white:hover,.kp-decorator-header-and-footer .hds-button--outline-white:active{color:var(--hds-brand-colors-light);fill:var(--hds-brand-colors-light)}.kp-decorator-header-and-footer .hds-button--outline-primary{border:var(--hds-stroke-thick)solid var(--hds-brand-colors-signature);color:var(--hds-ui-colors-black);fill:var(--hds-ui-colors-black);outline-offset:3px;background:0 0}.kp-decorator-header-and-footer .hds-button--outline-primary:hover,.kp-decorator-header-and-footer .hds-button--outline-primary:active{color:var(--hds-brand-colors-dark);fill:var(--hds-brand-colors-dark);border:var(--hds-stroke-thick)solid var(--hds-brand-colors-dark)}.kp-decorator-header-and-footer .hds-button--outline-primary:disabled,.kp-decorator-header-and-footer .hds-button--outline-primary[disabled],.kp-decorator-header-and-footer .hds-button--outline-primary[disabled]:active{border:var(--hds-stroke-thick)solid var(--hds-ui-colors-grey);color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);background:0 0!important}.kp-decorator-header-and-footer .hds-button--outline-secondary,.kp-decorator-header-and-footer .hds-button--outline-dark{border:var(--hds-stroke-thick)solid var(--hds-brand-colors-darker);color:var(--hds-brand-colors-darker);fill:var(--hds-brand-colors-darker);outline-offset:3px;background:0 0}.kp-decorator-header-and-footer .hds-button--outline-secondary:hover,.kp-decorator-header-and-footer .hds-button--outline-secondary:active,.kp-decorator-header-and-footer .hds-button--outline-dark:hover,.kp-decorator-header-and-footer .hds-button--outline-dark:active{color:var(--hds-ui-colors-black);fill:var(--hds-ui-colors-black);border:var(--hds-stroke-thick)solid var(--hds-ui-colors-black)}.kp-decorator-header-and-footer .hds-button--outline-secondary:disabled,.kp-decorator-header-and-footer .hds-button--outline-secondary[disabled],.kp-decorator-header-and-footer .hds-button--outline-secondary[disabled]:active,.kp-decorator-header-and-footer .hds-button--outline-dark:disabled,.kp-decorator-header-and-footer .hds-button--outline-dark[disabled],.kp-decorator-header-and-footer .hds-button--outline-dark[disabled]:active{border:var(--hds-stroke-thick)solid var(--hds-ui-colors-grey);color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);background:0 0!important}.kp-decorator-header-and-footer .hds-link{border-bottom:var(--hds-stroke-default)solid var(--hds-brand-link-colors-underline);fill:var(--hds-brand-link-colors-text);color:var(--hds-brand-link-colors-text);cursor:pointer;text-decoration:none;transition:all .1s}.kp-decorator-header-and-footer .hds-link:hover,.kp-decorator-header-and-footer .hds-link:active{color:var(--hds-brand-link-colors-hover);fill:var(--hds-brand-link-colors-hover);border-color:var(--hds-brand-link-colors-underline-hover)}.kp-decorator-header-and-footer .hds-link:hover .hds-link__text,.kp-decorator-header-and-footer .hds-link:active .hds-link__text{border-color:var(--hds-brand-link-colors-underline-hover)}.kp-decorator-header-and-footer .hds-link--inverted{color:var(--hds-ui-colors-white);-webkit-text-decoration-color:var(--hds-brand-colors-signature);-webkit-text-decoration-color:var(--hds-brand-colors-signature);text-decoration-color:var(--hds-brand-colors-signature);border-color:currentColor}.kp-decorator-header-and-footer .hds-link--inverted:hover,.kp-decorator-header-and-footer .hds-link--inverted:active{color:var(--hds-brand-colors-light);border-color:currentColor}.kp-decorator-header-and-footer .hds-link--inverted:disabled{color:var(--hds-ui-colors-dark-grey);fill:currentColor;cursor:default;border-color:currentColor;box-shadow:none!important;outline:0!important}.kp-decorator-header-and-footer .hds-link--small{font:var(--hds-typography-body-small)}.kp-decorator-header-and-footer .hds-link--large{font:var(--hds-typography-header-h3)}.kp-decorator-header-and-footer .hds-link--no-underline{font:var(--hds-fonts-posten-sans-medium);color:var(--hds-brand-colors-dark);border-bottom:none;text-decoration:none}.kp-decorator-header-and-footer .hds-link--no-underline:hover{color:var(--hds-brand-colors-dark);text-decoration:underline;-webkit-text-decoration-color:var(--hds-brand-colors-dark);-webkit-text-decoration-color:var(--hds-brand-colors-dark);text-decoration-color:var(--hds-brand-colors-dark);border-bottom:none}.kp-decorator-header-and-footer .hds-link--solid{color:var(--hds-ui-colors-black);border-color:var(--hds-ui-colors-black)}.kp-decorator-header-and-footer .hds-link--solid:hover,.kp-decorator-header-and-footer .hds-link--solid:active{color:var(--hds-ui-colors-black-hover);border-color:var(--hds-ui-colors-black-hover)}
|
|
2
|
-
/*# sourceMappingURL=scoped.css.map */
|
|
1
|
+
.kp-decorator-header-and-footer .hds-theme-posten{box-sizing:border-box;font:var(--hds-typography-body);fill:var(--hds-ui-colors-black);color:var(--hds-ui-colors-black);cursor:auto;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;line-height:1.4}.kp-decorator-header-and-footer .hds-theme-bring{box-sizing:border-box;font:var(--hds-typography-body);fill:var(--hds-ui-colors-black);color:var(--hds-ui-colors-black);cursor:auto;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;line-height:1.4}.kp-decorator-header-and-footer :is(.hds-theme-posten,.hds-theme-bring) body{background:var(--hds-ui-colors-white)}.kp-decorator-header-and-footer .hds-button{--hds-component-button-border-width:0px;-webkit-font-smoothing:antialiased;-webkit-appearance:button;box-sizing:border-box;border-radius:var(--hds-border-radius);border-style:solid;border-width:var(--hds-component-button-border-width);transition:all var(--hds-micro-animation-duration-quick)var(--hds-micro-animation-easing-normal);cursor:pointer;word-break:normal;font:var(--hds-typography-body-small-title);display:inline-block}.kp-decorator-header-and-footer .hds-button.hds-button--small{font-size:var(--hds-font-size-technical-title-max);line-height:var(--hds-line-height-technical-title-max);padding:calc(var(--hds-spacing-small-3) - var(--hds-component-button-border-width))calc(var(--hds-spacing-small-4) - var(--hds-component-button-border-width));height:calc(var(--hds-line-height-technical-title-max) + var(--hds-spacing-small-3)*2)}.kp-decorator-header-and-footer .hds-button.hds-button--medium{font-size:var(--hds-font-size-body-small-title-max);line-height:var(--hds-line-height-body-small-title-max);padding:calc(var(--hds-spacing-small-3) - var(--hds-component-button-border-width))calc(var(--hds-spacing-medium-1) - var(--hds-component-button-border-width));height:calc(var(--hds-line-height-body-small-title-max) + var(--hds-spacing-small-3)*2)}.kp-decorator-header-and-footer .hds-button.hds-button--large{font-size:var(--hds-font-size-body-small-title-max);line-height:var(--hds-line-height-body-small-title-max);padding:calc(var(--hds-spacing-small-4) - var(--hds-component-button-border-width))calc(var(--hds-spacing-medium-2) - var(--hds-component-button-border-width));height:calc(var(--hds-line-height-body-small-title-max) + var(--hds-spacing-small-4)*2)}.kp-decorator-header-and-footer .hds-button.hds-button--full{width:100%}.kp-decorator-header-and-footer .hds-button.hds-button--mobile-full{width:100%}@media (min-width:720px){.kp-decorator-header-and-footer .hds-button.hds-button--mobile-full{width:unset}}.kp-decorator-header-and-footer .hds-button.hds-button--primary{background-color:var(--hds-brand-colors-signature);color:var(--hds-brand-button-colors-text);fill:var(--hds-brand-button-colors-text)}.kp-decorator-header-and-footer .hds-button.hds-button--primary:hover{background-color:var(--hds-brand-colors-signature-hover);outline:0 solid var(--hds-brand-colors-signature-hover)}.kp-decorator-header-and-footer .hds-button.hds-button--primary:active{background-color:var(--hds-brand-colors-signature);outline:0 solid var(--hds-brand-colors-signature-hover)}.kp-decorator-header-and-footer .hds-button.hds-button--secondary{background-color:var(--hds-brand-colors-darker);color:var(--hds-ui-colors-white);fill:var(--hds-ui-colors-white)}.kp-decorator-header-and-footer .hds-button.hds-button--secondary:hover{background-color:var(--hds-ui-colors-black);outline:0 solid var(--hds-ui-colors-black)}.kp-decorator-header-and-footer .hds-button.hds-button--secondary:active{background-color:var(--hds-brand-colors-darker);outline:0 solid var(--hds-ui-colors-black)}.kp-decorator-header-and-footer .hds-button.hds-button--outline-primary{--hds-component-button-border-width:var(--hds-stroke-thick);border-color:var(--hds-brand-colors-signature);color:var(--hds-ui-colors-black);fill:var(--hds-ui-colors-black);outline-offset:3px;background-color:transparent}.kp-decorator-header-and-footer .hds-button.hds-button--outline-primary:hover{color:var(--hds-brand-colors-dark);fill:var(--hds-brand-colors-dark);border-color:var(--hds-brand-colors-dark)}.kp-decorator-header-and-footer .hds-button.hds-button--outline-primary:active{color:var(--hds-brand-colors-dark);fill:var(--hds-brand-colors-dark);border-color:var(--hds-brand-colors-dark)}.kp-decorator-header-and-footer .hds-button.hds-button--outline-secondary{--hds-component-button-border-width:var(--hds-stroke-thick);border-color:var(--hds-brand-colors-darker);color:var(--hds-brand-colors-darker);fill:var(--hds-brand-colors-darker);outline-offset:3px;background-color:transparent}.kp-decorator-header-and-footer .hds-button.hds-button--outline-secondary:hover{color:var(--hds-ui-colors-black);fill:var(--hds-ui-colors-black);border-color:var(--hds-ui-colors-black)}.kp-decorator-header-and-footer .hds-button.hds-button--outline-secondary:active{color:var(--hds-ui-colors-black);fill:var(--hds-ui-colors-black);border-color:var(--hds-ui-colors-black)}.kp-decorator-header-and-footer .hds-button.hds-button--outline-white{--hds-component-button-border-width:var(--hds-stroke-thick);border-color:var(--hds-brand-colors-light);color:var(--hds-ui-colors-white);fill:var(--hds-ui-colors-white);outline-offset:3px;background-color:transparent}.kp-decorator-header-and-footer .hds-button.hds-button--outline-white:hover{color:var(--hds-brand-colors-light);fill:var(--hds-brand-colors-light)}.kp-decorator-header-and-footer .hds-button.hds-button--outline-white:active{color:var(--hds-brand-colors-light);fill:var(--hds-brand-colors-light)}.kp-decorator-header-and-footer .hds-button:disabled.hds-button--primary{color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);background-color:var(--hds-ui-colors-grey);border-color:var(--hds-ui-colors-grey);box-shadow:none;cursor:default;outline:0}.kp-decorator-header-and-footer .hds-button:disabled.hds-button--secondary{color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);background-color:var(--hds-ui-colors-grey);border-color:var(--hds-ui-colors-grey);box-shadow:none;cursor:default;outline:0}.kp-decorator-header-and-footer .hds-button:disabled.hds-button--outline-primary{border-color:var(--hds-ui-colors-grey);color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);cursor:default;background-color:transparent}.kp-decorator-header-and-footer .hds-button:disabled.hds-button--outline-secondary{border-color:var(--hds-ui-colors-grey);color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);cursor:default;background-color:transparent}.kp-decorator-header-and-footer .hds-button[disabled].hds-button--primary{color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);background-color:var(--hds-ui-colors-grey);border-color:var(--hds-ui-colors-grey);box-shadow:none;cursor:default;outline:0}.kp-decorator-header-and-footer .hds-button[disabled].hds-button--secondary{color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);background-color:var(--hds-ui-colors-grey);border-color:var(--hds-ui-colors-grey);box-shadow:none;cursor:default;outline:0}.kp-decorator-header-and-footer .hds-button[disabled].hds-button--outline-primary{border-color:var(--hds-ui-colors-grey);color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);cursor:default;background-color:transparent}.kp-decorator-header-and-footer .hds-button[disabled].hds-button--outline-secondary{border-color:var(--hds-ui-colors-grey);color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);cursor:default;background-color:transparent}.kp-decorator-header-and-footer .hds-button[disabled]:active.hds-button--primary{color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);background-color:var(--hds-ui-colors-grey);border-color:var(--hds-ui-colors-grey);box-shadow:none;cursor:default;outline:0}.kp-decorator-header-and-footer .hds-button[disabled]:active.hds-button--secondary{color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);background-color:var(--hds-ui-colors-grey);border-color:var(--hds-ui-colors-grey);box-shadow:none;cursor:default;outline:0}.kp-decorator-header-and-footer .hds-button[disabled]:active.hds-button--outline-primary{border-color:var(--hds-ui-colors-grey);color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);cursor:default;background-color:transparent}.kp-decorator-header-and-footer .hds-button[disabled]:active.hds-button--outline-secondary{border-color:var(--hds-ui-colors-grey);color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);cursor:default;background-color:transparent}.kp-decorator-header-and-footer .hds-link{border-bottom:var(--hds-stroke-default)solid var(--hds-brand-link-colors-underline);fill:var(--hds-brand-link-colors-text);color:var(--hds-brand-link-colors-text);transition:all var(--hds-micro-animation-duration-quick)var(--hds-micro-animation-easing-normal);cursor:pointer;text-decoration:none}.kp-decorator-header-and-footer .hds-link:hover{color:var(--hds-brand-link-colors-hover);fill:var(--hds-brand-link-colors-hover);border-color:var(--hds-brand-link-colors-underline-hover)}.kp-decorator-header-and-footer .hds-link:hover .hds-link__text{border-color:var(--hds-brand-link-colors-underline-hover)}.kp-decorator-header-and-footer .hds-link:active{color:var(--hds-brand-link-colors-hover);fill:var(--hds-brand-link-colors-hover);border-color:var(--hds-brand-link-colors-underline-hover)}.kp-decorator-header-and-footer .hds-link:active .hds-link__text{border-color:var(--hds-brand-link-colors-underline-hover)}.kp-decorator-header-and-footer .hds-link.hds-link--inverted{color:var(--hds-ui-colors-white);-webkit-text-decoration-color:var(--hds-brand-colors-signature);-webkit-text-decoration-color:var(--hds-brand-colors-signature);text-decoration-color:var(--hds-brand-colors-signature);border-color:currentColor}.kp-decorator-header-and-footer .hds-link.hds-link--inverted:hover{color:var(--hds-brand-colors-light);border-color:currentColor}.kp-decorator-header-and-footer .hds-link.hds-link--inverted:active{color:var(--hds-brand-colors-light);border-color:currentColor}.kp-decorator-header-and-footer .hds-link.hds-link--inverted:disabled{color:var(--hds-ui-colors-dark-grey);fill:currentColor;cursor:default;border-color:currentColor;box-shadow:none!important;outline:0!important}.kp-decorator-header-and-footer .hds-link.hds-link--small{font:var(--hds-typography-body-small)}.kp-decorator-header-and-footer .hds-link.hds-link--large{font:var(--hds-typography-header-h3)}.kp-decorator-header-and-footer .hds-link.hds-link--no-underline{font-family:var(--hds-fonts-posten-sans-medium);color:var(--hds-brand-colors-dark);border-bottom:none;text-decoration:none}.kp-decorator-header-and-footer .hds-link.hds-link--no-underline:hover{color:var(--hds-brand-colors-dark);text-decoration:underline;-webkit-text-decoration-color:var(--hds-brand-colors-dark);-webkit-text-decoration-color:var(--hds-brand-colors-dark);text-decoration-color:var(--hds-brand-colors-dark);border-bottom:none}.kp-decorator-header-and-footer .hds-link.hds-link--solid{color:var(--hds-ui-colors-black);border-color:var(--hds-ui-colors-black)}.kp-decorator-header-and-footer .hds-link.hds-link--solid:hover{color:var(--hds-ui-colors-black-hover);border-color:var(--hds-ui-colors-black-hover)}.kp-decorator-header-and-footer .hds-link.hds-link--solid:active{color:var(--hds-ui-colors-black-hover);border-color:var(--hds-ui-colors-black-hover)}.kp-decorator-header-and-footer .hds-badge{border:var(--hds-stroke-default)solid var(--hds-brand-colors-lighter);border-radius:var(--hds-border-radius);text-transform:uppercase;font-size:12px;line-height:1.1;font-family:var(--hds-fonts-posten-sans-medium);-moz-osx-font-smoothing:subpixel-antialiased;-webkit-font-smoothing:subpixel-antialiased;vertical-align:10%;display:inline-block}.kp-decorator-header-and-footer .hds-badge{padding:var(--hds-spacing-small-1)var(--hds-spacing-small-2)}.kp-decorator-header-and-footer .hds-badge.hds-badge--small{padding:var(--hds-spacing-small-1)var(--hds-spacing-small-2)}.kp-decorator-header-and-footer .hds-badge.hds-badge--smaller{padding:2px var(--hds-spacing-small-1)}.kp-decorator-header-and-footer .hds-badge{background-color:var(--hds-brand-colors-lighter);border-color:var(--hds-brand-colors-lighter);color:var(--hds-brand-colors-dark)}.kp-decorator-header-and-footer .hds-badge.hds-badge--primary{background-color:var(--hds-brand-colors-lighter);border-color:var(--hds-brand-colors-lighter);color:var(--hds-brand-colors-dark)}.kp-decorator-header-and-footer .hds-badge.hds-badge--dark{background-color:var(--hds-brand-colors-darker);border-color:var(--hds-brand-colors-darker);color:var(--hds-ui-colors-white)}.kp-decorator-header-and-footer .hds-badge.hds-badge--white{background-color:var(--hds-ui-colors-white);border-color:var(--hds-ui-colors-white);color:var(--hds-brand-colors-dark)}.kp-decorator-header-and-footer .hds-badge.hds-badge--warning{background-color:var(--hds-ui-colors-warning-yellow);border-color:var(--hds-ui-colors-warning-yellow);color:var(--hds-brand-link-colors-text)}.kp-decorator-header-and-footer .hds-description-list{font:var(--hds-typography-body);margin:0;padding-left:0;list-style:none}.kp-decorator-header-and-footer .hds-description-list dt{font-family:var(--hds-fonts-posten-sans-bold)}.kp-decorator-header-and-footer .hds-description-list dd{margin-left:0;margin-bottom:var(--hds-spacing-small-3)}.kp-decorator-header-and-footer .hds-description-list.hds-description-list--horizontal dt{margin-right:var(--hds-spacing-small-1);margin-bottom:var(--hds-spacing-small-2);display:inline-block}.kp-decorator-header-and-footer .hds-description-list.hds-description-list--horizontal dt:after{content:"\a ";white-space:pre}.kp-decorator-header-and-footer .hds-description-list.hds-description-list--horizontal dd{display:inline}.kp-decorator-header-and-footer .hds-description-list.hds-description-list--horizontal dd:after{content:"\a ";white-space:pre}.kp-decorator-header-and-footer .hds-list{padding-left:var(--hds-spacing-medium-2);margin:0}.kp-decorator-header-and-footer .hds-list li{margin-bottom:var(--hds-spacing-small-3);position:relative}.kp-decorator-header-and-footer .hds-list ul{list-style:none}.kp-decorator-header-and-footer .hds-list ul li:before{content:"";background:var(--hds-brand-colors-dark);border-radius:50%;width:6px;height:6px;margin-left:-22px;position:absolute;top:11px}.kp-decorator-header-and-footer .hds-list.hds-list--small{font:var(--hds-typography-body-small);padding-left:var(--hds-spacing-medium-1);line-height:1.8}.kp-decorator-header-and-footer .hds-list.hds-list--small li{margin-bottom:0}.kp-decorator-header-and-footer .hds-list.hds-list--small li:before{width:5px;height:5px;margin-top:3px;margin-left:-18px;top:9px}.kp-decorator-header-and-footer .hds-list.hds-list--medium{font:var(--hds-typography-body)}.kp-decorator-header-and-footer .hds-list.hds-list--large{font:var(--hds-typography-header-h3)}.kp-decorator-header-and-footer .hds-list.hds-list--large li{margin-bottom:9px}.kp-decorator-header-and-footer .hds-list.hds-list--large li:before{width:8px;height:8px;margin-left:-24px;top:10px}.kp-decorator-header-and-footer .hds-list.hds-list--style-hidden{padding-left:0;list-style:none}.kp-decorator-header-and-footer .hds-typography-h2-display{font:var(--hds-brand-typography-h1-display)}.kp-decorator-header-and-footer .hds-typography-h1{font:var(--hds-brand-typography-h1)}.kp-decorator-header-and-footer .hds-typography-h1.hds-typography-h1--spacing{margin-top:var(--hds-spacing-large-2)}.kp-decorator-header-and-footer .hds-typography-h2{font:var(--hds-brand-typography-h2)}.kp-decorator-header-and-footer .hds-typography-h2.hds-typography-h2--spacing{margin-top:var(--hds-spacing-large-2)}.kp-decorator-header-and-footer .hds-typography-h1~.hds-typography-h2.hds-typography-h2--spacing{margin-top:var(--hds-spacing-medium-3)}.kp-decorator-header-and-footer .hds-typography-h3{font:var(--hds-typography-header-h3)}.kp-decorator-header-and-footer .hds-typography-h3.hds-typography-h3--title{font:var(--hds-typography-header-h3-title)}.kp-decorator-header-and-footer .hds-typography-h3.hds-typography-h3--spacing{margin-top:var(--hds-spacing-large-2)}.kp-decorator-header-and-footer .hds-typography-body{font:var(--hds-typography-body)}.kp-decorator-header-and-footer .hds-typography-body.hds-typography-body--title{font:var(--hds-typography-body-title)}.kp-decorator-header-and-footer .hds-typography-body.hds-typography-body--spacing{margin-top:var(--hds-spacing-medium-2)}.kp-decorator-header-and-footer .hds-typography-body-small{font:var(--hds-typography-body-small)}.kp-decorator-header-and-footer .hds-typography-body-small.hds-typography-body-small--title{font:var(--hds-typography-body-small-title)}.kp-decorator-header-and-footer .hds-typography-body-small.hds-typography-body-small--spacing{margin-top:var(--hds-spacing-medium-2)}.kp-decorator-header-and-footer .hds-typography-caption{font:var(--hds-typography-caption)}.kp-decorator-header-and-footer .hds-typography-caption.hds-typography-caption--title{font:var(--hds-typography-caption-title)}.kp-decorator-header-and-footer .hds-typography-caption.hds-typography-caption--spacing{margin-top:var(--hds-spacing-medium-2)}.kp-decorator-header-and-footer .hds-typography-technical{font:var(--hds-typography-technical)}.kp-decorator-header-and-footer .hds-typography-technical.hds-typography-technical--title{font:var(--hds-typography-technical-title)}.kp-decorator-header-and-footer .hds-typography-technical.hds-typography-technical--spacing{margin-top:var(--hds-spacing-small-1)}@media (min-width:940px){.kp-decorator-header-and-footer .hds-typography-technical.hds-typography-technical--spacing{margin-top:var(--hds-spacing-small-2)}}.kp-decorator-header-and-footer .hds-box{--hds-component-box-padding:var(--hds-spacing-medium-2);padding:var(--hds-component-box-padding);position:relative}.kp-decorator-header-and-footer .hds-box{background-color:var(--hds-ui-colors-light-grey-fill)}.kp-decorator-header-and-footer .hds-box.hds-box--light-grey{background-color:var(--hds-ui-colors-light-grey-fill)}.kp-decorator-header-and-footer .hds-box.hds-box--lighter{background-color:var(--hds-brand-colors-lighter)}.kp-decorator-header-and-footer .hds-box.hds-box--white{background-color:var(--hds-ui-colors-white);box-shadow:var(--hds-shadow-default)}.kp-decorator-header-and-footer .hds-box.hds-box--warning{background-color:var(--hds-ui-colors-warning-yellow)}@media (min-width:720px){.kp-decorator-header-and-footer .hds-box{--hds-component-box-padding:var(--hds-spacing-medium-3)}}.kp-decorator-header-and-footer .hds-box.hds-box--closed{display:none}.kp-decorator-header-and-footer .hds-box .hds-box__close-button{top:var(--hds-spacing-small-4);right:var(--hds-spacing-small-4);cursor:pointer;transition:filter var(--hds-micro-animation-duration-quick)var(--hds-micro-animation-easing-normal);background:url("data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M13.1602 12.25L16.7812 8.66406L17.5195 7.92578C17.625 7.82031 17.625 7.64453 17.5195 7.50391L16.7461 6.73047C16.6055 6.625 16.4297 6.625 16.3242 6.73047L12 11.0898L7.64062 6.73047C7.53516 6.625 7.35938 6.625 7.21875 6.73047L6.44531 7.50391C6.33984 7.64453 6.33984 7.82031 6.44531 7.92578L10.8047 12.25L6.44531 16.6094C6.33984 16.7148 6.33984 16.8906 6.44531 17.0312L7.21875 17.8047C7.35938 17.9102 7.53516 17.9102 7.64062 17.8047L12 13.4453L15.5859 17.0664L16.3242 17.8047C16.4297 17.9102 16.6055 17.9102 16.7461 17.8047L17.5195 17.0312C17.625 16.8906 17.625 16.7148 17.5195 16.6094L13.1602 12.25Z\" fill=\"black\"/></svg>");border:none;width:24px;height:24px;padding:0;position:absolute}.kp-decorator-header-and-footer .hds-box .hds-box__close-button:hover{filter:invert(40%)}.kp-decorator-header-and-footer .hds-box .hds-box__close-button:focus{box-shadow:0 0 0 2px var(--hds-ui-colors-black-hover);outline:none}.kp-decorator-header-and-footer .hds-box.hds-message{--hds-component-message-icon-width:var(--hds-spacing-medium-3);--hds-component-message-spacing-between:var(--hds-spacing-small-4);--hds-component-message-padding:var(--hds-component-box-padding);padding-left:calc(var(--hds-component-message-padding) + var(--hds-component-message-icon-width) + var(--hds-component-message-spacing-between))}@media (min-width:720px){.kp-decorator-header-and-footer .hds-box.hds-message{--hds-component-message-spacing-between:var(--hds-spacing-medium-2)}}.kp-decorator-header-and-footer .hds-box.hds-message:before{content:"";top:var(--hds-component-message-padding);left:var(--hds-component-message-padding);width:var(--hds-component-message-icon-width);height:var(--hds-component-message-icon-width);position:absolute}.kp-decorator-header-and-footer .hds-box.hds-message.hds-message--success{background-color:var(--hds-ui-colors-light-grey-fill)}.kp-decorator-header-and-footer .hds-box.hds-message.hds-message--success:before{background-image:url("data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"32\" height=\"32\" viewBox=\"0 0 32 32\" fill=\"none\"><path d=\"M27.6412 7.54758C28.3713 8.22153 28.3713 9.40094 27.6412 10.0749L13.2636 24.4524C12.5897 25.1825 11.4103 25.1825 10.7363 24.4524L3.54758 17.2637C2.81747 16.5897 2.81747 15.4103 3.54758 14.7363C4.22153 14.0062 5.40094 14.0062 6.07488 14.7363L11.9719 20.6334L25.1139 7.54758C25.7878 6.81747 26.9672 6.81747 27.6412 7.54758Z\" fill=\"%237BC144\"/></svg>")}.kp-decorator-header-and-footer .hds-box.hds-message.hds-message--attention{background-color:var(--hds-ui-colors-warning-yellow-light-fill)}.kp-decorator-header-and-footer .hds-box.hds-message.hds-message--attention:before{background-image:url("data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"32\" height=\"32\" viewBox=\"0 0 32 32\" fill=\"none\"><path d=\"M29.0323 23.7656C29.8537 25.2031 28.8269 27 27.1327 27H5.21084C3.51664 27 2.48986 25.2031 3.25994 23.7656L14.2466 5.07812C14.7086 4.35938 15.4274 4 16.1974 4C16.9162 4 17.6349 4.35938 18.097 5.07812L29.0323 23.7656ZM5.72423 24.5357H26.6193L16.1461 6.72098L5.72423 24.5357ZM16.1974 19.7098C17.0702 19.7098 17.789 20.4286 17.789 21.3013C17.789 22.1741 17.0702 22.8929 16.1974 22.8929C15.2733 22.8929 14.5546 22.1741 14.5546 21.3013C14.5546 20.4286 15.2733 19.7098 16.1974 19.7098ZM14.9653 11.8036C14.9653 11.1362 15.4787 10.5714 16.1974 10.5714C16.8649 10.5714 17.4296 11.1362 17.4296 11.8036V16.7321C17.4296 17.4509 16.8649 17.9643 16.1974 17.9643C15.4787 17.9643 14.9653 17.4509 14.9653 16.7321V11.8036Z\" fill=\"black\"/></svg>")}.kp-decorator-header-and-footer .hds-box.hds-message.hds-message--warning{background-color:var(--hds-ui-colors-warning-yellow)}.kp-decorator-header-and-footer .hds-box.hds-message.hds-message--warning:before{background-image:url("data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"32\" height=\"32\" viewBox=\"0 0 32 32\" fill=\"none\"><rect x=\"12\" y=\"10\" width=\"8\" height=\"14.6667\" rx=\"4\" fill=\"%23FDBB2F\"/><path d=\"M29.0094 24.7656C29.8308 26.2031 28.804 28 27.1098 28H5.18794C3.49374 28 2.46695 26.2031 3.28838 24.7656L14.275 6.07812C15.0964 4.64062 17.2013 4.64062 18.0741 6.07812L29.0094 24.7656ZM14.9424 11.9821V18.5536C14.9424 19.2723 15.5585 19.7857 16.1745 19.7857C16.842 19.7857 17.4067 19.2723 17.4067 18.5536V11.9821C17.4067 11.3147 16.842 10.75 16.1745 10.75C15.4558 10.75 14.9424 11.3147 14.9424 11.9821ZM16.1745 24.7143C17.0473 24.7143 17.7661 23.9955 17.7661 23.1228C17.7661 22.25 17.0473 21.5312 16.1745 21.5312C15.2504 21.5312 14.5317 22.25 14.5317 23.1228C14.5317 23.9955 15.2504 24.7143 16.1745 24.7143Z\" fill=\"black\"/></svg>")}.kp-decorator-header-and-footer .hds-box.hds-message.hds-message--neutral{background-color:var(--hds-ui-colors-light-grey-fill)}.kp-decorator-header-and-footer .hds-box.hds-message.hds-message--neutral .hds-message--neutral__icon{top:var(--hds-component-message-padding);left:var(--hds-component-message-padding);width:var(--hds-component-message-icon-width);position:absolute}.kp-decorator-header-and-footer .hds-input{gap:var(--hds-spacing-small-1);flex-flow:column;display:flex}.kp-decorator-header-and-footer .hds-input.hds-input--error .hds-input__input{border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-warning-yellow);margin-bottom:calc(var(--hds-stroke-thick) - var(--hds-stroke-default));position:relative}.kp-decorator-header-and-footer .hds-input.hds-input--error .hds-input__input:focus{border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-warning-yellow);margin-bottom:calc(var(--hds-stroke-thick) - var(--hds-stroke-default));position:relative}.kp-decorator-header-and-footer .hds-input.hds-input--lined.hds-input--error .hds-input__input{border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-warning-yellow);margin-bottom:calc(var(--hds-stroke-thick) - var(--hds-stroke-default));position:relative}.kp-decorator-header-and-footer .hds-input.hds-input--lined.hds-input--error .hds-input__input:focus{border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-warning-yellow);margin-bottom:calc(var(--hds-stroke-thick) - var(--hds-stroke-default));position:relative}.kp-decorator-header-and-footer .hds-input.hds-input--default .hds-input__input{background-color:var(--hds-ui-colors-light-grey-fill)}.kp-decorator-header-and-footer .hds-input.hds-input--white .hds-input__input{background-color:var(--hds-ui-colors-white)}.kp-decorator-header-and-footer .hds-input.hds-input--lined .hds-input__input{border-bottom:var(--hds-stroke-default)solid var(--hds-ui-colors-grey);padding-left:0;padding-top:var(--hds-spacing-small-1);padding-bottom:var(--hds-spacing-small-3);background:0 0;border-radius:0}.kp-decorator-header-and-footer .hds-input:focus-within .hds-input__label{color:var(--hds-brand-colors-darker)}.kp-decorator-header-and-footer .hds-input .hds-input__label{transition:color var(--hds-micro-animation-duration-normal)var(--hds-micro-animation-easing-normal);font:var(--hds-typography-caption);order:1}.kp-decorator-header-and-footer .hds-input .hds-input__input{color:var(--hds-ui-colors-black);padding:var(--hds-spacing-small-4);font:var(--hds-typography-body-small);border:var(--hds-stroke-default)solid transparent;border-radius:var(--hds-border-radius);transition:border margin var(--hds-micro-animation-duration-normal)var(--hds-micro-animation-easing-normal);box-sizing:border-box;order:2;width:100%;line-height:normal;position:relative}.kp-decorator-header-and-footer .hds-input .hds-input__input::placeholder{color:var(--hds-ui-colors-dark-grey);opacity:1}.kp-decorator-header-and-footer .hds-input .hds-input__input::placeholder{color:var(--hds-ui-colors-dark-grey);opacity:1}.kp-decorator-header-and-footer .hds-input .hds-input__input:focus{border-bottom:var(--hds-stroke-default)solid var(--hds-brand-colors-darker);outline:0}.kp-decorator-header-and-footer .hds-input .hds-input__input:focus::placeholder{color:var(--hds-ui-colors-grey)}.kp-decorator-header-and-footer .hds-input .hds-input__input:focus::placeholder{color:var(--hds-ui-colors-grey)}.kp-decorator-header-and-footer .hds-input .hds-input__input:disabled{color:var(--hds-ui-colors-dark-grey);background-color:var(--hds-ui-colors-grey);border:var(--hds-stroke-default)solid var(--hds-ui-colors-grey)}.kp-decorator-header-and-footer .hds-input .hds-input__input:read-only{color:var(--hds-ui-colors-dark-grey);background-color:var(--hds-ui-colors-grey);border:var(--hds-stroke-default)solid var(--hds-ui-colors-grey)}.kp-decorator-header-and-footer .hds-input .hds-input__input:read-only:focus{border-bottom-color:var(--hds-brand-colors-darker)}.kp-decorator-header-and-footer .hds-input .hds-input__error-message{font:var(--hds-typography-caption-title);color:var(--hds-ui-colors-dark-grey);padding:var(--hds-spacing-small-1)0 0 var(--hds-spacing-small-4);order:3}.kp-decorator-header-and-footer .hds-accordion{--hds-accordion-icon-dimension:24px;--hds-component-accordion-trigger-spacing-between:var(--hds-spacing-small-4);--hds-component-accordion-content-spacing:var(--hds-spacing-medium-3);border:none;border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-light-grey-fill);font:var(--hds-typography-body);fill:var(--hds-ui-colors-black);color:var(--hds-ui-colors-black);list-style:none;display:block}@media (min-width:720px){.kp-decorator-header-and-footer .hds-accordion{--hds-component-accordion-content-spacing:var(--hds-spacing-large-1);--hds-component-accordion-trigger-spacing-between:var(--hds-spacing-medium-2)}}.kp-decorator-header-and-footer .hds-accordion .hds-accordion-item{overflow:hidden}.kp-decorator-header-and-footer .hds-accordion .hds-accordion-item.hds-accordion-item__expanded .hds-accordion-item-trigger{color:var(--hds-brand-colors-dark)}.kp-decorator-header-and-footer .hds-accordion .hds-accordion-item:first-child .hds-accordion-item-trigger{border:0}.kp-decorator-header-and-footer .hds-accordion .hds-accordion-item .hds-accordion-item-trigger{padding:var(--hds-component-accordion-trigger-spacing-between)0;border:0;border-top:var(--hds-stroke-thick)solid var(--hds-ui-colors-light-grey-fill);text-align:left;font:var(--hds-typography-body);background-color:transparent;width:100%;display:block;position:relative}.kp-decorator-header-and-footer .hds-accordion .hds-accordion-item .hds-accordion-item-trigger:hover{color:var(--hds-brand-colors-dark);outline:0}.kp-decorator-header-and-footer .hds-accordion .hds-accordion-item .hds-accordion-item-trigger .hds-accordion-item-trigger--icon{color:var(--hds-brand-colors-dark);margin-right:var(--hds-spacing-small-4);width:var(--hds-accordion-icon-dimension);height:var(--hds-accordion-icon-dimension);display:inline-block}.kp-decorator-header-and-footer .hds-accordion .hds-accordion-item .hds-accordion-item-content{padding:0 0 var(--hds-component-accordion-content-spacing)var(--hds-spacing-medium-4);font:var(--hds-typography-body-small)}.kp-decorator-header-and-footer .hds-accordion .hds-accordion-item .hds-accordion-item-content.hds-accordion-item-content--closed{display:none}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
.hds-typography-h2-display{font:var(--hds-brand-typography-h1-display)}.hds-typography-h1{font:var(--hds-brand-typography-h1)}.hds-typography-h1.hds-typography-h1--spacing{margin-top:var(--hds-spacing-large-2)}.hds-typography-h2{font:var(--hds-brand-typography-h2)}.hds-typography-h2.hds-typography-h2--spacing{margin-top:var(--hds-spacing-large-2)}.hds-typography-h1~.hds-typography-h2.hds-typography-h2--spacing{margin-top:var(--hds-spacing-medium-3)}.hds-typography-h3{font:var(--hds-typography-header-h3)}.hds-typography-h3.hds-typography-h3--title{font:var(--hds-typography-header-h3-title)}.hds-typography-h3.hds-typography-h3--spacing{margin-top:var(--hds-spacing-large-2)}.hds-typography-body{font:var(--hds-typography-body)}.hds-typography-body.hds-typography-body--title{font:var(--hds-typography-body-title)}.hds-typography-body.hds-typography-body--spacing{margin-top:var(--hds-spacing-medium-2)}.hds-typography-body-small{font:var(--hds-typography-body-small)}.hds-typography-body-small.hds-typography-body-small--title{font:var(--hds-typography-body-small-title)}.hds-typography-body-small.hds-typography-body-small--spacing{margin-top:var(--hds-spacing-medium-2)}.hds-typography-caption{font:var(--hds-typography-caption)}.hds-typography-caption.hds-typography-caption--title{font:var(--hds-typography-caption-title)}.hds-typography-caption.hds-typography-caption--spacing{margin-top:var(--hds-spacing-medium-2)}.hds-typography-technical{font:var(--hds-typography-technical)}.hds-typography-technical.hds-typography-technical--title{font:var(--hds-typography-technical-title)}.hds-typography-technical.hds-typography-technical--spacing{margin-top:var(--hds-spacing-small-1)}@media (min-width:940px){.hds-typography-technical.hds-typography-technical--spacing{margin-top:var(--hds-spacing-small-2)}}
|
|
2
|
-
/*# sourceMappingURL
|
|
2
|
+
/*# sourceMappingURL=./dist/typography.css.map */
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"mappings":"AAAA,uEAIA,uDAGE,oFAKF,uDAGE,oFAIA,wGAKF,wDAGE,uFAIA,oFAKF,qDAGE,sFAIA,yFAKF,iEAGE,wGAIA,qGAKF,2DAGE,+FAIA,+FAKF,+DAGE,qGAIA,kGAIA,yBACE","sources":["src/typography/typography.css"],"sourcesContent":[".hds-typography-h2-display {\n font: var(--hds-brand-typography-h1-display);\n}\n\n.hds-typography-h1 {\n font: var(--hds-brand-typography-h1);\n\n &.hds-typography-h1--spacing {\n margin-top: var(--hds-spacing-large-2);\n }\n}\n\n.hds-typography-h2 {\n font: var(--hds-brand-typography-h2);\n\n &.hds-typography-h2--spacing {\n margin-top: var(--hds-spacing-large-2);\n }\n\n .hds-typography-h1 ~ &.hds-typography-h2--spacing {\n margin-top: var(--hds-spacing-medium-3);\n }\n}\n\n.hds-typography-h3 {\n font: var(--hds-typography-header-h3);\n\n &.hds-typography-h3--title {\n font: var(--hds-typography-header-h3-title);\n }\n\n &.hds-typography-h3--spacing {\n margin-top: var(--hds-spacing-large-2);\n }\n}\n\n.hds-typography-body {\n font: var(--hds-typography-body);\n\n &.hds-typography-body--title {\n font: var(--hds-typography-body-title);\n }\n\n &.hds-typography-body--spacing {\n margin-top: var(--hds-spacing-medium-2);\n }\n}\n\n.hds-typography-body-small {\n font: var(--hds-typography-body-small);\n\n &.hds-typography-body-small--title {\n font: var(--hds-typography-body-small-title);\n }\n\n &.hds-typography-body-small--spacing {\n margin-top: var(--hds-spacing-medium-2);\n }\n}\n\n.hds-typography-caption {\n font: var(--hds-typography-caption);\n\n &.hds-typography-caption--title {\n font: var(--hds-typography-caption-title);\n }\n\n &.hds-typography-caption--spacing {\n margin-top: var(--hds-spacing-medium-2);\n }\n}\n\n.hds-typography-technical {\n font: var(--hds-typography-technical);\n\n &.hds-typography-technical--title {\n font: var(--hds-typography-technical-title);\n }\n\n &.hds-typography-technical--spacing {\n margin-top: var(--hds-spacing-small-1);\n }\n\n @media (min-width: 940px) {\n &.hds-typography-technical--spacing {\n margin-top: var(--hds-spacing-small-2);\n }\n }\n}\n"],"names":[]}
|
package/package.json
CHANGED
|
@@ -1,46 +1,42 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@postenbring/hedwig-css",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.6",
|
|
4
4
|
"description": "",
|
|
5
|
-
"scripts": {
|
|
6
|
-
"build": "npm-run-all build:*",
|
|
7
|
-
"build:css": "parcel build --no-cache 'src/*.css' 'src/**/*.css' 'src/*.scss' 'src/**/*.scss'",
|
|
8
|
-
"build:typed-classname": "postcss dist/index.css --config ./typed-classname --no-map > /dev/null",
|
|
9
|
-
"dev": "npm-run-all -p dev:*",
|
|
10
|
-
"dev:css": "parcel watch --no-cache 'src/*.css' 'src/**/*.css' 'src/*.scss' 'src/**/*.scss'",
|
|
11
|
-
"dev:typed-classname": "chokidar 'dist/index.css' -c 'npm run build:typed-classname'",
|
|
12
|
-
"lint": "stylelint 'src/**/*.css' 'src/**/*.scss' --cache",
|
|
13
|
-
"lint:fix": "npm run lint -- --fix",
|
|
14
|
-
"clean": "rm -rf .turbo && rm -rf .parcel-cache && rm -rf node_modules && rm -rf dist"
|
|
15
|
-
},
|
|
16
5
|
"files": [
|
|
17
6
|
"dist/**",
|
|
18
|
-
"typed-classname
|
|
19
|
-
"typed-classname.d.mts"
|
|
7
|
+
"typed-classname/**"
|
|
20
8
|
],
|
|
21
9
|
"license": "MIT",
|
|
22
10
|
"devDependencies": {
|
|
23
|
-
"
|
|
24
|
-
"autoprefixer": "10.4.16",
|
|
11
|
+
"browserslist": "4.22.1",
|
|
25
12
|
"chokidar-cli": "3.0.0",
|
|
26
|
-
"
|
|
27
|
-
"
|
|
28
|
-
"postcss": "8.4.31",
|
|
29
|
-
"postcss-cli": "10.1.0",
|
|
30
|
-
"postcss-custom-properties": "13.3.2",
|
|
31
|
-
"postcss-import": "15.1.0",
|
|
32
|
-
"postcss-nested": "6.0.1",
|
|
33
|
-
"postcss-ts-classnames": "0.3.0",
|
|
13
|
+
"lightningcss": "1.22.1",
|
|
14
|
+
"lightningcss-cli": "1.22.1",
|
|
34
15
|
"sanitize.css": "^13.0.0",
|
|
35
16
|
"stylelint": "15.11.0",
|
|
17
|
+
"stylelint-config-prettier-scss": "1.0.0",
|
|
36
18
|
"stylelint-config-standard": "34.0.0",
|
|
37
19
|
"stylelint-config-standard-scss": "11.1.0",
|
|
38
|
-
"stylelint-value-no-unknown-custom-properties": "5.0.0"
|
|
20
|
+
"stylelint-value-no-unknown-custom-properties": "5.0.0",
|
|
21
|
+
"wait-on": "^7.2.0"
|
|
39
22
|
},
|
|
40
23
|
"publishConfig": {
|
|
41
24
|
"access": "public"
|
|
42
25
|
},
|
|
43
26
|
"browserslist": [
|
|
44
27
|
"defaults"
|
|
45
|
-
]
|
|
46
|
-
|
|
28
|
+
],
|
|
29
|
+
"scripts": {
|
|
30
|
+
"build": "pnpm run --sequential /^build:.*/",
|
|
31
|
+
"build:css": "mkdir -p dist && lightningcss --minify --bundle --sourcemap --targets '>= 0.25%' src/*.css src/**/*.css -d ./dist",
|
|
32
|
+
"build:typed-classname": "node ./typed-classname/build.mjs",
|
|
33
|
+
"build:scoped-css": "node ./build-scoped-css.mjs",
|
|
34
|
+
"dev": "pnpm run --parallel /^dev:.*/",
|
|
35
|
+
"dev:css": "chokidar --initial 'src/**/*.css' -c 'pnpm build:css'",
|
|
36
|
+
"dev:typed-classname": "wait-on dist/index.css && node --watch-preserve-output --watch-path dist/index.css --watch ./typed-classname/build.mjs",
|
|
37
|
+
"lint": "stylelint 'src/**/*.css' 'src/**/*.scss' --cache",
|
|
38
|
+
"lint:fix": "pnpm lint -- --fix",
|
|
39
|
+
"clean": "rm -rf .turbo && rm -rf node_modules && rm -rf dist",
|
|
40
|
+
"show-css-size": "pnpm build:css && echo '\nSize of dist/index.css (original → gzip)' && pnpm dlx gzip-size-cli dist/index.css --include-original"
|
|
41
|
+
}
|
|
42
|
+
}
|
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
// @ts-check
|
|
2
|
+
import { readFile, writeFile } from "node:fs/promises";
|
|
3
|
+
import { transform } from "lightningcss";
|
|
4
|
+
|
|
5
|
+
// Read the input file
|
|
6
|
+
const file = await readFile(new URL("../dist/index.css", import.meta.url), "utf8");
|
|
7
|
+
|
|
8
|
+
/** @type {Set<string>} */
|
|
9
|
+
const allClasses = new Set([]);
|
|
10
|
+
|
|
11
|
+
transform({
|
|
12
|
+
filename: "",
|
|
13
|
+
code: Buffer.from(file),
|
|
14
|
+
visitor: {
|
|
15
|
+
Selector(_selector) {
|
|
16
|
+
inner(_selector);
|
|
17
|
+
|
|
18
|
+
/** @typedef {import('lightningcss').Selector} Selector */
|
|
19
|
+
/** @param {Selector} selector */
|
|
20
|
+
function inner(selector) {
|
|
21
|
+
for (const selectorComponent of selector) {
|
|
22
|
+
if (selectorComponent.type === "class") {
|
|
23
|
+
allClasses.add(selectorComponent.name);
|
|
24
|
+
}
|
|
25
|
+
|
|
26
|
+
// Extract classnames from pseudo selectors
|
|
27
|
+
if ("selectors" in selectorComponent && selectorComponent.selectors) {
|
|
28
|
+
const childSelectors = [selectorComponent.selectors].flat(2);
|
|
29
|
+
inner(childSelectors);
|
|
30
|
+
}
|
|
31
|
+
}
|
|
32
|
+
}
|
|
33
|
+
},
|
|
34
|
+
},
|
|
35
|
+
});
|
|
36
|
+
|
|
37
|
+
// Output the result
|
|
38
|
+
const output = `// Autogenerated file, do not edit
|
|
39
|
+
|
|
40
|
+
export type ClassNames =
|
|
41
|
+
| ${[...allClasses].map((className) => `"${className}"`).join("\n | ")};
|
|
42
|
+
`;
|
|
43
|
+
|
|
44
|
+
await writeFile(new URL("../dist/classnames.d.ts", import.meta.url), output);
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import { ClassNames } from "../dist/classnames";
|
|
2
|
+
|
|
3
|
+
/**
|
|
4
|
+
* Helper function to ensure classnames are referenced correctly
|
|
5
|
+
*
|
|
6
|
+
* ```tsx
|
|
7
|
+
* <button className="hds-button"> ✅ Passes
|
|
8
|
+
* <button className="hds-buton"> ❌ Fails typecheck
|
|
9
|
+
* ```
|
|
10
|
+
*
|
|
11
|
+
* @param {ClassNames} value
|
|
12
|
+
* @returns {ClassNames}
|
|
13
|
+
*/
|
|
14
|
+
export function t(value: ClassNames): ClassNames;
|
package/dist/badge/badge.css
DELETED
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
.hds-badge{background-color:var(--hds-brand-colors-lighter);border:var(--hds-stroke-default)solid var(--hds-brand-colors-lighter);border-radius:var(--hds-border-radius);padding:var(--hds-spacing-small-1)var(--hds-spacing-small-2);color:var(--hds-brand-colors-dark);text-transform:uppercase;font-size:12px;line-height:1.1;font-family:var(--hds-fonts-posten-sans-medium);-moz-osx-font-smoothing:subpixel-antialiased;-webkit-font-smoothing:subpixel-antialiased;vertical-align:10%;display:inline-block}.hds-badge--small{padding:var(--hds-spacing-small-1)var(--hds-spacing-small-2)}.hds-badge--smaller{padding:2px var(--hds-spacing-small-1)}.hds-badge--primary{background-color:var(--hds-brand-colors-lighter);border-color:var(--hds-brand-colors-lighter);color:var(--hds-brand-colors-dark)}.hds-badge--dark{background-color:var(--hds-brand-colors-darker);border-color:var(--hds-brand-colors-darker);color:var(--hds-ui-colors-white)}.hds-badge--white{background-color:var(--hds-ui-colors-white);border-color:var(--hds-ui-colors-white);color:var(--hds-brand-colors-dark)}.hds-badge--warning{background-color:var(--hds-ui-colors-warning-yellow);border-color:var(--hds-ui-colors-warning-yellow);color:var(--hds-brand-link-colors-text)}
|
|
2
|
-
/*# sourceMappingURL=badge.css.map */
|
package/dist/badge/badge.css.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"mappings":"ACIA,kfAuBE,+EAIA,2DAMA,qJAOA,8IAMA,yIAMA","sources":["badge/badge.css","packages/css/src/badge/badge.scss"],"sourcesContent":[".hds-badge {\n background-color: var(--hds-brand-colors-lighter);\n border: var(--hds-stroke-default) solid var(--hds-brand-colors-lighter);\n border-radius: var(--hds-border-radius);\n padding: var(--hds-spacing-small-1) var(--hds-spacing-small-2);\n color: var(--hds-brand-colors-dark);\n text-transform: uppercase;\n font-size: 12px;\n line-height: 1.1;\n font-family: var(--hds-fonts-posten-sans-medium);\n -moz-osx-font-smoothing: subpixel-antialiased;\n -webkit-font-smoothing: subpixel-antialiased;\n vertical-align: 10%;\n display: inline-block;\n}\n\n.hds-badge--small {\n padding: var(--hds-spacing-small-1) var(--hds-spacing-small-2);\n}\n\n.hds-badge--smaller {\n padding: 2px var(--hds-spacing-small-1);\n}\n\n.hds-badge--primary {\n background-color: var(--hds-brand-colors-lighter);\n border-color: var(--hds-brand-colors-lighter);\n color: var(--hds-brand-colors-dark);\n}\n\n.hds-badge--dark {\n background-color: var(--hds-brand-colors-darker);\n border-color: var(--hds-brand-colors-darker);\n color: var(--hds-ui-colors-white);\n}\n\n.hds-badge--white {\n background-color: var(--hds-ui-colors-white);\n border-color: var(--hds-ui-colors-white);\n color: var(--hds-brand-colors-dark);\n}\n\n.hds-badge--warning {\n background-color: var(--hds-ui-colors-warning-yellow);\n border-color: var(--hds-ui-colors-warning-yellow);\n color: var(--hds-brand-link-colors-text);\n}\n\n/*# sourceMappingURL=badge.css.map */\n","/**\n * Block\n */\n\n.hds-badge {\n display: inline-block;\n background-color: var(--hds-brand-colors-lighter);\n border: var(--hds-stroke-default) solid var(--hds-brand-colors-lighter);\n border-radius: var(--hds-border-radius);\n padding: var(--hds-spacing-small-1) var(--hds-spacing-small-2);\n color: var(--hds-brand-colors-dark);\n text-transform: uppercase;\n line-height: 1.1;\n font-size: 12px; /* For now, this might be changed later */\n font-family: var(--hds-fonts-posten-sans-medium);\n -moz-osx-font-smoothing: subpixel-antialiased;\n -webkit-font-smoothing: subpixel-antialiased;\n vertical-align: 10%;\n\n /**\n * Modifiers\n */\n\n /* Variations */\n\n /* Size variations */\n\n &--small {\n padding: var(--hds-spacing-small-1) var(--hds-spacing-small-2);\n }\n\n &--smaller {\n padding: 2px var(--hds-spacing-small-1);\n }\n\n /* Color variations */\n\n &--primary {\n /* Default */\n background-color: var(--hds-brand-colors-lighter);\n border-color: var(--hds-brand-colors-lighter);\n color: var(--hds-brand-colors-dark);\n }\n\n &--dark {\n background-color: var(--hds-brand-colors-darker);\n border-color: var(--hds-brand-colors-darker);\n color: var(--hds-ui-colors-white);\n }\n\n &--white {\n background-color: var(--hds-ui-colors-white);\n border-color: var(--hds-ui-colors-white);\n color: var(--hds-brand-colors-dark);\n }\n\n &--warning {\n background-color: var(--hds-ui-colors-warning-yellow);\n border-color: var(--hds-ui-colors-warning-yellow);\n color: var(--hds-brand-link-colors-text);\n }\n}\n"],"names":[],"version":3,"file":"badge.css.map"}
|
package/dist/button/button.css
DELETED
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
.hds-button{-webkit-font-smoothing:antialiased;-webkit-appearance:button;box-sizing:border-box;padding:var(--hds-spacing-small-3)var(--hds-spacing-medium-2);border-radius:var(--hds-border-radius);background:var(--hds-ui-colors-grey);border-width:0;border-color:var(--hds-ui-colors-grey);color:var(--hds-brand-button-colors-text);fill:var(--hds-brand-button-colors-text);font:var(--hds-typography-body-title);transition:all var(--hds-micro-animation-duration-quick)var(--hds-micro-animation-easing-normal);text-align:center;cursor:pointer;word-break:normal;display:inline-block}.hds-button:disabled,.hds-button[disabled],.hds-button[disabled]:active{cursor:default;color:var(--hds-ui-colors-dark-grey)!important;fill:var(--hds-ui-colors-dark-grey)!important;background:var(--hds-ui-colors-grey)!important;border-color:var(--hds-ui-colors-grey)!important;box-shadow:none!important;outline:0!important}.hds-button--large{height:58px;padding:16px 24px;font-size:18px;line-height:26px}.hds-button--large i,.hds-button--large svg{margin-right:12px}.hds-button--medium{height:50px;padding:12px 20px;font-size:18px;line-height:26px}.hds-button--medium i,.hds-button--medium svg{margin-right:10px}.hds-button--small{height:48px;padding:12px 16px;font-size:16px;line-height:24px}.hds-button--small i,.hds-button--small svg{margin-right:8px}.hds-button--full{width:100%}@media (max-width:720px){.hds-button--mobile-full{width:100%}}.hds-button--primary{background:var(--hds-brand-colors-signature);border-color:var(--hds-brand-colors-signature);color:var(--hds-brand-button-colors-text);fill:var(--hds-brand-button-colors-text)}.hds-button--primary:hover,.hds-button--primary:active{background:var(--hds-brand-colors-signature-hover);border-color:var(--hds-brand-colors-signature);outline:0 solid var(--hds-brand-colors-signature-hover)}.hds-button--primary:active{background:var(--hds-brand-colors-signature)!important}.hds-button--secondary{background:var(--hds-brand-colors-darker);border-color:var(--hds-brand-colors-darker);color:var(--hds-ui-colors-white);fill:var(--hds-ui-colors-white)}.hds-button--secondary:hover,.hds-button--secondary:active{background:var(--hds-ui-colors-black);outline:0 solid var(--hds-ui-colors-black)}.hds-button--secondary:active{background:var(--hds-brand-colors-darker)!important}.hds-button--outline{color:var(--hds-brand-colors-dark);fill:var(--hds-brand-colors-dark);border:var(--hds-stroke-thick)solid var(--hds-brand-colors-dark);background:0 0}.hds-button--outline:disabled,.hds-button--outline[disabled],.hds-button--outline[disabled]:active{background:0 0!important}.hds-button--outline:hover,.hds-button--outline:active{color:var(--hds-ui-colors-black);fill:var(--hds-ui-colors-black);border-color:var(--hds-ui-colors-black);background:0 0}.hds-button--outline:active{border-color:var(--hds-ui-colors-dark-grey)}.hds-button--outline-white{border:var(--hds-stroke-thick)solid var(--hds-brand-colors-light);color:var(--hds-ui-colors-white);fill:var(--hds-ui-colors-white);outline-offset:3px;background:0 0}.hds-button--outline-white:hover,.hds-button--outline-white:active{color:var(--hds-brand-colors-light);fill:var(--hds-brand-colors-light)}.hds-button--outline-primary{border:var(--hds-stroke-thick)solid var(--hds-brand-colors-signature);color:var(--hds-ui-colors-black);fill:var(--hds-ui-colors-black);outline-offset:3px;background:0 0}.hds-button--outline-primary:hover,.hds-button--outline-primary:active{color:var(--hds-brand-colors-dark);fill:var(--hds-brand-colors-dark);border:var(--hds-stroke-thick)solid var(--hds-brand-colors-dark)}.hds-button--outline-primary:disabled,.hds-button--outline-primary[disabled],.hds-button--outline-primary[disabled]:active{border:var(--hds-stroke-thick)solid var(--hds-ui-colors-grey);color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);background:0 0!important}.hds-button--outline-secondary,.hds-button--outline-dark{border:var(--hds-stroke-thick)solid var(--hds-brand-colors-darker);color:var(--hds-brand-colors-darker);fill:var(--hds-brand-colors-darker);outline-offset:3px;background:0 0}.hds-button--outline-secondary:hover,.hds-button--outline-secondary:active,.hds-button--outline-dark:hover,.hds-button--outline-dark:active{color:var(--hds-ui-colors-black);fill:var(--hds-ui-colors-black);border:var(--hds-stroke-thick)solid var(--hds-ui-colors-black)}.hds-button--outline-secondary:disabled,.hds-button--outline-secondary[disabled],.hds-button--outline-secondary[disabled]:active,.hds-button--outline-dark:disabled,.hds-button--outline-dark[disabled],.hds-button--outline-dark[disabled]:active{border:var(--hds-stroke-thick)solid var(--hds-ui-colors-grey);color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);background:0 0!important}
|
|
2
|
-
/*# sourceMappingURL=button.css.map */
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"mappings":"ACAA,ikBAmBE,kUAgBA,iFAME,8DAMF,kFAME,gEAMF,iFAME,6DAMF,6BAYE,yBAJF,qCAaA,oMAME,iNAOA,mFAKF,8KAME,4IAMA,kFAKF,0KAME,4HAMA,+KAQA,wEAKF,gMAOE,0IAOF,sMAOE,6MAOA,2RAUF,uOAQE,4QASA","sources":["button/button.css","packages/css/src/button/button.scss"],"sourcesContent":[".hds-button {\n -webkit-font-smoothing: antialiased;\n -webkit-appearance: button;\n box-sizing: border-box;\n padding: var(--hds-spacing-small-3) var(--hds-spacing-medium-2);\n border-radius: var(--hds-border-radius);\n background: var(--hds-ui-colors-grey);\n border-width: 0;\n border-color: var(--hds-ui-colors-grey);\n color: var(--hds-brand-button-colors-text);\n fill: var(--hds-brand-button-colors-text);\n font: var(--hds-typography-body-title);\n transition: all var(--hds-micro-animation-duration-quick) var(--hds-micro-animation-easing-normal);\n text-align: center;\n cursor: pointer;\n word-break: normal;\n display: inline-block;\n}\n\n.hds-button:disabled, .hds-button[disabled], .hds-button[disabled]:active {\n cursor: default;\n color: var(--hds-ui-colors-dark-grey) !important;\n fill: var(--hds-ui-colors-dark-grey) !important;\n background: var(--hds-ui-colors-grey) !important;\n border-color: var(--hds-ui-colors-grey) !important;\n box-shadow: none !important;\n outline: 0 !important;\n}\n\n.hds-button--large {\n height: 58px;\n padding: 16px 24px;\n font-size: 18px;\n line-height: 26px;\n}\n\n.hds-button--large i, .hds-button--large svg {\n margin-right: 12px;\n}\n\n.hds-button--medium {\n height: 50px;\n padding: 12px 20px;\n font-size: 18px;\n line-height: 26px;\n}\n\n.hds-button--medium i, .hds-button--medium svg {\n margin-right: 10px;\n}\n\n.hds-button--small {\n height: 48px;\n padding: 12px 16px;\n font-size: 16px;\n line-height: 24px;\n}\n\n.hds-button--small i, .hds-button--small svg {\n margin-right: 8px;\n}\n\n.hds-button--full {\n width: 100%;\n}\n\n@media (max-width: 720px) {\n .hds-button--mobile-full {\n width: 100%;\n }\n}\n\n.hds-button--primary {\n background: var(--hds-brand-colors-signature);\n border-color: var(--hds-brand-colors-signature);\n color: var(--hds-brand-button-colors-text);\n fill: var(--hds-brand-button-colors-text);\n}\n\n.hds-button--primary:hover, .hds-button--primary:active {\n background: var(--hds-brand-colors-signature-hover);\n border-color: var(--hds-brand-colors-signature);\n outline: 0 solid var(--hds-brand-colors-signature-hover);\n}\n\n.hds-button--primary:active {\n background: var(--hds-brand-colors-signature) !important;\n}\n\n.hds-button--secondary {\n background: var(--hds-brand-colors-darker);\n border-color: var(--hds-brand-colors-darker);\n color: var(--hds-ui-colors-white);\n fill: var(--hds-ui-colors-white);\n}\n\n.hds-button--secondary:hover, .hds-button--secondary:active {\n background: var(--hds-ui-colors-black);\n outline: 0 solid var(--hds-ui-colors-black);\n}\n\n.hds-button--secondary:active {\n background: var(--hds-brand-colors-darker) !important;\n}\n\n.hds-button--outline {\n color: var(--hds-brand-colors-dark);\n fill: var(--hds-brand-colors-dark);\n border: var(--hds-stroke-thick) solid var(--hds-brand-colors-dark);\n background: none;\n}\n\n.hds-button--outline:disabled, .hds-button--outline[disabled], .hds-button--outline[disabled]:active {\n background: none !important;\n}\n\n.hds-button--outline:hover, .hds-button--outline:active {\n color: var(--hds-ui-colors-black);\n fill: var(--hds-ui-colors-black);\n border-color: var(--hds-ui-colors-black);\n background: none;\n}\n\n.hds-button--outline:active {\n border-color: var(--hds-ui-colors-dark-grey);\n}\n\n.hds-button--outline-white {\n border: var(--hds-stroke-thick) solid var(--hds-brand-colors-light);\n color: var(--hds-ui-colors-white);\n fill: var(--hds-ui-colors-white);\n outline-offset: 3px;\n background: none;\n}\n\n.hds-button--outline-white:hover, .hds-button--outline-white:active {\n color: var(--hds-brand-colors-light);\n fill: var(--hds-brand-colors-light);\n}\n\n.hds-button--outline-primary {\n border: var(--hds-stroke-thick) solid var(--hds-brand-colors-signature);\n color: var(--hds-ui-colors-black);\n fill: var(--hds-ui-colors-black);\n outline-offset: 3px;\n background: none;\n}\n\n.hds-button--outline-primary:hover, .hds-button--outline-primary:active {\n color: var(--hds-brand-colors-dark);\n fill: var(--hds-brand-colors-dark);\n border: var(--hds-stroke-thick) solid var(--hds-brand-colors-dark);\n}\n\n.hds-button--outline-primary:disabled, .hds-button--outline-primary[disabled], .hds-button--outline-primary[disabled]:active {\n border: var(--hds-stroke-thick) solid var(--hds-ui-colors-grey);\n color: var(--hds-ui-colors-dark-grey);\n fill: var(--hds-ui-colors-dark-grey);\n background: none !important;\n}\n\n.hds-button--outline-secondary, .hds-button--outline-dark {\n border: var(--hds-stroke-thick) solid var(--hds-brand-colors-darker);\n color: var(--hds-brand-colors-darker);\n fill: var(--hds-brand-colors-darker);\n outline-offset: 3px;\n background: none;\n}\n\n.hds-button--outline-secondary:hover, .hds-button--outline-secondary:active, .hds-button--outline-dark:hover, .hds-button--outline-dark:active {\n color: var(--hds-ui-colors-black);\n fill: var(--hds-ui-colors-black);\n border: var(--hds-stroke-thick) solid var(--hds-ui-colors-black);\n}\n\n.hds-button--outline-secondary:disabled, .hds-button--outline-secondary[disabled], .hds-button--outline-secondary[disabled]:active, .hds-button--outline-dark:disabled, .hds-button--outline-dark[disabled], .hds-button--outline-dark[disabled]:active {\n border: var(--hds-stroke-thick) solid var(--hds-ui-colors-grey);\n color: var(--hds-ui-colors-dark-grey);\n fill: var(--hds-ui-colors-dark-grey);\n background: none !important;\n}\n\n/*# sourceMappingURL=button.css.map */\n",".hds-button {\n -webkit-font-smoothing: antialiased;\n /* stylelint-disable-next-line property-no-vendor-prefix -- Not sure if we need this or not 🤷 */\n -webkit-appearance: button;\n box-sizing: border-box;\n display: inline-block;\n padding: var(--hds-spacing-small-3) var(--hds-spacing-medium-2);\n border-radius: var(--hds-border-radius);\n border-width: 0;\n background: var(--hds-ui-colors-grey);\n border-color: var(--hds-ui-colors-grey);\n color: var(--hds-brand-button-colors-text);\n fill: var(--hds-brand-button-colors-text);\n font: var(--hds-typography-body-title);\n transition: all var(--hds-micro-animation-duration-quick) var(--hds-micro-animation-easing-normal);\n text-align: center; /* Center text when this is an <a> */\n cursor: pointer;\n word-break: normal;\n\n &:disabled,\n &[disabled],\n &[disabled]:active {\n color: var(--hds-ui-colors-dark-grey) !important;\n fill: var(--hds-ui-colors-dark-grey) !important;\n background: var(--hds-ui-colors-grey) !important;\n border-color: var(--hds-ui-colors-grey) !important;\n outline: 0 !important;\n box-shadow: none !important;\n cursor: default;\n }\n\n /**\n * Modifiers: sizes\n */\n\n &--large {\n font-size: 18px; /* TODO Token: typography-body minimum value */\n line-height: 26px;\n height: 58px;\n padding: 16px 24px;\n\n i,\n svg {\n margin-right: 12px;\n }\n }\n\n &--medium {\n font-size: 18px; /* TODO Token: typography-body minimum value */\n line-height: 26px;\n height: 50px;\n padding: 12px 20px;\n\n i,\n svg {\n margin-right: 10px;\n }\n }\n\n &--small {\n font-size: 16px; /* TODO Token: typography-body-small minimum value */\n line-height: 24px;\n height: 48px;\n padding: 12px 16px;\n\n i,\n svg {\n margin-right: 8px;\n }\n }\n\n &--full {\n width: 100%;\n }\n\n /**\n * Responsive modifiers\n */\n\n &--mobile-full {\n // TODO: Currently hardcoded due to css variables not available in media queries\n // Would be: --hds-breakpoints-medium\n // 🤷\n @media (max-width: 720px) {\n width: 100%;\n }\n }\n\n /**\n * Modifiers: types\n */\n\n &--primary {\n background: var(--hds-brand-colors-signature);\n border-color: var(--hds-brand-colors-signature);\n color: var(--hds-brand-button-colors-text);\n fill: var(--hds-brand-button-colors-text);\n\n &:hover,\n &:active {\n background: var(--hds-brand-colors-signature-hover);\n border-color: var(--hds-brand-colors-signature);\n outline: 0 solid var(--hds-brand-colors-signature-hover);\n }\n\n &:active {\n background: var(--hds-brand-colors-signature) !important;\n }\n }\n\n &--secondary {\n background: var(--hds-brand-colors-darker);\n border-color: var(--hds-brand-colors-darker);\n color: var(--hds-ui-colors-white);\n fill: var(--hds-ui-colors-white);\n\n &:hover,\n &:active {\n background: var(--hds-ui-colors-black);\n outline: 0 solid var(--hds-ui-colors-black);\n }\n\n &:active {\n background: var(--hds-brand-colors-darker) !important;\n }\n }\n\n &--outline {\n background: transparent;\n color: var(--hds-brand-colors-dark);\n fill: var(--hds-brand-colors-dark);\n border: var(--hds-stroke-thick) solid var(--hds-brand-colors-dark);\n\n &:disabled,\n &[disabled],\n &[disabled]:active {\n background: none !important;\n }\n\n &:hover,\n &:active {\n color: var(--hds-ui-colors-black);\n fill: var(--hds-ui-colors-black);\n border-color: var(--hds-ui-colors-black);\n background: none;\n }\n\n &:active {\n border-color: var(--hds-ui-colors-dark-grey);\n }\n }\n\n &--outline-white {\n background: transparent;\n border: var(--hds-stroke-thick) solid var(--hds-brand-colors-light);\n color: var(--hds-ui-colors-white);\n fill: var(--hds-ui-colors-white);\n outline-offset: 3px;\n\n &:hover,\n &:active {\n color: var(--hds-brand-colors-light);\n fill: var(--hds-brand-colors-light);\n }\n }\n\n &--outline-primary {\n background: transparent;\n border: var(--hds-stroke-thick) solid var(--hds-brand-colors-signature);\n color: var(--hds-ui-colors-black);\n fill: var(--hds-ui-colors-black);\n outline-offset: 3px;\n\n &:hover,\n &:active {\n color: var(--hds-brand-colors-dark);\n fill: var(--hds-brand-colors-dark);\n border: var(--hds-stroke-thick) solid var(--hds-brand-colors-dark);\n }\n\n &:disabled,\n &[disabled],\n &[disabled]:active {\n border: var(--hds-stroke-thick) solid var(--hds-ui-colors-grey);\n color: var(--hds-ui-colors-dark-grey);\n fill: var(--hds-ui-colors-dark-grey);\n background: transparent !important;\n }\n }\n\n &--outline-secondary,\n &--outline-dark {\n background: transparent;\n border: var(--hds-stroke-thick) solid var(--hds-brand-colors-darker);\n color: var(--hds-brand-colors-darker);\n fill: var(--hds-brand-colors-darker);\n outline-offset: 3px;\n\n &:hover,\n &:active {\n color: var(--hds-ui-colors-black);\n fill: var(--hds-ui-colors-black);\n border: var(--hds-stroke-thick) solid var(--hds-ui-colors-black);\n\n /* outline: 0px solid var(--hds-ui-colors-white); */\n }\n\n &:disabled,\n &[disabled],\n &[disabled]:active {\n border: var(--hds-stroke-thick) solid var(--hds-ui-colors-grey);\n color: var(--hds-ui-colors-dark-grey);\n fill: var(--hds-ui-colors-dark-grey);\n background: transparent !important;\n }\n }\n}\n"],"names":[],"version":3,"file":"button.css.map"}
|
package/dist/link/link.css
DELETED
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
.hds-link{border-bottom:var(--hds-stroke-default)solid var(--hds-brand-link-colors-underline);fill:var(--hds-brand-link-colors-text);color:var(--hds-brand-link-colors-text);cursor:pointer;text-decoration:none;transition:all .1s}.hds-link:hover,.hds-link:active{color:var(--hds-brand-link-colors-hover);fill:var(--hds-brand-link-colors-hover);border-color:var(--hds-brand-link-colors-underline-hover)}.hds-link:hover .hds-link__text,.hds-link:active .hds-link__text{border-color:var(--hds-brand-link-colors-underline-hover)}.hds-link--inverted{color:var(--hds-ui-colors-white);-webkit-text-decoration-color:var(--hds-brand-colors-signature);-webkit-text-decoration-color:var(--hds-brand-colors-signature);text-decoration-color:var(--hds-brand-colors-signature);border-color:currentColor}.hds-link--inverted:hover,.hds-link--inverted:active{color:var(--hds-brand-colors-light);border-color:currentColor}.hds-link--inverted:disabled{color:var(--hds-ui-colors-dark-grey);fill:currentColor;cursor:default;border-color:currentColor;box-shadow:none!important;outline:0!important}.hds-link--small{font:var(--hds-typography-body-small)}.hds-link--large{font:var(--hds-typography-header-h3)}.hds-link--no-underline{font:var(--hds-fonts-posten-sans-medium);color:var(--hds-brand-colors-dark);border-bottom:none;text-decoration:none}.hds-link--no-underline:hover{color:var(--hds-brand-colors-dark);text-decoration:underline;-webkit-text-decoration-color:var(--hds-brand-colors-dark);-webkit-text-decoration-color:var(--hds-brand-colors-dark);text-decoration-color:var(--hds-brand-colors-dark);border-bottom:none}.hds-link--solid{color:var(--hds-ui-colors-black);border-color:var(--hds-ui-colors-black)}.hds-link--solid:hover,.hds-link--solid:active{color:var(--hds-ui-colors-black-hover);border-color:var(--hds-ui-colors-black-hover)}
|
|
2
|
-
/*# sourceMappingURL=link.css.map */
|
package/dist/link/link.css.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"mappings":"ACIA,oOAQE,4KAME,2HASF,uQAKE,mHAMA,2KAUF,uDAIA,sDAIA,4IAME,uRAQF,0FAIE","sources":["link/link.css","packages/css/src/link/link.scss"],"sourcesContent":[".hds-link {\n border-bottom: var(--hds-stroke-default) solid var(--hds-brand-link-colors-underline);\n fill: var(--hds-brand-link-colors-text);\n color: var(--hds-brand-link-colors-text);\n cursor: pointer;\n text-decoration: none;\n transition: all .1s;\n}\n\n.hds-link:hover, .hds-link:active {\n color: var(--hds-brand-link-colors-hover);\n fill: var(--hds-brand-link-colors-hover);\n border-color: var(--hds-brand-link-colors-underline-hover);\n}\n\n.hds-link:hover .hds-link__text, .hds-link:active .hds-link__text {\n border-color: var(--hds-brand-link-colors-underline-hover);\n}\n\n.hds-link--inverted {\n color: var(--hds-ui-colors-white);\n -webkit-text-decoration-color: var(--hds-brand-colors-signature);\n text-decoration-color: var(--hds-brand-colors-signature);\n border-color: currentColor;\n}\n\n.hds-link--inverted:hover, .hds-link--inverted:active {\n color: var(--hds-brand-colors-light);\n border-color: currentColor;\n}\n\n.hds-link--inverted:disabled {\n color: var(--hds-ui-colors-dark-grey);\n fill: currentColor;\n cursor: default;\n border-color: currentColor;\n box-shadow: none !important;\n outline: 0 !important;\n}\n\n.hds-link--small {\n font: var(--hds-typography-body-small);\n}\n\n.hds-link--large {\n font: var(--hds-typography-header-h3);\n}\n\n.hds-link--no-underline {\n font: var(--hds-fonts-posten-sans-medium);\n color: var(--hds-brand-colors-dark);\n border-bottom: none;\n text-decoration: none;\n}\n\n.hds-link--no-underline:hover {\n color: var(--hds-brand-colors-dark);\n text-decoration: underline;\n -webkit-text-decoration-color: var(--hds-brand-colors-dark);\n text-decoration-color: var(--hds-brand-colors-dark);\n border-bottom: none;\n}\n\n.hds-link--solid {\n color: var(--hds-ui-colors-black);\n border-color: var(--hds-ui-colors-black);\n}\n\n.hds-link--solid:hover, .hds-link--solid:active {\n color: var(--hds-ui-colors-black-hover);\n border-color: var(--hds-ui-colors-black-hover);\n}\n\n/*# sourceMappingURL=link.css.map */\n","/**\n * Block\n */\n\n.hds-link {\n text-decoration: none;\n border-bottom: var(--hds-stroke-default) solid var(--hds-brand-link-colors-underline);\n fill: var(--hds-brand-link-colors-text);\n color: var(--hds-brand-link-colors-text);\n transition: all 0.1s ease;\n cursor: pointer;\n\n &:hover,\n &:active {\n color: var(--hds-brand-link-colors-hover);\n fill: var(--hds-brand-link-colors-hover);\n border-color: var(--hds-brand-link-colors-underline-hover);\n\n & .hds-link__text {\n border-color: var(--hds-brand-link-colors-underline-hover);\n }\n }\n\n /**\n * Modifers\n */\n\n &--inverted {\n color: var(--hds-ui-colors-white);\n text-decoration-color: var(--hds-brand-colors-signature);\n border-color: currentcolor;\n\n &:hover,\n &:active {\n color: var(--hds-brand-colors-light);\n border-color: currentcolor;\n }\n\n &:disabled {\n color: var(--hds-ui-colors-dark-grey);\n fill: currentcolor;\n border-color: currentcolor;\n outline: 0 !important;\n box-shadow: none !important;\n cursor: default;\n }\n }\n\n &--small {\n font: var(--hds-typography-body-small);\n }\n\n &--large {\n font: var(--hds-typography-header-h3);\n }\n\n &--no-underline {\n font: var(--hds-fonts-posten-sans-medium);\n color: var(--hds-brand-colors-dark);\n text-decoration: none;\n border-bottom: none;\n\n &:hover {\n color: var(--hds-brand-colors-dark);\n text-decoration: underline;\n text-decoration-color: var(--hds-brand-colors-dark);\n border-bottom: none;\n }\n }\n\n &--solid {\n color: var(--hds-ui-colors-black);\n border-color: var(--hds-ui-colors-black);\n\n &:hover,\n &:active {\n color: var(--hds-ui-colors-black-hover);\n border-color: var(--hds-ui-colors-black-hover);\n }\n }\n}\n"],"names":[],"version":3,"file":"link.css.map"}
|
package/dist/scoped.css.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"mappings":"AGAA,imBAmBE,kaAgBA,iHAME,8HAMF,kHAME,gIAMF,iHAME,6HAMF,6DAYE,yBAJF,qEAaA,oOAME,iRAOA,mHAKF,8MAME,4MAMA,kHAKF,0MAME,4NAMA,+OAQA,wGAKF,gOAOE,0MAOF,sOAOE,6QAOA,2XAUF,uSAQE,4YASA,mlBD3MJ,oQAQE,4OAME,2LASF,uSAKE,mLAMA,2MAUF,uFAIA,sFAIA,4KAME,uTAQF,0HAIE","sources":["scoped.css","packages/css/src/scoped.scss","packages/css/src/link/link.scss","packages/css/src/button/button.scss"],"sourcesContent":[".kp-decorator-header-and-footer .hds-button {\n -webkit-font-smoothing: antialiased;\n -webkit-appearance: button;\n box-sizing: border-box;\n padding: var(--hds-spacing-small-3) var(--hds-spacing-medium-2);\n border-radius: var(--hds-border-radius);\n background: var(--hds-ui-colors-grey);\n border-width: 0;\n border-color: var(--hds-ui-colors-grey);\n color: var(--hds-brand-button-colors-text);\n fill: var(--hds-brand-button-colors-text);\n font: var(--hds-typography-body-title);\n transition: all var(--hds-micro-animation-duration-quick) var(--hds-micro-animation-easing-normal);\n text-align: center;\n cursor: pointer;\n word-break: normal;\n display: inline-block;\n}\n\n.kp-decorator-header-and-footer .hds-button:disabled, .kp-decorator-header-and-footer .hds-button[disabled], .kp-decorator-header-and-footer .hds-button[disabled]:active {\n cursor: default;\n color: var(--hds-ui-colors-dark-grey) !important;\n fill: var(--hds-ui-colors-dark-grey) !important;\n background: var(--hds-ui-colors-grey) !important;\n border-color: var(--hds-ui-colors-grey) !important;\n box-shadow: none !important;\n outline: 0 !important;\n}\n\n.kp-decorator-header-and-footer .hds-button--large {\n height: 58px;\n padding: 16px 24px;\n font-size: 18px;\n line-height: 26px;\n}\n\n.kp-decorator-header-and-footer .hds-button--large i, .kp-decorator-header-and-footer .hds-button--large svg {\n margin-right: 12px;\n}\n\n.kp-decorator-header-and-footer .hds-button--medium {\n height: 50px;\n padding: 12px 20px;\n font-size: 18px;\n line-height: 26px;\n}\n\n.kp-decorator-header-and-footer .hds-button--medium i, .kp-decorator-header-and-footer .hds-button--medium svg {\n margin-right: 10px;\n}\n\n.kp-decorator-header-and-footer .hds-button--small {\n height: 48px;\n padding: 12px 16px;\n font-size: 16px;\n line-height: 24px;\n}\n\n.kp-decorator-header-and-footer .hds-button--small i, .kp-decorator-header-and-footer .hds-button--small svg {\n margin-right: 8px;\n}\n\n.kp-decorator-header-and-footer .hds-button--full {\n width: 100%;\n}\n\n@media (max-width: 720px) {\n .kp-decorator-header-and-footer .hds-button--mobile-full {\n width: 100%;\n }\n}\n\n.kp-decorator-header-and-footer .hds-button--primary {\n background: var(--hds-brand-colors-signature);\n border-color: var(--hds-brand-colors-signature);\n color: var(--hds-brand-button-colors-text);\n fill: var(--hds-brand-button-colors-text);\n}\n\n.kp-decorator-header-and-footer .hds-button--primary:hover, .kp-decorator-header-and-footer .hds-button--primary:active {\n background: var(--hds-brand-colors-signature-hover);\n border-color: var(--hds-brand-colors-signature);\n outline: 0 solid var(--hds-brand-colors-signature-hover);\n}\n\n.kp-decorator-header-and-footer .hds-button--primary:active {\n background: var(--hds-brand-colors-signature) !important;\n}\n\n.kp-decorator-header-and-footer .hds-button--secondary {\n background: var(--hds-brand-colors-darker);\n border-color: var(--hds-brand-colors-darker);\n color: var(--hds-ui-colors-white);\n fill: var(--hds-ui-colors-white);\n}\n\n.kp-decorator-header-and-footer .hds-button--secondary:hover, .kp-decorator-header-and-footer .hds-button--secondary:active {\n background: var(--hds-ui-colors-black);\n outline: 0 solid var(--hds-ui-colors-black);\n}\n\n.kp-decorator-header-and-footer .hds-button--secondary:active {\n background: var(--hds-brand-colors-darker) !important;\n}\n\n.kp-decorator-header-and-footer .hds-button--outline {\n color: var(--hds-brand-colors-dark);\n fill: var(--hds-brand-colors-dark);\n border: var(--hds-stroke-thick) solid var(--hds-brand-colors-dark);\n background: none;\n}\n\n.kp-decorator-header-and-footer .hds-button--outline:disabled, .kp-decorator-header-and-footer .hds-button--outline[disabled], .kp-decorator-header-and-footer .hds-button--outline[disabled]:active {\n background: none !important;\n}\n\n.kp-decorator-header-and-footer .hds-button--outline:hover, .kp-decorator-header-and-footer .hds-button--outline:active {\n color: var(--hds-ui-colors-black);\n fill: var(--hds-ui-colors-black);\n border-color: var(--hds-ui-colors-black);\n background: none;\n}\n\n.kp-decorator-header-and-footer .hds-button--outline:active {\n border-color: var(--hds-ui-colors-dark-grey);\n}\n\n.kp-decorator-header-and-footer .hds-button--outline-white {\n border: var(--hds-stroke-thick) solid var(--hds-brand-colors-light);\n color: var(--hds-ui-colors-white);\n fill: var(--hds-ui-colors-white);\n outline-offset: 3px;\n background: none;\n}\n\n.kp-decorator-header-and-footer .hds-button--outline-white:hover, .kp-decorator-header-and-footer .hds-button--outline-white:active {\n color: var(--hds-brand-colors-light);\n fill: var(--hds-brand-colors-light);\n}\n\n.kp-decorator-header-and-footer .hds-button--outline-primary {\n border: var(--hds-stroke-thick) solid var(--hds-brand-colors-signature);\n color: var(--hds-ui-colors-black);\n fill: var(--hds-ui-colors-black);\n outline-offset: 3px;\n background: none;\n}\n\n.kp-decorator-header-and-footer .hds-button--outline-primary:hover, .kp-decorator-header-and-footer .hds-button--outline-primary:active {\n color: var(--hds-brand-colors-dark);\n fill: var(--hds-brand-colors-dark);\n border: var(--hds-stroke-thick) solid var(--hds-brand-colors-dark);\n}\n\n.kp-decorator-header-and-footer .hds-button--outline-primary:disabled, .kp-decorator-header-and-footer .hds-button--outline-primary[disabled], .kp-decorator-header-and-footer .hds-button--outline-primary[disabled]:active {\n border: var(--hds-stroke-thick) solid var(--hds-ui-colors-grey);\n color: var(--hds-ui-colors-dark-grey);\n fill: var(--hds-ui-colors-dark-grey);\n background: none !important;\n}\n\n.kp-decorator-header-and-footer .hds-button--outline-secondary, .kp-decorator-header-and-footer .hds-button--outline-dark {\n border: var(--hds-stroke-thick) solid var(--hds-brand-colors-darker);\n color: var(--hds-brand-colors-darker);\n fill: var(--hds-brand-colors-darker);\n outline-offset: 3px;\n background: none;\n}\n\n.kp-decorator-header-and-footer .hds-button--outline-secondary:hover, .kp-decorator-header-and-footer .hds-button--outline-secondary:active, .kp-decorator-header-and-footer .hds-button--outline-dark:hover, .kp-decorator-header-and-footer .hds-button--outline-dark:active {\n color: var(--hds-ui-colors-black);\n fill: var(--hds-ui-colors-black);\n border: var(--hds-stroke-thick) solid var(--hds-ui-colors-black);\n}\n\n.kp-decorator-header-and-footer .hds-button--outline-secondary:disabled, .kp-decorator-header-and-footer .hds-button--outline-secondary[disabled], .kp-decorator-header-and-footer .hds-button--outline-secondary[disabled]:active, .kp-decorator-header-and-footer .hds-button--outline-dark:disabled, .kp-decorator-header-and-footer .hds-button--outline-dark[disabled], .kp-decorator-header-and-footer .hds-button--outline-dark[disabled]:active {\n border: var(--hds-stroke-thick) solid var(--hds-ui-colors-grey);\n color: var(--hds-ui-colors-dark-grey);\n fill: var(--hds-ui-colors-dark-grey);\n background: none !important;\n}\n\n.kp-decorator-header-and-footer .hds-link {\n border-bottom: var(--hds-stroke-default) solid var(--hds-brand-link-colors-underline);\n fill: var(--hds-brand-link-colors-text);\n color: var(--hds-brand-link-colors-text);\n cursor: pointer;\n text-decoration: none;\n transition: all .1s;\n}\n\n.kp-decorator-header-and-footer .hds-link:hover, .kp-decorator-header-and-footer .hds-link:active {\n color: var(--hds-brand-link-colors-hover);\n fill: var(--hds-brand-link-colors-hover);\n border-color: var(--hds-brand-link-colors-underline-hover);\n}\n\n.kp-decorator-header-and-footer .hds-link:hover .hds-link__text, .kp-decorator-header-and-footer .hds-link:active .hds-link__text {\n border-color: var(--hds-brand-link-colors-underline-hover);\n}\n\n.kp-decorator-header-and-footer .hds-link--inverted {\n color: var(--hds-ui-colors-white);\n -webkit-text-decoration-color: var(--hds-brand-colors-signature);\n text-decoration-color: var(--hds-brand-colors-signature);\n border-color: currentColor;\n}\n\n.kp-decorator-header-and-footer .hds-link--inverted:hover, .kp-decorator-header-and-footer .hds-link--inverted:active {\n color: var(--hds-brand-colors-light);\n border-color: currentColor;\n}\n\n.kp-decorator-header-and-footer .hds-link--inverted:disabled {\n color: var(--hds-ui-colors-dark-grey);\n fill: currentColor;\n cursor: default;\n border-color: currentColor;\n box-shadow: none !important;\n outline: 0 !important;\n}\n\n.kp-decorator-header-and-footer .hds-link--small {\n font: var(--hds-typography-body-small);\n}\n\n.kp-decorator-header-and-footer .hds-link--large {\n font: var(--hds-typography-header-h3);\n}\n\n.kp-decorator-header-and-footer .hds-link--no-underline {\n font: var(--hds-fonts-posten-sans-medium);\n color: var(--hds-brand-colors-dark);\n border-bottom: none;\n text-decoration: none;\n}\n\n.kp-decorator-header-and-footer .hds-link--no-underline:hover {\n color: var(--hds-brand-colors-dark);\n text-decoration: underline;\n -webkit-text-decoration-color: var(--hds-brand-colors-dark);\n text-decoration-color: var(--hds-brand-colors-dark);\n border-bottom: none;\n}\n\n.kp-decorator-header-and-footer .hds-link--solid {\n color: var(--hds-ui-colors-black);\n border-color: var(--hds-ui-colors-black);\n}\n\n.kp-decorator-header-and-footer .hds-link--solid:hover, .kp-decorator-header-and-footer .hds-link--solid:active {\n color: var(--hds-ui-colors-black-hover);\n border-color: var(--hds-ui-colors-black-hover);\n}\n\n/*# sourceMappingURL=scoped.css.map */\n","/* stylelint-disable no-invalid-position-at-import-rule -- It's fine */\n/* stylelint-disable scss/at-import-partial-extension -- It's fine */\n.kp-decorator-header-and-footer {\n @import \"button/button.scss\";\n @import \"link/link.scss\";\n}\n","/**\n * Block\n */\n\n.hds-link {\n text-decoration: none;\n border-bottom: var(--hds-stroke-default) solid var(--hds-brand-link-colors-underline);\n fill: var(--hds-brand-link-colors-text);\n color: var(--hds-brand-link-colors-text);\n transition: all 0.1s ease;\n cursor: pointer;\n\n &:hover,\n &:active {\n color: var(--hds-brand-link-colors-hover);\n fill: var(--hds-brand-link-colors-hover);\n border-color: var(--hds-brand-link-colors-underline-hover);\n\n & .hds-link__text {\n border-color: var(--hds-brand-link-colors-underline-hover);\n }\n }\n\n /**\n * Modifers\n */\n\n &--inverted {\n color: var(--hds-ui-colors-white);\n text-decoration-color: var(--hds-brand-colors-signature);\n border-color: currentcolor;\n\n &:hover,\n &:active {\n color: var(--hds-brand-colors-light);\n border-color: currentcolor;\n }\n\n &:disabled {\n color: var(--hds-ui-colors-dark-grey);\n fill: currentcolor;\n border-color: currentcolor;\n outline: 0 !important;\n box-shadow: none !important;\n cursor: default;\n }\n }\n\n &--small {\n font: var(--hds-typography-body-small);\n }\n\n &--large {\n font: var(--hds-typography-header-h3);\n }\n\n &--no-underline {\n font: var(--hds-fonts-posten-sans-medium);\n color: var(--hds-brand-colors-dark);\n text-decoration: none;\n border-bottom: none;\n\n &:hover {\n color: var(--hds-brand-colors-dark);\n text-decoration: underline;\n text-decoration-color: var(--hds-brand-colors-dark);\n border-bottom: none;\n }\n }\n\n &--solid {\n color: var(--hds-ui-colors-black);\n border-color: var(--hds-ui-colors-black);\n\n &:hover,\n &:active {\n color: var(--hds-ui-colors-black-hover);\n border-color: var(--hds-ui-colors-black-hover);\n }\n }\n}\n",".hds-button {\n -webkit-font-smoothing: antialiased;\n /* stylelint-disable-next-line property-no-vendor-prefix -- Not sure if we need this or not 🤷 */\n -webkit-appearance: button;\n box-sizing: border-box;\n display: inline-block;\n padding: var(--hds-spacing-small-3) var(--hds-spacing-medium-2);\n border-radius: var(--hds-border-radius);\n border-width: 0;\n background: var(--hds-ui-colors-grey);\n border-color: var(--hds-ui-colors-grey);\n color: var(--hds-brand-button-colors-text);\n fill: var(--hds-brand-button-colors-text);\n font: var(--hds-typography-body-title);\n transition: all var(--hds-micro-animation-duration-quick) var(--hds-micro-animation-easing-normal);\n text-align: center; /* Center text when this is an <a> */\n cursor: pointer;\n word-break: normal;\n\n &:disabled,\n &[disabled],\n &[disabled]:active {\n color: var(--hds-ui-colors-dark-grey) !important;\n fill: var(--hds-ui-colors-dark-grey) !important;\n background: var(--hds-ui-colors-grey) !important;\n border-color: var(--hds-ui-colors-grey) !important;\n outline: 0 !important;\n box-shadow: none !important;\n cursor: default;\n }\n\n /**\n * Modifiers: sizes\n */\n\n &--large {\n font-size: 18px; /* TODO Token: typography-body minimum value */\n line-height: 26px;\n height: 58px;\n padding: 16px 24px;\n\n i,\n svg {\n margin-right: 12px;\n }\n }\n\n &--medium {\n font-size: 18px; /* TODO Token: typography-body minimum value */\n line-height: 26px;\n height: 50px;\n padding: 12px 20px;\n\n i,\n svg {\n margin-right: 10px;\n }\n }\n\n &--small {\n font-size: 16px; /* TODO Token: typography-body-small minimum value */\n line-height: 24px;\n height: 48px;\n padding: 12px 16px;\n\n i,\n svg {\n margin-right: 8px;\n }\n }\n\n &--full {\n width: 100%;\n }\n\n /**\n * Responsive modifiers\n */\n\n &--mobile-full {\n // TODO: Currently hardcoded due to css variables not available in media queries\n // Would be: --hds-breakpoints-medium\n // 🤷\n @media (max-width: 720px) {\n width: 100%;\n }\n }\n\n /**\n * Modifiers: types\n */\n\n &--primary {\n background: var(--hds-brand-colors-signature);\n border-color: var(--hds-brand-colors-signature);\n color: var(--hds-brand-button-colors-text);\n fill: var(--hds-brand-button-colors-text);\n\n &:hover,\n &:active {\n background: var(--hds-brand-colors-signature-hover);\n border-color: var(--hds-brand-colors-signature);\n outline: 0 solid var(--hds-brand-colors-signature-hover);\n }\n\n &:active {\n background: var(--hds-brand-colors-signature) !important;\n }\n }\n\n &--secondary {\n background: var(--hds-brand-colors-darker);\n border-color: var(--hds-brand-colors-darker);\n color: var(--hds-ui-colors-white);\n fill: var(--hds-ui-colors-white);\n\n &:hover,\n &:active {\n background: var(--hds-ui-colors-black);\n outline: 0 solid var(--hds-ui-colors-black);\n }\n\n &:active {\n background: var(--hds-brand-colors-darker) !important;\n }\n }\n\n &--outline {\n background: transparent;\n color: var(--hds-brand-colors-dark);\n fill: var(--hds-brand-colors-dark);\n border: var(--hds-stroke-thick) solid var(--hds-brand-colors-dark);\n\n &:disabled,\n &[disabled],\n &[disabled]:active {\n background: none !important;\n }\n\n &:hover,\n &:active {\n color: var(--hds-ui-colors-black);\n fill: var(--hds-ui-colors-black);\n border-color: var(--hds-ui-colors-black);\n background: none;\n }\n\n &:active {\n border-color: var(--hds-ui-colors-dark-grey);\n }\n }\n\n &--outline-white {\n background: transparent;\n border: var(--hds-stroke-thick) solid var(--hds-brand-colors-light);\n color: var(--hds-ui-colors-white);\n fill: var(--hds-ui-colors-white);\n outline-offset: 3px;\n\n &:hover,\n &:active {\n color: var(--hds-brand-colors-light);\n fill: var(--hds-brand-colors-light);\n }\n }\n\n &--outline-primary {\n background: transparent;\n border: var(--hds-stroke-thick) solid var(--hds-brand-colors-signature);\n color: var(--hds-ui-colors-black);\n fill: var(--hds-ui-colors-black);\n outline-offset: 3px;\n\n &:hover,\n &:active {\n color: var(--hds-brand-colors-dark);\n fill: var(--hds-brand-colors-dark);\n border: var(--hds-stroke-thick) solid var(--hds-brand-colors-dark);\n }\n\n &:disabled,\n &[disabled],\n &[disabled]:active {\n border: var(--hds-stroke-thick) solid var(--hds-ui-colors-grey);\n color: var(--hds-ui-colors-dark-grey);\n fill: var(--hds-ui-colors-dark-grey);\n background: transparent !important;\n }\n }\n\n &--outline-secondary,\n &--outline-dark {\n background: transparent;\n border: var(--hds-stroke-thick) solid var(--hds-brand-colors-darker);\n color: var(--hds-brand-colors-darker);\n fill: var(--hds-brand-colors-darker);\n outline-offset: 3px;\n\n &:hover,\n &:active {\n color: var(--hds-ui-colors-black);\n fill: var(--hds-ui-colors-black);\n border: var(--hds-stroke-thick) solid var(--hds-ui-colors-black);\n\n /* outline: 0px solid var(--hds-ui-colors-white); */\n }\n\n &:disabled,\n &[disabled],\n &[disabled]:active {\n border: var(--hds-stroke-thick) solid var(--hds-ui-colors-grey);\n color: var(--hds-ui-colors-dark-grey);\n fill: var(--hds-ui-colors-dark-grey);\n background: transparent !important;\n }\n }\n}\n"],"names":[],"version":3,"file":"scoped.css.map"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"mappings":"ACAA,uEAIA,uDAGE,oFAKF,uDAGE,oFAIA,wGAKF,wDAGE,uFAIA,oFAKF,qDAGE,sFAIA,yFAKF,iEAGE,wGAIA,qGAKF,2DAGE,+FAIA,+FAKF,+DAGE,qGAIA,kGAIA,yBACE","sources":["typography/typography.css","packages/css/src/typography/typography.css"],"sourcesContent":[".hds-typography-h2-display {\n font: var(--hds-brand-typography-h1-display);\n}\n\n.hds-typography-h1 {\n font: var(--hds-brand-typography-h1);\n}\n\n.hds-typography-h1.hds-typography-h1--spacing {\n margin-top: var(--hds-spacing-large-2);\n}\n\n.hds-typography-h2 {\n font: var(--hds-brand-typography-h2);\n}\n\n.hds-typography-h2.hds-typography-h2--spacing {\n margin-top: var(--hds-spacing-large-2);\n}\n\n.hds-typography-h1 ~ .hds-typography-h2.hds-typography-h2--spacing {\n margin-top: var(--hds-spacing-medium-3);\n}\n\n.hds-typography-h3 {\n font: var(--hds-typography-header-h3);\n}\n\n.hds-typography-h3.hds-typography-h3--title {\n font: var(--hds-typography-header-h3-title);\n}\n\n.hds-typography-h3.hds-typography-h3--spacing {\n margin-top: var(--hds-spacing-large-2);\n}\n\n.hds-typography-body {\n font: var(--hds-typography-body);\n}\n\n.hds-typography-body.hds-typography-body--title {\n font: var(--hds-typography-body-title);\n}\n\n.hds-typography-body.hds-typography-body--spacing {\n margin-top: var(--hds-spacing-medium-2);\n}\n\n.hds-typography-body-small {\n font: var(--hds-typography-body-small);\n}\n\n.hds-typography-body-small.hds-typography-body-small--title {\n font: var(--hds-typography-body-small-title);\n}\n\n.hds-typography-body-small.hds-typography-body-small--spacing {\n margin-top: var(--hds-spacing-medium-2);\n}\n\n.hds-typography-caption {\n font: var(--hds-typography-caption);\n}\n\n.hds-typography-caption.hds-typography-caption--title {\n font: var(--hds-typography-caption-title);\n}\n\n.hds-typography-caption.hds-typography-caption--spacing {\n margin-top: var(--hds-spacing-medium-2);\n}\n\n.hds-typography-technical {\n font: var(--hds-typography-technical);\n}\n\n.hds-typography-technical.hds-typography-technical--title {\n font: var(--hds-typography-technical-title);\n}\n\n.hds-typography-technical.hds-typography-technical--spacing {\n margin-top: var(--hds-spacing-small-1);\n}\n\n@media (min-width: 940px) {\n .hds-typography-technical.hds-typography-technical--spacing {\n margin-top: var(--hds-spacing-small-2);\n }\n}\n\n/*# sourceMappingURL=typography.css.map */\n",".hds-typography-h2-display {\n font: var(--hds-brand-typography-h1-display);\n}\n\n.hds-typography-h1 {\n font: var(--hds-brand-typography-h1);\n\n &.hds-typography-h1--spacing {\n margin-top: var(--hds-spacing-large-2);\n }\n}\n\n.hds-typography-h2 {\n font: var(--hds-brand-typography-h2);\n\n &.hds-typography-h2--spacing {\n margin-top: var(--hds-spacing-large-2);\n }\n\n .hds-typography-h1 ~ &.hds-typography-h2--spacing {\n margin-top: var(--hds-spacing-medium-3);\n }\n}\n\n.hds-typography-h3 {\n font: var(--hds-typography-header-h3);\n\n &.hds-typography-h3--title {\n font: var(--hds-typography-header-h3-title);\n }\n\n &.hds-typography-h3--spacing {\n margin-top: var(--hds-spacing-large-2);\n }\n}\n\n.hds-typography-body {\n font: var(--hds-typography-body);\n\n &.hds-typography-body--title {\n font: var(--hds-typography-body-title);\n }\n\n &.hds-typography-body--spacing {\n margin-top: var(--hds-spacing-medium-2);\n }\n}\n\n.hds-typography-body-small {\n font: var(--hds-typography-body-small);\n\n &.hds-typography-body-small--title {\n font: var(--hds-typography-body-small-title);\n }\n\n &.hds-typography-body-small--spacing {\n margin-top: var(--hds-spacing-medium-2);\n }\n}\n\n.hds-typography-caption {\n font: var(--hds-typography-caption);\n\n &.hds-typography-caption--title {\n font: var(--hds-typography-caption-title);\n }\n\n &.hds-typography-caption--spacing {\n margin-top: var(--hds-spacing-medium-2);\n }\n}\n\n.hds-typography-technical {\n font: var(--hds-typography-technical);\n\n &.hds-typography-technical--title {\n font: var(--hds-typography-technical-title);\n }\n\n &.hds-typography-technical--spacing {\n margin-top: var(--hds-spacing-small-1);\n }\n\n @media (min-width: 940px) {\n &.hds-typography-technical--spacing {\n margin-top: var(--hds-spacing-small-2);\n }\n }\n}\n"],"names":[],"version":3,"file":"typography.css.map"}
|