"Fossies" - the Fresh Open Source Software Archive 
Member "jitsi-meet-7675/css/_welcome_page.scss" (24 Nov 2023, 8669 Bytes) of package /linux/misc/jitsi-meet-7675.tar.gz:
As a special service "Fossies" has tried to format the requested source page into HTML format using (guessed) Sass/SCSS source code syntax highlighting (style:
standard) with prefixed line numbers.
Alternatively you can here
view or
download the uninterpreted source code file.
See also the last
Fossies "Diffs" side-by-side code changes report for "_welcome_page.scss":
7658_vs_7665.
1 body.welcome-page {
2 background: inherit;
3 overflow: auto;
4 }
5
6 .welcome {
7 background-image: $welcomePageBackground;
8 background-color: #fff;
9 display: flex;
10 flex-direction: column;
11 font-family: $welcomePageFontFamily;
12 justify-content: space-between;
13 min-height: 100dvh;
14 position: relative;
15
16 .header {
17 background-image: $welcomePageHeaderBackground;
18 background-position: $welcomePageHeaderBackgroundPosition;
19 background-repeat: $welcomePageHeaderBackgroundRepeat;
20 background-size: $welcomePageHeaderBackgroundSize;
21 padding-bottom: $welcomePageHeaderPaddingBottom;
22 background-color: #131519;
23 overflow: hidden;
24 position: relative;
25
26 .header-container {
27 display: $welcomePageHeaderContainerDisplay;
28 flex-direction: column;
29 margin: $welcomePageHeaderContainerMargin;
30 z-index: $zindex2;
31 align-items: center;
32 position: relative;
33 max-width: 688px;
34 }
35
36 .header-watermark-container {
37 position: absolute;
38 width: 100%;
39 height: 100%;
40 margin-top: calc(20px - #{$welcomePageHeaderContainerMarginTop});
41 }
42
43 .header-text-title {
44 color: $welcomePageTitleColor;
45 font-size: $welcomePageHeaderTextTitleFontSize;
46 font-weight: $welcomePageHeaderTextTitleFontWeight;
47 line-height: $welcomePageHeaderTextTitleLineHeight;
48 margin-bottom: $welcomePageHeaderTextTitleMarginBottom;
49 max-width: $welcomePageHeaderTitleMaxWidth;
50 opacity: $welcomePageHeaderTextTitleOpacity;
51 text-align: $welcomePageHeaderTextAlign;
52 }
53
54 .header-text-subtitle {
55 color: #fff;
56 font-size: 20px;
57 font-weight: 600;
58 line-height: 26px;
59 margin: 16px 0 32px 0;
60 text-align: $welcomePageHeaderTextAlign;
61
62 }
63
64 .not-allow-title-character-div {
65 color: #f03e3e;
66 background-color: #fff;
67 font-size: 12px;
68 font-weight: 600;
69 margin: 10px 0px 5px 0px;
70 text-align: $welcomePageHeaderTextAlign;
71 border-radius: 5px;
72 padding: 5px;
73 .not-allow-title-character-text {
74 float: right;
75 line-height: 1.9;
76 };
77 .jitsi-icon {
78 margin-right: 9px;
79 float: left;
80
81
82 svg {
83 fill:#f03e3e;
84
85 & > *:first-child {
86 fill: none !important;
87 }
88 }
89 }
90
91 }
92
93 .insecure-room-name-warning {
94 align-items: center;
95 color: rgb(215, 121, 118);
96 font-weight: 600;
97 display: flex;
98 flex-direction: row;
99 margin-top: 15px;
100 max-width: 480px;
101 width: $welcomePageEnterRoomWidth;
102
103 .jitsi-icon {
104 margin-right: 15px;
105
106 svg {
107 fill: rgb(215, 121, 118);
108
109 & > *:first-child {
110 fill: none !important;
111 }
112 }
113 }
114 }
115
116 ::placeholder {
117 color: #253858;
118 }
119
120 #enter_room {
121 display: $welcomePageEnterRoomDisplay;
122 align-items: center;
123 max-width: 480px;
124 width: $welcomePageEnterRoomWidth;
125 z-index: $zindex2;
126 height: fit-content;
127
128 .join-meeting-container {
129 margin: $welcomePageEnterRoomMargin;
130 padding: $welcomePageEnterRoomPadding;
131 border-radius: 4px;
132 background-color: #fff;
133 display: flex;
134 width: 100%;
135 text-align: left;
136 color: #253858;
137 }
138
139 .enter-room-input-container {
140 flex-grow: 1;
141 padding-right: 4px;
142
143 .enter-room-input {
144 border-radius: 4px;
145 border: 0;
146 background: #fff;
147 display: inline-block;
148 height: 50px;
149 width: 100%;
150 font-size: 14px;
151 padding-left: 10px;
152
153 &.focus-visible {
154 outline: auto 2px #005fcc;
155 }
156 }
157 }
158
159 }
160
161 #moderated-meetings {
162 max-width: calc(100% - 40px);
163 padding: 16px 0 0;
164 width: $welcomePageEnterRoomWidth;
165 text-align: center;
166
167 a {
168 color: inherit;
169 font-weight: 600;
170 }
171 }
172 }
173
174 .tab-container {
175 font-size: 16px;
176 position: relative;
177 text-align: left;
178 display: $welcomePageTabContainerDisplay;
179 flex-direction: column;
180
181 .tab-content{
182 display: $welcomePageTabContentDisplay;
183 height: 250px;
184 margin: 5px 0px;
185 overflow: hidden;
186 flex-grow: 1;
187 position: relative;
188 }
189
190 .tab-buttons {
191 background-color: #c7ddff;
192 border-radius: 6px;
193 color: #0163FF;
194 font-size: 14px;
195 line-height: 18px;
196 margin: 4px;
197 display: $welcomePageTabButtonsDisplay;
198
199 [role="tab"] {
200 background-color: #c7ddff;
201 border-radius: 7px;
202 cursor: pointer;
203 display: $welcomePageTabDisplay;
204 flex-grow: 1;
205 margin: 2px;
206 padding: 7px 0;
207 text-align: center;
208 color: inherit;
209 border: 0;
210
211 &[aria-selected="true"] {
212 background-color: #FFF;
213 }
214 }
215
216 }
217 }
218
219 .welcome-page-button {
220 border: 0;
221 font-size: 14px;
222 background: #0074E0;
223 border-radius: 3px;
224 color: #FFFFFF;
225 cursor: pointer;
226 padding: 16px 20px;
227
228 &:focus-within {
229 outline: auto 2px #022e61;
230 }
231 }
232
233 .welcome-page-settings {
234 background: rgba(255, 255, 255, 0.38);
235 border-radius: 3px;
236 color: $welcomePageDescriptionColor;
237 padding: 4px;
238 position: absolute;
239 top: calc(35px - #{$welcomePageHeaderContainerMarginTop});
240 right: 0;
241 z-index: $zindex2;
242
243 * {
244 cursor: pointer;
245 font-size: 32px;
246 }
247
248 .toolbox-icon {
249 height: 24px;
250 width: 24px;
251 }
252 }
253
254 .welcome-watermark {
255 position: absolute;
256 width: 100%;
257 height: 100%;
258
259 .watermark.leftwatermark {
260 width: $welcomePageWatermarkWidth;
261 height: $welcomePageWatermarkHeight;
262 }
263 }
264
265 &.without-content {
266 .welcome-card {
267 min-width: 500px;
268 max-width: 580px;
269 }
270 }
271
272 &.without-footer {
273 justify-content: start;
274 }
275
276 .welcome-cards-container {
277 color:#131519;
278 padding-top: 40px;
279 }
280
281 .welcome-card-column {
282 display: flex;
283 justify-content: center;
284 flex-direction: column;
285 align-items: center;
286 max-width: 688px;
287 margin: auto;
288
289 > div {
290 margin-bottom: 16px;
291 }
292 }
293
294 .welcome-card-text {
295 padding: 32px;
296 }
297
298 .welcome-card {
299 width: 100%;
300 border-radius: 8px;
301
302 &--dark {
303 background: #444447;
304 color: #fff;
305 }
306
307 &--blue {
308 background: #D5E5FF;
309 }
310
311 &--grey {
312 background: #F2F3F4;
313 }
314 }
315
316 .welcome-footer {
317 background: #131519;
318 color: #fff;
319 margin-top: 40px;
320 position: relative;
321 }
322
323 .welcome-footer-centered {
324 max-width: 688px;
325 margin: 0 auto;
326 }
327
328 .welcome-footer-padded {
329 padding: 0px 16px;
330 }
331
332 .welcome-footer-row-block {
333 display: flex;
334 justify-content: space-between;
335 align-items: center;
336 border-bottom: 1px solid #424447;
337
338 &:last-child {
339 border-bottom: none;
340 }
341 }
342
343 .welcome-footer--row-1 {
344 padding: 40px 0 24px 0;
345 }
346
347 .welcome-footer-row-1-text {
348 max-width: 200px;
349 margin-right: 16px;
350 }
351 }