ASCII text
1
/* Top Bar */
2
// a.k.a. the panel
3
$panel_corner_radius: $base_border_radius+1;
5
$panel_bg_color: #000;
6
$panel_fg_color: #ccc;
7
$panel_height: 1.86em;
8
#panel {
11
background-color: $panel_bg_color;
12
font-weight: bold;
13
height: $panel_height;
14
font-feature-settings: "tnum";
15
// transparent panel on lock & login screens
17
&.unlock-screen,
18
&.login-screen,
19
&.lock-screen {
20
background-color: transparent;
21
.panel-corner {
23
-panel-corner-radius: 0;
24
-panel-corner-background-color: transparent;
25
-panel-corner-border-color: transparent;
26
}
27
}
28
// spacing between activities, app menu and such
30
#panelLeft, #panelCenter {
31
spacing: $base_spacing;
32
}
33
// the rounded outset corners
35
.panel-corner {
36
-panel-corner-radius: $panel_corner_radius;
37
-panel-corner-background-color: $panel_bg_color;
38
-panel-corner-border-width: 2px;
39
-panel-corner-border-color: transparent;
40
&:active, &:overview, &:focus {
42
-panel-corner-border-color: lighten($selected_bg_color,5%);
43
}
44
}
45
// panel menus
47
.panel-button {
48
font-weight: bold;
49
color: $panel_fg_color;
50
-natural-hpadding: $base_padding * 2;
51
-minimum-hpadding: $base_padding;
52
&:hover {
54
color: lighten($panel_fg_color, 20%);
55
}
56
&:active, &:overview, &:focus, &:checked {
58
// Trick due to St limitations. It needs a background to draw a box-shadow
59
background-color: rgba(0, 0, 0, 0.01);
60
box-shadow: inset 0 -2px 0 0 lighten($selected_bg_color,5%);
61
color: lighten($panel_fg_color, 20%);
62
}
63
// status area icons
65
.system-status-icon {
66
icon-size: $base_icon_size;
67
padding: $base_padding - 1px;
68
}
69
// app menu icon
71
.app-menu-icon {
72
margin-left: $base_margin;
73
margin-right: $base_margin;
74
-st-icon-style: symbolic;
75
// dimensions of the icon are hardcoded
76
}
77
// lock & login screen styles
79
.unlock-screen &,
80
.login-screen &,
81
.lock-screen & {
82
color: lighten($fg_color, 10%);
83
&:focus, &:hover, &:active { color: lighten($fg_color, 10%); }
84
}
85
}
86
.panel-status-indicators-box,
88
.panel-status-menu-box {
89
spacing: 2px;
90
}
91
// spacing between power icon and (optional) percentage label
93
.power-status.panel-status-indicators-box {
94
spacing: 0;
95
}
96
// indicator for active
98
.screencast-indicator,
99
.remote-access-indicator { color: $warning_color; }
100
}
101
// App Menu
103
#appMenu {
104
spacing: $base_spacing;
105
.label-shadow { color: transparent; }
106
}
107