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
107
108
109
110
111
112
113
114
115
116
|
@import "css/grid.css";
@import "css/dragui.css";
@import "css/toasts.css";
@import "css/popups.css";
@import "css/theming.css";
@import "css/launcher.css";
body {
margin: 0;
overflow: hidden;
}
button {outline: none}
b, strong {font-weight: 700}
body, input, button {font-weight: 500}
button {
border: none;
color: white;
outline: none;
cursor: pointer;
font-weight: 700;
padding: 5px 10px;
border-radius: 5px;
transition: 0.2s ease-in-out;
}
button:hover {filter: brightness(110%)}
button:active {filter: brightness(90%)}
.popup, #modsdiv, .release-block {
outline: 1px solid #444444;
border: 3px solid var(--bg);
}
.playBtn, .gamesContainer button, #winbtns div {
cursor: pointer;
}
/* window buttons { */
#winbtns {
z-index: 2;
display: flex;
position: fixed;
top: var(--padding);
right: calc(var(--padding) / 2);
}
#winbtns div {
width: 25px;
opacity: 0.6;
height: 25px;
position: relative;
background-size: contain;
transition: 0.25s ease-in-out;
margin-right: calc(var(--padding) / 2);
}
#winbtns #close {background-image: url("icons/close.png")}
#winbtns #minimize {background-image: url("icons/minimize.png")}
#winbtns #settings {background-image: url("icons/settings.png")}
#winbtns #settings:hover {
transform: rotate(90deg);
}
#winbtns div:hover {opacity: 1.0}
#winbtns div:active {transform: scale(0.95)}
/* } */
img {pointer-events: none}
#bgHolder {
top: -5px;
left: -5px;
right: -5px;
bottom: -5px;
z-index: -1;
position: absolute;
background-size: cover;
background-position: center;
background-repeat: no-repeat;
transition: background-image 0.1s ease-in-out;
filter: brightness(0.4) blur(2px) grayscale(0.6);
}
#bgHolder[bg="0"] {background-image: url("../assets/bg/viper.jpg")}
#bgHolder[bg="1"] {background-image: url("../assets/bg/northstar.jpg")}
#bgHolder[bg="2"] {background-image: url("../assets/bg/tf2.jpg")}
/* drag control */
#bgHolder,
.contentContainer,
.gamesContainer {
user-select: none;
-webkit-app-region: drag;
}
#overlay.shown ~ #bgHolder,
#overlay.shown ~ .contentContainer,
#overlay.shown ~ .gamesContainer {
-webkit-app-region: no-drag;
}
a, button, #close, #nsRelease, #vpReleaseNotes,
.mod, #overlay, #modsdiv, #winbtns, .contentMenu {
-webkit-app-region: no-drag;
}
/* grids */
.grid {
display: flex;
flex-wrap: wrap;
}
|