|
|
|
|
@ -271,76 +271,77 @@ spinner {
|
|
|
|
|
/****************
|
|
|
|
|
* Text Entries *
|
|
|
|
|
****************/
|
|
|
|
|
%entry,
|
|
|
|
|
entry {
|
|
|
|
|
%entry_basic, & {
|
|
|
|
|
min-height: $medium-size;
|
|
|
|
|
padding: 0 8px;
|
|
|
|
|
border-spacing: $space-size;
|
|
|
|
|
border-radius: $corner-radius;
|
|
|
|
|
caret-color: currentColor; // this shouldn't be needed.
|
|
|
|
|
|
|
|
|
|
@include entry(normal);
|
|
|
|
|
|
|
|
|
|
&:focus-within { @include entry(checked); }
|
|
|
|
|
|
|
|
|
|
&:drop(active) { @include entry(hover); }
|
|
|
|
|
%entry-basic {
|
|
|
|
|
caret-color: currentColor; // this shouldn't be needed.
|
|
|
|
|
|
|
|
|
|
&:disabled { @include entry(disabled); }
|
|
|
|
|
@include entry(normal);
|
|
|
|
|
&:focus-within { @include entry(checked); }
|
|
|
|
|
&:drop(active) { @include entry(hover); }
|
|
|
|
|
&:disabled { @include entry(disabled); }
|
|
|
|
|
|
|
|
|
|
// &.search { border-radius: $circular-radius; }
|
|
|
|
|
image {
|
|
|
|
|
color: $text-secondary;
|
|
|
|
|
|
|
|
|
|
&.flat {
|
|
|
|
|
min-height: 0;
|
|
|
|
|
padding: 2px;
|
|
|
|
|
border-radius: 0;
|
|
|
|
|
background-color: transparent;
|
|
|
|
|
}
|
|
|
|
|
&:hover, &:active { color: $text; }
|
|
|
|
|
|
|
|
|
|
image { // icons inside the entry
|
|
|
|
|
color: $text-secondary;
|
|
|
|
|
&:disabled { color: $text-disabled; }
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
&:hover, &:active { color: $text; }
|
|
|
|
|
entry {
|
|
|
|
|
min-height: $medium-size;
|
|
|
|
|
padding: 0 8px;
|
|
|
|
|
border-spacing: $space-size;
|
|
|
|
|
border-radius: $corner-radius;
|
|
|
|
|
@extend %entry-basic;
|
|
|
|
|
|
|
|
|
|
&:disabled { color: $text-disabled; }
|
|
|
|
|
// &.search { border-radius: $circular-radius; }
|
|
|
|
|
|
|
|
|
|
&.left {
|
|
|
|
|
margin-left: ($medium-size - 16px) / 2 - 8px;
|
|
|
|
|
margin-right: 6px;
|
|
|
|
|
}
|
|
|
|
|
&.flat {
|
|
|
|
|
min-height: 0;
|
|
|
|
|
padding: 2px;
|
|
|
|
|
border-radius: 0;
|
|
|
|
|
background-color: transparent;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
&.right {
|
|
|
|
|
margin-left: 6px;
|
|
|
|
|
margin-right: ($medium-size - 16px) / 2 - 8px;
|
|
|
|
|
}
|
|
|
|
|
image { // icons inside the entry
|
|
|
|
|
&.left {
|
|
|
|
|
margin-left: ($medium-size - 16px) / 2 - 8px;
|
|
|
|
|
margin-right: 6px;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
undershoot {
|
|
|
|
|
&.left { @include undershoot(left); }
|
|
|
|
|
|
|
|
|
|
&.right { @include undershoot(right); }
|
|
|
|
|
&.right {
|
|
|
|
|
margin-left: 6px;
|
|
|
|
|
margin-right: ($medium-size - 16px) / 2 - 8px;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
> text > selection { @extend %selected_items_primary; }
|
|
|
|
|
undershoot {
|
|
|
|
|
&.left { @include undershoot(left); }
|
|
|
|
|
|
|
|
|
|
// entry error and warning style
|
|
|
|
|
@each $e_type, $e_color in (error, $error),
|
|
|
|
|
(success, $success),
|
|
|
|
|
(warning, $warning) {
|
|
|
|
|
&.#{$e_type} {
|
|
|
|
|
@include entry(normal, $e_color);
|
|
|
|
|
&.right { @include undershoot(right); }
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
image { color: $e_color; }
|
|
|
|
|
> text > selection { @extend %selected_items_primary; }
|
|
|
|
|
|
|
|
|
|
selection {
|
|
|
|
|
color: on($e_color);
|
|
|
|
|
background-color: $e_color;
|
|
|
|
|
}
|
|
|
|
|
// entry error and warning style
|
|
|
|
|
@each $e_type, $e_color in (error, $error),
|
|
|
|
|
(success, $success),
|
|
|
|
|
(warning, $warning) {
|
|
|
|
|
&.#{$e_type} {
|
|
|
|
|
@include entry(normal, $e_color);
|
|
|
|
|
|
|
|
|
|
&:focus-within { @include entry(checked, $e_color); }
|
|
|
|
|
image { color: $e_color; }
|
|
|
|
|
|
|
|
|
|
&:disabled { @include entry(disabled, $e_color); }
|
|
|
|
|
selection {
|
|
|
|
|
color: on($e_color);
|
|
|
|
|
background-color: $e_color;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
&:focus-within { @include entry(checked, $e_color); }
|
|
|
|
|
|
|
|
|
|
&:disabled { @include entry(disabled, $e_color); }
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
@ -750,20 +751,17 @@ button.link {
|
|
|
|
|
* GtkSpinButton *
|
|
|
|
|
*****************/
|
|
|
|
|
spinbutton {
|
|
|
|
|
&:not(.vertical) {
|
|
|
|
|
// in this horizontal configuration, the whole spinbutton
|
|
|
|
|
// behaves as the entry, so we extend the entry styling
|
|
|
|
|
// and nuke the style on the internal entry
|
|
|
|
|
@extend %entry;
|
|
|
|
|
|
|
|
|
|
&:not(.vertical),
|
|
|
|
|
&.vertical {
|
|
|
|
|
@include entry(normal);
|
|
|
|
|
&:focus-within { @include entry(checked); }
|
|
|
|
|
&:disabled { @include entry(disabled); }
|
|
|
|
|
border-radius: $corner-radius;
|
|
|
|
|
padding: 0;
|
|
|
|
|
border-spacing: 0;
|
|
|
|
|
|
|
|
|
|
> text {
|
|
|
|
|
min-width: $large-size - 8px * 2;
|
|
|
|
|
// reset all the other props since the spinbutton node is styled here
|
|
|
|
|
margin: 0;
|
|
|
|
|
padding-left: $space-size * 2;
|
|
|
|
|
border-image: none;
|
|
|
|
|
border-radius: 0;
|
|
|
|
|
box-shadow: none;
|
|
|
|
|
@ -773,17 +771,29 @@ spinbutton {
|
|
|
|
|
> button {
|
|
|
|
|
@extend %button-flat-simple;
|
|
|
|
|
@extend %small-button;
|
|
|
|
|
margin: 0;
|
|
|
|
|
|
|
|
|
|
// margin: $space-size;
|
|
|
|
|
border: solid $space-size transparent;
|
|
|
|
|
padding: 0;
|
|
|
|
|
border: $space-size solid transparent;
|
|
|
|
|
|
|
|
|
|
// Remove unwanted focus indicator
|
|
|
|
|
&:focus:not(:hover):not(:active):not(:disabled) {
|
|
|
|
|
box-shadow: inset 0 0 0 9999px transparent;
|
|
|
|
|
color: $text-secondary;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
&:not(.vertical) {
|
|
|
|
|
// in this horizontal configuration, the whole spinbutton
|
|
|
|
|
// behaves as the entry, so we extend the entry styling
|
|
|
|
|
// and nuke the style on the internal entry
|
|
|
|
|
|
|
|
|
|
> text {
|
|
|
|
|
min-width: $large-size - 8px * 2;
|
|
|
|
|
// reset all the other props since the spinbutton node is styled here
|
|
|
|
|
padding-left: $space-size * 2;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
> button {
|
|
|
|
|
&.up:dir(ltr),
|
|
|
|
|
&.down:dir(rtl) { margin-left: -$space-size / 2; }
|
|
|
|
|
|
|
|
|
|
@ -794,38 +804,16 @@ spinbutton {
|
|
|
|
|
|
|
|
|
|
// Vertical
|
|
|
|
|
&.vertical {
|
|
|
|
|
@extend %entry;
|
|
|
|
|
|
|
|
|
|
padding: 0;
|
|
|
|
|
|
|
|
|
|
&:disabled { color: $text-disabled; }
|
|
|
|
|
|
|
|
|
|
> text {
|
|
|
|
|
margin: 0;
|
|
|
|
|
border-image: none;
|
|
|
|
|
border-radius: 0;
|
|
|
|
|
box-shadow: none;
|
|
|
|
|
background-color: transparent;
|
|
|
|
|
|
|
|
|
|
min-height: $medium-size;
|
|
|
|
|
min-width: $large-size - $space-size;
|
|
|
|
|
padding: 0;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
> button {
|
|
|
|
|
@extend %button-flat-simple;
|
|
|
|
|
@extend %small-button;
|
|
|
|
|
padding: 0;
|
|
|
|
|
border: solid $space-size transparent;
|
|
|
|
|
|
|
|
|
|
// Remove unwanted focus indicator
|
|
|
|
|
&:focus:not(:hover):not(:active) {
|
|
|
|
|
box-shadow: inset 0 0 0 9999px transparent;
|
|
|
|
|
color: $text-secondary;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
&.up { margin: 0 $space-size / 2; }
|
|
|
|
|
|
|
|
|
|
&.down { margin: 0 $space-size / 2; }
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
@ -864,16 +852,8 @@ combobox {
|
|
|
|
|
|
|
|
|
|
// align menu labels with the button label
|
|
|
|
|
> popover.menu {
|
|
|
|
|
margin-top: $space-size - 2px;
|
|
|
|
|
|
|
|
|
|
> contents {
|
|
|
|
|
padding: $space-size;
|
|
|
|
|
|
|
|
|
|
modelbutton {
|
|
|
|
|
padding-left: $space-size * 1.5;
|
|
|
|
|
padding-right: $space-size * 1.5;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
margin-top: $space-size;
|
|
|
|
|
padding: 0;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
button.combo cellview {
|
|
|
|
|
@ -1053,7 +1033,10 @@ searchbar > revealer > box {
|
|
|
|
|
background-clip: border-box;
|
|
|
|
|
box-shadow: none;
|
|
|
|
|
|
|
|
|
|
entry { margin: 0; }
|
|
|
|
|
entry,
|
|
|
|
|
button,
|
|
|
|
|
menubutton,
|
|
|
|
|
splitbutton { margin: 0; }
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/***************
|
|
|
|
|
@ -1095,8 +1078,15 @@ searchbar > revealer > box {
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
%titlebar-entry {
|
|
|
|
|
background-color: $titlebar-fill;
|
|
|
|
|
color: $titlebar-text;
|
|
|
|
|
caret-color: $titlebar-text;
|
|
|
|
|
|
|
|
|
|
&, &:focus-within {
|
|
|
|
|
background-color: $titlebar-fill;
|
|
|
|
|
|
|
|
|
|
&, & > text {
|
|
|
|
|
color: $titlebar-text;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
&:disabled {
|
|
|
|
|
background-color: $titlebar-fill;
|
|
|
|
|
@ -1114,20 +1104,29 @@ searchbar > revealer > box {
|
|
|
|
|
|
|
|
|
|
headerbar {
|
|
|
|
|
transition: background-color $duration $ease-out, color $duration $ease-out;
|
|
|
|
|
box-shadow: inset 0 -1px $divider, inset 0 1px highlight($titlebar);
|
|
|
|
|
background-color: $titlebar;
|
|
|
|
|
box-shadow: inset 0 -1px $divider;
|
|
|
|
|
color: $titlebar-text;
|
|
|
|
|
min-height: $large-size;
|
|
|
|
|
padding: 0;
|
|
|
|
|
margin: 0;
|
|
|
|
|
border-radius: $window-radius $window-radius 0 0;
|
|
|
|
|
|
|
|
|
|
@if $topbar == 'dark' {
|
|
|
|
|
background-color: transparent;
|
|
|
|
|
} @else {
|
|
|
|
|
background-color: $titlebar;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
&:disabled { color: $titlebar-text-disabled; }
|
|
|
|
|
|
|
|
|
|
&:backdrop {
|
|
|
|
|
background-color: $titlebar-backdrop;
|
|
|
|
|
color: $titlebar-text-secondary;
|
|
|
|
|
|
|
|
|
|
@if $topbar == 'dark' {
|
|
|
|
|
background-color: transparent;
|
|
|
|
|
} @else {
|
|
|
|
|
background-color: $titlebar-backdrop;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
&:disabled { color: $titlebar-text-secondary-disabled; }
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
@ -1186,7 +1185,8 @@ headerbar {
|
|
|
|
|
@extend %titlebar-button;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
button.suggested-action, button.destructive-action {
|
|
|
|
|
button.suggested-action,
|
|
|
|
|
button.destructive-action {
|
|
|
|
|
&:disabled {
|
|
|
|
|
background-color: $titlebar-fill;
|
|
|
|
|
color: $titlebar-text-disabled;
|
|
|
|
|
@ -1195,15 +1195,29 @@ headerbar {
|
|
|
|
|
|
|
|
|
|
button.toggle { border-radius: $circular-radius; }
|
|
|
|
|
|
|
|
|
|
popover.background {
|
|
|
|
|
popover.background { // reset
|
|
|
|
|
> contents {
|
|
|
|
|
color: $text;
|
|
|
|
|
|
|
|
|
|
.dim-label { color: $text-secondary; }
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
button, entry, spinbutton {
|
|
|
|
|
border-radius: $menuitem-radius;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
button:not(.suggested-action):not(.destructive-action):not(.flat) {
|
|
|
|
|
button:not(.suggested-action):not(.destructive-action) {
|
|
|
|
|
@extend %button-basic;
|
|
|
|
|
|
|
|
|
|
&.flat {
|
|
|
|
|
@extend %button-flat;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
image { color: $text; }
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
entry { @extend %entry-basic; }
|
|
|
|
|
|
|
|
|
|
.linked:not(.vertical) > button:not(.suggested-action):not(.destructive-action) {
|
|
|
|
|
border-radius: 0;
|
|
|
|
|
|
|
|
|
|
@ -1219,11 +1233,34 @@ headerbar {
|
|
|
|
|
|
|
|
|
|
&.linked:not(.vertical) > button:not(.suggested-action):not(.destructive-action).text-button {
|
|
|
|
|
border-radius: $circular-radius;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
color: $titlebar-text-secondary;
|
|
|
|
|
|
|
|
|
|
box.vertical & {
|
|
|
|
|
background-color: $titlebar;
|
|
|
|
|
&:focus, &:hover, &:active { color: $titlebar-text; }
|
|
|
|
|
|
|
|
|
|
&:disabled { color: $titlebar-text-secondary-disabled; }
|
|
|
|
|
|
|
|
|
|
&:checked {
|
|
|
|
|
color: on($primary);
|
|
|
|
|
|
|
|
|
|
&:disabled {
|
|
|
|
|
color: on($primary, disabled);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
&:backdrop {
|
|
|
|
|
color: $titlebar-text-disabled;
|
|
|
|
|
|
|
|
|
|
&:focus, &:hover, &:active { color: $titlebar-text-secondary; }
|
|
|
|
|
|
|
|
|
|
&:disabled { color: $titlebar-text-secondary-disabled; }
|
|
|
|
|
|
|
|
|
|
&:checked {
|
|
|
|
|
color: on($primary, disabled);
|
|
|
|
|
|
|
|
|
|
&:disabled { color: on($primary, secondary-disabled); }
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
> windowhandle > box {
|
|
|
|
|
@ -1303,6 +1340,8 @@ headerbar {
|
|
|
|
|
&.default-decoration {
|
|
|
|
|
min-height: $small-size;
|
|
|
|
|
padding: $space-size;
|
|
|
|
|
background-image: none;
|
|
|
|
|
background-color: $titlebar;
|
|
|
|
|
box-shadow: inset 0 -1px $divider, inset 0 1px highlight($titlebar);
|
|
|
|
|
|
|
|
|
|
windowcontrols {
|
|
|
|
|
@ -1375,6 +1414,34 @@ pathbar > button {
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.pathbar {
|
|
|
|
|
background-color: $fill;
|
|
|
|
|
color: $text-secondary;
|
|
|
|
|
border: none;
|
|
|
|
|
border-radius: $corner-radius;
|
|
|
|
|
padding: 2px;
|
|
|
|
|
|
|
|
|
|
headerbar & {
|
|
|
|
|
margin-top: $space-size;
|
|
|
|
|
margin-bottom: $space-size;
|
|
|
|
|
background-color: on($titlebar, fill);
|
|
|
|
|
color: $titlebar-text-secondary;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
> button {
|
|
|
|
|
margin-top: 0;
|
|
|
|
|
margin-bottom: 0;
|
|
|
|
|
min-height: 20px;
|
|
|
|
|
border-radius: $corner-radius - 2px;
|
|
|
|
|
border: none;
|
|
|
|
|
box-shadow: none;
|
|
|
|
|
|
|
|
|
|
&:last-child {
|
|
|
|
|
@include button(flat-checked);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/**************
|
|
|
|
|
* Tree Views *
|
|
|
|
|
@ -1560,7 +1627,7 @@ menubar {
|
|
|
|
|
|
|
|
|
|
popover.menu {
|
|
|
|
|
box.inline-buttons {
|
|
|
|
|
padding: 0 $space-size;
|
|
|
|
|
padding: 0 $space-size + 8px;
|
|
|
|
|
|
|
|
|
|
button.image-button.model {
|
|
|
|
|
min-height: $menuitem-size;
|
|
|
|
|
@ -1615,6 +1682,7 @@ popover.menu {
|
|
|
|
|
margin-right: 0;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
<<<<<<< HEAD
|
|
|
|
|
modelbutton {
|
|
|
|
|
transition: background-color $duration $ease-out;
|
|
|
|
|
min-height: $menuitem-size - $space-size;
|
|
|
|
|
@ -1642,9 +1710,11 @@ popover.menu {
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
=======
|
|
|
|
|
>>>>>>> fdefaf61499c971da070212bd68fd775b6cc1393
|
|
|
|
|
label.title {
|
|
|
|
|
font-weight: bold;
|
|
|
|
|
padding: 4px ($space-size + 20px); //this will fall apart with font sizing
|
|
|
|
|
padding: $space-size / 2 ($space-size + 6px) * 2 + $space-size + 2px; //this will fall apart with font sizing
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
@ -1655,6 +1725,7 @@ popover.menu {
|
|
|
|
|
|
|
|
|
|
popover.background {
|
|
|
|
|
font: initial;
|
|
|
|
|
padding: 0;
|
|
|
|
|
|
|
|
|
|
&, &:backdrop {
|
|
|
|
|
background-color: transparent;
|
|
|
|
|
@ -1696,7 +1767,13 @@ popover.background {
|
|
|
|
|
margin: $space-size / 2 0;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
list separator { margin: 0; }
|
|
|
|
|
list {
|
|
|
|
|
> row {
|
|
|
|
|
padding: $space-size $space-size * 2;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
separator { margin: 0; }
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// FIXME: Use the popover color instead of transparent as a workaround for .view
|
|
|
|
|
@ -1709,6 +1786,33 @@ popover.background {
|
|
|
|
|
&:only-child { border-radius: $menuitem-radius; }
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
modelbutton {
|
|
|
|
|
transition: background-color $duration $ease-out;
|
|
|
|
|
min-height: $menuitem-size - $space-size;
|
|
|
|
|
min-width: $menuitem-size * 2;
|
|
|
|
|
padding: $space-size / 2 $space-size * 1.5;
|
|
|
|
|
border-radius: $menuitem-radius;
|
|
|
|
|
color: $text;
|
|
|
|
|
font: initial;
|
|
|
|
|
text-shadow: none;
|
|
|
|
|
border-spacing: $space-size;
|
|
|
|
|
@extend %button-flat-simple;
|
|
|
|
|
|
|
|
|
|
accelerator {
|
|
|
|
|
color: $text-disabled;
|
|
|
|
|
margin-left: $space-size * 5;
|
|
|
|
|
|
|
|
|
|
&:disabled {
|
|
|
|
|
color: $divider;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
arrow {
|
|
|
|
|
&.left { -gtk-icon-source: -gtk-icontheme("go-previous-symbolic"); }
|
|
|
|
|
&.right { -gtk-icon-source: -gtk-icontheme("go-next-symbolic"); }
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
&.menu button,
|
|
|
|
|
button.model {
|
|
|
|
|
min-height: 32px;
|
|
|
|
|
@ -2257,7 +2361,7 @@ radio {
|
|
|
|
|
|
|
|
|
|
&:not(:hover):focus { box-shadow: inset 0 0 0 9999px transparent; }
|
|
|
|
|
|
|
|
|
|
popover modelbutton.flat & {
|
|
|
|
|
popover modelbutton & {
|
|
|
|
|
margin: 0; // this is a workaround for a menu check/radio size allocation issue
|
|
|
|
|
padding: 0;
|
|
|
|
|
|
|
|
|
|
@ -2675,6 +2779,9 @@ progressbar {
|
|
|
|
|
min-width: $bar-size;
|
|
|
|
|
min-height: $bar-size;
|
|
|
|
|
background-color: transparent;
|
|
|
|
|
box-shadow: none;
|
|
|
|
|
margin: 0;
|
|
|
|
|
padding: 0;
|
|
|
|
|
|
|
|
|
|
trough { background-color: transparent; }
|
|
|
|
|
|
|
|
|
|
@ -2787,6 +2894,11 @@ actionbar > revealer > box {
|
|
|
|
|
background-color: $base;
|
|
|
|
|
background-clip: border-box;
|
|
|
|
|
box-shadow: none;
|
|
|
|
|
|
|
|
|
|
entry,
|
|
|
|
|
button,
|
|
|
|
|
menubutton,
|
|
|
|
|
splitbutton { margin: 0; }
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
statusbar {
|
|
|
|
|
@ -2865,7 +2977,6 @@ list {
|
|
|
|
|
color: $text-secondary;
|
|
|
|
|
|
|
|
|
|
> row {
|
|
|
|
|
padding: 2px;
|
|
|
|
|
background-clip: padding-box;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
@ -2927,8 +3038,14 @@ row {
|
|
|
|
|
@extend %button-flat-simple;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
button:hover &, button:active &, button:checked & {
|
|
|
|
|
background-color: transparent;
|
|
|
|
|
button &.activatable {
|
|
|
|
|
&, &:hover, &.has-open-popup, &:active, &:active:hover {
|
|
|
|
|
background-color: transparent;
|
|
|
|
|
box-shadow: none;
|
|
|
|
|
background-image: none;
|
|
|
|
|
transition: none;
|
|
|
|
|
animation: none;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
button:checked & {
|
|
|
|
|
@ -3131,7 +3248,6 @@ row.expander {
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// AdwExpanderRow arrow rotation
|
|
|
|
|
|
|
|
|
|
image.expander-row-arrow {
|
|
|
|
|
transition: 200ms $ease-out;
|
|
|
|
|
@include margin-start(6px);
|
|
|
|
|
@ -3145,11 +3261,11 @@ row.expander {
|
|
|
|
|
@extend .dim-label;
|
|
|
|
|
|
|
|
|
|
&:dir(ltr) {
|
|
|
|
|
-gtk-icon-transform: rotate(-0.25turn);
|
|
|
|
|
-gtk-icon-transform: rotate(0.5turn);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
&:dir(rtl) {
|
|
|
|
|
-gtk-icon-transform: rotate(0.25turn);
|
|
|
|
|
-gtk-icon-transform: rotate(-0.5turn);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
@ -3936,8 +4052,6 @@ colorchooser .popover.osd {
|
|
|
|
|
**********************/
|
|
|
|
|
window {
|
|
|
|
|
outline: none;
|
|
|
|
|
transition: $transition-shadow;
|
|
|
|
|
box-shadow: $shadow-z16, 0 16px (24px * .6) 2px transparent, 0 6px (30px * .6) 5px transparent;
|
|
|
|
|
|
|
|
|
|
&.csd {
|
|
|
|
|
border-radius: $window-radius;
|
|
|
|
|
@ -3951,8 +4065,12 @@ window {
|
|
|
|
|
&.tiled-left { border-radius: 0; }
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
@if $variant == 'light' and $topbar == 'dark' {
|
|
|
|
|
@if $topbar == 'dark' {
|
|
|
|
|
&.background {
|
|
|
|
|
box-shadow: $shadow-z16,
|
|
|
|
|
0 16px (24px * .6) 2px transparent,
|
|
|
|
|
0 6px (30px * .6) 5px transparent,
|
|
|
|
|
inset 0 1px highlight($titlebar);
|
|
|
|
|
background-color: transparent;
|
|
|
|
|
background-image: linear-gradient(to bottom,
|
|
|
|
|
$titlebar,
|
|
|
|
|
@ -3960,6 +4078,10 @@ window {
|
|
|
|
|
$background $large-size,
|
|
|
|
|
$background);
|
|
|
|
|
}
|
|
|
|
|
} @else {
|
|
|
|
|
box-shadow: $shadow-z16,
|
|
|
|
|
0 16px (24px * .6) 2px transparent,
|
|
|
|
|
0 6px (30px * .6) 5px transparent;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
&:backdrop {
|
|
|
|
|
@ -3967,7 +4089,26 @@ window {
|
|
|
|
|
// change when we go to backdrop, to prevent jumping windows.
|
|
|
|
|
// The biggest shadow should be in the same order then in the active state
|
|
|
|
|
// or the jumping will happen during the transition.
|
|
|
|
|
box-shadow: $shadow-z4, 0 16px (24px * .6) 2px transparent, 0 6px (30px * .6) 5px transparent;
|
|
|
|
|
transition: $transition-shadow;
|
|
|
|
|
|
|
|
|
|
@if $topbar == 'dark' {
|
|
|
|
|
&.background {
|
|
|
|
|
box-shadow: $shadow-z4,
|
|
|
|
|
0 16px (24px * .6) 2px transparent,
|
|
|
|
|
0 6px (30px * .6) 5px transparent,
|
|
|
|
|
inset 0 1px highlight($titlebar);
|
|
|
|
|
background-color: transparent;
|
|
|
|
|
background-image: linear-gradient(to bottom,
|
|
|
|
|
$titlebar-backdrop,
|
|
|
|
|
$titlebar-backdrop $large-size,
|
|
|
|
|
$background $large-size,
|
|
|
|
|
$background);
|
|
|
|
|
}
|
|
|
|
|
} @else {
|
|
|
|
|
box-shadow: $shadow-z4,
|
|
|
|
|
0 16px (24px * .6) 2px transparent,
|
|
|
|
|
0 6px (30px * .6) 5px transparent;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
&.ssd {
|
|
|
|
|
|
vinceliuice
3 years ago