forked from AuroraMiddleware/gtk
Adwaita: simplify vertically linked entries scss code
This commit is contained in:
parent
4c3e4d3ea1
commit
b37e4ff805
@ -332,14 +332,6 @@ entry {
|
|||||||
.linked.vertical {
|
.linked.vertical {
|
||||||
> entry { @extend %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
|
// brighter border between linked entries
|
||||||
> entry:not(:disabled) + entry:not(:disabled) {
|
> entry:not(:disabled) + entry:not(:disabled) {
|
||||||
border-top-color: mix($borders_color, $base_color, 30%);
|
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%); }
|
> 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.
|
// 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();
|
border-top-color: entry_focus_border();
|
||||||
box-shadow: entry_focus_shadow();
|
|
||||||
}
|
}
|
||||||
|
> entry + entry:drop(active):not(:only-child) {
|
||||||
> entry + entry:drop(active):not(:last-child) {
|
|
||||||
border-top-color: $drop_target_color;
|
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.
|
// this takes care of coloring the top border of the focused entry subsequent widget.
|
||||||
// :not(:only-child) is a specificity bump hack.
|
// :not(:only-child) is a specificity bump hack.
|
||||||
> entry:focus:not(:only-child) + entry,
|
> entry:focus:not(:only-child) + entry,
|
||||||
|
@ -309,12 +309,6 @@ entry, spinbutton:not(.vertical) {
|
|||||||
border-color: black;
|
border-color: black;
|
||||||
box-shadow: inset 0 0 0 1px 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) {
|
.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;
|
border-top-color: #252626;
|
||||||
background-image: linear-gradient(to bottom, #292929); }
|
background-image: linear-gradient(to bottom, #292929); }
|
||||||
@ -323,15 +317,9 @@ entry, spinbutton:not(.vertical) {
|
|||||||
background-image: linear-gradient(to bottom, #2c2c2c); }
|
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) {
|
.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; }
|
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) {
|
.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;
|
|
||||||
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) {
|
|
||||||
border-top-color: #0f2b48; }
|
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; }
|
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) + 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,
|
.linked.vertical > entry:focus:not(:only-child) + button,
|
||||||
|
@ -309,12 +309,6 @@ entry, spinbutton:not(.vertical) {
|
|||||||
border-color: black;
|
border-color: black;
|
||||||
box-shadow: inset 0 0 0 1px 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) {
|
.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;
|
border-top-color: #e2e2e0;
|
||||||
background-image: linear-gradient(to bottom, #ffffff); }
|
background-image: linear-gradient(to bottom, #ffffff); }
|
||||||
@ -323,15 +317,9 @@ entry, spinbutton:not(.vertical) {
|
|||||||
background-image: linear-gradient(to bottom, white); }
|
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) {
|
.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; }
|
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) {
|
.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;
|
|
||||||
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) {
|
|
||||||
border-top-color: #4a90d9; }
|
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; }
|
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) + 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,
|
.linked.vertical > entry:focus:not(:only-child) + button,
|
||||||
|
Loading…
Reference in New Issue
Block a user