From b37e4ff8059e31fd482560327a20580cb5969303 Mon Sep 17 00:00:00 2001 From: Lapo Calamandrei Date: Fri, 11 Mar 2016 14:56:21 +0100 Subject: [PATCH] Adwaita: simplify vertically linked entries scss code --- gtk/theme/Adwaita/_common.scss | 22 +++------------------- gtk/theme/Adwaita/gtk-contained-dark.css | 16 ++-------------- gtk/theme/Adwaita/gtk-contained.css | 16 ++-------------- 3 files changed, 7 insertions(+), 47 deletions(-) diff --git a/gtk/theme/Adwaita/_common.scss b/gtk/theme/Adwaita/_common.scss index feb229d981..9114049858 100644 --- a/gtk/theme/Adwaita/_common.scss +++ b/gtk/theme/Adwaita/_common.scss @@ -332,14 +332,6 @@ entry { .linked.vertical { > entry { @extend %linked_vertical; } - // remove the edge hilight and the focus shadow (unfortunatelly) - > entry:not(:last-child) { box-shadow: none; } - - // add back the focus shadow - > entry:focus:not(:last-child) { box-shadow: entry_focus_shadow(); } - - > entry:drop(active):not(:last-child) { box-shadow: inset 0 0 0 1px $drop_target_color; } - // brighter border between linked entries > entry:not(:disabled) + entry:not(:disabled) { border-top-color: mix($borders_color, $base_color, 30%); @@ -355,22 +347,14 @@ entry { > entry:disabled + entry:disabled { border-top-color: mix($borders_color, $base_color, 30%); } // color back the top border of a linked focused entry following another entry and add back the focus shadow. - > entry + entry:focus:not(:last-child) { + // :not(:only-child) is a specificity bump hack. + > entry + entry:focus:not(:only-child) { border-top-color: entry_focus_border(); - box-shadow: entry_focus_shadow(); } - - > entry + entry:drop(active):not(:last-child) { + > entry + entry:drop(active):not(:only-child) { border-top-color: $drop_target_color; - box-shadow: inset 0 0 0 1px $drop_target_color; } - // just recolor the top border on the last focused entry, since we don't reset the shadow here letting that be - // inherited by the entry styling. - > entry + entry:focus:last-child { border-top-color: entry_focus_border(); } - - > entry + entry:drop(active):last-child { border-top-color: $drop_target_color; } - // this takes care of coloring the top border of the focused entry subsequent widget. // :not(:only-child) is a specificity bump hack. > entry:focus:not(:only-child) + entry, diff --git a/gtk/theme/Adwaita/gtk-contained-dark.css b/gtk/theme/Adwaita/gtk-contained-dark.css index 7bee821c8e..ad17291b86 100644 --- a/gtk/theme/Adwaita/gtk-contained-dark.css +++ b/gtk/theme/Adwaita/gtk-contained-dark.css @@ -309,12 +309,6 @@ entry, spinbutton:not(.vertical) { border-color: black; box-shadow: inset 0 0 0 1px black; } -.linked.vertical > entry:not(:last-child), .linked.vertical > spinbutton:not(:last-child):not(.vertical) { - box-shadow: none; } -.linked.vertical > entry:focus:not(:last-child), .linked.vertical > spinbutton:focus:not(:last-child):not(.vertical) { - box-shadow: inset 0 0 0 1px #215d9c; } -.linked.vertical > entry:drop(active):not(:last-child), .linked.vertical > spinbutton:drop(active):not(:last-child):not(.vertical) { - box-shadow: inset 0 0 0 1px black; } .linked.vertical > entry:not(:disabled) + entry:not(:disabled), .linked.vertical > spinbutton:not(:disabled):not(.vertical) + entry:not(:disabled), .linked.vertical > entry:not(:disabled) + spinbutton:not(:disabled):not(.vertical), .linked.vertical > spinbutton:not(:disabled):not(.vertical) + spinbutton:not(:disabled):not(.vertical) { border-top-color: #252626; background-image: linear-gradient(to bottom, #292929); } @@ -323,15 +317,9 @@ entry, spinbutton:not(.vertical) { background-image: linear-gradient(to bottom, #2c2c2c); } .linked.vertical > entry:disabled + entry:disabled, .linked.vertical > spinbutton:disabled:not(.vertical) + entry:disabled, .linked.vertical > entry:disabled + spinbutton:disabled:not(.vertical), .linked.vertical > spinbutton:disabled:not(.vertical) + spinbutton:disabled:not(.vertical) { border-top-color: #252626; } -.linked.vertical > entry + entry:focus:not(:last-child), .linked.vertical > spinbutton:not(.vertical) + entry:focus:not(:last-child), .linked.vertical > entry + spinbutton:focus:not(:last-child):not(.vertical), .linked.vertical > spinbutton:not(.vertical) + spinbutton:focus:not(:last-child):not(.vertical) { - border-top-color: #0f2b48; - box-shadow: inset 0 0 0 1px #215d9c; } -.linked.vertical > entry + entry:drop(active):not(:last-child), .linked.vertical > spinbutton:not(.vertical) + entry:drop(active):not(:last-child), .linked.vertical > entry + spinbutton:drop(active):not(:last-child):not(.vertical), .linked.vertical > spinbutton:not(.vertical) + spinbutton:drop(active):not(:last-child):not(.vertical) { - border-top-color: black; - box-shadow: inset 0 0 0 1px black; } -.linked.vertical > entry + entry:focus:last-child, .linked.vertical > spinbutton:not(.vertical) + entry:focus:last-child, .linked.vertical > entry + spinbutton:focus:last-child:not(.vertical), .linked.vertical > spinbutton:not(.vertical) + spinbutton:focus:last-child:not(.vertical) { +.linked.vertical > entry + entry:focus:not(:only-child), .linked.vertical > spinbutton:not(.vertical) + entry:focus:not(:only-child), .linked.vertical > entry + spinbutton:focus:not(:only-child):not(.vertical), .linked.vertical > spinbutton:not(.vertical) + spinbutton:focus:not(:only-child):not(.vertical) { border-top-color: #0f2b48; } -.linked.vertical > entry + entry:drop(active):last-child, .linked.vertical > spinbutton:not(.vertical) + entry:drop(active):last-child, .linked.vertical > entry + spinbutton:drop(active):last-child:not(.vertical), .linked.vertical > spinbutton:not(.vertical) + spinbutton:drop(active):last-child:not(.vertical) { +.linked.vertical > entry + entry:drop(active):not(:only-child), .linked.vertical > spinbutton:not(.vertical) + entry:drop(active):not(:only-child), .linked.vertical > entry + spinbutton:drop(active):not(:only-child):not(.vertical), .linked.vertical > spinbutton:not(.vertical) + spinbutton:drop(active):not(:only-child):not(.vertical) { border-top-color: black; } .linked.vertical > entry:focus:not(:only-child) + entry, .linked.vertical > spinbutton:focus:not(:only-child):not(.vertical) + entry, .linked.vertical > entry:focus:not(:only-child) + spinbutton:not(.vertical), .linked.vertical > spinbutton:focus:not(:only-child):not(.vertical) + spinbutton:not(.vertical), .linked.vertical > entry:focus:not(:only-child) + button, diff --git a/gtk/theme/Adwaita/gtk-contained.css b/gtk/theme/Adwaita/gtk-contained.css index c37b744bf8..9a0c8009c2 100644 --- a/gtk/theme/Adwaita/gtk-contained.css +++ b/gtk/theme/Adwaita/gtk-contained.css @@ -309,12 +309,6 @@ entry, spinbutton:not(.vertical) { border-color: black; box-shadow: inset 0 0 0 1px black; } -.linked.vertical > entry:not(:last-child), .linked.vertical > spinbutton:not(:last-child):not(.vertical) { - box-shadow: none; } -.linked.vertical > entry:focus:not(:last-child), .linked.vertical > spinbutton:focus:not(:last-child):not(.vertical) { - box-shadow: inset 0 0 0 1px #4a90d9; } -.linked.vertical > entry:drop(active):not(:last-child), .linked.vertical > spinbutton:drop(active):not(:last-child):not(.vertical) { - box-shadow: inset 0 0 0 1px black; } .linked.vertical > entry:not(:disabled) + entry:not(:disabled), .linked.vertical > spinbutton:not(:disabled):not(.vertical) + entry:not(:disabled), .linked.vertical > entry:not(:disabled) + spinbutton:not(:disabled):not(.vertical), .linked.vertical > spinbutton:not(:disabled):not(.vertical) + spinbutton:not(:disabled):not(.vertical) { border-top-color: #e2e2e0; background-image: linear-gradient(to bottom, #ffffff); } @@ -323,15 +317,9 @@ entry, spinbutton:not(.vertical) { background-image: linear-gradient(to bottom, white); } .linked.vertical > entry:disabled + entry:disabled, .linked.vertical > spinbutton:disabled:not(.vertical) + entry:disabled, .linked.vertical > entry:disabled + spinbutton:disabled:not(.vertical), .linked.vertical > spinbutton:disabled:not(.vertical) + spinbutton:disabled:not(.vertical) { border-top-color: #e2e2e0; } -.linked.vertical > entry + entry:focus:not(:last-child), .linked.vertical > spinbutton:not(.vertical) + entry:focus:not(:last-child), .linked.vertical > entry + spinbutton:focus:not(:last-child):not(.vertical), .linked.vertical > spinbutton:not(.vertical) + spinbutton:focus:not(:last-child):not(.vertical) { - border-top-color: #4a90d9; - box-shadow: inset 0 0 0 1px #4a90d9; } -.linked.vertical > entry + entry:drop(active):not(:last-child), .linked.vertical > spinbutton:not(.vertical) + entry:drop(active):not(:last-child), .linked.vertical > entry + spinbutton:drop(active):not(:last-child):not(.vertical), .linked.vertical > spinbutton:not(.vertical) + spinbutton:drop(active):not(:last-child):not(.vertical) { - border-top-color: black; - box-shadow: inset 0 0 0 1px black; } -.linked.vertical > entry + entry:focus:last-child, .linked.vertical > spinbutton:not(.vertical) + entry:focus:last-child, .linked.vertical > entry + spinbutton:focus:last-child:not(.vertical), .linked.vertical > spinbutton:not(.vertical) + spinbutton:focus:last-child:not(.vertical) { +.linked.vertical > entry + entry:focus:not(:only-child), .linked.vertical > spinbutton:not(.vertical) + entry:focus:not(:only-child), .linked.vertical > entry + spinbutton:focus:not(:only-child):not(.vertical), .linked.vertical > spinbutton:not(.vertical) + spinbutton:focus:not(:only-child):not(.vertical) { border-top-color: #4a90d9; } -.linked.vertical > entry + entry:drop(active):last-child, .linked.vertical > spinbutton:not(.vertical) + entry:drop(active):last-child, .linked.vertical > entry + spinbutton:drop(active):last-child:not(.vertical), .linked.vertical > spinbutton:not(.vertical) + spinbutton:drop(active):last-child:not(.vertical) { +.linked.vertical > entry + entry:drop(active):not(:only-child), .linked.vertical > spinbutton:not(.vertical) + entry:drop(active):not(:only-child), .linked.vertical > entry + spinbutton:drop(active):not(:only-child):not(.vertical), .linked.vertical > spinbutton:not(.vertical) + spinbutton:drop(active):not(:only-child):not(.vertical) { border-top-color: black; } .linked.vertical > entry:focus:not(:only-child) + entry, .linked.vertical > spinbutton:focus:not(:only-child):not(.vertical) + entry, .linked.vertical > entry:focus:not(:only-child) + spinbutton:not(.vertical), .linked.vertical > spinbutton:focus:not(:only-child):not(.vertical) + spinbutton:not(.vertical), .linked.vertical > entry:focus:not(:only-child) + button,