GithubMirrors/cardconjurer
1
0
Fork 1
mirror of https://github.com/Investigamer/cardconjurer.git synced 2025-07-26 21:04:58 -05:00
Code Issues Actions Packages Projects Releases Wiki Activity

restyle

Browse Source
This commit is contained in:
Kyle
2020-07-25 10:28:40 -07:00
parent 8e13889803
commit 35c525b764
9 changed files with 19 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
data/scripts/footer.js
View File

@@ -13,10 +13,10 @@ document.getElementById('footer').innerHTML = `
<hr>
<div>
<select id='inputColorPalette' onchange='loadScript("/data/scripts/palettes/" + this.value + ".js")'>
<option disabled>Bare Bones</option>
<option disabled>Grayscale</option>
<option value='lightMode'>Light Mode</option>
<option value='darkMode'>Dark Mode</option>
<option disabled>Lowpoly</option>
<option disabled>Colored</option>
<option value='lowpolyRed'>Red</option>
<option value='lowpolyGreen' selected='selected'>Green</option>
<option value='lowpolyBlue'>Blue</option>

7
data/scripts/palettes/darkMode.js
View File

@@ -1,7 +1,6 @@
var currentPalette = 'darkMode'
rootStyles.setProperty('--site-background', '#3a3838')
rootStyles.setProperty('--site-background-filter', 'none')
rootStyles.setProperty('--layer-background', '#242424')
rootStyles.setProperty('--site-background', '#3a3838 url("/data/images/site/backgrounds/lowpolyDarkGreen.svg") left/cover no-repeat fixed')
rootStyles.setProperty('--site-background-filter', 'grayscale(100) hue-rotate(0deg)')
rootStyles.setProperty('--layer-background', '#242424 url("/data/images/site/backgrounds/lowpolyDarkGray.svg") left/cover no-repeat fixed')
rootStyles.setProperty('--layer-background-selected', '#1d1d1d')
rootStyles.setProperty('--interactable-unselected', '#666666')
rootStyles.setProperty('--interactable-selected', '#99ee99')

4
data/scripts/palettes/dayRave.js
View File

@@ -1,5 +1,5 @@
rootStyles.setProperty('--site-background', '#f5f5f5 url("/data/images/site/backgrounds/lowpolyLightGreen.svg") left/cover no-repeat fixed')
rootStyles.setProperty('--site-background-filter', 'none')
rootStyles.setProperty('--site-background-filter', 'grayscale(0) hue-rotate(0deg)')
rootStyles.setProperty('--layer-background', '#e4e4e4 url("/data/images/site/backgrounds/lowpolyLightGray.svg") left/cover no-repeat fixed')
rootStyles.setProperty('--layer-background-selected', '#cccccc')
rootStyles.setProperty('--interactable-unselected', '#aaaaaa')
@@ -27,7 +27,7 @@ var colorCycle = setInterval(shiftHue, 200)
var currentHueRotation = 0
function shiftHue() {
rootStyles.setProperty('--site-background-filter', 'hue-rotate(' + currentHueRotation + 'deg)')
rootStyles.setProperty('--site-background-filter', 'grayscale(0) hue-rotate(' + currentHueRotation + 'deg)')
currentHueRotation += 1
if (currentHueRotation == 360) {
currentHueRotation = 0

7
data/scripts/palettes/lightMode.js
View File

@@ -1,7 +1,6 @@
var currentPalette = 'lightMode'
rootStyles.setProperty('--site-background', '#f5f5f5')
rootStyles.setProperty('--site-background-filter', 'none')
rootStyles.setProperty('--layer-background', '#e4e4e4')
rootStyles.setProperty('--site-background', '#f5f5f5 url("/data/images/site/backgrounds/lowpolyLightGreen.svg") left/cover no-repeat fixed')
rootStyles.setProperty('--site-background-filter', 'grayscale(100) hue-rotate(0deg)')
rootStyles.setProperty('--layer-background', '#e4e4e4 url("/data/images/site/backgrounds/lowpolyLightGray.svg") left/cover no-repeat fixed')
rootStyles.setProperty('--layer-background-selected', '#cccccc')
rootStyles.setProperty('--interactable-unselected', '#aaaaaa')
rootStyles.setProperty('--interactable-selected', '#00aa00')

5
data/scripts/palettes/lowpolyBlue.js
View File

@@ -1,6 +1,5 @@
var currentPalette = 'lowpolyBlue'
rootStyles.setProperty('--site-background', '#3a3838 url("/data/images/site/backgrounds/lowpolyDarkBlue.svg") left/cover no-repeat fixed')
rootStyles.setProperty('--site-background-filter', 'none')
rootStyles.setProperty('--site-background', '#3a3838 url("/data/images/site/backgrounds/lowpolyDarkGreen.svg") left/cover no-repeat fixed')
rootStyles.setProperty('--site-background-filter', 'grayscale(0) hue-rotate(90deg)')
rootStyles.setProperty('--layer-background', '#242424 url("/data/images/site/backgrounds/lowpolyDarkGray.svg") left/cover no-repeat fixed')
rootStyles.setProperty('--layer-background-selected', '#1d1d1d')
rootStyles.setProperty('--interactable-unselected', '#666666')

3
data/scripts/palettes/lowpolyGreen.js
View File

@@ -1,6 +1,5 @@
var currentPalette = 'lowpolyGreen'
rootStyles.setProperty('--site-background', '#3a3838 url("/data/images/site/backgrounds/lowpolyDarkGreen.svg") left/cover no-repeat fixed')
rootStyles.setProperty('--site-background-filter', 'none')
rootStyles.setProperty('--site-background-filter', 'grayscale(0) hue-rotate(0deg)')
rootStyles.setProperty('--layer-background', '#242424 url("/data/images/site/backgrounds/lowpolyDarkGray.svg") left/cover no-repeat fixed')
rootStyles.setProperty('--layer-background-selected', '#1d1d1d')
rootStyles.setProperty('--interactable-unselected', '#666666')

5
data/scripts/palettes/lowpolyRed.js
View File

@@ -1,6 +1,5 @@
var currentPalette = 'lowpolyRed'
rootStyles.setProperty('--site-background', '#3a3838 url("/data/images/site/backgrounds/lowpolyDarkRed.svg") left/cover no-repeat fixed')
rootStyles.setProperty('--site-background-filter', 'none')
rootStyles.setProperty('--site-background', '#3a3838 url("/data/images/site/backgrounds/lowpolyDarkGreen.svg") left/cover no-repeat fixed')
rootStyles.setProperty('--site-background-filter', 'grayscale(0) hue-rotate(245deg)')
rootStyles.setProperty('--layer-background', '#242424 url("/data/images/site/backgrounds/lowpolyDarkGray.svg") left/cover no-repeat fixed')
rootStyles.setProperty('--layer-background-selected', '#1d1d1d')
rootStyles.setProperty('--interactable-unselected', '#666666')

4
data/scripts/palettes/nightRave.js
View File

@@ -1,5 +1,5 @@
rootStyles.setProperty('--site-background', '#3a3838 url("/data/images/site/backgrounds/lowpolyDarkGreen.svg") left/cover no-repeat fixed')
rootStyles.setProperty('--site-background-filter', 'none')
rootStyles.setProperty('--site-background-filter', 'grayscale(0) hue-rotate(0deg)')
rootStyles.setProperty('--layer-background', '#242424 url("/data/images/site/backgrounds/lowpolyDarkGray.svg") left/cover no-repeat fixed')
rootStyles.setProperty('--layer-background-selected', '#1d1d1d')
rootStyles.setProperty('--interactable-unselected', '#666666')
@@ -27,7 +27,7 @@ var colorCycle = setInterval(shiftHue, 200)
var currentHueRotation = 0
function shiftHue() {
rootStyles.setProperty('--site-background-filter', 'hue-rotate(' + currentHueRotation + 'deg)')
rootStyles.setProperty('--site-background-filter', 'grayscale(0) hue-rotate(' + currentHueRotation + 'deg)')
currentHueRotation += 1
if (currentHueRotation == 360) {
currentHueRotation = 0

3
data/styles/main.css
View File

@@ -69,6 +69,7 @@ html::before {
height: 100%;
background: var(--site-background);
filter: var(--site-background-filter);
transition: 2s;
z-index: -1;
}
html, body {
@@ -78,7 +79,7 @@ html, body {
overflow-x: hidden;
}
body {
background: var(--body-background);
/*background: var(--body-background);*/
}
a {
font: inherit;