Drupal
/
drupal
mirror of https://git.drupalcode.org/project/drupal.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

Issue #3177918 by mherchel: Holistically refactor use of Olivero's z-index rules to play nice with Core

merge-requests/184/head
Alex Pott 2020-12-24 08:25:34 +00:00
parent 77e75d6293
commit bdf6131d9f
No known key found for this signature in database
GPG Key ID: 31905460D4A69276
12 changed files with 12 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
core/themes/olivero/css/components/header-navigation.css
View File

@ -36,7 +36,7 @@
.header-nav {
position: fixed;
z-index: 5; /* appear above overlay */
z-index: 105; /* appear above overlay */
top: 0;
visibility: hidden;
overflow: auto;

2
core/themes/olivero/css/components/header-navigation.pcss.css
View File

@ -7,7 +7,7 @@
.header-nav {
position: fixed;
z-index: 5; /* appear above overlay */
z-index: 105; /* appear above overlay */
inset-block-start: 0;
inset-inline-end: 0;
visibility: hidden;

4
core/themes/olivero/css/components/header.css
View File

@ -27,7 +27,7 @@
.header__left {
position: relative;
z-index: 2;
z-index: 102;
display: flex;
align-items: flex-end;
-ms-grid-row-align: stretch;
@ -50,7 +50,7 @@
@media (min-width: 75rem) {
body:not(.is-always-mobile-nav) .site-header__fixable.js-fixed {
position: fixed;
z-index: 2; /* Appear above body content that is position: relative */
z-index: 102; /* Appear above body content that is position: relative */
top: -4.5rem;
max-width: 98.125rem;
}

4
core/themes/olivero/css/components/header.pcss.css
View File

@ -18,7 +18,7 @@
.header__left {
position: relative;
z-index: 2;
z-index: 102;
display: flex;
align-items: flex-end;
align-self: stretch;
@ -43,7 +43,7 @@
body:not(.is-always-mobile-nav) {
& .site-header__fixable.js-fixed {
position: fixed;
z-index: 2; /* Appear above body content that is position: relative */
z-index: 102; /* Appear above body content that is position: relative */
inset-block-start: calc(-1 * var(--sp4));
max-width: var(--max-bg-color);
}

4
core/themes/olivero/css/components/navigation/nav-button-mobile.css
View File

@ -36,7 +36,7 @@
.mobile-nav-button {
position: relative;
z-index: 10; /* appear above mobile nav */
z-index: 110; /* Appear above mobile nav. */
display: flex;
align-items: center;
-ms-grid-row-align: center;
@ -67,7 +67,7 @@
}
}
/* Text that says "menu" */
/* Text that says "menu". */
.mobile-nav-button__label {
position: absolute;

4
core/themes/olivero/css/components/navigation/nav-button-mobile.pcss.css
View File

@ -7,7 +7,7 @@
.mobile-nav-button {
position: relative;
z-index: 10; /* appear above mobile nav */
z-index: 110; /* Appear above mobile nav. */
display: flex;
align-items: center;
align-self: center;
@ -29,7 +29,7 @@
}
}
/* Text that says "menu" */
/* Text that says "menu". */
.mobile-nav-button__label {
position: absolute;
display: block;

2
core/themes/olivero/css/components/navigation/nav-primary-wide.css
View File

@ -161,7 +161,7 @@
body:not(.is-always-mobile-nav) .primary-nav__menu--level-2 {
position: absolute;
z-index: 5; /* Appear above search container. */
z-index: 105; /* Appear above search container. */
/* stylelint-disable csstools/use-logical */
top: calc(100% - 0.5625rem);
left: 50%;

2
core/themes/olivero/css/components/navigation/nav-primary-wide.pcss.css
View File

@ -85,7 +85,7 @@ body:not(.is-always-mobile-nav) {
& .primary-nav__menu--level-2 {
position: absolute;
z-index: 5; /* Appear above search container. */
z-index: 105; /* Appear above search container. */
/* stylelint-disable csstools/use-logical */
top: calc(100% - (0.5 * var(--sp)));
left: 50%;

1
core/themes/olivero/css/components/skip-link.css
View File

@ -29,7 +29,6 @@
}
.skip-link {
z-index: 1; /* Appear above header */
display: block;
width: 100%;
max-width: 98.125rem;

1
core/themes/olivero/css/components/skip-link.pcss.css
View File

@ -8,7 +8,6 @@
@import "../base/variables.pcss.css";
.skip-link {
z-index: 1; /* Appear above header */
display: block;
width: 100%;
max-width: var(--max-bg-color);

2
core/themes/olivero/css/components/tabs.css
View File

@ -110,8 +110,6 @@ html:not(.js) .tabs__tab,
}
}
.tabs__link:focus {
position: relative;
z-index: 1;
border-color: #2494db;
outline: none;
}

2
core/themes/olivero/css/components/tabs.pcss.css
View File

@ -80,8 +80,6 @@ html:not(.js) .tabs__tab,
}
.tabs__link:focus {
position: relative;
z-index: 1;
border-color: var(--color--blue-50);
outline: none;
}