ASCII text
1
/* OVERVIEW */
2
@use "../../../../theme";
4
@use "../../../../theme-color";
5
@use "../../../../st-theme";
6
@use "../../gnome-shell";
7
@use "../../typography";
8
@use "../base/scrollbar";
9
// Same as the ANIMATION_TIME in overview.js
11
$transition-duration: 250ms;
12
$color: theme-color.$system;
14
$on-color: theme-color.$on-system;
15
@if gnome-shell.$version < 40 {
17
$color: transparent;
18
$on-color: theme-color.$on-dark;
19
}
20
@if gnome-shell.$version >= 40 {
22
.controls-manager,
23
.secondary-monitor-workspaces {
24
spacing: 16px;
25
}
26
#overviewGroup {
28
background-color: $color;
29
color: $on-color;
30
StScrollBar {
32
@include scrollbar.color($on-color);
33
}
34
}
35
} @else {
36
#overview {
37
spacing: 24px;
38
background-color: $color;
39
color: $on-color;
40
StScrollBar {
42
@include scrollbar.color($on-color);
43
}
44
}
45
.overview-controls {
47
padding-bottom: 32px;
48
}
49
}
50
@mixin panel {
52
transition-duration: $transition-duration;
53
border: 0;
54
background-color: theme-color.fill($on-color);
55
color: $on-color;
56
}
57
@mixin status-text {
59
@include typography.headline3;
60
color: theme-color.disabled($on-color);
61
}
62
@mixin item {
64
@include _item;
65
&:focus {
67
@include _item-focus;
68
}
69
&:hover,
71
&:selected {
72
@include _item-hover;
73
}
74
&:active,
76
&:checked {
77
@include _item-active;
78
}
79
}
80
@mixin icon {
82
.overview-icon {
83
@include _item;
84
}
85
&:focus {
87
.overview-icon {
88
@include _item-focus;
89
}
90
}
91
&:drop,
93
&:hover,
94
&:selected {
95
.overview-icon {
96
@include _item-hover;
97
}
98
}
99
&:active,
101
&:checked {
102
.overview-icon {
103
@include _item-active;
104
}
105
}
106
}
107
@mixin _item {
109
padding: 6px;
110
border: 0;
111
border-radius: theme.$corner-radius;
112
background-color: transparent;
113
color: inherit;
114
text-align: center;
115
transition-duration: st-theme.$duration;
116
}
117
@mixin _item-focus {
119
border-image: none;
120
background-image: none;
121
background-color: theme-color.focus-overlay($on-color);
122
color: inherit;
123
transition-duration: 0ms;
124
}
125
@mixin _item-hover {
127
border: 0;
128
border-image: none;
129
background-image: none;
130
background-color: theme-color.hover-overlay($on-color);
131
color: inherit;
132
transition-duration: 0ms;
133
}
134
@mixin _item-active {
136
box-shadow: none;
137
background-color: theme-color.pressed-overlay($on-color);
138
color: inherit;
139
transition-duration: st-theme.$duration-ripple;
140
}
141