1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
|
/* Dash */
// uses system colors
$dash_background_color: $system_overlay_bg_color;
$dash_placeholder_size: 32px;
$dash_padding: $base_padding * 2;
$dash_edge_offset: $base_margin * 3;
$dash_border_radius: $modal_radius + $dash_padding;
$dash_spacing: $base_margin * 0.5;
// container for the dash
#dash {
// a bit of spacing so that dash doesn't touch the screen edges
padding-left: $base_padding;
padding-right: $base_padding;
// background behind item container
.dash-background {
background-color: $dash_background_color;
border-radius: $dash_border_radius;
padding-top: $dash_padding;
padding-bottom: $dash_padding;
padding-left: $dash_padding - $dash_spacing; // subtract the margins added to .overview-tile below
padding-right: $dash_padding - $dash_spacing;
@if $contrast == 'high' {
@include draw_hc_inset($width: 2px);
}
}
// items on the dash
.dash-item-container {
.placeholder {
// background-image: url("resource:///org/gnome/shell/theme/dash-placeholder.svg");
background-image: none;
background-size: contain;
height: $dash_placeholder_size;
}
.empty-dash-drop-target {
width: $dash_placeholder_size;
height: $dash_placeholder_size;
}
// IMPORTANT: items on the dash need to extend to the edge to be adequate click targets
// as such the %tile style is overriden and button styles are applied to the child class .overview-icon
.show-apps,
.overview-tile {
// remove styles
@extend %reset;
margin: 0 $dash_spacing;
padding-bottom: $dash_edge_offset; // align with other items
$fg:$system_fg_color;
$bg:$dash_background_color;
.overview-icon {
@extend %tile;
@include button(normal, $tc:$fg, $c:$bg, $style: flat, $always_dark: true);
}
&:focus .overview-icon { @include button(focus, $tc:$fg, $c:$bg, $style: flat, $always_dark: true);}
&:hover .overview-icon { @include button(hover, $tc:$fg, $c:$bg, $style: flat, $always_dark: true);}
&:active .overview-icon { @include button(active, $tc:$fg, $c:$bg, $style: flat, $always_dark: true);}
&:checked .overview-icon { @include button(checked, $tc:$fg, $c:$bg, $style: flat, $always_dark: true);}
}
// running app dot
.app-grid-running-dot {
// manually position the dot within the dash item
@if $contrast == 'high' {
offset-y: -$dash_padding - 1px; // don't draw dot directly on inset
} @else {
offset-y: -$dash_padding;
}
}
}
// separator between pinned and running apps
.dash-separator {
width: 1px;
margin-left:$base_margin;
margin-right:$base_margin;
background-color: $system_borders_color;
@if $contrast == 'high' {
width: 2px;
background-color: $hc_inset_color;
}
}
// make sure all dash components have same margin from screen edge
.dash-separator,
.dash-background {
margin-bottom: $dash_edge_offset;
}
}
// OSD Tooltip
.dash-label {
@extend %tooltip;
-y-offset: $base_margin * 2; // distance from the dash edge
}
|
