nirilayout/style.css at main · Piero-93/nirilayout · GitHub

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
/* The window is only a transparent tray. A drop shadow cannot spill past the
   edge of its surface, so the window has to stay larger than the card drawn
   inside it — hence the padding here and the background on .card below. */
window {
	opacity: 0;
	padding: 14px;
	background-color: transparent;
	transition: opacity 75ms ease-in-out;
}

window.visible {
	opacity: 1;
}

/* The raised surface everything is drawn on: a hairline border and a soft drop
   shadow, so the panel reads as floating above the desktop rather than painted
   flat onto it. Shared by the picker and the identify overlays so they look
   like the same application. Theme colors rather than fixed ones, so it still
   reads on a light theme. */
box.card {
	border-radius: 14px;
	background-color: @theme_bg_color;
	border: 1px solid alpha(@theme_fg_color, 0.14);
	box-shadow: 0 4px 18px rgba(0, 0, 0, 0.45);
}

box.panel {
	padding: 16px;
}

button {
	border: 2px solid transparent;
}

button:hover {
	border-color: #595959;
}

button.current {
	border-color: #007595;
}

button.selected {
	border-color: #7dc4e4;
}

/* Layouts whose outputs are not all connected (-dim-unavailable). */
button.unavailable {
	opacity: 0.35;
}

button.unavailable:hover {
	border-color: transparent;
}

label.missing-outputs {
	font-size: smaller;
}

/* Per-monitor overlays naming each screen (-identify, -identify-on-open, F1).
   They sit in the top-left corner so they do not cover the picker. */
box.identify-card {
	padding: 14px 20px;
}

label.identify-name {
	font-size: 30px;
	font-weight: bold;
}

label.identify-details {
	font-size: 13px;
	opacity: 0.55;
}