From 3823fce7be5546b5f25ec6eedb9007d1cb28fce1 Mon Sep 17 00:00:00 2001 From: fatchan Date: Sat, 7 Sep 2019 09:52:27 +0000 Subject: [PATCH] more themes and final changes to script for now --- gulp/res/css/themes/rei-zero.css | 28 ++++++++++++++++++++++++++ gulp/res/css/themes/sushi.css | 2 +- gulp/res/js/theme.js | 34 ++++++++++++++++---------------- 3 files changed, 46 insertions(+), 18 deletions(-) create mode 100644 gulp/res/css/themes/rei-zero.css diff --git a/gulp/res/css/themes/rei-zero.css b/gulp/res/css/themes/rei-zero.css new file mode 100644 index 00000000..ca6ad92b --- /dev/null +++ b/gulp/res/css/themes/rei-zero.css @@ -0,0 +1,28 @@ +/*rei-zero*/ +:root { + --background-top: #000E1C; + --background-rest: #000E1C; + --navbar-color: #29373E; + --post-color: #29373E; + --post-outline-color: #666666; + --label-color: #29373E; + --box-border-color: #000; + --darken: #00000010; + --highlighted-post-color: #193A3A; + --highlighted-post-outline-color: #999999; + --board-title: #193A3A; + --hr: #474747; + --font-color: #D6D6D6; + --name-color: #117743; + --capcode-color: #f00; + --subject-color: #CCCCCC; + --link-color: #5C99AD; + --post-link-color: #00BfFF; + --link-hover: #eeeeee; + --input-borders: #a9a9a9; + --input-color: lightgray; + --input-background: #001229; + --dice-color: darkorange; + --title-color: #d70000; + --greentext-color: #789922; +} diff --git a/gulp/res/css/themes/sushi.css b/gulp/res/css/themes/sushi.css index c00c667f..25a2a12f 100644 --- a/gulp/res/css/themes/sushi.css +++ b/gulp/res/css/themes/sushi.css @@ -9,7 +9,7 @@ --box-border-color: #8FCCCD; --darken: #00000010; --highlighted-post-color: #a9d8ff; - --highlighted-post-outline-color: #a9d8ff; + --highlighted-post-outline-color: #8FCCCD; --board-title: #800000; --hr: #B7D9C5; --font-color: black; diff --git a/gulp/res/js/theme.js b/gulp/res/js/theme.js index 9f43ce91..59a8ca4d 100644 --- a/gulp/res/js/theme.js +++ b/gulp/res/js/theme.js @@ -8,43 +8,43 @@ function changeTheme(e) { //add theme setting to localstorage localStorage.setItem('theme', theme); //check for theme style tag - var custom = document.getElementById('customtheme'); + var tempLink = document.getElementById('customtheme'); if (theme === 'default') { - if (custom) { + if (tempLink) { //remove theme style tag if we switching to default - custom.remove(); + tempLink.remove(); } } else { //path of the theme css var path = '/css/themes/'+theme+'.css'; //get the raw css from localstorage var css = localStorage.getItem(path); - if (!custom) { + if (!tempLink) { //create the style tag if it doesnt exist - custom = document.createElement('style'); - custom.id = 'customtheme'; - document.head.appendChild(custom); + tempLink = document.createElement('style'); + document.head.appendChild(tempLink); } if (css) { //if we have the css in localstorage, set it (prevents FOUC) - custom.innerHTML = css; + tempLink.innerHTML = css; } //then createa new link rel=stylesheet, and load the css - var tempLink = document.createElement('link'); - tempLink.rel = 'stylesheet'; - tempLink.onload = function() { + var themeLink = document.createElement('link'); + themeLink.rel = 'stylesheet'; + themeLink.id = 'customtheme'; + themeLink.onload = function() { css = ''; - for(var i = 0; i < tempLink.sheet.rules.length; i++) { - css += tempLink.sheet.rules[i].cssText; + for(var i = 0; i < themeLink.sheet.rules.length; i++) { + css += themeLink.sheet.rules[i].cssText; } //update our localstorage with latest version localStorage.setItem(path, css); - custom.innerHTML = css; + tempLink.innerHTML = css; //immediately remove it since we dont need it - custom.remove(); + tempLink.remove(); } - tempLink.href = path; - document.head.appendChild(tempLink); + themeLink.href = path; + document.head.appendChild(themeLink); } }