sass: Add track-disabled color variable
and replace $divider with it. In some contexts, using "divider" color was not appropriate.
and replace $divider with it. In some contexts, using "divider" color was not appropriate.
by roundabout, Friday, 19 April 2019, 15:33:43 (1555688023), pushed by roundabout, Sunday, 11 May 2025, 13:22:36 (1746969756)
Author identity: nana-4 <hnmaigo@gmail.com>
d02248982099d5812fcb16452c6bf893eb4d01a9
@if ($state == 'disabled') { @return rgba(black, 0.38); }
@if ($state == 'secondary-disabled') { @return rgba(black, 0.26); }
@if ($state == 'track') { @return rgba(black, 0.26); }
@if ($state == 'track-disabled') { @return rgba(black, 0.12); }
@if ($state == 'divider') { @return rgba(black, 0.12); }
@if ($state == 'fill') { @return rgba(black, 0.04); }
} @else {
@if ($state == 'disabled') { @return rgba(white, 0.5); }
@if ($state == 'secondary-disabled') { @return rgba(white, 0.3); }
@if ($state == 'track') { @return rgba(white, 0.3); }
@if ($state == 'track-disabled') { @return rgba(white, 0.12); }
@if ($state == 'divider') { @return rgba(white, 0.12); }
@if ($state == 'fill') { @return rgba(white, 0.04); }
}
$text-disabled: on($background, disabled);
$text-secondary-disabled: on($background, secondary-disabled);
$track: on($background, track);
$track-disabled: on($background, track-disabled);
$divider: on($background, divider);
$fill: on($background, fill);
$titlebar-text-disabled: on($titlebar, disabled);
$titlebar-text-secondary-disabled: on($titlebar, secondary-disabled);
$titlebar-track: on($titlebar, track);
$titlebar-track-disabled: on($titlebar, track-disabled);
$titlebar-divider: on($titlebar, divider);
$titlebar-fill: on($titlebar, fill);
StBin#trough {
margin: 4px;
border-radius: 100px;
background-color: $divider;
background-color: $track-disabled;
}
StButton#vhandle, StButton#hhandle {
%overview_scrollbar {
StBin#trough {
background-color: on(dark, divider);
background-color: on(dark, track-disabled);
}
StButton#vhandle, StButton#hhandle {
.level {
height: 8px;
border-radius: 0;
background-color: $divider;
background-color: $track-disabled;
color: $text;
}
.level-bar {
.switcher-list .item-box:outlined {
padding: 8px;
border: none;
background-color: $divider;
background-color: $track-disabled;
}
.switcher-list .item-box:selected {
.ws-switcher-box {
height: 48px;
border: none;
background: $divider;
background: $track-disabled;
border-radius: $corner-radius;
}
padding: 8px;
border: none;
border-radius: $corner-radius;
background-color: $divider;
background-color: $track-disabled;
color: $text-disabled;
}
}
@include entry(normal, $fc:on($os-background, track));
&:focus { @include entry(focus, $fc:on($os-background)); }
&:insensitive {
@include entry(insensitive, $fc:on($os-background, divider));
@include entry(insensitive, $fc:on($os-background, track-disabled));
color: on($os-background, disabled);
}
}
StBin#trough {
margin: 4px;
border-radius: 100px;
background-color: $divider;
background-color: $track-disabled;
}
StButton#vhandle, StButton#hhandle {
%overview_scrollbar {
StBin#trough {
background-color: on(dark, divider);
background-color: on(dark, track-disabled);
}
StButton#vhandle, StButton#hhandle {
.level {
height: 8px;
border-radius: 0;
background-color: $divider;
background-color: $track-disabled;
color: $text;
}
.level-bar {
.switcher-list .item-box:outlined {
padding: 8px;
border: none;
background-color: $divider;
background-color: $track-disabled;
}
.switcher-list .item-box:selected {
.ws-switcher-box {
height: 48px;
border: none;
background: $divider;
background: $track-disabled;
border-radius: $corner-radius;
}
padding: 8px;
border: none;
border-radius: $corner-radius;
background-color: $divider;
background-color: $track-disabled;
color: $text-disabled;
}
}
@include entry(normal, $fc:on($os-background, track));
&:focus { @include entry(focus, $fc:on($os-background)); }
&:insensitive {
@include entry(insensitive, $fc:on($os-background, divider));
@include entry(insensitive, $fc:on($os-background, track-disabled));
color: on($os-background, disabled);
}
}
StBin#trough {
margin: 4px;
border-radius: 100px;
background-color: $divider;
background-color: $track-disabled;
}
StButton#vhandle, StButton#hhandle {
%overview_scrollbar {
StBin#trough {
background-color: on(dark, divider);
background-color: on(dark, track-disabled);
}
StButton#vhandle, StButton#hhandle {
.level {
height: 8px;
border-radius: 0;
background-color: $divider;
background-color: $track-disabled;
color: $text;
}
.level-bar {
.switcher-list .item-box:outlined {
padding: 8px;
border: none;
background-color: $divider;
background-color: $track-disabled;
color: $text; // for Ubuntu session
}
.ws-switcher-box {
height: 48px;
border: none;
background: $divider;
background: $track-disabled;
border-radius: $corner-radius;
}
padding: 8px;
border: none;
border-radius: $corner-radius;
background-color: $divider;
background-color: $track-disabled;
color: $text-disabled;
}
}
@include entry(normal, $fc:on($os-background, track));
&:focus { @include entry(focus, $fc:on($os-background)); }
&:insensitive {
@include entry(insensitive, $fc:on($os-background, divider));
@include entry(insensitive, $fc:on($os-background, track-disabled));
color: on($os-background, disabled);
}
}
StBin#trough {
margin: 4px;
border-radius: 100px;
background-color: $divider;
background-color: $track-disabled;
}
StButton#vhandle, StButton#hhandle {
%overview_scrollbar {
StBin#trough {
background-color: on(dark, divider);
background-color: on(dark, track-disabled);
}
StButton#vhandle, StButton#hhandle {
.level {
height: 8px;
border-radius: 0;
background-color: $divider;
background-color: $track-disabled;
color: $text;
}
.level-bar {
.switcher-list .item-box:outlined {
padding: 8px;
border: none;
background-color: $divider;
background-color: $track-disabled;
color: $text; // for Ubuntu session
}
.ws-switcher-box {
height: 48px;
border: none;
background: $divider;
background: $track-disabled;
border-radius: $corner-radius;
}
padding: 8px;
border: none;
border-radius: $corner-radius;
background-color: $divider;
background-color: $track-disabled;
color: $text-disabled;
}
}
@include entry(normal, $fc:on($os-background, track));
&:focus { @include entry(focus, $fc:on($os-background)); }
&:insensitive {
@include entry(insensitive, $fc:on($os-background, divider));
@include entry(insensitive, $fc:on($os-background, track-disabled));
color: on($os-background, disabled);
}
}
StBin#trough {
margin: 4px;
border-radius: 100px;
background-color: $divider;
background-color: $track-disabled;
}
StButton#vhandle, StButton#hhandle {
%overview_scrollbar {
StBin#trough {
background-color: on(dark, divider);
background-color: on(dark, track-disabled);
}
StButton#vhandle, StButton#hhandle {
.level {
height: 8px;
-barlevel-height: 8px;
-barlevel-background-color: $divider;
-barlevel-background-color: $track-disabled;
-barlevel-active-background-color: $primary;
-barlevel-overdrive-color: $destructive;
-barlevel-overdrive-separator-width: 2px;
.switcher-list .item-box:outlined {
padding: 8px;
border: none;
background-color: $divider;
background-color: $track-disabled;
color: $text; // for Ubuntu session
}
.ws-switcher-box {
height: 48px;
border: none;
background: $divider;
background: $track-disabled;
border-radius: $corner-radius;
}
padding: 8px;
border: none;
border-radius: $corner-radius;
background-color: $divider;
background-color: $track-disabled;
color: $text-disabled;
}
}
@include entry(normal, $fc:on($os-background, track));
&:focus { @include entry(focus, $fc:on($os-background)); }
&:insensitive {
@include entry(insensitive, $fc:on($os-background, divider));
@include entry(insensitive, $fc:on($os-background, track-disabled));
color: on($os-background, disabled);
}
}
StBin#trough {
margin: 4px;
border-radius: 100px;
background-color: $divider;
background-color: $track-disabled;
}
StButton#vhandle, StButton#hhandle {
%overview_scrollbar {
StBin#trough {
background-color: on(dark, divider);
background-color: on(dark, track-disabled);
}
StButton#vhandle, StButton#hhandle {
.level {
height: 8px;
-barlevel-height: 8px;
-barlevel-background-color: $divider;
-barlevel-background-color: $track-disabled;
-barlevel-active-background-color: $primary;
-barlevel-overdrive-color: $destructive;
-barlevel-overdrive-separator-width: 2px;
.switcher-list .item-box:outlined {
padding: 8px;
border: none;
background-color: $divider;
background-color: $track-disabled;
color: $text; // for Ubuntu session
}
.ws-switcher-box {
height: 48px;
border: none;
background: $divider;
background: $track-disabled;
border-radius: $corner-radius;
}
padding: 8px;
border: none;
border-radius: $corner-radius;
background-color: $divider;
background-color: $track-disabled;
color: $text-disabled;
}
}
@include entry(normal, $fc:on($os-background, track));
&:focus { @include entry(focus, $fc:on($os-background)); }
&:insensitive {
@include entry(insensitive, $fc:on($os-background, divider));
@include entry(insensitive, $fc:on($os-background, track-disabled));
color: on($os-background, disabled);
}
}
@if $t == insensitive {
color: $text-disabled;
border-color: transparent;
box-shadow: inset 0 -1px if($fc == $primary, $divider, $fc);
box-shadow: inset 0 -1px if($fc == $primary, $track-disabled, $fc);
}
}
margin: 2px;
border-radius: $circular-radius;
box-shadow: none;
background-color: $divider;
background-color: $track-disabled;
color: $text;
&:hover { background-image: image($overlay-hover); }
color: $titlebar-text;
&:disabled {
box-shadow: inset 0 -1px $titlebar-divider;
box-shadow: inset 0 -1px $titlebar-track-disabled;
background-color: $titlebar-fill;
color: $titlebar-text-disabled;
}
}
&.trough { // progress bar trough in treeviews
border-bottom: $bar-size solid $divider;
border-bottom: $bar-size solid $track-disabled;
box-shadow: none;
background-color: transparent;
background-image: none;
outline: none;
background-color: $track;
&:disabled { background-color: $divider; }
&:disabled { background-color: $track-disabled; }
}
// the colored part of the backing bit
color: $text-secondary;
font-size: smaller;
trough { background-color: $divider; }
trough { background-color: $track-disabled; }
progress { background-color: $primary; }
&.full { background-color: $success; }
&.empty { background-color: $divider; }
&.empty { background-color: $track-disabled; }
}
}
}
@if $t == disabled {
box-shadow: inset 0 0 0 9999px transparent, inset 0 -1px $divider;
box-shadow: inset 0 0 0 9999px transparent, inset 0 -1px $track-disabled;
background-color: $fill;
color: $text-disabled;
}
}
&.free {
background-color: $divider;
color: $divider;
background-color: $track-disabled;
color: $track-disabled;
}
}
.trough {
border-radius: 0;
background-color: on($tooltip, divider);
background-color: on($tooltip, track-disabled);
}
.progressbar {
*************/
#live_installer .menubar progressbar trough {
border-radius: 4px; // Adjust to hard-coded progress border-radius
background-color: $titlebar-divider;
background-color: $titlebar-track-disabled;
}