diff --git a/index.html b/index.html
index c8e84eb..22ea288 100644
--- a/index.html
+++ b/index.html
@@ -23,7 +23,8 @@
-
Bored guy who likes to make random stuff.
+
Bored guy who likes to make random stuff.
+
(not for hire btw)
@@ -34,6 +35,9 @@
GitHub
+
+ Contact
+
diff --git a/script.js b/script.js
index 39d2e7c..b0e1bfe 100644
--- a/script.js
+++ b/script.js
@@ -91,6 +91,9 @@ document.addEventListener('DOMContentLoaded', function() {
// Add keyboard interactions
addKeyboardInteractions();
+
+ // Start automatic glitch mode: initial after 0.1s, then 1s every 20s
+ startAutoGlitch();
});
// Show specific content section
@@ -606,6 +609,30 @@ function activateBrandEasterEgg() {
showNotification('⚡ Glitch Mode Activated!');
}
+// Auto Glitch Mode
+function triggerGlitch(durationMs = 1000) {
+ const brandName = document.querySelector('.brand-name');
+ if (!brandName) return;
+ const originalText = brandName.textContent;
+ const glitchTexts = ['Z4n3D3v', 'Z@n3D3v', 'ZaneDev', 'ZANE_DEV', 'zanedev'];
+ let glitchIndex = 0;
+ const glitchInterval = setInterval(() => {
+ brandName.textContent = glitchTexts[glitchIndex];
+ glitchIndex = (glitchIndex + 1) % glitchTexts.length;
+ }, 100);
+ setTimeout(() => {
+ clearInterval(glitchInterval);
+ brandName.textContent = originalText;
+ }, durationMs);
+}
+
+function startAutoGlitch() {
+ // Initial trigger after 0.1s
+ setTimeout(() => triggerGlitch(1000), 100);
+ // Repeat every 20s
+ setInterval(() => triggerGlitch(1000), 20000);
+}
+
// Sound Effects
function addSoundEffects() {
const buttons = document.querySelectorAll('.nav-button');
diff --git a/styles.css b/styles.css
index 796d769..19f8305 100644
--- a/styles.css
+++ b/styles.css
@@ -164,15 +164,29 @@ body::after {
height: 100%;
object-fit: cover;
border-radius: 50%;
- animation: slowSpin 60s linear infinite;
+ animation: sway 45s ease-in-out infinite, pulseSlow 6s ease-in-out infinite;
}
-@keyframes slowSpin {
- from {
- transform: rotate(0deg);
+@keyframes sway {
+ 0% {
+ transform: rotate(-10deg);
}
- to {
- transform: rotate(360deg);
+ 50% {
+ transform: rotate(10deg);
+ }
+ 100% {
+ transform: rotate(-10deg);
+ }
+}
+
+@keyframes pulseSlow {
+ 0%, 100% {
+ transform: scale(1);
+ filter: drop-shadow(0 0 0 rgba(0, 122, 204, 0));
+ }
+ 50% {
+ transform: scale(1.05);
+ filter: drop-shadow(0 0 12px rgba(0, 122, 204, 0.25));
}
}
@@ -279,6 +293,20 @@ body::after {
font-weight: 400;
}
+.not-for-hire-note {
+ margin-top: 0.5rem;
+ font-size: 0.9rem;
+ color: rgba(128, 128, 128, 0.5);
+ opacity: 0;
+ animation: fadeInOpacity 0.3s ease forwards;
+ animation-delay: 10s;
+}
+
+@keyframes fadeInOpacity {
+ from { opacity: 0; }
+ to { opacity: 1; }
+}
+
/* Navigation */
.navigation {