theme: Use box shadow for active panel menu border

This commit is contained in:
Carlos Soriano 2014-11-10 15:10:40 +01:00
parent 1842466069
commit aceb9fe825
2 changed files with 9 additions and 11 deletions

View File

@ -243,7 +243,6 @@ StScrollBar {
&.login-screen, &.login-screen,
&.lock-screen { &.lock-screen {
background-color: transparent; background-color: transparent;
} }
#panelLeft, #panelCenter { // spacing between activities<>app menu and such #panelLeft, #panelCenter { // spacing between activities<>app menu and such
@ -269,7 +268,7 @@ StScrollBar {
font-weight: bold; font-weight: bold;
color: #ccc; color: #ccc;
transition-duration: 100ms; transition-duration: 100ms;
padding: 2px;
#appMenuIcon { #appMenuIcon {
app-icon-bottom-clip: 1px; app-icon-bottom-clip: 1px;
@ -287,9 +286,10 @@ StScrollBar {
} }
&:active, &:overview, &:focus, &:checked { &:active, &:overview, &:focus, &:checked {
border-color: lighten($selected_bg_color,5%); // Trick due to St limitations. It needs a background to draw
border-bottom-width: 2px; // a box-shadow
padding: 2px 2px 0 2px; background-color: rgba(0, 0, 0, 0.01);
box-shadow: inset 0 -2px 0px lighten($selected_bg_color,5%);
color: lighten($fg_color,10%); color: lighten($fg_color,10%);
text-shadow: black 0px 2px 2px; text-shadow: black 0px 2px 2px;

View File

@ -1204,8 +1204,7 @@ StScrollBar {
padding: 0px 12px; padding: 0px 12px;
font-weight: bold; font-weight: bold;
color: #ccc; color: #ccc;
transition-duration: 100ms; transition-duration: 100ms; }
padding: 2px; }
#panel .panel-button #appMenuIcon { #panel .panel-button #appMenuIcon {
app-icon-bottom-clip: 1px; } app-icon-bottom-clip: 1px; }
.panel-button:active #panel .panel-button #appMenuIcon, .panel-button:overview #panel .panel-button #appMenuIcon, .panel-button:focus #panel .panel-button #appMenuIcon, .panel-button:checked #panel .panel-button #appMenuIcon { .panel-button:active #panel .panel-button #appMenuIcon, .panel-button:overview #panel .panel-button #appMenuIcon, .panel-button:focus #panel .panel-button #appMenuIcon, .panel-button:checked #panel .panel-button #appMenuIcon {
@ -1214,9 +1213,8 @@ StScrollBar {
color: white; color: white;
text-shadow: black 0 2px 2px; } text-shadow: black 0 2px 2px; }
#panel .panel-button:active, #panel .panel-button:overview, #panel .panel-button:focus, #panel .panel-button:checked { #panel .panel-button:active, #panel .panel-button:overview, #panel .panel-button:focus, #panel .panel-button:checked {
border-color: #256ab1; background-color: rgba(0, 0, 0, 0.01);
border-bottom-width: 2px; box-shadow: inset 0 -2px 0px #256ab1;
padding: 2px 2px 0 2px;
color: white; color: white;
text-shadow: black 0px 2px 2px; } text-shadow: black 0px 2px 2px; }
#panel .panel-button:active > .system-status-icon, #panel .panel-button:overview > .system-status-icon, #panel .panel-button:focus > .system-status-icon, #panel .panel-button:checked > .system-status-icon { #panel .panel-button:active > .system-status-icon, #panel .panel-button:overview > .system-status-icon, #panel .panel-button:focus > .system-status-icon, #panel .panel-button:checked > .system-status-icon {