mirror of
https://gerrit.wikimedia.org/r/mediawiki/skins/MinervaNeue
synced 2024-11-27 15:40:15 +00:00
Improve Minerva drop-shadows in dark-mode
Converts several drop-shadows to use standard Codex values: - `.search-box .search` uses `@box-shadow-drop-small` - `.drawer, .toast` uses `@box-shadow-drop-xx-large` - `.toggle-list__list--drop-down` uses `@border-color-base` Bug: T364425 Change-Id: Id00e525655d3a7138aa65f424fd6ab2ff82290c8
This commit is contained in:
parent
389518bb4f
commit
98eaa00cd5
|
@ -8,7 +8,8 @@
|
||||||
overflow-y: auto;
|
overflow-y: auto;
|
||||||
// The menu floats over content but below overlays.
|
// The menu floats over content but below overlays.
|
||||||
z-index: @z-index-drawer;
|
z-index: @z-index-drawer;
|
||||||
box-shadow: 0 5px 17px 0 rgba( 0, 0, 0, 0.24 ), 0 0 1px #a2a9b1;
|
// Two box-shadows: first creates a drop-shadow, second acts as a subtle border.
|
||||||
|
box-shadow: 0 5px 17px 0 rgba( 0, 0, 0, 0.24 ), 0 0 1px @border-color-base;
|
||||||
visibility: hidden;
|
visibility: hidden;
|
||||||
opacity: 0;
|
opacity: 0;
|
||||||
transform: translateY( -8px );
|
transform: translateY( -8px );
|
||||||
|
|
|
@ -112,7 +112,7 @@ main {
|
||||||
border: @border-width-base @border-style-base var( --border-color-inverted );
|
border: @border-width-base @border-style-base var( --border-color-inverted );
|
||||||
border-radius: @border-radius-base;
|
border-radius: @border-radius-base;
|
||||||
padding: @padding-vertical-search 0 @padding-vertical-search @padding-start-search-icon;
|
padding: @padding-vertical-search 0 @padding-vertical-search @padding-start-search-icon;
|
||||||
box-shadow: 0 1px 1px rgba( 0, 0, 0, 0.05 );
|
box-shadow: @box-shadow-drop-small;
|
||||||
// Keyboard focus is taken care of below at `.search:focus`.
|
// Keyboard focus is taken care of below at `.search:focus`.
|
||||||
outline: 0;
|
outline: 0;
|
||||||
transition-property: border-color, box-shadow;
|
transition-property: border-color, box-shadow;
|
||||||
|
|
|
@ -36,7 +36,7 @@
|
||||||
.toast,
|
.toast,
|
||||||
.drawer {
|
.drawer {
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
box-shadow: 0 -1px 8px 0 @box-shadow-color-base;
|
box-shadow: @box-shadow-drop-xx-large;
|
||||||
word-wrap: break-word;
|
word-wrap: break-word;
|
||||||
// don't use visibility: hidden in old browsers that don't support animations
|
// don't use visibility: hidden in old browsers that don't support animations
|
||||||
display: none;
|
display: none;
|
||||||
|
|
Loading…
Reference in a new issue