_window-picker.scss
ASCII text
1
/* Window Picker */
2
3
// Window picker
4
.window-picker {
5
// Space between window thumbnails
6
@if $version >= 3.38 {
7
spacing: 8px;
8
} @else {
9
-horizontal-spacing: 16px;
10
-vertical-spacing: 16px;
11
}
12
13
@if $version < 40 {
14
// Padding for container around window thumbnails
15
padding: 0 16px 32px;
16
17
&.external-monitor {
18
padding: 16px;
19
}
20
}
21
}
22
23
@if $version < 40 {
24
// Borders on window thumbnails
25
.window-clone-border {
26
border: 4px solid stroke($on-dark);
27
border-radius: $corner-radius;
28
// For window decorations with round corners we can't match
29
// the exact shape when the window is scaled. So apply a shadow
30
// to fix that case
31
box-shadow: inset 0 0 0 1px stroke($on-dark);
32
}
33
}
34
35
// Window titles
36
.window-caption {
37
padding: 4px 8px;
38
border-radius: $corner-radius;
39
background-color: $scrim;
40
color: $on-scrim;
41
42
@if $version < 40 {
43
spacing: 0;
44
border: 0;
45
font-size: 1em;
46
font-weight: normal;
47
}
48
}
49
50
// Close button
51
.window-close {
52
transition-duration: $duration;
53
height: $medium-size;
54
width: $medium-size;
55
padding: 0;
56
border: 0;
57
border-radius: $medium-size / 2;
58
box-shadow: $shadow-z2;
59
background-color: $error;
60
color: $on-error;
61
62
@if $version < 40 {
63
background-image: url("assets/window-close.svg");
64
background-size: 24px;
65
}
66
67
@if $version < 3.38 {
68
-shell-close-overlap: $medium-size / 2;
69
}
70
71
&:hover {
72
box-shadow: $shadow-z4;
73
border-color: transparent;
74
background-color: overlay("hover", $on-error, $on: $error);
75
color: $on-error;
76
77
@if $version < 3.32 {
78
background-image: url("assets/window-close.svg");
79
}
80
}
81
82
&:active {
83
transition-duration: $duration-ripple;
84
box-shadow: $shadow-z8;
85
border-color: transparent;
86
background-color: overlay("pressed", $on-error, $on: $error);
87
color: $on-error;
88
89
@if $version < 3.32 {
90
background-image: url("assets/window-close.svg");
91
}
92
}
93
94
StIcon {
95
icon-size: 24px;
96
97
@if $version < 40 {
98
color: transparent;
99
}
100
}
101
}
102
103
@if $version >= 40 {
104
.workspace-background {
105
// keep in sync with BACKGROUND_CORNER_RADIUS_PIXELS in workspace.js
106
border-radius: 30px;
107
background-color: black;
108
box-shadow: $shadow-z8;
109
}
110
}
111