191 lines
4 KiB
CSS
191 lines
4 KiB
CSS
/*Canopy - The next generation of stoner streaming software
|
|
Copyright (C) 2024 Rainbownapkin and the TTN Community
|
|
|
|
This program is free software: you can redistribute it and/or modify
|
|
it under the terms of the GNU Affero General Public License as
|
|
published by the Free Software Foundation, either version 3 of the
|
|
License, or (at your option) any later version.
|
|
|
|
This program is distributed in the hope that it will be useful,
|
|
but WITHOUT ANY WARRANTY; without even the implied warranty of
|
|
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
|
GNU Affero General Public License for more details.
|
|
|
|
You should have received a copy of the GNU Affero General Public License
|
|
along with this program. If not, see <https://www.gnu.org/licenses/>.*/
|
|
|
|
:root{
|
|
--main-font: "open-sans", sans-serif;
|
|
--bg0: rgb(158, 158, 158);
|
|
--bg1: rgb(70, 70, 70);
|
|
--bg2: rgb(220, 220, 220);
|
|
--bg1-alt0: rgb(30, 30, 30);
|
|
--bg2-alt0: rgb(200, 200, 200);
|
|
--bg2-alt1: rgb(180, 180, 180);
|
|
|
|
--accent0: rgb(48, 47, 47);
|
|
--accent0-alt0: rgb(34, 34, 34);
|
|
--accent0-warning: firebrick;
|
|
--accent1: rgb(245, 245, 245);
|
|
--accent1-alt0: rgb(185, 185, 185);
|
|
--accent2: var(--accent0-alt0);
|
|
|
|
|
|
--userlist-color0:rgb(122, 199, 135);
|
|
--userlist-color1:rgb(242, 104, 77);
|
|
--userlist-color2:rgb(77, 150, 239);
|
|
--userlist-color3:rgb(247, 241, 212);
|
|
--userlist-color4:rgb(255, 173, 173);
|
|
--userlist-color5:rgb(254, 151, 82);
|
|
--userlist-color6:rgb(209, 167, 246);
|
|
}
|
|
|
|
body{
|
|
background-color: var(--bg0);
|
|
font-family: var(--main-font);
|
|
color: var(--accent0);
|
|
}
|
|
|
|
a{
|
|
text-decoration: none;
|
|
color: var(--accent0);
|
|
}
|
|
|
|
a:hover{
|
|
color: var(--accent0-alt0);
|
|
}
|
|
|
|
#navbar{
|
|
background-color: var(--bg1);
|
|
}
|
|
|
|
.navbar-item{
|
|
color: var(--accent1);
|
|
border: hidden;
|
|
}
|
|
|
|
a:hover.navbar-item{
|
|
color: var(--accent1-alt0);
|
|
}
|
|
|
|
.navbar-item input{
|
|
background-color: var(--bg1-alt0);
|
|
}
|
|
|
|
.channel-guide-entry{
|
|
background-color: var(--bg1);
|
|
color: var(--accent1);
|
|
}
|
|
|
|
div.channel-guide-entry{
|
|
border-radius: 0.3em;
|
|
box-shadow: 0.2em 0.2em 0.1em var(--bg1-alt0) inset;
|
|
}
|
|
|
|
a.channel-guide-entry-item{
|
|
color: var(--accent1);
|
|
}
|
|
|
|
a:hover.channel-guide-entry-item{
|
|
color: var(--accent1-alt0);
|
|
}
|
|
|
|
span.channel-guide-entry-item{
|
|
background-color: var(--bg1-alt0);
|
|
box-shadow: 0.2em 0.2em 0.1em black inset;
|
|
border-radius: 0.3em;
|
|
margin: 0 0.1em 0 0.1em;
|
|
}
|
|
|
|
|
|
p.channel-guide-entry-item{
|
|
background-color: var(--bg1-alt0);
|
|
}
|
|
|
|
a#account-settings-delete-link{
|
|
color: var(--accent0-warning);
|
|
}
|
|
|
|
#channel-delete{
|
|
color: var(--accent0-warning);
|
|
}
|
|
|
|
#admin-channel-list-table{
|
|
background-color: var(--bg1);
|
|
color: var(--accent1);
|
|
}
|
|
|
|
tr.admin-channel-list-entry{
|
|
box-shadow: var(--accent1) 0px 1em 1px -1em, var(--accent1) 0px -1em 1px -1em;
|
|
}
|
|
|
|
td.admin-channel-list-entry-name-row{
|
|
box-shadow: var(--accent1) 1em 0px 1px -1em, var(--accent1) -1em 0px 1px -1em;
|
|
}
|
|
|
|
a.admin-channel-list-entry-item{
|
|
color: var(--accent1);
|
|
}
|
|
|
|
a:hover.admin-channel-list-entry-item{
|
|
color: var(--accent1-alt0);
|
|
}
|
|
|
|
#media-panel-div{
|
|
background-color: black;
|
|
}
|
|
|
|
#chat-panel-buffer-div{
|
|
background-color: var(--bg2);
|
|
}
|
|
|
|
.chat-entry{
|
|
display: flex;
|
|
background-color: var(--bg2);
|
|
border-bottom: 1px solid var(--bg2-alt1);
|
|
font-size: 0.8em;
|
|
}
|
|
|
|
.chat-entry-username{
|
|
margin: 0.2em;
|
|
}
|
|
|
|
.chat-entry-body{
|
|
margin: 0.2em;
|
|
}
|
|
|
|
.userlist-color0{/*green0*/
|
|
color: var(--userlist-color0);
|
|
text-shadow: none;
|
|
}
|
|
|
|
.userlist-color1{/*red0*/
|
|
color: var(--userlist-color1);
|
|
text-shadow: none;
|
|
}
|
|
|
|
.userlist-color2{/*blue0*/
|
|
color: var(--userlist-color2);
|
|
text-shadow: none;
|
|
}
|
|
|
|
.userlist-color3{/*tan0*/
|
|
color: var(--userlist-color3);
|
|
text-shadow: none;
|
|
}
|
|
|
|
.userlist-color4{/*pink0*/
|
|
color: var(--userlist-color4);
|
|
text-shadow: none;
|
|
}
|
|
|
|
.userlist-color5{/*orange*/
|
|
color: var(--userlist-color5);
|
|
text-shadow: none;
|
|
}
|
|
|
|
.userlist-color6{/*violet*/
|
|
color: var(--userlist-color6);
|
|
text-shadow: none;
|
|
}
|