Files
element-web/src/vector/jitsi/index.pcss
2024-09-06 15:44:31 +01:00

104 lines
2.1 KiB
Plaintext

/*
Copyright 2020-2024 New Vector Ltd.
SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only
Please see LICENSE files in the repository root for full details.
*/
/* TODO: Match the user's theme: https://github.com/element-hq/element-web/issues/12794 */
@font-face {
font-family: "Nunito";
font-style: normal;
font-weight: 400;
src: url("~matrix-react-sdk/res/fonts/Nunito/Nunito-Regular.ttf") format("truetype");
}
$dark-fg: #edf3ff;
$dark-bg: #363c43;
$light-fg: #2e2f32;
$light-bg: #fff;
body {
font-family: Nunito, Arial, Helvetica, sans-serif;
background-color: $dark-bg;
color: $dark-fg;
}
body.theme-light {
background-color: $light-bg;
color: $light-fg;
}
body,
html {
padding: 0;
margin: 0;
}
#jitsiContainer {
position: fixed;
top: 0;
bottom: 0;
left: 0;
right: 0;
}
#joinButtonContainer {
display: table;
position: absolute;
height: 100%;
width: 100%;
/* Hidden by default to avoid flashing the prejoin screen at the user when */
/* we're supposed to skip it anyways */
visibility: hidden;
}
.joinConferenceFloating {
display: table-cell;
vertical-align: middle;
}
.joinConferencePrompt {
margin-left: auto;
margin-right: auto;
width: 90%;
text-align: center;
}
#joinButton {
/* A mix of AccessibleButton styles */
cursor: pointer;
padding: 7px 18px;
text-align: center;
border-radius: 4px;
display: inline-block;
font-size: 14px;
color: #ffffff;
background-color: #03b381;
border: 0;
}
.icon {
$icon-size: 42px;
margin-top: -$icon-size; /* to visually center the form */
&::before {
content: "";
background-size: contain;
background-color: $dark-fg;
mask-repeat: no-repeat;
mask-position: center;
mask-image: url("~matrix-react-sdk/res/img/element-icons/call/video-call.svg");
mask-size: $icon-size;
display: block;
width: $icon-size;
height: $icon-size;
margin: 0 auto; /* center */
}
}
body.theme-light .icon::before {
background-color: $light-fg;
}