This commit is contained in:
Kyle
2019-12-17 08:46:03 -08:00
parent 503aa21bfd
commit c9c2d19cfd
2 changed files with 14 additions and 3 deletions

View File

@@ -1,5 +1,5 @@
//Cycles through a rainbow! //Cycles through a rainbow!
setInterval(changeColor, 100) setInterval(changeColor, 250)
var regularAdjust = 0//60 var regularAdjust = 0//60
var lightAdjust = 64//100 var lightAdjust = 64//100
var lightLead = 255 var lightLead = 255
@@ -9,7 +9,7 @@ function changeColor() {
document.documentElement.style.setProperty("--shifting-color-1", "rgb(" + parseInt(colors[0] + regularAdjust) + "," + parseInt(colors[1] + regularAdjust) + "," + parseInt(colors[2] + regularAdjust) + ")") document.documentElement.style.setProperty("--shifting-color-1", "rgb(" + parseInt(colors[0] + regularAdjust) + "," + parseInt(colors[1] + regularAdjust) + "," + parseInt(colors[2] + regularAdjust) + ")")
var lightColors = indexToColor(currentColorIndex + lightLead) var lightColors = indexToColor(currentColorIndex + lightLead)
document.documentElement.style.setProperty("--shifting-color-1-light", "rgb(" + parseInt(lightColors[0] + lightAdjust) + "," + parseInt(lightColors[1] + lightAdjust) + "," + parseInt(lightColors[2] + lightAdjust) + ")") document.documentElement.style.setProperty("--shifting-color-1-light", "rgb(" + parseInt(lightColors[0] + lightAdjust) + "," + parseInt(lightColors[1] + lightAdjust) + "," + parseInt(lightColors[2] + lightAdjust) + ")")
currentColorIndex += 153 / 180 //The second number is how many seconds it takes to do a full loop currentColorIndex += 2.5 * 153 / 180 //The second number is how many seconds it takes to do a full loop
} }
function indexToColor(colorIndex) { function indexToColor(colorIndex) {
var red = 0, green = 0, blue = 0 var red = 0, green = 0, blue = 0

View File

@@ -224,6 +224,18 @@ footer a:hover {
@media screen and (min-width: 750pt) { @media screen and (min-width: 750pt) {
.samples { .samples {
grid-template-columns: 33.33% 33.33% 33.33% !important; grid-template-columns: 33.33% 33.33% 33.33% !important;
margin-bottom: 2em;
}
.samples #sample1 {
width: 90%;
transform: rotate(-10deg) translate(10%, 8%);
}
.samples #sample2 {
z-index: 10;
}
.samples #sample3 {
width: 90%;
transform: rotate(10deg) translate(-10%, 8%);
} }
} }
/*These control tooltips for mobile devices vs. desktops/laptops*/ /*These control tooltips for mobile devices vs. desktops/laptops*/
@@ -469,4 +481,3 @@ input[type="checkbox"], .frameOption, .maskOption, .button {