assembler source, ASCII text
1
@import url("gnome-shell.css");
2
/* FIXME:
4
- white edge highlight with text-shadow and icon-shadow for panel-button
5
- better shading of the panel (dark 5%) - impossible without multipoint gradients, image-bg is a hack
6
*/
7
#panel {
9
background-color: #e9e9e9 !important;
10
background-gradient-direction: vertical;
11
background-gradient-end: #d0d0d0;
12
border-top-color: #666; /* we don't support non-uniform border-colors and
13
use the top border color for any border, so we
14
need to set it even if all we want is a bottom
15
border */
16
border-bottom: 1px solid #666;
17
app-icon-bottom-clip: 0px;
18
/* hrm, still no multipoint gradients
20
background-image: linear-gradient(left, rgba(255, 255, 255, 0), rgba(255, 255, 255, 1) 50%, rgba(255, 255, 255, 0)) !important;*/
21
}
22
#panel:overview {
24
background-color: #000 !important;
25
background-gradient-end: #000 !important;
26
border-top-color: #000;
27
border-bottom: 1px solid #000 !important;
28
}
29
#panel.lock-screen {
31
background-color: rgba(0,0,0,0.3) !important;
32
background-gradient-end: rgba(0,0,0,0.3) !important;
33
border-top-color: transparent;
34
}
35
#panel.unlock-screen {
37
background-color: transparent !important;
38
background-gradient-end: transparent !important;
39
border-top-color: transparent;
40
}
41
.tile-preview-left.on-primary,
43
.tile-preview-right.on-primary,
44
.tile-preview-left.tile-preview-right.on-primary {
45
/* keep in sync with -panel-corner-radius */
46
border-radius: 0;
47
}
48
/* TOP BAR */
50
.panel-corner,
52
.panel-corner:active,
53
.panel-corner:overview,
54
.panel-corner:focus {
55
-panel-corner-radius: 0 !important;
56
}
57
.panel-button {
59
color: #555 !important;
60
-natural-hpadding: 6px !important;
61
-minimum-hpadding: 3px !important;
62
}
63
#panel:overview .panel-button,
65
#panel.lock-screen .panel-button,
66
#panel.unlock-screen .panel-button {
67
color: #ccc !important;
68
}
69
.panel-button:hover {
71
color: #000 !important;
72
}
73
#panel:overview .panel-button:hover,
75
#panel:overview .panel-button:active {
76
color: white !important;
77
}
78
.panel-button > .system-status-icon {
80
icon-shadow: #fff 0 1px 0 !important; /* FIXME */
81
}
82
.panel-button:hover,
84
.panel-button:active,
85
.panel-button:overview,
86
.panel-button:focus {
87
text-shadow: 0 0 0 transparent !important; /* FIXME: why can't I do none ? */
88
}
89
.panel-button:active,
91
.panel-button:overview,
92
.panel-button:focus {
93
background-color: #4a90d9 !important; /* FIXME */
94
color: #fff !important;
95
border: none !important;
96
border-image: none !important;
97
background-image: none !important;
98
}
99
#panelUserMenu {
101
padding: 0 10px 0 10px !important;
102
}
103
#appMenu {
105
text-shadow: 0 0 0 transparent !important;
106
spinner-image: url("process-working-symbolic.svg");
107
}
108
/* used for the app menu header only */
110
.label-shadow {
111
color: rgba(0,0,0,0.5);
112
}
113
.label-shadow {
115
color: rgba(255,255,255,.5) !important;
116
}
117
.panel-button:active .label-shadow,
118
.panel-button:focus .label-shadow {
119
color: rgba(0,0,0,.5) !important;
120
}
121
.popup-menu-boxpointer {
123
-arrow-background-color: #e9e9e9 !important;
124
-arrow-border-width: 1px !important;
125
-arrow-border-color: #aaa !important;
126
-arrow-border-radius: 3px !important;
127
color: #000 !important;
128
-arrow-base: 11px !important;
129
-arrow-rise: 5px !important;
130
}
131
.popup-combo-menu {
133
background-color: #e9e9e9 !important;
134
border: 1px solid #aaa !important;
135
color: #000 !important;
136
}
137
.popup-menu-item:active {
139
background-color: #4a90d9 !important;
140
color: #fff !important;
141
}
142
.popup-menu-item:insensitive {
144
color: #888;
145
}
146
.popup-separator-menu-item {
148
-gradient-height: 1px;
149
-gradient-start: rgba(0,0,0,0.0);
150
-gradient-end: rgba(0,0,0,0.15);
151
-margin-horizontal: 24px;
152
height: 1px;
153
padding: 8px 0px;
154
}
155
.popup-menu-item:hover .popup-status-menu-item {
157
color: #fff;
158
}
159
.popup-subtitle-menu-item, .popup-subtitle-menu-item:insensitive {
161
color: #000;
162
}
163
.popup-submenu-menu-item:open {
165
background-color: #888;
166
color: #fff;
167
}
168
.popup-sub-menu {
170
background-gradient-start: #ddd;
171
background-gradient-end: #dfdfdf;
172
background-gradient-direction: vertical;
173
box-shadow: inset 0px 1px 3px rgba(0,0,0,0.4);
174
}
175
/* SCROLLBARS for POPUP MENU */
177
.popup-menu StScrollBar StBin#trough {
179
background-color: transparent;
180
}
181
.popup-menu StScrollBar StButton#vhandle, .popup-menu StScrollBar StButton#hhandle {
183
border-color: #e9e9e9;
184
background-color: #888;
185
}
186
.popup-menu StScrollBar StButton#vhandle:hover,
187
.popup-menu StScrollBar StButton#hhandle:hover {
188
background-color: #666;
189
}
190
.popup-menu StScrollBar StButton#vhandle:active,
191
.popup-menu StScrollBar StButton#hhandle:active {
192
background-color: #4a90d9;
193
}
194
/* CALENDAR */
196
.calendar {}
198
.calendar-month-label {
199
color: #333 !important;
200
}
201
.datemenu-date-label,
202
.events-day-header {
203
color: #666 !important;
204
}
205
.calendar-day-base:active {
206
color: #fff !important;
207
background-color: #4a90d9 !important;
208
background-image: none !important;
209
border-image: none !important;
210
}
211
.calendar-today {
212
background-color: #4a90d9 !important;
213
background-image: none !important;
214
border-image: none !important;
215
}
216
.calendar-day-base {
217
color: #666 !important;
218
}
219
.calendar-day-base:hover {
220
background-color: #666 !important;
221
color: #fff !important;
222
}
223
.calendar-nonwork-day {
224
color: #999 !important;
225
}
226
.events-day-dayname,
227
.events-day-time {
228
color: #666 !important;
229
}
230
/* SYSTEM MENU */
232
.system-menu-action {
234
color: #e6e6e6;
235
border: 2px solid #ddd; /* using rgba() is flaky unfortunately */
236
}
237
.system-menu-action:hover,
239
.system-menu-action:focus,
240
.system-menu-action:active {
241
color: white;
242
background-color: #4a90d9;
243
border: none;
244
}
245
/* VOLUME SLIDER */
247
.slider {
249
-slider-background-color: #e9e9e9;
250
-slider-border-color: #999;
251
-slider-active-background-color: #76b0ec;
252
-slider-active-border-color: #1f6dbc;
253
-slider-handle-border-color: #888;
254
-slider-handle-border-width: 1px;
255
}
256
.popup-menu-icon {
258
color: #000 !important;
259
}
260
/* ON OFF switch */
262
.toggle-switch-us {
264
background-image: url("switch-off.svg");
265
background-size: contain;
266
}
267
.toggle-switch-us:checked {
268
background-image: url("switch-on.svg");
269
background-size: contain;
270
}
271
.toggle-switch-intl {
273
background-image: url("switch-off.svg");
274
background-size: contain;
275
}
276
.toggle-switch-intl:checked {
277
background-image: url("switch-on.svg");
278
background-size: contain;
279
}
280
.system-menu-action {
282
color: #555 !important;
283
}
284
.system-menu-action:hover,
286
.system-menu-action:focus {
287
color: black !important;
288
}
289