Clean up z-indexes

There have been some z-indexes that were removed and then reintroduced
through strange merges. This is an attempt to remove all z-indexes that
are unnecessary and to clearly state the purpose of the remaining
z-indexes in a comment to each index.

SPR-981
This commit is contained in:
Michael Große 2017-05-05 12:14:44 +02:00
commit 80aedcc551
No known key found for this signature in database
GPG key ID: 7E31028FBFEACC79
15 changed files with 11 additions and 23 deletions

View file

@ -10,14 +10,12 @@
#dokuwiki__content { #dokuwiki__content {
position: relative; position: relative;
z-index: 10;
&::before { &::before {
content: ''; content: '';
position: absolute; position: absolute;
top: 0; top: 0;
left: 0; left: 0;
z-index: -1;
height: @page-header_height; height: @page-header_height;
box-sizing: border-box; box-sizing: border-box;
width: 100%; width: 100%;

View file

@ -38,7 +38,6 @@
#dokuwiki__footer { #dokuwiki__footer {
.main-footer { .main-footer {
position: relative; position: relative;
z-index: 2;
box-sizing: border-box; box-sizing: border-box;
background-color: @ini_background_site; background-color: @ini_background_site;
} }

View file

@ -136,7 +136,6 @@
/* + + + mobile nav togglelink + + + */ /* + + + mobile nav togglelink + + + */
.menu-togglelink { .menu-togglelink {
position: relative; position: relative;
z-index: 1;
margin: @headericons-margin-xxs -(@very-small-spacing) 0 0; margin: @headericons-margin-xxs -(@very-small-spacing) 0 0;
a { a {

View file

@ -6,7 +6,6 @@
#dokuwiki__content.main-content { #dokuwiki__content.main-content {
.editbutton_section { .editbutton_section {
position: relative; position: relative;
z-index: 2;
top: 0; top: 0;
float: right; float: right;
margin-top: 0; // for best position of edit-tab beneeth table margin-top: 0; // for best position of edit-tab beneeth table

View file

@ -119,7 +119,7 @@
&:focus, &:focus,
&:active { &:active {
position: relative; // always show label, even with collapsed sidebar position: relative; // always show label, even with collapsed sidebar
z-index: 100; z-index: 100; // show label/link above content on hover etc.
width: 100%; width: 100%;
background-color: @ini_nav_menu_hover_bg; background-color: @ini_nav_menu_hover_bg;
border-color: @ini_nav_menu_hover_color; border-color: @ini_nav_menu_hover_color;
@ -316,7 +316,7 @@
display: block !important; display: block !important;
position: absolute; position: absolute;
left: 1.25rem; // left margin of content container left: 1.25rem; // left margin of content container
z-index: 200; // above all z-index: 200; // mobile sidebar above all
box-shadow: @box-shadow-right-bottom; box-shadow: @box-shadow-right-bottom;
min-width: 45%; min-width: 45%;
max-width: 90%; max-width: 90%;
@ -325,7 +325,6 @@
> nav { > nav {
position: relative; position: relative;
z-index: 2;
&:first-child { &:first-child {
margin-top: 1.2rem; margin-top: 1.2rem;

View file

@ -191,7 +191,7 @@
.search.main-sidebar { .search.main-sidebar {
p.toggleSearch { p.toggleSearch {
position: relative; position: relative;
z-index: 1; z-index: 1; // put search-toggle-button above #dw__search
display: block; display: block;
float: left; float: left;
width: auto; width: auto;
@ -233,7 +233,6 @@
.search.main-sidebar { .search.main-sidebar {
display: block !important; display: block !important;
position: relative; position: relative;
z-index: 1;
margin-left: -1px; margin-left: -1px;
margin-right: -1px; margin-right: -1px;

View file

@ -12,7 +12,7 @@
.justify-content(flex-end); .justify-content(flex-end);
position: relative; position: relative;
z-index: 10; z-index: 1; // put meta-box above positioned content-elements such as aggregations, edit-buttons
float: right; float: right;
max-width: 40%; max-width: 40%;
margin-top: -(@page_padding-top); // reverse padding-top of .page container margin-top: -(@page_padding-top); // reverse padding-top of .page container
@ -158,7 +158,7 @@
} }
&.active { &.active {
z-index: 1; z-index: 1; // put the active tab above the meta-content in .tab-pane.active
> a { > a {
cursor: default; cursor: default;

View file

@ -32,7 +32,7 @@ nav#dokuwiki__pagetools {
@toolbox-size: 30px; @toolbox-size: 30px;
top: 3.05rem; top: 3.05rem;
z-index: 100; z-index: 100; // put labels of the pagetools above content on hover etc.
@media @screen_min-md { @media @screen_min-md {
right: -2.5rem; right: -2.5rem;

View file

@ -12,7 +12,6 @@
bottom: -1px; bottom: -1px;
width: 2rem; width: 2rem;
left: -(@margin-default); left: -(@margin-default);
z-index: 1;
@media @screen_max-md { @media @screen_max-md {
display: none; display: none;

View file

@ -66,11 +66,11 @@
/* + + + + + z-indeces + + + + + */ /* + + + + + z-indeces + + + + + */
@media @screen_min-md { @media @screen_min-md {
.nav-direct p { .nav-direct p {
z-index: 1000; z-index: 1000; // keyboard-navigation overlays
} }
.top-header { .top-header {
z-index: 900; z-index: 1; // put MagicMatcher-Dropdowns above .content
} }
.content .row > .col-xs-12 { .content .row > .col-xs-12 {

View file

@ -95,5 +95,5 @@ ul.page-attributes {
} }
.plugin__do_usertasks_list { .plugin__do_usertasks_list {
z-index: 5; z-index: 200; // put tasks-list above pagetools
} }

View file

@ -47,7 +47,6 @@
#magicmatcher__context { #magicmatcher__context {
position: relative; position: relative;
z-index: 100;
width: 100%; width: 100%;
min-height: @height-context-bar; min-height: @height-context-bar;
box-sizing: border-box; box-sizing: border-box;

View file

@ -101,7 +101,6 @@
/* + + + + + struct inline-editor + + + + + */ /* + + + + + struct inline-editor + + + + + */
.dokuwiki { .dokuwiki {
.struct_inlineditor { .struct_inlineditor {
z-index: 3;
box-shadow: @box-shadow-bottom; box-shadow: @box-shadow-bottom;
p.hint { p.hint {

View file

@ -34,7 +34,7 @@ div#dwpl-ti-container {
&.selected { &.selected {
position: relative; position: relative;
z-index: 1; z-index: 1; // put .slected tab above div.dwpl-ti-content-box
background-color: @ini_background; background-color: @ini_background;
color: @ini_text; color: @ini_text;
} }
@ -45,7 +45,6 @@ div#dwpl-ti-container {
/* + + + content box + + + */ /* + + + content box + + + */
div.dwpl-ti-content-box { div.dwpl-ti-content-box {
position: relative; position: relative;
z-index: 0;
overflow: auto; overflow: auto;
box-shadow: @box-shadow; box-shadow: @box-shadow;
background-color: @ini_background; background-color: @ini_background;

View file

@ -24,7 +24,7 @@
position: absolute; position: absolute;
top: 0; top: 0;
left: 0; left: 0;
z-index: 2; z-index: 2; // put 'view original file'-overlay above image
display: block; display: block;
width: 100%; width: 100%;
box-sizing: border-box; box-sizing: border-box;
@ -38,7 +38,6 @@
display: block; display: block;
border: 1px dotted @ini_background_site; border: 1px dotted @ini_background_site;
position: relative; position: relative;
z-index: 1;
} }
&:hover, &:hover,