diff --git a/data/theme/_common.scss b/data/theme/_common.scss index b9e6f0833..528c0cbfb 100644 --- a/data/theme/_common.scss +++ b/data/theme/_common.scss @@ -89,6 +89,58 @@ StScrollBar { &:hover { color: lighten($link_color,10%); } } +/* Popvers/Menus */ + +.popup-menu { + min-width: 200px; + + .popup-menu-arrow { } //defined globally in the TOP BAR + .popup-sub-menu { + background-color: darken($bg_color,2%); + border-top: 1px solid lighten($borders_color,5%); + border-bottom: 1px solid lighten($borders_color,5%); + } + + .popup-menu-content { padding: 1em 0em; } + .popup-menu-item { + spacing: 12px; + + &:ltr { padding: .4em 1.75em .4em 0em; } + &:rtl { padding: .4em 0em .4em 1.75em; } + &:active { background-color: lighten($bg_color,10%); } + &:insensitive { background-color: transparentize($bg_color,.5); } + } + .popup-inactive-menu-item { //all icons and other graphical elements + color: $fg_color; + + &:insensitive { color: transparentize($fg_color,0.5); } + } + //.popup-status-menu-item { font-weight: normal; color: pink; } //dunno what that is +} + + .popup-menu-boxpointer, + .candidate-popup-boxpointer { + -arrow-border-radius: 3px; + -arrow-background-color: $bg_color; + -arrow-border-width: 1px; + -arrow-border-color: $borders_color; + -arrow-base: 24px; + -arrow-rise: 11px; + -arrow-box-shadow: 0 1px 3px red; //dreaming. bug #689995 + } + + +/* fallback menu +- odd thing for styling App menu when apparently not running under shell. Light Adwaita styled + app menu inside the main app window itself rather than the top bar +*/ + + + /* TOP BAR */ +// not really top bar only +.popup-menu-arrow { width: 16px; height: 16px; } +.popup-menu-icon { icon-size: 1.09em; } + /* NOTIFICATIONS & MESSAGE TRAY */ diff --git a/data/theme/_drawing.scss b/data/theme/_drawing.scss index acd989bbc..33b4fd4ad 100644 --- a/data/theme/_drawing.scss +++ b/data/theme/_drawing.scss @@ -254,58 +254,3 @@ } } -@mixin trough($flat:false, $c:$bg_color, $tc:$fg_color, $noedge:false) { - color: mix($tc,$bg_color,80%); - @if $flat { background-image: linear-gradient(to bottom,$c); } - @else { - background-image: linear-gradient(to bottom, - mix(black,$c,15%) 5%, - mix(black,$c,10%) 20%, - mix(black,$c,10%) 90%, - $c); - } - - border-color: if($c!=$bg_color, _border_color($c), $border_color); - - @if not($noedge) { - @if lightness($c) > 60% { - box-shadow: inset 0 -1px $borders_edge, - 0 1px $borders_edge; - } - @else { - box-shadow: inset 0 -1px transparentize($borders_edge,0.5), - 0 1px transparentize($borders_edge,0.5); - } - } - @else { box-shadow: none; } -} - -@mixin progressbar_fill($d:horizontal) { - $dir: if($d==vertical,right,bottom); - background-image: linear-gradient(to $dir, $selected_bg_color 2px, - lighten($selected_bg_color,6%)); -} - -@function headerbar_gradient($c, $tc:lighten($c,4%)) { -// -// headerbar gradient helper function -// -// $c: base color -// $tc: top color -// - @return linear-gradient(to bottom, $tc, $c); -} - -@mixin headerbar_fill($c:$bg_color, $tc:lighten($c,4%), $hc:$top_hilight) { -// -// headerbar fill -// -// $c: base color -// $tc: top color -// $hc: top highlight color -// - background-image: headerbar_gradient($c, $tc); - box-shadow: inset 0 -1px mix(_border_color($c), $c, 30%), // bottom shade - inset 0 1px $hc; // top highlight - -} diff --git a/data/theme/_gnome-shell-old.scss b/data/theme/_gnome-shell-old.scss index 6e19db89e..77eaaba9a 100644 --- a/data/theme/_gnome-shell-old.scss +++ b/data/theme/_gnome-shell-old.scss @@ -65,73 +65,7 @@ width: 1em; } -.popup-menu-boxpointer, -.candidate-popup-boxpointer { - -arrow-border-radius: 8px; - -arrow-background-color: rgba(0,0,0,0.9); - -arrow-border-width: 2px; - -arrow-border-color: #a5a5a5; - -arrow-base: 24px; - -arrow-rise: 11px; -} -.popup-menu-boxpointer.fallback-app-menu { - -arrow-border-radius: 4px; - -arrow-background-color: #ededed; - -arrow-border-width: 1px; - -arrow-border-color: #a6a6a6; - -arrow-base: 24px; - -arrow-rise: 11px; -} - -.popup-menu-boxpointer.fallback-app-menu.dark { - -arrow-background-color: #3f4747; - -arrow-border-color: #282b2b; -} - - -.popup-menu { - min-width: 200px; -} - -.popup-menu-arrow { - width: 16px; - height: 16px; -} - -.popup-submenu-menu-item:open { - background-color: #333333; -} - -.fallback-app-menu .popup-submenu-menu-item:open { - background-color: #888888; - color: white; -} - -.fallback-app-menu.dark .popup-submenu-menu-item:open { - background-color: #333333; -} - -.popup-sub-menu { - background-gradient-start: rgba(80,80,80,0.3); - background-gradient-end: rgba(80,80,80,0.4); - background-gradient-direction: vertical; - box-shadow: inset 0px 2px 4px rgba(0,0,0,0.9); -} - -.fallback-app-menu .popup-sub-menu { - background-gradient-start: #dddddd; - background-gradient-end: #dfdfdf; - background-gradient-direction: vertical; - box-shadow: inset 0px 2px 4px rgba(0,0,0,0.4); -} - -.fallback-app-menu.dark .popup-sub-menu { - background-gradient-start: #474747; - background-gradient-end: #4b4b4b; - background-gradient-direction: vertical; - box-shadow: inset 0px 2px 4px rgba(0,0,0,0.9); -} .popup-sub-menu:scrolled .popup-menu-item:ltr { padding-right: 0em; @@ -157,87 +91,8 @@ /* The remaining popup-menu sizing is all done in ems, so that if you * override .popup-menu.font-size, everything else will scale with it. */ -.popup-menu-content { - padding: 1em 0em; -} -.popup-menu-item { - spacing: 12px; -} -.popup-menu-item:ltr { - padding: .4em 1.75em .4em 0em; -} - -.popup-menu-item:rtl { - padding: .4em 0em .4em 1.75em; -} - -.popup-menu-item:active { - background-color: #4c4c4c; -} - -.popup-menu-item:insensitive { - color: #9f9f9f; -} - -.fallback-app-menu .popup-menu-item { - color: #43484a; -} - -.fallback-app-menu .popup-menu-item:active { - color: white; - background-color: #4689cd; -} - -.fallback-app-menu .popup-menu-item:insensitive { - color: gray; -} - -.fallback-app-menu.dark .popup-menu-item { - color: white; -} - -.fallback-app-menu.dark .popup-menu-item:active { - background-color: #445f7d; -} - -.fallback-app-menu.dark .popup-menu-item:insensitive { - color: #9f9f9f; -} - -.popup-separator-menu-item { - -gradient-height: 1px; - -gradient-start: rgba(255,255,255,0.0); - -gradient-end: rgba(255,255,255,0.3); - -margin-horizontal: 24px; - height: 1px; - padding: 8px 0px; -} - -.fallback-app-menu .popup-separator-menu-item { - -gradient-start: #a0a2a3; - -gradient-end: #a0a2a3; - -margin-horizontal: 0; -} - -.fallback-app-menu.dark .popup-separator-menu-item { - -gradient-start: #818584; - -gradient-end: #818584; -} - -.popup-status-menu-item { - font-weight: normal; - color: #999; -} - -.popup-inactive-menu-item, .popup-inactive-menu-item:insensitive { - color: white; -} - -.popup-menu-icon { - icon-size: 1.09em; -} /* Switches */ .toggle-switch { diff --git a/data/theme/gnome-shell.css b/data/theme/gnome-shell.css index 1695b14c6..d643ab9f4 100644 --- a/data/theme/gnome-shell.css +++ b/data/theme/gnome-shell.css @@ -52,62 +52,6 @@ text-align: right; width: 1em; } -.popup-menu-boxpointer, -.candidate-popup-boxpointer { - -arrow-border-radius: 8px; - -arrow-background-color: rgba(0, 0, 0, 0.9); - -arrow-border-width: 2px; - -arrow-border-color: #a5a5a5; - -arrow-base: 24px; - -arrow-rise: 11px; } - -.popup-menu-boxpointer.fallback-app-menu { - -arrow-border-radius: 4px; - -arrow-background-color: #ededed; - -arrow-border-width: 1px; - -arrow-border-color: #a6a6a6; - -arrow-base: 24px; - -arrow-rise: 11px; } - -.popup-menu-boxpointer.fallback-app-menu.dark { - -arrow-background-color: #3f4747; - -arrow-border-color: #282b2b; } - -.popup-menu { - min-width: 200px; } - -.popup-menu-arrow { - width: 16px; - height: 16px; } - -.popup-submenu-menu-item:open { - background-color: #333333; } - -.fallback-app-menu .popup-submenu-menu-item:open { - background-color: #888888; - color: white; } - -.fallback-app-menu.dark .popup-submenu-menu-item:open { - background-color: #333333; } - -.popup-sub-menu { - background-gradient-start: rgba(80, 80, 80, 0.3); - background-gradient-end: rgba(80, 80, 80, 0.4); - background-gradient-direction: vertical; - box-shadow: inset 0px 2px 4px rgba(0, 0, 0, 0.9); } - -.fallback-app-menu .popup-sub-menu { - background-gradient-start: #dddddd; - background-gradient-end: #dfdfdf; - background-gradient-direction: vertical; - box-shadow: inset 0px 2px 4px rgba(0, 0, 0, 0.4); } - -.fallback-app-menu.dark .popup-sub-menu { - background-gradient-start: #474747; - background-gradient-end: #4b4b4b; - background-gradient-direction: vertical; - box-shadow: inset 0px 2px 4px rgba(0, 0, 0, 0.9); } - .popup-sub-menu:scrolled .popup-menu-item:ltr { padding-right: 0em; } @@ -127,70 +71,6 @@ /* The remaining popup-menu sizing is all done in ems, so that if you * override .popup-menu.font-size, everything else will scale with it. */ -.popup-menu-content { - padding: 1em 0em; } - -.popup-menu-item { - spacing: 12px; } - -.popup-menu-item:ltr { - padding: .4em 1.75em .4em 0em; } - -.popup-menu-item:rtl { - padding: .4em 0em .4em 1.75em; } - -.popup-menu-item:active { - background-color: #4c4c4c; } - -.popup-menu-item:insensitive { - color: #9f9f9f; } - -.fallback-app-menu .popup-menu-item { - color: #43484a; } - -.fallback-app-menu .popup-menu-item:active { - color: white; - background-color: #4689cd; } - -.fallback-app-menu .popup-menu-item:insensitive { - color: gray; } - -.fallback-app-menu.dark .popup-menu-item { - color: white; } - -.fallback-app-menu.dark .popup-menu-item:active { - background-color: #445f7d; } - -.fallback-app-menu.dark .popup-menu-item:insensitive { - color: #9f9f9f; } - -.popup-separator-menu-item { - -gradient-height: 1px; - -gradient-start: rgba(255, 255, 255, 0); - -gradient-end: rgba(255, 255, 255, 0.3); - -margin-horizontal: 24px; - height: 1px; - padding: 8px 0px; } - -.fallback-app-menu .popup-separator-menu-item { - -gradient-start: #a0a2a3; - -gradient-end: #a0a2a3; - -margin-horizontal: 0; } - -.fallback-app-menu.dark .popup-separator-menu-item { - -gradient-start: #818584; - -gradient-end: #818584; } - -.popup-status-menu-item { - font-weight: normal; - color: #999; } - -.popup-inactive-menu-item, .popup-inactive-menu-item:insensitive { - color: white; } - -.popup-menu-icon { - icon-size: 1.09em; } - /* Switches */ .toggle-switch { width: 65px; @@ -2173,5 +2053,50 @@ StScrollBar { .shell-link:hover { color: #74aae2; } +/* Popvers/Menus */ +.popup-menu { + min-width: 200px; } + .popup-menu .popup-sub-menu { + background-color: #343a3a; + border-top: 1px solid #282c2c; + border-bottom: 1px solid #282c2c; } + .popup-menu .popup-menu-content { + padding: 1em 0em; } + .popup-menu .popup-menu-item { + spacing: 12px; } + .popup-menu .popup-menu-item:ltr { + padding: .4em 1.75em .4em 0em; } + .popup-menu .popup-menu-item:rtl { + padding: .4em 0em .4em 1.75em; } + .popup-menu .popup-menu-item:active { + background-color: #515a5a; } + .popup-menu .popup-menu-item:insensitive { + background-color: rgba(57, 63, 63, 0.5); } + .popup-menu .popup-inactive-menu-item { + color: #eeeeec; } + .popup-menu .popup-inactive-menu-item:insensitive { + color: rgba(238, 238, 236, 0.5); } + +.popup-menu-boxpointer, +.candidate-popup-boxpointer { + -arrow-border-radius: 3px; + -arrow-background-color: #393f3f; + -arrow-border-width: 1px; + -arrow-border-color: #1c1f1f; + -arrow-base: 24px; + -arrow-rise: 11px; + -arrow-box-shadow: 0 1px 3px red; } + +/* fallback menu +- odd thing for styling App menu when apparently not running under shell. Light Adwaita styled + app menu inside the main app window itself rather than the top bar +*/ /* TOP BAR */ +.popup-menu-arrow { + width: 16px; + height: 16px; } + +.popup-menu-icon { + icon-size: 1.09em; } + /* NOTIFICATIONS & MESSAGE TRAY */