Adwaita: make links readable in the dark variant

And fix the messy style we have for *:link in the process.
https://bugzilla.gnome.org/show_bug.cgi?id=737386
This commit is contained in:
Lapo Calamandrei 2014-09-26 17:05:17 +02:00 committed by Matthias Clasen
parent 695862797c
commit 7e1673d0b7
4 changed files with 52 additions and 24 deletions

View File

@ -12,7 +12,10 @@ $selected_borders_color: if($variant=='light', darken($selected_bg_color, 30%),
darken($selected_bg_color, 20%));
$borders_color: if($variant =='light', darken($bg_color,30%), darken($bg_color,12%));
$borders_edge: if($variant =='light', white, transparentize($fg_color, 0.9));
$link_color: darken($selected_bg_color,10%);
$link_color: if($variant == 'light', darken($selected_bg_color,10%),
lighten($selected_bg_color,20%));
$link_visited_color: if($variant == 'light', darken($selected_bg_color,20%),
lighten($selected_bg_color,10%));
$top_hilight: $borders_edge;
$warning_color: #f57900;

View File

@ -29,7 +29,7 @@
-GtkMenu-vertical-padding: 0;
-GtkWidget-link-color: $link_color;
-GtkWidget-visited-link-color: $link_color;
-GtkWidget-visited-link-color: $link_visited_color;
-GtkWidget-focus-padding: 2; // FIXME: do we still need these?
-GtkWidget-focus-line-width: 1; //
@ -703,15 +703,25 @@ GtkColorButton.button {
*********/
*:link {
color: $selected_bg_color; //FIXME use a proper color
&:hover, &:active, &:visited {
color: mix($fg_color, $selected_bg_color, 40%); //FIXME same here
color: $link_color;
&:visited {
color: $link_visited_color;
*:selected & { color: mix($selected_fg_color, $selected_bg_color, 60%); }
}
&:hover {
color: lighten($link_color,10%);
*:selected & { color: mix($selected_fg_color, $selected_bg_color, 90%); }
}
&:active {
color: $link_color;
*:selected & { color: mix($selected_fg_color, $selected_bg_color, 80%); }
}
&:backdrop, &:backdrop:hover, &:backdrop:hover:selected {
color: $selected_bg_color;
}
&:selected, *:selected & { color: $selected_fg_color; }
&:selected, *:selected & {
color: mix($selected_fg_color, $selected_bg_color, 80%);
}
}
.button:link, .button:visited {
@ -1108,7 +1118,7 @@ GtkComboBox {
padding-left: 12px;
padding-right: 12px;
}
// the following is for spacing the icon and the label inside the home button
GtkLabel:last-child { padding-left: 2px; }
GtkLabel:first-child { padding-right: 2px; }
@ -1258,8 +1268,7 @@ GtkTreeView.view.progressbar { //Progressbar in treeview cells
padding: 4px 8px;
&:hover { //Seems like it :hover even with keyboard focus
box-shadow: inset 0 -3px $selected_bg_color;
color: if($variant == 'light', $selected_bg_color,
lighten($selected_bg_color,15%));
color: $link_color;
}
&:insensitive {
color: $insensitive_fg_color;

View File

@ -13,8 +13,8 @@
-GtkTreeView-horizontal-separator: 4;
-GtkMenu-horizontal-padding: 0;
-GtkMenu-vertical-padding: 0;
-GtkWidget-link-color: #184472;
-GtkWidget-visited-link-color: #184472;
-GtkWidget-link-color: #4a90d9;
-GtkWidget-visited-link-color: #2a76c6;
-GtkWidget-focus-padding: 2;
-GtkWidget-focus-line-width: 1;
-GtkDialog-button-spacing: 4;
@ -1189,19 +1189,27 @@ GtkCalendar.header GtkColorButton.button.titlebutton {
GtkCalendar.header .button.titlebutton:link, .button:visited, .header-bar .button.titlebutton:visited,
.titlebar .button.titlebutton:visited,
GtkCalendar.header .button.titlebutton:visited {
color: #215d9c; }
*:link:hover, .button:hover:link, .button:hover:visited, *:link:active, .button:active:link, .button:active:visited, *:link:visited, .button:visited, .header-bar .button.titlebutton:visited,
color: #4a90d9; }
*:link:visited, .button:visited, .header-bar .button.titlebutton:visited,
.titlebar .button.titlebutton:visited,
GtkCalendar.header .button.titlebutton:visited {
color: #7397bc; }
*:selected *:link:hover, *:selected .button:hover:link, *:selected .button:hover:visited, *:selected *:link:active, *:selected .button:active:link, *:selected .button:active:visited, *:selected *:link:visited, *:selected .button:visited {
color: #2a76c6; }
*:selected *:link:visited, *:selected .button:visited {
color: #a6bed7; }
*:link:hover, .button:hover:link, .button:hover:visited {
color: #74aae2; }
*:selected *:link:hover, *:selected .button:hover:link, *:selected .button:hover:visited {
color: #e8eef5; }
*:link:active, .button:active:link, .button:active:visited {
color: #4a90d9; }
*:selected *:link:active, *:selected .button:active:link, *:selected .button:active:visited {
color: #d2deeb; }
*:link:backdrop, .button:backdrop:link, .button:backdrop:visited, *:link:backdrop:hover, .button:backdrop:hover:link, .button:backdrop:hover:visited, *:link:backdrop:hover:selected, .button:backdrop:hover:selected:link, .button:backdrop:hover:selected:visited, .titlebar.selection-mode .subtitle:backdrop:hover:link, GtkCalendar.selection-mode.header .subtitle:backdrop:hover:link,
.header-bar.selection-mode .subtitle:backdrop:hover:link {
color: #215d9c; }
*:link:selected, .button:selected:link, .button:selected:visited, .titlebar.selection-mode .subtitle:link, GtkCalendar.selection-mode.header .subtitle:link,
.header-bar.selection-mode .subtitle:link, *:selected *:link, *:selected .button:link, *:selected .button:visited {
color: #ffffff; }
color: #d2deeb; }
.button:link, .header-bar .button.titlebutton:link,
.titlebar .button.titlebutton:link,
@ -1887,7 +1895,7 @@ GtkTreeView.view.progressbar {
padding: 4px 8px; }
.menubar > .menuitem:hover {
box-shadow: inset 0 -3px #215d9c;
color: #3583d5; }
color: #4a90d9; }
.menubar > .menuitem:insensitive {
color: #939695;
box-shadow: none; }

View File

@ -14,7 +14,7 @@
-GtkMenu-horizontal-padding: 0;
-GtkMenu-vertical-padding: 0;
-GtkWidget-link-color: #2a76c6;
-GtkWidget-visited-link-color: #2a76c6;
-GtkWidget-visited-link-color: #215d9c;
-GtkWidget-focus-padding: 2;
-GtkWidget-focus-line-width: 1;
-GtkDialog-button-spacing: 4;
@ -1181,19 +1181,27 @@ GtkCalendar.header GtkColorButton.button.titlebutton {
GtkCalendar.header .button.titlebutton:link, .button:visited, .header-bar .button.titlebutton:visited,
.titlebar .button.titlebutton:visited,
GtkCalendar.header .button.titlebutton:visited {
color: #4a90d9; }
*:link:hover, .button:hover:link, .button:hover:visited, *:link:active, .button:active:link, .button:active:visited, *:link:visited, .button:visited, .header-bar .button.titlebutton:visited,
color: #2a76c6; }
*:link:visited, .button:visited, .header-bar .button.titlebutton:visited,
.titlebar .button.titlebutton:visited,
GtkCalendar.header .button.titlebutton:visited {
color: #3e6b97; }
*:selected *:link:hover, *:selected .button:hover:link, *:selected .button:hover:visited, *:selected *:link:active, *:selected .button:active:link, *:selected .button:active:visited, *:selected *:link:visited, *:selected .button:visited {
color: #215d9c; }
*:selected *:link:visited, *:selected .button:visited {
color: #b6d2ef; }
*:link:hover, .button:hover:link, .button:hover:visited {
color: #4a90d9; }
*:selected *:link:hover, *:selected .button:hover:link, *:selected .button:hover:visited {
color: #ecf3fb; }
*:link:active, .button:active:link, .button:active:visited {
color: #2a76c6; }
*:selected *:link:active, *:selected .button:active:link, *:selected .button:active:visited {
color: #dae8f7; }
*:link:backdrop, .button:backdrop:link, .button:backdrop:visited, *:link:backdrop:hover, .button:backdrop:hover:link, .button:backdrop:hover:visited, *:link:backdrop:hover:selected, .button:backdrop:hover:selected:link, .button:backdrop:hover:selected:visited, .titlebar.selection-mode .subtitle:backdrop:hover:link, GtkCalendar.selection-mode.header .subtitle:backdrop:hover:link,
.header-bar.selection-mode .subtitle:backdrop:hover:link {
color: #4a90d9; }
*:link:selected, .button:selected:link, .button:selected:visited, .titlebar.selection-mode .subtitle:link, GtkCalendar.selection-mode.header .subtitle:link,
.header-bar.selection-mode .subtitle:link, *:selected *:link, *:selected .button:link, *:selected .button:visited {
color: #ffffff; }
color: #dae8f7; }
.button:link, .header-bar .button.titlebutton:link,
.titlebar .button.titlebutton:link,
@ -1881,7 +1889,7 @@ GtkTreeView.view.progressbar {
padding: 4px 8px; }
.menubar > .menuitem:hover {
box-shadow: inset 0 -3px #4a90d9;
color: #4a90d9; }
color: #2a76c6; }
.menubar > .menuitem:insensitive {
color: #8d9091;
box-shadow: none; }