diff options
author | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-21 11:44:51 +0000 |
---|---|---|
committer | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-21 11:44:51 +0000 |
commit | 9e3c08db40b8916968b9f30096c7be3f00ce9647 (patch) | |
tree | a68f146d7fa01f0134297619fbe7e33db084e0aa /browser/components/firefoxview/fxview-category-navigation.css | |
parent | Initial commit. (diff) | |
download | thunderbird-upstream.tar.xz thunderbird-upstream.zip |
Adding upstream version 1:115.7.0.upstream/1%115.7.0upstream
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'browser/components/firefoxview/fxview-category-navigation.css')
-rw-r--r-- | browser/components/firefoxview/fxview-category-navigation.css | 64 |
1 files changed, 64 insertions, 0 deletions
diff --git a/browser/components/firefoxview/fxview-category-navigation.css b/browser/components/firefoxview/fxview-category-navigation.css new file mode 100644 index 0000000000..0f2198e239 --- /dev/null +++ b/browser/components/firefoxview/fxview-category-navigation.css @@ -0,0 +1,64 @@ +/* This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this + * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ + +:host { + --fxviewcategorynav-button-padding: 8px; + margin-inline-start: 42px; + border-inline-end: 1px solid transparent; + position: sticky; +} + +nav { + height: 100%; + display: grid; + grid-template-rows: min-content 1fr auto; + gap: 25px; +} + +.category-nav-header { + /* Align the header text/icon with the category button icons */ + margin-inline-start: var(--fxviewcategorynav-button-padding); +} + +::slotted(h2) { + font-size: 1.6em; + margin: 0; +} + +.category-nav-buttons, +::slotted(.category-nav-footer) { + display: grid; + grid-template-columns: 1fr; + grid-auto-rows: min-content; + gap: 4px; +} + +@media (prefers-contrast) { + .category-nav-buttons { + gap: 8px; + } +} + +@media (prefers-reduced-motion) { + /* Setting border-inline-end to add clear differentiation between side navigation and main content area */ + :host { + border-inline-end-color: var(--in-content-border-color); + } +} + +@media (max-width: 52rem) { + :host { + grid-template-rows: 1fr auto; + } + + .category-nav-header { + display: none; + } + + .category-nav-buttons, + ::slotted(.category-nav-footer) { + justify-content: center; + grid-template-columns: min-content; + } +} |