Small Luh Update

public/!!.html

@@ -29,7 +29,7 @@
       <script src="/assets/js/eruda.js" defer></script>
       <script src="/assets/js/register.js" defer></script>
       <script src="/assets/js/settings.js" defer></script>
-      <script src="/assets/js/greeting.js" defer></script>
+      <script src="/assets/js/greetings.js" defer></script>
       <script src="/assets/js/$.js" defer></script>
       <script src="/assets/js/a.js" defer></script>
       <div class="relative flex flex-col h-[100vh] items-center justify-center bg-black transition-bg">
@@ -55,7 +55,7 @@
             <li><a id="backIcon" href="#"><i class="fa-regular fa-arrow-left"></i></a></li>
             <li><a id="refreshIcon" href="#"><i class="fa-regular fa-rotate-right"></i></a></li>
             <li><a id="forwardIcon" href="#"><i class="fa-regular fa-arrow-right"></i></a></li>
-            <li><a href="/"><i class="fa-regular fa-home"></i></a></li>
+            <li><a id="fullscreenIcon" href="#"><i class="fa-regular fa-expand"></i></a></li>
             <li>
                <div class="small-searchbar" style="position: relative;">
                   <i id="lockIcon" class="fa-solid fa-lock"></i>
@@ -64,9 +64,9 @@
                      style="padding-left: 40px;">
                </div>
             </li>
+            <li><a href="/"><i class="fa-regular fa-home"></i></a></li>
             <li><a href="/g"><i class="fa-regular fa-gamepad"></i></a></li>
             <li><a href="/a"><i class="fa-regular fa-grid-2"></i></a></li>
-            <li><a id="fullscreenIcon" href="#"><i class="fa-regular fa-expand"></i></a></li>
             <li><a id="erudaIcon" href="#"><i class="fa-regular fa-code"></i></a></li>
          </ul>
       </div>

public/!.html

@@ -29,7 +29,7 @@
       <script src="/assets/js/eruda.js" defer></script>
       <script src="/assets/js/register.js" defer></script>
       <script src="/assets/js/settings.js" defer></script>
-      <script src="/assets/js/greeting.js" defer></script>
+      <script src="/assets/js/greetings.js" defer></script>
       <script src="/assets/js/$.js" defer></script>
       <script src="/assets/js/g.js" defer></script>
       <div class="relative flex flex-col h-[100vh] items-center justify-center bg-black transition-bg">
@@ -55,7 +55,7 @@
             <li><a id="backIcon" href="#"><i class="fa-regular fa-arrow-left"></i></a></li>
             <li><a id="refreshIcon" href="#"><i class="fa-regular fa-rotate-right"></i></a></li>
             <li><a id="forwardIcon" href="#"><i class="fa-regular fa-arrow-right"></i></a></li>
-            <li><a href="/"><i class="fa-regular fa-home"></i></a></li>
+            <li><a id="fullscreenIcon" href="#"><i class="fa-regular fa-expand"></i></a></li>
             <li>
                <div class="small-searchbar" style="position: relative;">
                   <i id="lockIcon" class="fa-solid fa-lock"></i>
@@ -64,9 +64,9 @@
                      style="padding-left: 40px;">
                </div>
             </li>
+            <li><a href="/"><i class="fa-regular fa-home"></i></a></li>
             <li><a href="/g"><i class="fa-regular fa-gamepad"></i></a></li>
             <li><a href="/a"><i class="fa-regular fa-grid-2"></i></a></li>
-            <li><a id="fullscreenIcon" href="#"><i class="fa-regular fa-expand"></i></a></li>
             <li><a id="erudaIcon" href="#"><i class="fa-regular fa-code"></i></a></li>
          </ul>
       </div>

public/$.html

@@ -29,7 +29,7 @@
       <script src="/assets/js/register.js" defer></script>
       <script src="/assets/js/settings.js" defer></script>
       <script src="/assets/js/ping.js" defer></script>
-      <script src="/assets/js/greeting.js" defer></script>
+      <script src="/assets/js/greetings.js" defer></script>
       <script src="/assets/js/$.js" defer></script>
       <div class="relative flex flex-col h-[100vh] items-center justify-center bg-white transition-bg">
          <div class="absolute inset-0 overflow-hidden">
@@ -54,7 +54,7 @@
             <li><a id="backIcon" href="#"><i class="fa-regular fa-arrow-left"></i></a></li>
             <li><a id="refreshIcon" href="#"><i class="fa-regular fa-rotate-right"></i></a></li>
             <li><a id="forwardIcon" href="#"><i class="fa-regular fa-arrow-right"></i></a></li>
-            <li><a href="/"><i class="fa-regular fa-home"></i></a></li>
+            <li><a id="fullscreenIcon" href="#"><i class="fa-regular fa-expand"></i></a></li>
             <li>
                <div class="small-searchbar" style="position: relative;">
                   <i id="lockIcon" class="fa-solid fa-lock"></i>
@@ -63,9 +63,9 @@
                      style="padding-left: 40px;">
                </div>
             </li>
+            <li><a href="/"><i class="fa-regular fa-home"></i></a></li>
             <li><a href="/g"><i class="fa-regular fa-gamepad"></i></a></li>
             <li><a href="/a"><i class="fa-regular fa-grid-2"></i></a></li>
-            <li><a id="fullscreenIcon" href="#"><i class="fa-regular fa-expand"></i></a></li>
             <li><a id="erudaIcon" href="#"><i class="fa-regular fa-code"></i></a></li>
          </ul>
       </div>

public/assets/css/$.css

@@ -427,7 +427,8 @@ body {
     top: 46%;
     left: 50%;
     transform: translate(-50%, -50%);
-    background-color: #131313a4;
+    background-color: #08080894;
+    border: 1px solid #ffffff21;
     color: #e0e0e0;
     padding: 25px 30px;
     border-radius: 20px;

public/assets/css/settings.css

@@ -4,7 +4,8 @@
     top: 47%;
     left: 50%;
     transform: translate(-50%, -50%);
-    background-color: #0a0a0ae7;
+    background-color: #08080894;
+    border: 1px solid #ffffff21;
     padding: 25px 30px;
     border-radius: 20px;
     width: 450px;
@@ -46,7 +47,7 @@
 
 #close-settings {
     position: absolute;
-    top: 20px;
+    top: 17px;
     right: 10px;
     background-color: transparent;
     border: none;

public/assets/js/greeting.js

@@ -1,112 +0,0 @@
-window.onload = function() {
-	var storedName = localStorage.getItem('userName');
-	var greetingElement = document.getElementById('greeting');
-
-	if (!storedName) {
-		document.getElementById('overlay').style.display = 'block';
-		document.getElementById('namePrompt').style.display = 'block';
-	} else if (greetingElement) {
-		updateGreeting(storedName);
-		showToast(`Hey, ${storedName} welcome back to Waves!`);
-	}
-
-	var nameInput = document.getElementById('userName');
-	var doneButton = document.getElementById('doneButton');
-
-	doneButton.disabled = nameInput.value.trim() === '';
-	nameInput.addEventListener('input', function() {
-		doneButton.disabled = nameInput.value.trim() === '';
-	});
-};
-
-function submitName() {
-	var nameInput = document.getElementById('userName');
-	var name = nameInput.value.trim();
-
-	if (name) {
-		localStorage.setItem('userName', name);
-
-		var greetingElement = document.getElementById('greeting');
-		if (greetingElement) {
-			updateGreeting(name);
-		}
-
-		document.getElementById('namePrompt').classList.add('fade-out');
-		showToast(`Hey, ${name}! Welcome to Waves!`);
-
-		setTimeout(function() {
-			document.getElementById('namePrompt').style.display = 'none';
-			document.getElementById('overlay').style.display = 'none';
-		}, 300);
-	}
-}
-
-function updateGreeting(name) {
-	var greeting = getGreeting();
-	var greetingElement = document.getElementById('greeting');
-
-	if (greetingElement) {
-		greetingElement.innerHTML = `<i class="${greeting.iconClass}"></i> ${greeting.text}, ${name}!`;
-		greetingElement.style.opacity = 1;
-	}
-}
-
-function showToast(message, type = "success", iconType = "check") {
-	const toast = document.createElement("div");
-	toast.className = `toast show ${type}`;
-
-	const icons = {
-		success: '<i class="fas fa-check-circle" style="margin-right: 8px;"></i>',
-		error: '<i class="fas fa-times-circle" style="margin-right: 8px;"></i>',
-		info: '<i class="fas fa-info-circle" style="margin-right: 8px;"></i>',
-		warning: '<i class="fas fa-exclamation-triangle" style="margin-right: 8px;"></i>',
-		wave: '<i class="fa-regular fa-hand-wave" style="margin-right: 8px;"></i>'
-	};
-
-	const icon = icons[iconType] || icons['wave'];
-	toast.innerHTML = `${icon}${message} `;
-
-	const progressBar = document.createElement("div");
-	progressBar.className = "progress-bar";
-	toast.appendChild(progressBar);
-
-	const closeBtn = document.createElement("button");
-	closeBtn.className = "toast-close";
-	closeBtn.innerHTML = '<i class="fas fa-xmark" style="margin-left: 8px; font-size: 0.8em;"></i>';
-	closeBtn.addEventListener("click", () => {
-		toast.classList.add("hide");
-		setTimeout(() => toast.remove(), 500);
-	});
-	toast.appendChild(closeBtn);
-	document.body.appendChild(toast);
-
-	setTimeout(() => {
-		toast.classList.add("hide");
-		setTimeout(() => toast.remove(), 500);
-	}, 3000);
-}
-
-function getGreeting() {
-	var hour = new Date().getHours();
-	if (hour >= 5 && hour < 12) {
-		return {
-			text: 'Good morning',
-			iconClass: 'fa-regular fa-cloud-sun'
-		};
-	} else if (hour >= 12 && hour < 17) {
-		return {
-			text: 'Good afternoon',
-			iconClass: 'fa-regular fa-sun'
-		};
-	} else if (hour >= 17 && hour < 21) {
-		return {
-			text: 'Good evening',
-			iconClass: 'fa-regular fa-cloud-moon'
-		};
-	} else {
-		return {
-			text: 'Good night',
-			iconClass: 'fa-regular fa-moon'
-		};
-	}
-}

public/assets/js/greetings.js

@@ -0,0 +1,126 @@
+window.onload = function() {
+    const storedName = localStorage.getItem('userName');
+    if (!storedName) {
+        document.getElementById('overlay').style.display = 'block';
+        document.getElementById('namePrompt').style.display = 'block';
+        const nameInput = document.getElementById('userName');
+        const doneButton = document.getElementById('doneButton');
+        doneButton.disabled = true;
+        nameInput.addEventListener('input', () => {
+            doneButton.disabled = nameInput.value.trim() === '';
+        });
+        return;
+    }
+    showToast(`Hey, ${storedName}! Welcome back to Waves!`, 'success', 'wave');
+    const greetingElement = document.getElementById('greeting');
+    if (greetingElement) {
+        updateGreeting(storedName);
+    }
+};
+
+function submitName() {
+    const name = document.getElementById('userName').value.trim();
+    if (!name) return;
+    localStorage.setItem('userName', name);
+    updateGreeting(name);
+    document.getElementById('namePrompt').classList.add('fade-out');
+    showToast(`Hey, ${name}! Welcome to Waves!`, 'success', 'wave');
+    setTimeout(() => {
+        document.getElementById('namePrompt').style.display = 'none';
+        document.getElementById('overlay').style.display = 'none';
+    }, 300);
+}
+
+function updateGreeting(name) {
+    const { text, iconClass } = getGreeting();
+    const el = document.getElementById('greeting');
+    if (el) {
+        el.innerHTML = `<i class="${iconClass}"></i> ${text}, ${name}!`;
+        el.style.opacity = 1;
+    }
+}
+
+function showToast(message, type = 'success', iconType = 'check') {
+    const toast = document.createElement('div');
+    toast.className = `toast show ${type}`;
+    const icons = {
+        success: '<i class="fas fa-check-circle" style="margin-right: 8px;"></i>',
+        error: '<i class="fas fa-times-circle" style="margin-right: 8px;"></i>',
+        info: '<i class="fas fa-info-circle" style="margin-right: 8px;"></i>',
+        warning: '<i class="fas fa-exclamation-triangle" style="margin-right: 8px;"></i>',
+        wave: '<i class="fa-regular fa-hand-wave" style="margin-right: 8px;"></i>'
+    };
+    toast.innerHTML = `${icons[iconType] || icons.wave}${message} `;
+    const progressBar = document.createElement('div');
+    progressBar.className = 'progress-bar';
+    toast.appendChild(progressBar);
+    const closeBtn = document.createElement('button');
+    closeBtn.className = 'toast-close';
+    closeBtn.innerHTML = '<i class="fas fa-xmark" style="margin-left: 8px; font-size: 0.8em;"></i>';
+    closeBtn.addEventListener('click', () => {
+        toast.classList.add('hide');
+        setTimeout(() => toast.remove(), 500);
+    });
+    toast.appendChild(closeBtn);
+    document.body.appendChild(toast);
+    setTimeout(() => {
+        toast.classList.add('hide');
+        setTimeout(() => toast.remove(), 500);
+    }, 3000);
+}
+
+function getGreeting() {
+    const now = new Date();
+    const hour = now.getHours();
+    const day = now.getDay();
+    const options = [];
+    if (hour >= 5 && hour < 12) {
+        options.push(
+            { text: 'Good morning, sunshine', iconClass: 'fa-regular fa-sun' },
+            { text: 'Here’s to a bright morning', iconClass: 'fa-regular fa-cloud-sun' },
+            { text: 'Morning vibes only', iconClass: 'fa-regular fa-mug-hot' },
+            { text: 'Your day starts here', iconClass: 'fa-regular fa-star' }
+        );
+    } else if (hour < 17) {
+        options.push(
+            { text: 'Good afternoon', iconClass: 'fa-regular fa-leaf' },
+            { text: 'Hope your day is going well', iconClass: 'fa-regular fa-coffee' },
+            { text: 'Keep up the pace', iconClass: 'fa-regular fa-book' },
+            { text: 'Stay on track today', iconClass: 'fa-regular fa-sun' }
+        );
+    } else if (hour < 21) {
+        options.push(
+            { text: 'Good evening', iconClass: 'fa-regular fa-cloud-moon' },
+            { text: 'Time to unwind', iconClass: 'fa-regular fa-fire' },
+            { text: 'Evening’s here—relax', iconClass: 'fa-regular fa-star' },
+            { text: 'Breathe and recharge', iconClass: 'fa-regular fa-moon' }
+        );
+    } else {
+        options.push(
+            { text: 'Good night', iconClass: 'fa-regular fa-bed' },
+            { text: 'Rest well', iconClass: 'fa-regular fa-sleep' },
+            { text: 'Sweet dreams', iconClass: 'fa-regular fa-star-and-crescent' },
+            { text: 'See you tomorrow', iconClass: 'fa-regular fa-moon' }
+        );
+    }
+    if (day === 4) {
+        options.push(
+            { text: 'Thursday mode: engaged', iconClass: 'fa-regular fa-party-popper' },
+            { text: 'Almost Friday', iconClass: 'fa-regular fa-music' },
+            { text: 'Keep going', iconClass: 'fa-regular fa-thumbs-up' }
+        );
+    }
+    if (day === 0 || day === 6) {
+        options.push(
+            { text: 'Happy weekend', iconClass: 'fa-regular fa-umbrella-beach' },
+            { text: 'Enjoy some downtime', iconClass: 'fa-regular fa-cocktail' }
+        );
+    } else {
+        options.push(
+            { text: 'You’ve got this', iconClass: 'fa-regular fa-hand-holding-heart' },
+            { text: 'One step at a time', iconClass: 'fa-regular fa-walking' },
+            { text: 'Summer is coming', iconClass: 'fa-regular fa-umbrella-beach' }
+        );
+    }
+    return options[Math.floor(Math.random() * options.length)];
+}