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
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
|
/*
This file is part of keks-meet (https://codeberg.org/metamuffin/keks-meet)
which is licensed under the GNU Affero General Public License (version 3); see /COPYING.
Copyright (C) 2023 metamuffin <metamuffin@disroot.org>
@use 'chat'
@use 'logger'
@use 'room'
@use 'prefs'
@use 'menu'
@import url("/assets/font/include.css")
@import url("/overrides.css")
*
font-family: "Ubuntu", sans-serif
color: white
margin: 0px
padding: 0px
body.start
background-image: linear-gradient(var(--ac-dark-transparent), black 150%), url("/assets/tile-backdrop.svg")
background-attachment: fixed
background-size: cover, 750px
background-color: var(--ac-dark)
position: absolute
inset: 0
display: flex
place-content: center
align-items: center
overflow: hidden
body
font-weight: 300
background-color: var(--bg-dark)
height: 100vh
width: 100vw
justify-content: left
h1
text-shadow: 0px 0px 20px rgba(0, 0, 0, 0.75)
font-size: 5em
font-weight: 700
text-align: center
margin-bottom: 0.1em
input[type="button"],
button
padding: 0.5em
margin: 0.25em
background-color: var(--ac)
border: 0px solid transparent
border-radius: 3px
input[type="button"]:hover,
button:hover
filter: brightness(130%)
input[type="button"].active,
button.active
filter: hue-rotate(20deg)
input[type="text"],
select,
input[type="number"]
background-color: var(--bg-dark)
border: 1px solid var(--ac-light)
input:disabled,
button:disabled
filter: sepia(90%)
.start-box
text-align: center
position: absolute
max-width: 64em
.instructions
margin-bottom: 0.5em
font-size: x-large
color: #c5c5c5
text-align: left
.start-box input[type="text"]
margin: 2em 0 1em 0
width: 25em
font-weight: 500
color: whitesmoke
border: 0.15em solid var(--ac)
background-color: rgba(0, 0, 0, 0.3)
backdrop-filter: blur(5px)
border-radius: 0.5em
outline: none
.start-box input[type="text"]:focus
transition: 0.1s ease-out
background-color: rgba(0, 0, 0, 0.5)
border-color: lightgray !important
.start-box input[type="button"]
margin: 1em 0 1em 0
border-radius: 0.5em
font-size: x-large
width: 12em
padding: 0.5em
font-weight: 500
color: white
background-color: var(--ac)
backdrop-filter: blur(5px)
border: 0
cursor: pointer
border: 0.15em solid var(--ac)
.start-box .description
margin-bottom: 1.5em
font-size: x-large
font-weight: bold
text-align: center
#room-id-input
padding: 0.5em
font-size: x-large
@media (max-width: 1100px)
.start-box
max-width: 90%
.start-box input[type="text"]
width: 90%
@media (max-width: 900px) and (max-height: 700px), (max-height: 550px)
h1
font-size: 3em
font-weight: 700
text-align: center
.instructions
font-size: large
.start-box .description
font-size: large
#room-id-input
padding: 0.5em
font-size: large
.start-box input[type="button"]
font-size: large
|