mirror of
https://github.com/horst3180/arc-theme.git
synced 2024-10-27 19:04:02 +00:00
lots of fixes
This commit is contained in:
Horst3180
parent
a5dc6aa589
commit
bb58312bdc
@ -1,18 +1,5 @@
|
||||
// Drawing mixins
|
||||
|
||||
// generic drawing of more complex things
|
||||
|
||||
@mixin _shadows($shadow1, $shadow2:none, $shadow3:none, $shadow4:none) {
|
||||
//
|
||||
// Helper function to stack up to 4 box-shadows;
|
||||
//
|
||||
|
||||
@if $shadow4!=none { box-shadow: $shadow1, $shadow2, $shadow3, $shadow4; }
|
||||
@else if $shadow3!=none { box-shadow: $shadow1, $shadow2, $shadow3; }
|
||||
@else if $shadow2!=none { box-shadow: $shadow1, $shadow2; }
|
||||
@else { box-shadow: $shadow1; }
|
||||
}
|
||||
|
||||
// Entries
|
||||
|
||||
@mixin entry($t) {
|
||||
|
||||
@ -1,18 +1,5 @@
|
||||
// Drawing mixins
|
||||
|
||||
// generic drawing of more complex things
|
||||
|
||||
@mixin _shadows($shadow1, $shadow2:none, $shadow3:none, $shadow4:none) {
|
||||
//
|
||||
// Helper function to stack up to 4 box-shadows;
|
||||
//
|
||||
|
||||
@if $shadow4!=none { box-shadow: $shadow1, $shadow2, $shadow3, $shadow4; }
|
||||
@else if $shadow3!=none { box-shadow: $shadow1, $shadow2, $shadow3; }
|
||||
@else if $shadow2!=none { box-shadow: $shadow1, $shadow2; }
|
||||
@else { box-shadow: $shadow1; }
|
||||
}
|
||||
|
||||
// Entries
|
||||
|
||||
@mixin entry($t) {
|
||||
|
||||
@ -1,18 +1,5 @@
|
||||
// Drawing mixins
|
||||
|
||||
// generic drawing of more complex things
|
||||
|
||||
@mixin _shadows($shadow1, $shadow2:none, $shadow3:none, $shadow4:none) {
|
||||
//
|
||||
// Helper function to stack up to 4 box-shadows;
|
||||
//
|
||||
|
||||
@if $shadow4!=none { box-shadow: $shadow1, $shadow2, $shadow3, $shadow4; }
|
||||
@else if $shadow3!=none { box-shadow: $shadow1, $shadow2, $shadow3; }
|
||||
@else if $shadow2!=none { box-shadow: $shadow1, $shadow2; }
|
||||
@else { box-shadow: $shadow1; }
|
||||
}
|
||||
|
||||
// Entries
|
||||
|
||||
@mixin entry($t) {
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
@ -24,6 +24,8 @@ $success_color: #73d216;
|
||||
$destructive_color: #F04A50;
|
||||
$suggested_color: #4DADD4;
|
||||
|
||||
$drop_target_color: #4e9a06;
|
||||
|
||||
//insensitive state derived colors
|
||||
$insensitive_fg_color: if($variant == 'light', transparentize($fg_color, 0.45), transparentize($fg_color, 0.55));
|
||||
$insensitive_bg_color: if($variant == 'light', mix($bg_color, $base_color, 40%), lighten($bg_color, 2%));
|
||||
|
||||
@ -41,9 +41,7 @@ $darker_asset_suffix: if($darker=='true', '-dark', $asset_suffix);
|
||||
background-color: if($transparency == 'true', transparentize($bg_color, 0.001), $bg_color); // without this headerbar transparency doesn't seem to work
|
||||
}
|
||||
|
||||
*:disabled {
|
||||
-gtk-icon-effect: dim;
|
||||
}
|
||||
*:disabled { -gtk-icon-effect: dim; }
|
||||
|
||||
.gtkstyle-fallback {
|
||||
background-color: $bg_color;
|
||||
@ -67,41 +65,29 @@ $darker_asset_suffix: if($darker=='true', '-dark', $asset_suffix);
|
||||
}
|
||||
|
||||
.view,
|
||||
textview text {
|
||||
%view {
|
||||
color: $text_color;
|
||||
background-color: $base_color;
|
||||
|
||||
&:selected,
|
||||
selection,
|
||||
selection:focus,
|
||||
selection:hover {
|
||||
&:selected {
|
||||
&, &:focus {
|
||||
@extend %selected_items;
|
||||
}
|
||||
&.dim-label {
|
||||
color: transparentize($text_color, 0.45);
|
||||
|
||||
selection, selection:focus {
|
||||
color: transparentize($selected_fg_color, 0.35);
|
||||
text-shadow: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
textview { // This will get overridden by .view, needed by gedit line numbers
|
||||
background-color: mix($bg_color, $base_color, 50%);
|
||||
}
|
||||
|
||||
iconview {
|
||||
color: $text_color;
|
||||
background-color: $base_color;
|
||||
|
||||
&:selected,
|
||||
&:selected:focus {
|
||||
border-radius: 2px;
|
||||
@extend %selected_items;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.view,
|
||||
textview {
|
||||
text {
|
||||
@extend %view;
|
||||
|
||||
selection { &:focus, & { @extend %selected_items; }}
|
||||
}
|
||||
}
|
||||
|
||||
iconview { @extend .view; }
|
||||
|
||||
rubberband,
|
||||
.rubberband {
|
||||
border: 1px solid darken($selected_bg_color, 10%);
|
||||
@ -116,26 +102,32 @@ flowbox {
|
||||
border-radius: 2px;
|
||||
|
||||
&:selected {
|
||||
outline-offset: -2px;
|
||||
|
||||
@extend %selected_items;
|
||||
|
||||
outline-offset: -2px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
label {
|
||||
&.separator {
|
||||
color: $fg_color;
|
||||
@extend .dim-label;
|
||||
|
||||
color: $fg_color;
|
||||
}
|
||||
&:selected,
|
||||
selection,
|
||||
selection:focus,
|
||||
selection:hover {
|
||||
@extend %selected_items;
|
||||
|
||||
row:selected &,
|
||||
&:selected { @extend %nobg_selected_items; }
|
||||
|
||||
selection {
|
||||
color: $selected_fg_color;
|
||||
background-color: $selected_bg_color;
|
||||
}
|
||||
|
||||
&:disabled {
|
||||
color: $insensitive_fg_color;
|
||||
|
||||
selection { @extend %selected_items:disabled; }
|
||||
}
|
||||
}
|
||||
|
||||
@ -150,6 +142,7 @@ assistant {
|
||||
}
|
||||
|
||||
&.csd .sidebar { border-top-style: none; }
|
||||
|
||||
.sidebar label { padding: 6px 12px; }
|
||||
|
||||
.sidebar label.highlight {
|
||||
@ -158,6 +151,10 @@ assistant {
|
||||
}
|
||||
}
|
||||
|
||||
textview { // This will get overridden by .view, needed by gedit line numbers
|
||||
background-color: $base_color;
|
||||
}
|
||||
|
||||
%osd, .osd {
|
||||
color: $osd_fg_color;
|
||||
border: none;
|
||||
@ -212,13 +209,15 @@ entry {
|
||||
&.right { padding-right: 0; padding-left: 5px; }
|
||||
}
|
||||
|
||||
&.flat, &.flat:focus {
|
||||
@include entry(normal);
|
||||
&.flat {
|
||||
&, &:focus {
|
||||
min-height: 0;
|
||||
padding: 2px;
|
||||
border: none;
|
||||
background-image: none;
|
||||
border-color: transparent;
|
||||
border-radius: 0;
|
||||
}
|
||||
}
|
||||
|
||||
&:focus {
|
||||
background-clip: border-box;
|
||||
@ -227,23 +226,9 @@ entry {
|
||||
|
||||
&:disabled { @include entry(insensitive); }
|
||||
|
||||
selection,
|
||||
selection:focus {
|
||||
background-color: $selected_bg_color;
|
||||
color: $selected_fg_color;
|
||||
}
|
||||
|
||||
progress {
|
||||
margin: 0 -6px;
|
||||
border-radius: 0;
|
||||
border-width: 0 0 2px;
|
||||
border-color: $selected_bg_color;
|
||||
border-style: solid;
|
||||
background-image: none;
|
||||
background-color: transparent;
|
||||
box-shadow: none;
|
||||
}
|
||||
selection { &:focus, & { @extend %selected_items; }}
|
||||
|
||||
// error and warning style
|
||||
@each $e_type, $e_color in (warning, $warning_color),
|
||||
(error, $error_color) {
|
||||
&.#{$e_type} {
|
||||
@ -265,12 +250,31 @@ entry {
|
||||
}
|
||||
}
|
||||
|
||||
&:drop(active) {
|
||||
&:focus, & {
|
||||
border-color: $drop_target_color;
|
||||
box-shadow: inset 0 0 0 1px $drop_target_color;
|
||||
}
|
||||
}
|
||||
|
||||
.osd & {
|
||||
@include entry(osd);
|
||||
&:focus { @include entry(osd-focus); }
|
||||
&:disabled { @include entry(osd-insensitive); }
|
||||
}
|
||||
|
||||
progress {
|
||||
margin: 0 -6px;
|
||||
border-radius: 0;
|
||||
border-width: 0 0 2px;
|
||||
border-color: $selected_bg_color;
|
||||
border-style: solid;
|
||||
background-image: none;
|
||||
background-color: transparent;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
// linked entries
|
||||
.linked:not(.vertical) > &,
|
||||
.linked:not(.vertical) > &:focus { @extend %linked; }
|
||||
|
||||
@ -278,6 +282,16 @@ entry {
|
||||
.linked.vertical > &:focus { @extend %linked_vertical; }
|
||||
}
|
||||
|
||||
treeview entry {
|
||||
&.flat, & {
|
||||
border-radius: 0;
|
||||
background-image: none;
|
||||
background-color: $base_color;
|
||||
|
||||
&:focus { border-color: $selected_bg_color; }
|
||||
}
|
||||
}
|
||||
|
||||
//
|
||||
// Buttons
|
||||
//
|
||||
@ -317,26 +331,29 @@ button {
|
||||
|
||||
&.flat {
|
||||
@include button(undecorated);
|
||||
background-color: transparentize($button_bg, 1);
|
||||
border-color: transparentize($button_border, 1);
|
||||
// to avoid adiacent buttons borders clashing when transitioning, the transition on the normal state is set
|
||||
// to none, while it's added back in the hover state, so the button decoration will fade in on hover, but
|
||||
// it won't fade out when the pointer leave the button allocation area. To make the transition more evident
|
||||
// in this case the duration is increased.
|
||||
transition: none;
|
||||
|
||||
&:hover {
|
||||
transition: $_button_transition;
|
||||
transition-duration: 350ms;
|
||||
|
||||
&:active { transition: $_button_transition; }
|
||||
}
|
||||
}
|
||||
|
||||
&:hover {
|
||||
@include button(hover);
|
||||
-gtk-icon-effect: highlight;
|
||||
}
|
||||
|
||||
&:active, &:checked {
|
||||
background-clip: if($variant=='light', border-box, padding-box);
|
||||
@include button(active);
|
||||
|
||||
background-clip: if($variant=='light', border-box, padding-box);
|
||||
transition-duration: 50ms;
|
||||
}
|
||||
|
||||
@ -345,15 +362,43 @@ button {
|
||||
&:active:hover, &:checked { color: $selected_fg_color; }
|
||||
//Webkitgtk workaround end
|
||||
|
||||
&.flat:disabled {
|
||||
@include button(undecorated);
|
||||
}
|
||||
&.flat:disabled { @include button(undecorated); }
|
||||
|
||||
&:disabled {
|
||||
@include button(insensitive);
|
||||
|
||||
&:active, &:checked {
|
||||
@include button(insensitive-active);
|
||||
}
|
||||
}
|
||||
|
||||
&.image-button {
|
||||
min-width: 32px;
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
&.text-button {
|
||||
padding-left: 16px;
|
||||
padding-right: 16px;
|
||||
}
|
||||
|
||||
&.text-button.image-button {
|
||||
padding-left: 8px;
|
||||
padding-right: 8px;
|
||||
|
||||
label {
|
||||
padding-left: 8px;
|
||||
padding-right: 8px;
|
||||
}
|
||||
}
|
||||
|
||||
&:drop(active) {
|
||||
color: $drop_target_color;
|
||||
border-color: $drop_target_color;
|
||||
box-shadow: inset 0 0 0 1px $drop_target_color;
|
||||
}
|
||||
|
||||
// big standalone buttons like in Documents pager
|
||||
&.osd {
|
||||
color: $osd_fg_color;
|
||||
@ -422,27 +467,6 @@ button {
|
||||
}
|
||||
}
|
||||
|
||||
&.image-button {
|
||||
min-width: 32px;
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
&.text-button {
|
||||
padding-left: 16px;
|
||||
padding-right: 16px;
|
||||
}
|
||||
|
||||
&.text-button.image-button {
|
||||
padding-left: 8px;
|
||||
padding-right: 8px;
|
||||
|
||||
label {
|
||||
padding-left: 8px;
|
||||
padding-right: 8px;
|
||||
}
|
||||
}
|
||||
|
||||
.stack-switcher > & {
|
||||
// to position the needs attention dot, padding is added to the button
|
||||
// child, a label needs just lateral padding while an icon needs vertical
|
||||
@ -509,16 +533,12 @@ button {
|
||||
.linked:not(.vertical) > &,
|
||||
.linked:not(.vertical) > &:hover,
|
||||
.linked:not(.vertical) > &:active,
|
||||
.linked:not(.vertical) > &:checked {
|
||||
@extend %linked;
|
||||
}
|
||||
.linked:not(.vertical) > &:checked { @extend %linked; }
|
||||
|
||||
.linked.vertical > &,
|
||||
.linked.vertical > &:hover,
|
||||
.linked.vertical > &:active,
|
||||
.linked.vertical > &:checked {
|
||||
@extend %linked_vertical;
|
||||
}
|
||||
.linked.vertical > &:checked { @extend %linked_vertical; }
|
||||
}
|
||||
|
||||
// all the following is for the +|- buttons on inline toolbars, that way
|
||||
@ -686,7 +706,8 @@ modelbutton.flat {
|
||||
}
|
||||
|
||||
modelbutton.flat arrow {
|
||||
&, &:hover { background: none; }
|
||||
& { background: none; }
|
||||
|
||||
&.left { -gtk-icon-source: -gtk-icontheme("pan-start-symbolic"); }
|
||||
&.right { -gtk-icon-source: -gtk-icontheme("pan-end-symbolic"); }
|
||||
}
|
||||
@ -696,6 +717,7 @@ modelbutton.flat arrow {
|
||||
//
|
||||
*:link {
|
||||
color: $link_color;
|
||||
|
||||
&:visited {
|
||||
color: $link_visited_color;
|
||||
*:selected & { color: mix($selected_fg_color, $selected_bg_color, 60%); }
|
||||
@ -708,9 +730,10 @@ modelbutton.flat arrow {
|
||||
color: $link_color;
|
||||
*:selected & { color: mix($selected_fg_color, $selected_bg_color, 80%); }
|
||||
}
|
||||
&:selected, *:selected & {
|
||||
color: mix($selected_fg_color, $selected_bg_color, 80%);
|
||||
}
|
||||
|
||||
@at-root %link_selected,
|
||||
&:selected,
|
||||
*:selected & { color: mix($selected_fg_color, $selected_bg_color, 80%); }
|
||||
}
|
||||
|
||||
button:link, button:visited {
|
||||
@ -780,6 +803,8 @@ combobox {
|
||||
min-width: 16px;
|
||||
}
|
||||
|
||||
&:drop(active) button.combo { @extend button:drop(active); }
|
||||
|
||||
&.linked {
|
||||
button:nth-child(2) {
|
||||
&:dir(ltr) { @extend %linked:last-child; }
|
||||
@ -816,11 +841,29 @@ toolbar {
|
||||
&.horizontal separator { margin: 0 6px; }
|
||||
&.vertical separator { margin: 6px 0; }
|
||||
|
||||
.osd &, &.osd {
|
||||
.osd & { background-color: transparent; }
|
||||
|
||||
&.osd {
|
||||
padding: 7px;
|
||||
border: 1px solid transparentize(black, 0.5);
|
||||
border-radius: 3px;
|
||||
background-color: transparentize($osd_bg_color, 0.1);
|
||||
|
||||
&.left,
|
||||
&.right,
|
||||
&.top,
|
||||
&.bottom { border-radius: 0; } // positional classes for `attached` osd toolbars
|
||||
}
|
||||
|
||||
&:not(.inline-toolbar):not(.osd) {
|
||||
switch,
|
||||
scale,
|
||||
entry,
|
||||
spinbutton,
|
||||
button {
|
||||
margin-right: 1px;
|
||||
margin-bottom: 1px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -1319,8 +1362,8 @@ headerbar {
|
||||
}
|
||||
|
||||
&.slider-button {
|
||||
padding-left: 2px;
|
||||
padding-right: 2px;
|
||||
padding-left: 1px;
|
||||
padding-right: 1px;
|
||||
}
|
||||
|
||||
image {
|
||||
@ -1333,7 +1376,6 @@ headerbar {
|
||||
// Tree Views
|
||||
//
|
||||
treeview.view {
|
||||
|
||||
-GtkTreeView-grid-line-width: 1;
|
||||
-GtkTreeView-grid-line-pattern: '';
|
||||
-GtkTreeView-tree-line-width: 1;
|
||||
@ -1346,15 +1388,18 @@ treeview.view {
|
||||
rubberband { @extend rubberband; } // to avoid borders being overridden by the previously set props
|
||||
|
||||
&:selected {
|
||||
&, &:focus {
|
||||
border-radius: 0;
|
||||
border-left-color: mix($selected_fg_color, $selected_bg_color, 50%);
|
||||
border-top-color: transparentize($fg_color, 0.9); // doesn't work unfortunately
|
||||
|
||||
@extend %selected_items;
|
||||
}
|
||||
}
|
||||
|
||||
&:disabled {
|
||||
color: $insensitive_fg_color;
|
||||
|
||||
&:selected {
|
||||
color: mix($selected_fg_color, $selected_bg_color, 40%);
|
||||
}
|
||||
@ -1365,10 +1410,13 @@ treeview.view {
|
||||
color: transparentize(black, 0.9);
|
||||
}
|
||||
|
||||
&.dnd {
|
||||
&:drop(active) {
|
||||
border-style: solid none;
|
||||
border-width: 1px;
|
||||
border-color: mix($fg_color, $selected_bg_color, 50%);
|
||||
|
||||
&.after { border-top-style: none; }
|
||||
&.before { border-bottom-style: none; }
|
||||
}
|
||||
|
||||
&.expander {
|
||||
@ -1593,8 +1641,7 @@ popover.background {
|
||||
|
||||
> list,
|
||||
> .view,
|
||||
> toolbar,
|
||||
&.osd > toolbar {
|
||||
> toolbar {
|
||||
border-style: none;
|
||||
background-color: transparent;
|
||||
}
|
||||
@ -1602,6 +1649,8 @@ popover.background {
|
||||
&, .csd & {
|
||||
&.osd, &.magnifier { @extend %osd; }
|
||||
&.touch-selection { @extend .context-menu }
|
||||
|
||||
&.osd { @extend %osd; }
|
||||
}
|
||||
}
|
||||
|
||||
@ -1620,7 +1669,6 @@ cursor-handle {
|
||||
//
|
||||
notebook {
|
||||
padding: 0;
|
||||
transition: all 200ms $ease-out-quad;
|
||||
|
||||
&.frame {
|
||||
border: 1px solid $borders_color;
|
||||
@ -1748,22 +1796,14 @@ scrollbar {
|
||||
|
||||
button { border: none; }
|
||||
|
||||
&.vertical {
|
||||
button.down {
|
||||
-gtk-icon-source: -gtk-icontheme('pan-down-symbolic');
|
||||
}
|
||||
button.up {
|
||||
-gtk-icon-source: -gtk-icontheme('pan-up-symbolic');
|
||||
}
|
||||
&.vertical button {
|
||||
&.down { -gtk-icon-source: -gtk-icontheme('pan-down-symbolic'); }
|
||||
&.up { -gtk-icon-source: -gtk-icontheme('pan-up-symbolic'); }
|
||||
}
|
||||
|
||||
&.horizontal {
|
||||
button.down {
|
||||
-gtk-icon-source: -gtk-icontheme('pan-right-symbolic');
|
||||
}
|
||||
button.up {
|
||||
-gtk-icon-source: -gtk-icontheme('pan-left-symbolic');
|
||||
}
|
||||
&.horizontal button {
|
||||
&.down { -gtk-icon-source: -gtk-icontheme('pan-right-symbolic'); }
|
||||
&.up { -gtk-icon-source: -gtk-icontheme('pan-left-symbolic'); }
|
||||
}
|
||||
|
||||
&.overlay-indicator {
|
||||
@ -1908,7 +1948,7 @@ switch {
|
||||
}
|
||||
|
||||
//
|
||||
// Check and Radio items *
|
||||
// Check and Radio items
|
||||
//
|
||||
@each $w,$a in ('check', 'checkbox'),
|
||||
('radio','radio') {
|
||||
@ -1960,27 +2000,22 @@ checkbutton, radiobutton {
|
||||
&.text-button {
|
||||
padding: 2px 0;
|
||||
outline-offset: 0;
|
||||
}
|
||||
|
||||
label:not(:only-child) {
|
||||
&:first-child { margin-left: 4px; }
|
||||
&:last-child { margin-right: 4px; }
|
||||
}
|
||||
|
||||
&:disabled,
|
||||
&:disabled:active,
|
||||
&:disabled:indeterminate {
|
||||
// set insensitive color, which is overriden otherwise
|
||||
color: $insensitive_fg_color;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
radiobutton radio,
|
||||
checkbutton check {
|
||||
check,
|
||||
radio {
|
||||
min-width: 16px;
|
||||
min-height: 16px;
|
||||
margin: 0 2px;
|
||||
&:only-child { margin: 0; }
|
||||
|
||||
&:only-child,
|
||||
menu menuitem & { margin: 0; }
|
||||
}
|
||||
|
||||
//
|
||||
@ -2117,7 +2152,7 @@ scale {
|
||||
}
|
||||
fill {
|
||||
background: none;
|
||||
background-color: red;
|
||||
background-color: transparentize($selected_bg_color, 0.5);
|
||||
}
|
||||
&:disabled {
|
||||
background-image: linear-gradient(to bottom, transparentize($_scale_trough_bg, 0.45));
|
||||
@ -2127,6 +2162,7 @@ scale {
|
||||
.osd & {
|
||||
background-image: linear-gradient(to bottom, lighten($osd_bg_color, 7%));
|
||||
outline-color: transparentize($osd_fg_color, 0.8);
|
||||
|
||||
highlight {
|
||||
background-image: none;
|
||||
background-image: linear-gradient(to bottom, $selected_bg_color);
|
||||
@ -2188,11 +2224,6 @@ progressbar {
|
||||
}
|
||||
}
|
||||
|
||||
// FIXME
|
||||
//.osd .scale.progressbar {
|
||||
// background-color: $selected_bg_color;
|
||||
//}
|
||||
|
||||
//
|
||||
// Level Bar
|
||||
//
|
||||
@ -2261,13 +2292,12 @@ frame > border,
|
||||
padding: 0;
|
||||
border-radius: 0;
|
||||
border: 1px solid $borders_color;
|
||||
|
||||
&.flat { border-style: none; }
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
scrolledwindow {
|
||||
viewport.frame { // avoid double borders when viewport inside
|
||||
// scrolled window
|
||||
viewport.frame { // avoid double borders when viewport inside scrolled window
|
||||
border-style: none;
|
||||
}
|
||||
|
||||
@ -2315,37 +2345,34 @@ list {
|
||||
row { padding: 2px; }
|
||||
}
|
||||
|
||||
row.activatable {
|
||||
row {
|
||||
&:not(:hover) { transition: all 150ms $ease-out-quad; }
|
||||
|
||||
&:selected {
|
||||
@extend %selected_items;
|
||||
|
||||
button { @extend %selected-button; }
|
||||
}
|
||||
|
||||
&.activatable {
|
||||
&.has-open-popup,
|
||||
&:hover { background-color: if($variant == 'light', transparentize(black, 0.95), transparentize(white, 0.97)); }
|
||||
|
||||
&:active { color: $fg_color; }
|
||||
&:disabled {
|
||||
color: $insensitive_fg_color;
|
||||
image { color: inherit; }
|
||||
}
|
||||
|
||||
&:selected {
|
||||
&:active { color: $selected_fg_color; }
|
||||
|
||||
&.has-open-popup,
|
||||
&:hover { background-color: mix(black, $selected_bg_color, 10%); }
|
||||
|
||||
&:disabled {
|
||||
color: transparentize($selected_fg_color, 0.3);
|
||||
background-color: transparentize($selected_bg_color, 0.3);
|
||||
label { color: inherit; }
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
row:selected {
|
||||
@extend %selected_items;
|
||||
button { @extend %selected-button }
|
||||
}
|
||||
|
||||
// transition
|
||||
row {
|
||||
transition: all 150ms $ease-out-quad;
|
||||
&:hover { transition: none; }
|
||||
}
|
||||
|
||||
//
|
||||
// App Notifications
|
||||
//
|
||||
@ -2423,9 +2450,7 @@ calendar {
|
||||
}
|
||||
}
|
||||
&:indeterminate { color: gtkalpha(currentColor,0.55); }
|
||||
&.highlight {
|
||||
color: $fg_color;
|
||||
}
|
||||
&.highlight { color: $fg_color; }
|
||||
}
|
||||
|
||||
//
|
||||
@ -2478,6 +2503,11 @@ filechooser {
|
||||
#pathbarbox { border-bottom: 1px solid transparentize($borders_color, 0.5); }
|
||||
}
|
||||
|
||||
filechooserbutton:drop(active) {
|
||||
box-shadow: none;
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
//
|
||||
// Sidebar
|
||||
//
|
||||
@ -2495,13 +2525,12 @@ filechooser {
|
||||
|
||||
@at-root %sidebar_right,
|
||||
&:dir(rtl),
|
||||
&.left {
|
||||
&.right {
|
||||
border-left: 1px solid $borders_color;
|
||||
border-right-style: none;
|
||||
}
|
||||
|
||||
&:selected { @extend %selected_items; }
|
||||
separator { @extend separator; }
|
||||
list { background-color: transparent; }
|
||||
|
||||
paned & { &.left, &.right, &.left:dir(rtl), &:dir(rtl), &:dir(ltr), & { border-style: none; }}
|
||||
}
|
||||
@ -2531,11 +2560,8 @@ stacksidebar {
|
||||
}
|
||||
|
||||
placessidebar {
|
||||
|
||||
> viewport.frame { border-style: none; }
|
||||
|
||||
list { background-color: transparent; }
|
||||
|
||||
row {
|
||||
// Needs overriding of the GtkListBoxRow padding
|
||||
min-height: 30px;
|
||||
@ -2565,11 +2591,27 @@ placessidebar {
|
||||
|
||||
&:not(:hover):not(:active) > image { opacity: 0.5 };
|
||||
}
|
||||
|
||||
&.sidebar-placeholder-row {
|
||||
padding: 0 8px;
|
||||
min-height: 2px;
|
||||
background-image: linear-gradient(to top, $drop_target_color);
|
||||
background-clip: content-box;
|
||||
}
|
||||
|
||||
row.sidebar-placeholder-row { border: solid 1px $selected_bg_color; }
|
||||
&.sidebar-new-bookmark-row { color: $selected_bg_color; }
|
||||
|
||||
row.sidebar-new-bookmark-row { background-color: darken($bg_color, 10%); }
|
||||
&:drop(active):not(:disabled) {
|
||||
color: $drop_target_color;
|
||||
box-shadow: inset 0 1px $drop_target_color,
|
||||
inset 0 -1px $drop_target_color;
|
||||
|
||||
&:selected {
|
||||
color: $selected_fg_color;
|
||||
background-color: $drop_target_color;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//
|
||||
@ -2649,19 +2691,25 @@ paned {
|
||||
//
|
||||
// GtkInfoBar
|
||||
//
|
||||
infobar {
|
||||
border-style: none;
|
||||
|
||||
button { @extend %selected-button }
|
||||
}
|
||||
infobar { border-style: none; }
|
||||
|
||||
.info,
|
||||
.question,
|
||||
.warning,
|
||||
.error,
|
||||
infobar {
|
||||
.error {
|
||||
background-color: $selected_bg_color;
|
||||
color: $selected_fg_color;
|
||||
|
||||
button { @extend %selected-button }
|
||||
|
||||
label:selected {
|
||||
&:focus, &:hover, & {
|
||||
color: $selected_bg_color;
|
||||
background-color: $selected_fg_color;
|
||||
}
|
||||
}
|
||||
|
||||
*:link { @extend %link_selected; }
|
||||
}
|
||||
|
||||
|
||||
@ -2837,10 +2885,14 @@ colorchooser .popover.osd { border-radius: 3px; }
|
||||
rubberband { @extend rubberband; }
|
||||
}
|
||||
|
||||
.scale-popup button { // +/- buttons on GtkVolumeButton popup
|
||||
.scale-popup {
|
||||
.osd & { @extend %osd; }
|
||||
|
||||
button { // +/- buttons on GtkVolumeButton popup
|
||||
&:hover {
|
||||
@include button(hover);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Decouple the font of context menus from their entry/textview
|
||||
@ -2884,8 +2936,8 @@ stackswitcher button {
|
||||
//
|
||||
*:drop(active):focus,
|
||||
*:drop(active) {
|
||||
border-color: black;
|
||||
box-shadow: inset 0 0 0 1px black;
|
||||
border-color: $drop_target_color;
|
||||
box-shadow: inset 0 0 0 1px $drop_target_color;
|
||||
}
|
||||
|
||||
//
|
||||
@ -2915,8 +2967,7 @@ decoration {
|
||||
.tiled & {
|
||||
border-radius: 0;
|
||||
}
|
||||
.popup &,
|
||||
&.popup {
|
||||
.popup & {
|
||||
box-shadow: none;
|
||||
border-radius: 0;
|
||||
}
|
||||
@ -2995,8 +3046,12 @@ headerbar,
|
||||
|
||||
// catch all extend
|
||||
%selected_items {
|
||||
background-image: none;
|
||||
background-color: $selected_bg_color;
|
||||
|
||||
@at-root %nobg_selected_items, & {
|
||||
color: $selected_fg_color;
|
||||
outline-color: transparentize($selected_fg_color, 0.7);
|
||||
|
||||
&:disabled { color: mix($selected_fg_color, $selected_bg_color, 50%); }
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,18 +1,5 @@
|
||||
// Drawing mixins
|
||||
|
||||
// generic drawing of more complex things
|
||||
|
||||
@mixin _shadows($shadow1, $shadow2:none, $shadow3:none, $shadow4:none) {
|
||||
//
|
||||
// Helper function to stack up to 4 box-shadows;
|
||||
//
|
||||
|
||||
@if $shadow4!=none { box-shadow: $shadow1, $shadow2, $shadow3, $shadow4; }
|
||||
@else if $shadow3!=none { box-shadow: $shadow1, $shadow2, $shadow3; }
|
||||
@else if $shadow2!=none { box-shadow: $shadow1, $shadow2; }
|
||||
@else { box-shadow: $shadow1; }
|
||||
}
|
||||
|
||||
// Entries
|
||||
|
||||
@mixin entry($t) {
|
||||
@ -163,24 +150,22 @@
|
||||
//
|
||||
// insensitive button
|
||||
//
|
||||
color: $insensitive_fg_color;
|
||||
label, & { color: $insensitive_fg_color; }
|
||||
|
||||
border-color: transparentize($button_border, 0.45);
|
||||
background-color: transparentize($button_bg, 0.45);
|
||||
|
||||
> label { color: inherit; }
|
||||
}
|
||||
|
||||
@else if $t==insensitive-active {
|
||||
//
|
||||
// insensitive pushed button
|
||||
//
|
||||
color: transparentize($selected_fg_color, 0.2);
|
||||
label, & { color: transparentize($selected_fg_color, 0.2); }
|
||||
|
||||
border-color: transparentize($selected_bg_color, 0.25);
|
||||
background-color: transparentize($selected_bg_color, 0.25);
|
||||
|
||||
opacity: 0.6;
|
||||
|
||||
> label { color: inherit; }
|
||||
}
|
||||
|
||||
@if $t==header-normal {
|
||||
@ -218,11 +203,10 @@
|
||||
//
|
||||
// insensitive header-bar button
|
||||
//
|
||||
color: transparentize($header_fg, 0.45);
|
||||
label, & { color: transparentize($header_fg, 0.45); }
|
||||
|
||||
background-color: transparentize($header_bg, 1);
|
||||
border-color: transparentize($header_bg, 1);
|
||||
|
||||
> label { color: inherit; }
|
||||
}
|
||||
|
||||
@else if $t==header-insensitive-active {
|
||||
|
||||
@ -21,22 +21,26 @@
|
||||
|
||||
background-color: $dark_sidebar_bg;
|
||||
|
||||
row.sidebar-placeholder-row { border: 1px solid $selected_bg_color; }
|
||||
row.sidebar-new-bookmark-row {
|
||||
&, image { color: $selected_bg_color; }
|
||||
}
|
||||
|
||||
row.sidebar-new-bookmark-row { background-color: lighten($dark_sidebar_bg, 10%); }
|
||||
|
||||
row.activatable {
|
||||
row {
|
||||
border: none;
|
||||
color: $dark_sidebar_fg;
|
||||
|
||||
&:not(:selected):not(:disabled):not(:active):not(.sidebar-new-bookmark-row) {
|
||||
.sidebar-icon { color: transparentize($dark_sidebar_fg, 0.4); }
|
||||
}
|
||||
|
||||
&.has-open-popup,
|
||||
&:hover { background-color: transparentize($dark_sidebar_fg, 0.85); }
|
||||
&:disabled {
|
||||
&, label, image { color: transparentize($dark_sidebar_fg, 0.6); }
|
||||
}
|
||||
|
||||
&:selected, &:selected:hover, &:active:hover {
|
||||
@extend %selected_items;
|
||||
.sidebar-icon { color: inherit; }
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
Loading…
Reference in New Issue
Block a user