i

i1li · Nov 27, 2024 · 4af0814 · 4af0814
1 parent f272cc2
commit 4af0814
Show file tree

Hide file tree

Showing 8 changed files with 19 additions and 22 deletions.
diff --git a/dist/bundle-5c14d.css b/dist/bundle-5c14d.css
diff --git a/dist/bundle-5c14d.js b/dist/bundle-5c14d.js
diff --git a/dist/bundle-91f7a.css b/dist/bundle-91f7a.css
diff --git a/dist/bundle-91f7a.js b/dist/bundle-91f7a.js
diff --git a/dist/index.html b/dist/index.html
diff --git a/src/css/style.css b/src/css/style.css
@@ -41,10 +41,10 @@ header {position: sticky;
     transition: all .2s ease-in-out;
     z-index: 2;}
 #site-title {display: flex; align-items: center; position:absolute; left: 5%;} .scrolled-down #site-title {left: 1%; margin-top: -.25em;}
-#site-title-text:hover {opacity:.9;}
-#site-title-text {opacity:.6;}
+#site-title-text:hover {opacity:.77;}
+#site-title-text {opacity:.55;}
 .img-header {height: 4rem; transition: all 1s ease;
-filter: drop-shadow(0 0 1rem rgba(127, 127, 127, 0.85));}
+filter: drop-shadow(0 0 1rem rgba(127, 127, 127, 0.75));}
 .img-header:hover {filter: invert(100%) !important; transition: all .5s ease-in-out; scale:1.07;}
 .no-bg {background: none !important;border: none !important;}
 #site-intro {text-align: center;

diff --git a/src/js/background.js b/src/js/background.js
@@ -119,18 +119,15 @@ function updateLayerState(state, element, deltaTime) {
   const { currentLayer } = getShiftLayerInfo(element);
   if (currentLayer === 1) {
     state.currentGradientSteps += Math.round((state.targetGradientSteps - state.currentGradientSteps) * (t() * 0.00005) * Math.random() * 10) / 10;
+    state.currentHueShift += Math.round((state.targetHueShift - state.currentHueShift) * (t() * 0.05) * Math.random() * 10) / 10;
   } else {
     state.currentGradientSteps += Math.round((state.targetGradientSteps - state.currentGradientSteps) * (t() * 0.05) * Math.random() * 10) / 10;
+    state.currentHueShift += Math.round((state.targetHueShift - state.currentHueShift) * (t() * 0.01) * Math.random() * 10) / 10;
   }
-  if (currentLayer === 1) {
-    state.currentHueShift += Math.round((state.targetGradientSteps - state.currentHueShift) * (t() * 0.2) * Math.random() * 10) / 10;
-  } else {
-    state.currentHueShift += Math.round((state.targetGradientSteps - state.currentHueShift) * (t() * 0.0005) * Math.random() * 10) / 10;
-  }
-  state.currentContrast += Math.round((state.targetContrast - state.currentContrast) * t() * 10) / 10;
-  state.currentBrightness += Math.round((state.targetBrightness - state.currentBrightness) * t() * 10) / 10;
-  state.currentSaturation += Math.round((state.targetSaturation - state.currentSaturation) * t() * 10) / 10;
-  state.currentOpacity += Math.round((state.targetOpacity - state.currentOpacity) * t() * 10) / 10;
+  state.currentContrast += Math.round((state.targetContrast - state.currentContrast) * (t() * Math.random()) * 10) / 10;
+  state.currentBrightness += Math.round((state.targetBrightness - state.currentBrightness) * (t() * Math.random()) * 10) / 10;
+  state.currentSaturation += Math.round((state.targetSaturation - state.currentSaturation) * (t() * Math.random()) * 10) / 10;
+  state.currentOpacity += Math.round((state.targetOpacity - state.currentOpacity) * (t() * Math.random()) * 10) / 10;
   if (state.transitionCurrentTime >= state.transitionDuration) {
     state.transitionCurrentTime = 0;
     state.transitionProgress = 0;

diff --git a/src/js/color-change.js b/src/js/color-change.js
@@ -42,7 +42,7 @@ function startShift(element, interval, isHover = false) {
     if (isWindowActive && isElementInViewport(element)) {
       const deltaTime = time - lastTime;
       lastTime = time;
-      progress += (deltaTime / interval) * Math.random();
+      progress += (deltaTime / interval) * (Math.random() * .55);
       if (progress >= 1) {
         targetDegree = getRandomDegree();
         targetSaturation = Math.random() * (125 - 90) + 90;
@@ -51,10 +51,10 @@ function startShift(element, interval, isHover = false) {
         progress = 0;
       }
       const t = () => metaRecursiveEaseNoise(progress);
-      currentDegree += Math.round((targetDegree - currentDegree) * t() * (Math.random() * .15)) / 10;
-      currentSaturation += Math.round((targetSaturation - currentSaturation) * t() * 10) / 10;
-      currentContrast += Math.round((targetContrast - currentContrast) * t() * 10) / 10;
-      currentBrightness += Math.round((targetBrightness - currentBrightness) * t() * 10) / 10;
+      currentDegree += Math.round((targetDegree - currentDegree) * t() * (Math.random() * .015)) / 10;
+      currentSaturation += Math.round((targetSaturation - currentSaturation) * t() * (Math.random() * .15)) / 10;
+      currentContrast += Math.round((targetContrast - currentContrast) * t() * (Math.random() * .15)) / 10;
+      currentBrightness += Math.round((targetBrightness - currentBrightness) * t() * (Math.random() * .15)) / 10;
       updateFilter();
     }
     if (isRunning) {