From a00580322d84b3c768fbbd501aaabb2395c089ad Mon Sep 17 00:00:00 2001 From: Felix Niklas Date: Thu, 27 Apr 2017 11:53:44 +0200 Subject: [PATCH] z-index - condense z-index range: several smaller z-indexes were unused like zIndex-3,4,5,6 - push notifications to the top on z-index: 10 to prevent it from staying behind modal windows, see #655 --- app/assets/stylesheets/zammad.scss | 25 ++++++++++++------------- 1 file changed, 12 insertions(+), 13 deletions(-) diff --git a/app/assets/stylesheets/zammad.scss b/app/assets/stylesheets/zammad.scss index 247df3c7c..9da7f127a 100644 --- a/app/assets/stylesheets/zammad.scss +++ b/app/assets/stylesheets/zammad.scss @@ -1912,7 +1912,7 @@ input.has-error { } .selected-clue { - @extend .zIndex-9; + @extend .zIndex-6; pointer-events: none; } @@ -1920,7 +1920,7 @@ input.has-error { display: flex; align-items: center; justify-content: center; - @extend .zIndex-8; + @extend .zIndex-5; .modal-backdrop { bottom: 0; @@ -3157,7 +3157,7 @@ footer { Safari font rendering bugfix while animating http://stackoverflow.com/questions/9733011/safari-changing-font-weights-when-unrelated-animations-are-running */ - z-index: 899; // stay beneath #global-search-results + @extend .zIndex-5; // stay beneath .global-search-menu position: relative; } @@ -3331,7 +3331,7 @@ footer { .search .logo { position: relative; - @extend .u-clickable, .zIndex-5; + @extend .u-clickable, .zIndex-3; margin: -4px 10px 0 12px; transition: 240ms; } @@ -3362,13 +3362,13 @@ footer { } .global-search-menu { + @extend .zIndex-6; background: #26272e; position: absolute; left: 0; right: 0; bottom: 0; top: 53px; - z-index: 900; display: none; overflow: auto; @@ -3852,7 +3852,7 @@ footer { border: none; color: hsl(206,7%,28%); box-shadow: 0 1px 14px rgba(0,8,14,.25); - z-index: 900; + @extend .zIndex-6; } .popover-body { @@ -3955,7 +3955,7 @@ footer { min-width: 350px; position: absolute; flex-direction: column; - @extend .zIndex-5; + @extend .zIndex-2; &.is-visible { display: flex; @@ -4858,7 +4858,7 @@ footer { .editControls-item { position: absolute; top: 43px; - @extend .u-clickable, .zIndex-7; + @extend .u-clickable, .zIndex-4; &.is-hidden { display: none; @@ -5725,7 +5725,7 @@ footer { /* allow/show autocomplete in modal dialog */ .ui-autocomplete.ui-widget-content { - z-index: 1100; + @extend .zIndex-9; } .drox { @@ -5856,7 +5856,7 @@ footer { .modal { position: fixed; - z-index: 1000; + @extend .zIndex-9; } .modal-dialog { @@ -6363,7 +6363,7 @@ footer { } .scrollPageHeader { - @extend .zIndex-8; + @extend .zIndex-5; display: flex; align-items: center; background: white; @@ -8469,8 +8469,7 @@ output { } .batch-overlay { - @extend .fit; - z-index: 100; + @extend .fit, .zIndex-1; color: white; text-transform: uppercase; text-align: center;