diff --git a/__snapshots__/header/showcase/mobile-chrome/DBHeader-should-match-screenshot-1/DBHeader-should-match-screenshot.png b/__snapshots__/header/showcase/mobile-chrome/DBHeader-should-match-screenshot-1/DBHeader-should-match-screenshot.png index e733f325b9a0..78935e425c1a 100644 Binary files a/__snapshots__/header/showcase/mobile-chrome/DBHeader-should-match-screenshot-1/DBHeader-should-match-screenshot.png and b/__snapshots__/header/showcase/mobile-chrome/DBHeader-should-match-screenshot-1/DBHeader-should-match-screenshot.png differ diff --git a/__snapshots__/header/showcase/mobile-chrome/should-have-same-aria-snapshot/DBHeader-should-have-same-aria-snapshot.yaml b/__snapshots__/header/showcase/mobile-chrome/should-have-same-aria-snapshot/DBHeader-should-have-same-aria-snapshot.yaml index 42d253a7ce7a..b9cf83412303 100644 --- a/__snapshots__/header/showcase/mobile-chrome/should-have-same-aria-snapshot/DBHeader-should-have-same-aria-snapshot.yaml +++ b/__snapshots__/header/showcase/mobile-chrome/should-have-same-aria-snapshot/DBHeader-should-have-same-aria-snapshot.yaml @@ -30,9 +30,6 @@ - link "Examples arrow_up_right\" / \"" - text: brand" / " DBHeader - button "menu\" / \" BurgerMenu" - - text: brand" / " DBHeader - - button "menu\" / \" BurgerMenu" - - text: brand" / " + - text: brand" / " DBHeader brand" / " - button "menu\" / \" BurgerMenu" - - text: brand" / " - - button "menu\" / \" BurgerMenu" \ No newline at end of file + - text: brand" / " \ No newline at end of file diff --git a/__snapshots__/header/showcase/mobile-safari/should-have-same-aria-snapshot/DBHeader-should-have-same-aria-snapshot.yaml b/__snapshots__/header/showcase/mobile-safari/should-have-same-aria-snapshot/DBHeader-should-have-same-aria-snapshot.yaml index 42d253a7ce7a..b9cf83412303 100644 --- a/__snapshots__/header/showcase/mobile-safari/should-have-same-aria-snapshot/DBHeader-should-have-same-aria-snapshot.yaml +++ b/__snapshots__/header/showcase/mobile-safari/should-have-same-aria-snapshot/DBHeader-should-have-same-aria-snapshot.yaml @@ -30,9 +30,6 @@ - link "Examples arrow_up_right\" / \"" - text: brand" / " DBHeader - button "menu\" / \" BurgerMenu" - - text: brand" / " DBHeader - - button "menu\" / \" BurgerMenu" - - text: brand" / " + - text: brand" / " DBHeader brand" / " - button "menu\" / \" BurgerMenu" - - text: brand" / " - - button "menu\" / \" BurgerMenu" \ No newline at end of file + - text: brand" / " \ No newline at end of file diff --git a/packages/components/src/components/header/header.scss b/packages/components/src/components/header/header.scss index a02802aa3bfc..8a2aecf1db01 100644 --- a/packages/components/src/components/header/header.scss +++ b/packages/components/src/components/header/header.scss @@ -52,6 +52,19 @@ display: none; } } + + // Hide the burger menu if there is no navigation + &:has(.db-header-navigation:empty) { + .db-header-burger-menu-container { + display: none; + } + + &:has(.db-header-secondary-action:empty) { + .db-header-action-container::before { + display: none; + } + } + } } .db-header-navigation-bar { diff --git a/packages/foundations/docs/BrowserSupport.md b/packages/foundations/docs/BrowserSupport.md index 185f9e6e8d75..be3f3f517012 100644 --- a/packages/foundations/docs/BrowserSupport.md +++ b/packages/foundations/docs/BrowserSupport.md @@ -4,7 +4,7 @@ We're [testing our components with playwright](../../foundations/test-table) on This may leave some older browser versions behind. If you need to take care of these older browsers, you may not want to migrate to DB UX Design System v3 right now, but stay with DB UI Core or Elements for a little longer. In particular, the following features we use may be related to an evaluation of your browser strategy: -| Web Feature | Google Chrome | Mozilla Firefox | Apple Safari | -| ------------------------------------------------------------------------------------------------------------------------------- | ---------------- | ---------------- | ----------------- | -| [`@property` / typed CSS Custom Properties](https://developer.mozilla.org/en-US/docs/Web/CSS/@property) | 85 (25.08.2022) | 128 (09.07.2024) | 16.4 (27.03.2023) | -| [`light-dark()`](https://developer.mozilla.org/en-US/docs/Web/CSS/color_value/light-dark) | 123 (19.03.2024) | 120 (21.11.2023) | 17.5 (13.05.2024) | +| Web Feature | Google Chrome | Mozilla Firefox | Apple Safari | +| ------------------------------------------------------------------------------------------------------- | ---------------- | ---------------- | ----------------- | +| [`@property` / typed CSS Custom Properties](https://developer.mozilla.org/en-US/docs/Web/CSS/@property) | 85 (25.08.2022) | 128 (09.07.2024) | 16.4 (27.03.2023) | +| [`light-dark()`](https://developer.mozilla.org/en-US/docs/Web/CSS/color_value/light-dark) | 123 (19.03.2024) | 120 (21.11.2023) | 17.5 (13.05.2024) | diff --git a/packages/foundations/scss/defaults/_default-variables.scss b/packages/foundations/scss/defaults/_default-variables.scss index 7e02d3721cc6..ceb2fcf45339 100644 --- a/packages/foundations/scss/defaults/_default-variables.scss +++ b/packages/foundations/scss/defaults/_default-variables.scss @@ -347,14 +347,11 @@ --db-border-radius-3xl: 2rem; --db-border-radius-full: 500rem; --db-elevation-sm: - 0 0 1px -1px #0003, 0 0 4px 1px #0000001f, - 0 0 2px #00000024; + 0 0 1px -1px #0003, 0 0 4px 1px #0000001f, 0 0 2px #00000024; --db-elevation-md: - 0 0 2px -1px #0003, 0 0 8px 1px #0000001f, - 0 0 4px #00000024; + 0 0 2px -1px #0003, 0 0 8px 1px #0000001f, 0 0 4px #00000024; --db-elevation-lg: - 0 0 4px -3px #0003, 0 0 16px 3px #0000001f, - 0 0 8px 1px #00000024; + 0 0 4px -3px #0003, 0 0 16px 3px #0000001f, 0 0 8px 1px #00000024; --db-font-family-sans: "OpenSans", helvetica, arial, sans-serif; --db-font-family-head: "OpenSans Head", helvetica, arial, sans-serif; --db-sizing-fixed-mobile-header: 3.5rem;