Merge pull request #1041 from lindenkron/Fix-Darkmode-Globally

Lot of style changes.
This commit is contained in:
Steve Seguin 2023-04-10 20:13:55 -04:00 committed by GitHub
commit 854698084d
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 63 additions and 41 deletions

View File

@ -350,7 +350,7 @@
<span data-translate="enter-the-rooms-control">Enter the room's Control Center in the director's role</span>
</button>
<br />
<button class="white roomnotes" style="display: block;" onclick="toggle(document.getElementById('roomnotes'),this);">
<button class="roomnotes" style="display: block;" onclick="toggle(document.getElementById('roomnotes'),this);">
<span data-translate="show-tips">Show me some tips..</span>
</button>
@ -621,7 +621,7 @@
<div id="headphonesDiv2">
<i class="las la-headphones"></i>
<span data-translate="select-output-source"> Audio Output Destination: <button onclick="playtone(true)" class="white" style="padding:3px 5px 2px 5px; margin:0; margin-left:15px; position: relative; " type="button">Test</button></span>
<select id="outputSourceScreenshare" style="background-color: #FFF; margin-top:5px; padding:10px 5px; width:100%; display:inline-block; vertical-align: middle;" onclick="requestOutputAudioStream();">
<select id="outputSourceScreenshare" onclick="requestOutputAudioStream();">
<option value="default">
Default Device
</option>

100
main.css
View File

@ -1688,6 +1688,8 @@ select{
vertical-align: middle;
font-size: 100%;
max-width: 260px;
border: solid 1px #AAA;
border-radius: 4px;
}
#effectSelector3{
background-color: #FFF;
@ -1697,6 +1699,8 @@ select{
font-size: 93%;
max-width: 100%;
width: 90%;
border: solid 1px #AAA;
border-radius: 4px;
}
/*https://css-tricks.com/styling-cross-browser-compatible-range-inputs-css/*/
@ -2004,6 +2008,8 @@ input[type=range]:focus::-ms-fill-upper {
overflow: auto;
padding: 5px;
resize: both;
border: solid 1px #AAA;
border-radius: 4px;
}
@ -2981,6 +2987,8 @@ button.toggleSettings{
vertical-align: middle;
font-size: 100%;
max-width: 260px;
border: solid 1px #AAA;
border-radius: 4px;
}
#gear_webcam{
cursor: pointer;
@ -3075,6 +3083,8 @@ button.toggleSettings{
padding: 4px;
font-size: 93%;
max-width: 100%;
border: solid 1px #AAA;
border-radius: 4px;
}
#outputSource3 {
display: inline-block;
@ -3099,6 +3109,16 @@ button.toggleSettings{
vertical-align: middle;
}
#outputSourceScreenshare {
margin-top: 5px;
padding: 10px 5px;
width: 100%;
display: inline-block;
vertical-align: middle;
border-radius: 4px;
border: solid 1px #AAA;
}
.videoMenu {
background-color: #f3f3f3;
width: 450px;
@ -3151,11 +3171,10 @@ div.multiselect {
margin: 0;
font-size: 80%;
padding: 3px 5px 1px;
border-top: 0;
border-bottom-left-radius: 4px;
border-bottom-right-radius: 4px;
text-align: left;
background-color: white;
border: solid 1px #AAA;
border-radius: 4px;
}
.multiselect .multiselect-contents li {
list-style: none;
@ -4196,7 +4215,7 @@ div.message-card a {
background: #e6e8f0;
}
.darktheme #guestTips {
background-color: #414141;
background-color: var(--discord-grey-7);
}
.darktheme #guestTips .las {
color: #FFF;
@ -4910,15 +4929,18 @@ body.darktheme form>label{
}
body.darktheme .container-inner{
background-color: #40444E
background-color: var(--discord-grey-3);
}
body.darktheme .card{
background-color: #40444E
background-color: var(--discord-grey-3);
}
body.darktheme input{
background-color: var(--discord-grey-7);
color: var(--discord-text);
}
body.darktheme input::placeholder {
color: var(--discord-) !important;
}
body.darktheme .column>h2{
color: #b6b6b6;
}
@ -4929,8 +4951,8 @@ body.darktheme .directorsgrid .vidcon > .las {
background-color: #424242;
}
body.darktheme .form-group .multiselect {
background-color: #414141;
padding: 10px; background-color:#f3f3f3;
background-color: var(--discord-grey-7);
padding: 10px;
}
body.darktheme h2 {
color: #DDD;
@ -4939,25 +4961,25 @@ body.darktheme button {
/* filter: brightness(0.70); */
}
body.darktheme .column .las {
color: black;
color: var(--discord-text);
}
body.darktheme label {
filter: brightness(0.85);
color: var(--discord-text);
}
body.darktheme #roomHeader{
filter: brightness(0.85);
color: var(--discord-text);
}
body.darktheme div.multiselect {
background-color: #414141;
background-color: var(--discord-grey-7);
}
body.darktheme .videoMenu {
background-color: #414141;
background-color: var(--discord-grey-7);
}
body.darktheme .audioMenu{
background-color: #414141;
background-color: var(--discord-grey-7);
}
body.darktheme #avatarDiv{
background-color: #414141;
background-color: var(--discord-grey-7);
}
body.darktheme .selected {
border: solid 3px #f8f7f7;
@ -4969,17 +4991,17 @@ body.darktheme .avatarLabel {
color: #f8f7f7;
}
body.darktheme #headphonesDiv{
background-color: #414141;
background-color: var(--discord-grey-7);
}
body.darktheme #headphonesDiv3{
background-color: #414141;
background-color: var(--discord-grey-7);
}
body.darktheme select{
background-color: var(--discord-grey-7);
color: var(--discord-text);
}
body.darktheme .white {
filter: brightness(0.85);
color: var(--discord-text);
}
body.darktheme .directorsgrid .vidcon {
background-color: var(--discord-grey-3);
@ -4993,13 +5015,13 @@ body.darktheme .infoblob{
color: #CCC;
}
body.darktheme #addPasswordBasic{
background-color: #414141;
background-color: var(--discord-grey-7);
}
body.darktheme #effectsDiv{
background-color: #414141;
background-color: var(--discord-grey-7);
}
body.darktheme #effectsDiv3{
background-color: #414141;
background-color: var(--discord-grey-7);
}
body.darktheme .outMessage{
background-color: #7f89a7;
@ -5017,52 +5039,52 @@ body.darktheme .popup-message{
background-color: #9b9b9b !important;
}
body.darktheme #audioScreenShare1{
background-color: #414141;
background-color: var(--discord-grey-3);
}
body.darktheme #webcamstats2{
background-color: #414141;
background-color: var(--discord-grey-3);
}
body.darktheme #audioSourceScreenshare{
background-color: #e4e4e4;
background-color: var(--discord-grey-7);
}
body.darktheme #headphonesDiv2{
background-color: #414141;
background-color: var(--discord-grey-3);
}
body.darktheme #outputSourceScreenshare{
background-color: #e4e4e4;
background-color: var(--discord-grey-7);
}
body.darktheme #audioSource{
background-color: #e4e4e4;
background-color: var(--discord-grey-3);
}
body.darktheme #outputSource{
background-color: #e4e4e4;
background-color: var(--discord-grey-3);
}
body.darktheme #videoSourceSelect{
background-color: #e4e4e4;
background-color: var(--discord-grey-3);
}
body.darktheme #videoSettings{
background-color: #414141;
background-color: var(--discord-grey-7);
}
body.darktheme #effectSelector{
background-color: #e4e4e4;
background-color: var(--discord-grey-3);
}
body.darktheme #effectSelector3{
background-color: #e4e4e4;
background-color: var(--discord-grey-3);
}
body.darktheme #audioSource3{
background-color: #e4e4e4;
background-color: var(--discord-grey-3);
}
body.darktheme #videoSource3{
background-color: #e4e4e4;
background-color: var(--discord-grey-3);
}
body.darktheme #videoMenu3{
background-color: #414141;
background-color: var(--discord-grey-7);
}
body.darktheme #outputSource3{
background-color: #e4e4e4;
background-color: var(--discord-grey-3);
}
body.darktheme #videoSettings3{
background-color: #414141;
background-color: var(--discord-grey-7);
}
body.darktheme .alertModal{
background-color: #ccc;
@ -5072,10 +5094,10 @@ body.darktheme .directorContainer{
filter: brightness(0.85);
}
body.darktheme #grabDirectorSoloLinkParent{
background-color: #414141;
background-color: var(--discord-grey-7);
}
body.darktheme #grabDirectorSoloLink{
background-color: #e4e4e4;
background-color: var(--discord-grey-3);
}
body.darktheme .cameraTip{
background-color: #27354b;