@sikt/sds-header 3.0.0 → 3.0.1

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/CHANGELOG.md CHANGED
@@ -2,6 +2,12 @@
2
2
 
3
3
  All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
4
4
 
5
+ ### [3.0.1](https://gitlab.sikt.no/designsystem/sds-komponentbibliotek/compare/@sikt/sds-header@3.0.0...@sikt/sds-header@3.0.1) (2023-12-05)
6
+
7
+ ### Bug Fixes
8
+
9
+ - **tabs:** remove border bottom on hover ([e308b3f](https://gitlab.sikt.no/designsystem/sds-komponentbibliotek/commit/e308b3fa895a05f581e8b1e106d1b7371ef44bc6))
10
+
5
11
  ## [3.0.0](https://gitlab.sikt.no/designsystem/sds-komponentbibliotek/compare/@sikt/sds-header@2.1.0...@sikt/sds-header@3.0.0) (2023-11-28)
6
12
 
7
13
  ### ⚠ BREAKING CHANGES
package/dist/index.css CHANGED
@@ -161,7 +161,6 @@
161
161
  .sds-header__nav-link:hover,
162
162
  .sds-header__nav-link:focus-visible {
163
163
  background-color: var( --sds-color-interaction-primary-transparent-highlight );
164
- border-color: var(--sds-color-interaction-primary-strong-highlight);
165
164
  }
166
165
  .sds-header__nav-link:active {
167
166
  background-color: var( --sds-color-interaction-primary-transparent-pressed );
@@ -1 +1 @@
1
- {"version":3,"sources":["../header.pcss","../header-nav.pcss"],"sourcesContent":[".sds-header {\n align-items: center;\n position: relative;\n background-color: var(--sds-color-layout-background-primary);\n\n --header-height: 48px;\n}\n\n @media (width >= 720px) {.sds-header {\n --header-height: 56px\n}\n }\n\n @media (width >= 1024px) {.sds-header {\n --header-height: 72px\n}\n }\n\n .sds-header__content {\n min-height: var(--header-height);\n padding: 0 var(--sds-space-padding-medium);\n display: grid;\n grid-gap: 0 var(--sds-space-padding-small);\n grid-template-columns: 1fr auto 1fr;\n align-items: center;\n }\n\n .sds-header__header-item {\n display: none;\n }\n\n @media (width >= 720px) {\n\n .sds-header__header-item {\n display: unset\n }\n }\n\n .sds-header__header-item--last-item {\n width: -moz-fit-content;\n width: fit-content;\n justify-self: end;\n }\n\n .sds-header__skip-link.sds-screen-reader-only--focusable:focus-within {\n background-color: var(--sds-color-layout-background-primary);\n position: absolute;\n z-index: 1;\n }\n\n .sds-header-collapsible__button {\n grid-column: -2 / -1;\n justify-self: end;\n width: -moz-fit-content;\n width: fit-content;\n }\n\n @media (width >= 720px) {\n\n .sds-header-collapsible__button.sds-button {\n display: none\n }\n }\n\n .sds-header-collapsible__menu {\n display: none;\n gap: var(--sds-space-gap-medium);\n flex-direction: column;\n overflow: auto;\n width: 100%;\n border-top: var(--sds-space-border-weight-thin) solid\n var(--sds-color-interaction-primary-strong-default);\n padding: var(--sds-space-padding-medium);\n }\n\n .sds-header-collapsible__menu .sds-header__nav-list {\n display: flex;\n flex-direction: column;\n }\n\n .sds-header-collapsible__dropdown {\n position: absolute;\n top: var(--header-height);\n left: 0;\n background-color: var(--sds-color-layout-background-primary);\n z-index: calc(var(--sds-base-zindex-drawer) + 1);\n height: 100vh;\n width: 100%;\n max-height: 0;\n transition: max-height 0.25s ease;\n overflow: hidden;\n grid-column: 1 / -1;\n }\n\n .sds-header-collapsible__dropdown--open {\n max-height: calc(100vh - var(--header-height));\n }\n\n @media (width >= 720px) {\n\n .sds-header-collapsible__dropdown {\n display: none\n }\n }\n\n .sds-header-collapsible__dropdown.sds-header-collapsible__dropdown--open .sds-header-collapsible__menu {\n display: flex;\n }\n\n .sds-header .sds-header__logo {\n font-size: var(--sds-base-size-relative-m);\n }\n\n .sds-header .sds-header__logo-link {\n background-color: unset;\n color: inherit;\n text-decoration: none;\n }\n",".sds-header__nav-list {\n height: 100%;\n list-style-type: none;\n margin: 0;\n }\n @media (width >= 720px) {\n .sds-header__nav-item {\n display: inline-flex\n }\n }\n @media (width < 720px) {\n .sds-header__nav-link {\n /* TODO: import this from Drawer component */\n align-items: center;\n background-color: transparent;\n border: 0 none;\n border-radius: var(--sds-space-border-radius-small);\n color: var(--sds-color-text-primary);\n cursor: pointer;\n display: flex;\n gap: var(--sds-space-gap-small);\n font-size: var(--sds-typography-body-fontsize-large);\n font-weight: var(--sds-typography-weight-regular);\n line-height: var(--sds-typography-body-lineheight-large);\n padding: var(--sds-space-padding-small);\n text-decoration: none;\n width: 100%\n }\n\n .sds-header__nav-link:hover,\n .sds-header__nav-link:focus-visible {\n background: var(--sds-color-interaction-primary-transparent-highlight);\n }\n\n .sds-header__nav-link:active {\n background: var(--sds-color-interaction-primary-transparent-pressed);\n }\n\n .sds-header__nav-link:focus-visible {\n outline: var(--sds-focus-outline);\n }\n }\n @media (width >= 720px) {\n .sds-header__nav-link {\n /* TODO: import this from Tabs component */\n align-items: center;\n border: 0 none;\n border-bottom: var(--sds-space-border-weight-bold) solid transparent;\n color: var(--sds-color-text-primary);\n display: inline-flex;\n gap: var(--sds-space-gap-small);\n font-size: var(--sds-typography-body-fontsize-large);\n line-height: var(--sds-typography-body-lineheight-large);\n padding: var(--sds-space-padding-medium) var(--sds-space-padding-small);\n margin-bottom: calc(var(--tab-list-border-bottom) * -1);\n text-decoration: none\n }\n\n .sds-header__nav-link-icon {\n font-size: var(--sds-base-size-m);\n }\n\n .sds-header__nav-link--selected,\n .sds-header__nav-link[aria-selected=\"true\"] {\n border-color: var(--sds-color-interaction-primary-strong-default);\n }\n\n .sds-header__nav-link:hover,\n .sds-header__nav-link:focus-visible {\n background-color: var(\n --sds-color-interaction-primary-transparent-highlight\n );\n border-color: var(--sds-color-interaction-primary-strong-highlight);\n }\n\n .sds-header__nav-link:active {\n background-color: var(\n --sds-color-interaction-primary-transparent-pressed\n );\n border-color: var(--sds-color-interaction-primary-strong-pressed);\n }\n\n .sds-header__nav-link:focus-visible {\n outline: var(--sds-focus-outline);\n outline-offset: 0;\n }\n }\n"],"mappings":"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","names":[]}
1
+ {"version":3,"sources":["../header.pcss","../header-nav.pcss"],"sourcesContent":[".sds-header {\n align-items: center;\n position: relative;\n background-color: var(--sds-color-layout-background-primary);\n\n --header-height: 48px;\n}\n\n @media (width >= 720px) {.sds-header {\n --header-height: 56px\n}\n }\n\n @media (width >= 1024px) {.sds-header {\n --header-height: 72px\n}\n }\n\n .sds-header__content {\n min-height: var(--header-height);\n padding: 0 var(--sds-space-padding-medium);\n display: grid;\n grid-gap: 0 var(--sds-space-padding-small);\n grid-template-columns: 1fr auto 1fr;\n align-items: center;\n }\n\n .sds-header__header-item {\n display: none;\n }\n\n @media (width >= 720px) {\n\n .sds-header__header-item {\n display: unset\n }\n }\n\n .sds-header__header-item--last-item {\n width: -moz-fit-content;\n width: fit-content;\n justify-self: end;\n }\n\n .sds-header__skip-link.sds-screen-reader-only--focusable:focus-within {\n background-color: var(--sds-color-layout-background-primary);\n position: absolute;\n z-index: 1;\n }\n\n .sds-header-collapsible__button {\n grid-column: -2 / -1;\n justify-self: end;\n width: -moz-fit-content;\n width: fit-content;\n }\n\n @media (width >= 720px) {\n\n .sds-header-collapsible__button.sds-button {\n display: none\n }\n }\n\n .sds-header-collapsible__menu {\n display: none;\n gap: var(--sds-space-gap-medium);\n flex-direction: column;\n overflow: auto;\n width: 100%;\n border-top: var(--sds-space-border-weight-thin) solid\n var(--sds-color-interaction-primary-strong-default);\n padding: var(--sds-space-padding-medium);\n }\n\n .sds-header-collapsible__menu .sds-header__nav-list {\n display: flex;\n flex-direction: column;\n }\n\n .sds-header-collapsible__dropdown {\n position: absolute;\n top: var(--header-height);\n left: 0;\n background-color: var(--sds-color-layout-background-primary);\n z-index: calc(var(--sds-base-zindex-drawer) + 1);\n height: 100vh;\n width: 100%;\n max-height: 0;\n transition: max-height 0.25s ease;\n overflow: hidden;\n grid-column: 1 / -1;\n }\n\n .sds-header-collapsible__dropdown--open {\n max-height: calc(100vh - var(--header-height));\n }\n\n @media (width >= 720px) {\n\n .sds-header-collapsible__dropdown {\n display: none\n }\n }\n\n .sds-header-collapsible__dropdown.sds-header-collapsible__dropdown--open .sds-header-collapsible__menu {\n display: flex;\n }\n\n .sds-header .sds-header__logo {\n font-size: var(--sds-base-size-relative-m);\n }\n\n .sds-header .sds-header__logo-link {\n background-color: unset;\n color: inherit;\n text-decoration: none;\n }\n",".sds-header__nav-list {\n height: 100%;\n list-style-type: none;\n margin: 0;\n }\n @media (width >= 720px) {\n .sds-header__nav-item {\n display: inline-flex\n }\n }\n @media (width < 720px) {\n .sds-header__nav-link {\n /* TODO: import this from Drawer component */\n align-items: center;\n background-color: transparent;\n border: 0 none;\n border-radius: var(--sds-space-border-radius-small);\n color: var(--sds-color-text-primary);\n cursor: pointer;\n display: flex;\n gap: var(--sds-space-gap-small);\n font-size: var(--sds-typography-body-fontsize-large);\n font-weight: var(--sds-typography-weight-regular);\n line-height: var(--sds-typography-body-lineheight-large);\n padding: var(--sds-space-padding-small);\n text-decoration: none;\n width: 100%\n }\n\n .sds-header__nav-link:hover,\n .sds-header__nav-link:focus-visible {\n background: var(--sds-color-interaction-primary-transparent-highlight);\n }\n\n .sds-header__nav-link:active {\n background: var(--sds-color-interaction-primary-transparent-pressed);\n }\n\n .sds-header__nav-link:focus-visible {\n outline: var(--sds-focus-outline);\n }\n }\n @media (width >= 720px) {\n .sds-header__nav-link {\n /* TODO: import this from Tabs component */\n align-items: center;\n border: 0 none;\n border-bottom: var(--sds-space-border-weight-bold) solid transparent;\n color: var(--sds-color-text-primary);\n display: inline-flex;\n gap: var(--sds-space-gap-small);\n font-size: var(--sds-typography-body-fontsize-large);\n line-height: var(--sds-typography-body-lineheight-large);\n padding: var(--sds-space-padding-medium) var(--sds-space-padding-small);\n margin-bottom: calc(var(--tab-list-border-bottom) * -1);\n text-decoration: none\n }\n\n .sds-header__nav-link-icon {\n font-size: var(--sds-base-size-m);\n }\n\n .sds-header__nav-link--selected,\n .sds-header__nav-link[aria-selected=\"true\"] {\n border-color: var(--sds-color-interaction-primary-strong-default);\n }\n\n .sds-header__nav-link:hover,\n .sds-header__nav-link:focus-visible {\n background-color: var(\n --sds-color-interaction-primary-transparent-highlight\n );\n }\n\n .sds-header__nav-link:active {\n background-color: var(\n --sds-color-interaction-primary-transparent-pressed\n );\n border-color: var(--sds-color-interaction-primary-strong-pressed);\n }\n\n .sds-header__nav-link:focus-visible {\n outline: var(--sds-focus-outline);\n outline-offset: 0;\n }\n }\n"],"mappings":"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","names":[]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@sikt/sds-header",
3
- "version": "3.0.0",
3
+ "version": "3.0.1",
4
4
  "license": "UNLICENSED",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.mjs",