HighContrast: insensitive backdrop list rows have a border
https://bugzilla.gnome.org/show_bug.cgi?id=747288
This commit is contained in:
@ -2,6 +2,8 @@
|
||||
@return unquote("alpha(#{$c},#{$a})");
|
||||
}
|
||||
|
||||
$ease-out-quad: cubic-bezier(0.25, 0.46, 0.45, 0.94);
|
||||
|
||||
* {
|
||||
padding: 0;
|
||||
-GtkToolButton-icon-spacing: 4;
|
||||
@ -570,7 +572,6 @@ $_dot_color: $selected_bg_color;
|
||||
border-color: transparent;
|
||||
background-color: transparent;
|
||||
background-image: none;
|
||||
box-shadow: inset 0 1px transparentize(white,1);
|
||||
text-shadow: none;
|
||||
icon-shadow: none;
|
||||
}
|
||||
@ -1466,7 +1467,7 @@ GtkSwitch {
|
||||
inset 0 -2px transparentize($bg_color,0.4),
|
||||
inset 0 -1px mix($bg_color,$borders_color,50%);
|
||||
}
|
||||
&:active { border: 1px solid $selected_borders_color; }
|
||||
&:active { border-color: $selected_borders_color; }
|
||||
&:insensitive { @include button(insensitive, $edge: none); }
|
||||
&:backdrop { @include button(backdrop);
|
||||
&:active{ border-color: $selected_bg_color; }
|
||||
@ -1804,6 +1805,24 @@ GtkScrolledWindow {
|
||||
padding: 2px;
|
||||
}
|
||||
|
||||
.list-row.button,
|
||||
.list-row.button:backdrop,
|
||||
.list-row.button:backdrop:active,
|
||||
.list-row.button:backdrop:checked,
|
||||
.list-row.button:backdrop:insensitive,
|
||||
.list-row.button:backdrop:insensitive:active,
|
||||
.list-row.button:backdrop:insensitive:checked,
|
||||
.list-row.button:insensitive:active,
|
||||
.list-row.button:insensitive:checked {
|
||||
// reset button inherited stuff
|
||||
@extend %undecorated_button;
|
||||
background-color: transparentize($base_color,1); // for the transition
|
||||
border-style: none; // I need no borders here
|
||||
border-radius: 0; // and no rounded corners
|
||||
box-shadow: none; // and no box-shadow
|
||||
|
||||
}
|
||||
|
||||
.list-row.button {
|
||||
@extend %undecorated_button;
|
||||
background-color: transparentize($base_color,1); // for the transition
|
||||
@ -1811,28 +1830,72 @@ GtkScrolledWindow {
|
||||
border-radius: 0; // and no rounded corners
|
||||
box-shadow: none; // and no box-shadow
|
||||
&:hover {
|
||||
background-color: mix(black, $base_color, 5%);
|
||||
background-color: mix($fg_color, $base_color, 5%);
|
||||
}
|
||||
&:active {
|
||||
box-shadow: inset 0 2px 2px -2px transparentize(black,0.8);
|
||||
box-shadow: inset 0 2px 2px -2px transparentize(black, 0.8);
|
||||
}
|
||||
&:selected {
|
||||
&:active { box-shadow: inset 0 2px 3px -1px transparentize(black,0.5); }
|
||||
&:active { box-shadow: inset 0 2px 3px -1px transparentize(black, 0.5); }
|
||||
&:hover {
|
||||
background-color: mix(black, $selected_bg_color, 10%);
|
||||
background-color: mix($fg_color, $selected_bg_color, 10%);
|
||||
}
|
||||
}
|
||||
&:backdrop:hover {
|
||||
@extend %undecorated_button;
|
||||
&:backdrop { background-color: $selected_bg_color; }
|
||||
}
|
||||
}
|
||||
|
||||
.list-row:selected {
|
||||
background-color: $selected_bg_color;
|
||||
color: $selected_fg_color;
|
||||
&:backdrop { color: $backdrop_base_color;}
|
||||
@extend %selected_items;
|
||||
.button {
|
||||
@include button(normal, $edge:none);
|
||||
border-color: $selected_borders_color;
|
||||
&.flat {
|
||||
@include button(undecorated, $edge:none);
|
||||
color: $selected_fg_color;
|
||||
}
|
||||
&:hover {
|
||||
@include button(hover, $edge:none);
|
||||
border-color: $selected_borders_color;
|
||||
}
|
||||
&:active, &:checked {
|
||||
@include button(active, $edge:none);
|
||||
border-color: $selected_borders_color;
|
||||
}
|
||||
&:backdrop, &.flat:backdrop {
|
||||
@include button(backdrop, $edge:none);
|
||||
border-color: $selected_borders_color;
|
||||
&:active, &:checked {
|
||||
@include button(backdrop-active, $edge:none);
|
||||
border-color: $selected_borders_color;
|
||||
}
|
||||
&:insensitive {
|
||||
@include button(backdrop-insensitive, $edge:none);
|
||||
border-color: $selected_borders_color;
|
||||
&:active, &:checked {
|
||||
@include button(backdrop-insensitive-active, $edge:none);
|
||||
border-color: $selected_borders_color;
|
||||
}
|
||||
}
|
||||
}
|
||||
&.flat:backdrop {
|
||||
@include button(undecorated);
|
||||
color: $backdrop_base_color;
|
||||
}
|
||||
&:insensitive {
|
||||
@include button(insensitive, $edge:none);
|
||||
border-color: $selected_borders_color;
|
||||
&:active, &:checked { @include button(insensitive-active, $edge:none); }
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// transition
|
||||
.list-row, list-row.button {
|
||||
transition: all 300ms $ease-out-quad;
|
||||
&:hover { transition: none; }
|
||||
}
|
||||
|
||||
|
||||
/*********************
|
||||
* App Notifications *
|
||||
*********************/
|
||||
|
||||
@ -766,11 +766,18 @@
|
||||
border-radius: 3px;
|
||||
border-style: solid; }
|
||||
|
||||
.button.flat, .button.flat:backdrop, .button.flat:insensitive:backdrop, .menuitem.button.flat, .menuitem.button.flat:backdrop, .button:link, .button:visited, .button:link:hover, .button:link:active, .button:visited:hover, .button:visited:active, .button:link:backdrop, .button:visited:backdrop, .notebook tab .button, .list-row.button, .list-row.button:backdrop:hover, GtkCalendar.button, GtkCalendar.button:hover, GtkCalendar.button:backdrop, GtkCalendar.button:backdrop:hover {
|
||||
.button.flat, .button.flat:backdrop, .button.flat:insensitive:backdrop, .menuitem.button.flat, .menuitem.button.flat:backdrop, .button:link, .button:visited, .button:link:hover, .button:link:active, .button:visited:hover, .button:visited:active, .button:link:backdrop, .button:visited:backdrop, .notebook tab .button, .list-row.button,
|
||||
.list-row.button:backdrop,
|
||||
.list-row.button:backdrop:active,
|
||||
.list-row.button:backdrop:checked,
|
||||
.list-row.button:backdrop:insensitive,
|
||||
.list-row.button:backdrop:insensitive:active,
|
||||
.list-row.button:backdrop:insensitive:checked,
|
||||
.list-row.button:insensitive:active,
|
||||
.list-row.button:insensitive:checked, GtkCalendar.button, GtkCalendar.button:hover, GtkCalendar.button:backdrop, GtkCalendar.button:backdrop:hover {
|
||||
border-color: transparent;
|
||||
background-color: transparent;
|
||||
background-image: none;
|
||||
box-shadow: inset 0 1px rgba(255, 255, 255, 0);
|
||||
text-shadow: none;
|
||||
icon-shadow: none; }
|
||||
|
||||
@ -1665,7 +1672,7 @@ GtkSwitch {
|
||||
background-image: none;
|
||||
box-shadow: inset 0 1px white, inset 0 -2px rgba(255, 255, 255, 0.6), inset 0 -1px #bfbfbf; }
|
||||
GtkSwitch.slider:active {
|
||||
border: 1px solid #000; }
|
||||
border-color: #000; }
|
||||
GtkSwitch.slider:insensitive {
|
||||
border-width: 2px;
|
||||
border-style: solid;
|
||||
@ -1975,11 +1982,11 @@ GtkLevelBar.vertical {
|
||||
.level-bar.fill-block.empty-fill-block:backdrop {
|
||||
border-color: rgba(0, 0, 0, 0.15); }
|
||||
|
||||
.view:selected, GtkCalendar:selected, .view:selected:focus, GtkCalendar:focus:selected, .view:selected:hover, GtkCalendar:hover:selected, .label:selected, .label:selected:focus, .label:selected:hover, .label:backdrop:selected, .entry:selected, .entry:selected:focus, .menuitem.button.flat:hover, .menuitem.button.flat:selected, .sidebar:selected, GtkPlacesSidebar.sidebar .view:selected, GtkPlacesSidebar.sidebar GtkCalendar:selected {
|
||||
.view:selected, GtkCalendar:selected, .view:selected:focus, GtkCalendar:focus:selected, .view:selected:hover, GtkCalendar:hover:selected, .label:selected, .label:selected:focus, .label:selected:hover, .label:backdrop:selected, .entry:selected, .entry:selected:focus, .menuitem.button.flat:hover, .menuitem.button.flat:selected, .list-row:selected, .sidebar:selected, GtkPlacesSidebar.sidebar .view:selected, GtkPlacesSidebar.sidebar GtkCalendar:selected {
|
||||
background-color: #000;
|
||||
color: #fff;
|
||||
outline-color: rgba(255, 255, 255, 0.3); }
|
||||
.view:backdrop:selected, GtkCalendar:backdrop:selected, GtkCalendar:backdrop:focus:selected, GtkCalendar:backdrop:hover:selected, .label:backdrop:selected, .entry:backdrop:selected, .menuitem.button.flat:backdrop:hover, .menuitem.button.flat:backdrop:selected, .sidebar:backdrop:selected, GtkPlacesSidebar.sidebar .view:backdrop:selected, GtkPlacesSidebar.sidebar GtkCalendar:backdrop:selected {
|
||||
.view:backdrop:selected, GtkCalendar:backdrop:selected, GtkCalendar:backdrop:focus:selected, GtkCalendar:backdrop:hover:selected, .label:backdrop:selected, .entry:backdrop:selected, .menuitem.button.flat:backdrop:hover, .menuitem.button.flat:backdrop:selected, .list-row:backdrop:selected, .sidebar:backdrop:selected, GtkPlacesSidebar.sidebar .view:backdrop:selected, GtkPlacesSidebar.sidebar GtkCalendar:backdrop:selected {
|
||||
background-color: #7f7f7f;
|
||||
color: #fff; }
|
||||
|
||||
@ -2022,6 +2029,20 @@ GtkPlacesSidebar.sidebar .view .separator:backdrop {
|
||||
.grid-child {
|
||||
padding: 2px; }
|
||||
|
||||
.list-row.button,
|
||||
.list-row.button:backdrop,
|
||||
.list-row.button:backdrop:active,
|
||||
.list-row.button:backdrop:checked,
|
||||
.list-row.button:backdrop:insensitive,
|
||||
.list-row.button:backdrop:insensitive:active,
|
||||
.list-row.button:backdrop:insensitive:checked,
|
||||
.list-row.button:insensitive:active,
|
||||
.list-row.button:insensitive:checked {
|
||||
background-color: rgba(255, 255, 255, 0);
|
||||
border-style: none;
|
||||
border-radius: 0;
|
||||
box-shadow: none; }
|
||||
|
||||
.list-row.button {
|
||||
background-color: rgba(255, 255, 255, 0);
|
||||
border-style: none;
|
||||
@ -2035,12 +2056,97 @@ GtkPlacesSidebar.sidebar .view .separator:backdrop {
|
||||
box-shadow: inset 0 2px 3px -1px rgba(0, 0, 0, 0.5); }
|
||||
.list-row.button:selected:hover {
|
||||
background-color: black; }
|
||||
.list-row.button:selected:backdrop {
|
||||
background-color: #000; }
|
||||
|
||||
.list-row:selected {
|
||||
background-color: #000;
|
||||
color: #fff; }
|
||||
.list-row:selected:backdrop {
|
||||
.list-row:selected .button {
|
||||
border-width: 2px;
|
||||
border-style: solid;
|
||||
color: #000;
|
||||
background-image: none;
|
||||
background-color: #fff;
|
||||
border-color: #7f7f7f;
|
||||
border-color: #000; }
|
||||
.list-row:selected .button.flat {
|
||||
border-width: 2px;
|
||||
border-style: solid;
|
||||
color: #fff; }
|
||||
.list-row:selected .button:hover {
|
||||
border-width: 2px;
|
||||
border-style: solid;
|
||||
color: #000;
|
||||
background-color: #fff;
|
||||
border-color: #7f7f7f;
|
||||
background-image: none;
|
||||
border-color: #000; }
|
||||
.list-row:selected .button:active, .list-row:selected .button:checked {
|
||||
border-width: 2px;
|
||||
border-style: solid;
|
||||
background-image: none;
|
||||
color: white;
|
||||
background-color: black;
|
||||
border-color: #7f7f7f;
|
||||
border-color: #000; }
|
||||
.list-row:selected .button:backdrop, .list-row:selected .button.flat:backdrop {
|
||||
border-width: 2px;
|
||||
border-style: solid;
|
||||
color: #000;
|
||||
background-color: #fff;
|
||||
border-color: #8b8b8b;
|
||||
background-image: none;
|
||||
text-shadow: none;
|
||||
icon-shadow: none;
|
||||
border-color: #000; }
|
||||
.list-row:selected .button:backdrop:active, .list-row:selected .button:backdrop:checked, .list-row:selected .button.flat:backdrop:active, .list-row:selected .button.flat:backdrop:checked {
|
||||
border-width: 2px;
|
||||
border-style: solid;
|
||||
color: white;
|
||||
background-color: #8b8b8b;
|
||||
border-color: #8b8b8b;
|
||||
background-image: none;
|
||||
border-color: #000; }
|
||||
.list-row:selected .button:backdrop:insensitive, .list-row:selected .button.flat:backdrop:insensitive {
|
||||
border-width: 2px;
|
||||
border-style: solid;
|
||||
color: #7f7f7f;
|
||||
background-color: white;
|
||||
border-color: #8b8b8b;
|
||||
background-image: none;
|
||||
border-color: #000; }
|
||||
.list-row:selected .button:backdrop:insensitive:active, .list-row:selected .button:backdrop:insensitive:checked, .list-row:selected .button.flat:backdrop:insensitive:active, .list-row:selected .button.flat:backdrop:insensitive:checked {
|
||||
border-width: 2px;
|
||||
border-style: solid;
|
||||
color: #7f7f7f;
|
||||
border-color: #8b8b8b;
|
||||
background-image: none;
|
||||
background-color: whitesmoke;
|
||||
border-color: #000; }
|
||||
.list-row:selected .button.flat:backdrop {
|
||||
border-width: 2px;
|
||||
border-style: solid;
|
||||
color: #fff; }
|
||||
.list-row:selected .button:insensitive {
|
||||
border-width: 2px;
|
||||
border-style: solid;
|
||||
color: #7f7f7f;
|
||||
background-color: white;
|
||||
border-color: #7f7f7f;
|
||||
background-image: none;
|
||||
text-shadow: none;
|
||||
icon-shadow: none;
|
||||
border-color: #000; }
|
||||
.list-row:selected .button:insensitive:active, .list-row:selected .button:insensitive:checked {
|
||||
border-width: 2px;
|
||||
border-style: solid;
|
||||
color: #7f7f7f;
|
||||
border-color: #7f7f7f;
|
||||
background-image: none;
|
||||
background-color: white; }
|
||||
|
||||
.list-row, list-row.button {
|
||||
transition: all 300ms cubic-bezier(0.25, 0.46, 0.45, 0.94); }
|
||||
.list-row:hover, list-row.button:hover {
|
||||
transition: none; }
|
||||
|
||||
/*********************
|
||||
* App Notifications *
|
||||
|
||||
Reference in New Issue
Block a user