create board theme switcher

toggles between light and dark mode
This commit is contained in:
Dylan
2020-02-04 10:58:15 -05:00
parent 4a8037e16b
commit 05bcb375f0
2 changed files with 45 additions and 4 deletions

View File

@@ -160,7 +160,7 @@ body.crowded .board {
right: 0;
height: 20px;
padding: 5px 6px 7px 30px;
background: linear-gradient(to right, #EAEDF000, #EAEDF0 10px);
background: #eaedf0;
font-size: 11px;
line-height: 20px;
}
@@ -195,7 +195,7 @@ body.crowded .board {
}
.board>.head {
background: #EAEDF0;
background: #eaedf0;
padding: 5px;
margin: 0 0 10px;
border-radius: 2px;
@@ -230,7 +230,7 @@ body.crowded .board {
vertical-align: top;
width: 250px;
margin: 0 5px 10px;
background: linear-gradient(#EAEDF0 30px, #DDE1E5 90px);
background: #eaedf0;
border-radius: 2px;
}

View File

@@ -1640,7 +1640,48 @@
//Toggle board theme
$('.theme-swap').click(function() {
var $body = $('body');
var $head = $('.head');
var $config = $('.config');
var $config_items = $('.config a');
var $list = $('.list');
var $menu = $('.menu');
var $menu_items = $('.menu a');
var $note = $('.note');
var $note_raw = $('.note.raw');
var $textarea = $('textarea');
var $input = $('input');
var $teaser = $('.teaser');
if ($body.css('background-color') === 'rgb(248, 249, 251)') {
$body.css({'background-color': '#252525', 'color': '#ddd'});
$head.css('background-color', '#454545');
$config.css('background-color', '#454545');
$list.css('background-color', '#454545');
$menu.css('background-color', '#454545');
$note.css({'background-color': '#656565', 'box-shadow': '0 1px 2px #656565, 0 0 1px #959595'});
$note_raw.css({'background-color': '#454545', 'box-shadow': '0 1px 2px #454545, 0 0 1px #656565'});
$textarea.css('background-color', '#959595');
$input.css('background-color', '#959595');
$teaser.css('color', '#ddd');
$menu_items.css('color', '#ddd');
$config_items.css('color', '#ddd');
} else {
$body.css({'background-color': '#f8f9fb', 'color': '#000'});
$head.css('background-color', '#eaedf0');
$config.css('background-color', '#f8f9fb');
$list.css('background-color', '#eaedf0');
$menu.css('background-color', '#eaedf0');
$note.css({'background-color': '#fff', 'box-shadow': '0 1px 2px #bbb, 0 0 1px #ddd'});
$note_raw.css({'background-color': '#eaedf0', 'box-shadow': '0 1px 2px #bbb, 0 0 1px #ddd'});
$textarea.css('background-color', '#fff');
$input.css('background-color', '#fff');
$teaser.css('color', '#000');
$menu_items.css('color', '#000');
$config_items.css('color', '#000');
}
});
//