teto improvements

Author: quantumbagel

index.html

@@ -1407,8 +1407,39 @@ <h2 class="text-2xl font-bold font-mono text-zinc-900 dark:text-zinc-100">aerpaw
 ⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢻⣿⣿⡇⢸⣿⣿⣿⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀
 ⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢸⣿⣿⡇⢸⣿⣿⣿⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀
 ⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠈⠉⠉⠀⠘⠛⠛⠋⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀`;
-        console.log("%c" + tetoAscii, "color: #FF3366; font-family: monospace; font-size: 8px; line-height: 1.1; font-weight: bold;");
-        console.log("%cI ❤️ teto", "color: #FF3366; font-family: monospace; font-size: 12px; font-weight: bold;");
+
+        const blankStyle = "color: rgba(255, 51, 102, 0.08); font-family: monospace; font-size: 8px; line-height: 1.15;";
+        const dotStyle = "color: rgb(255, 51, 102); font-family: monospace; font-size: 8px; line-height: 1.15; font-weight: bold;";
+
+        tetoAscii.split("\n").forEach((line) => {
+            const parts = [];
+            const styles = [];
+            let currentType = null;
+            let currentStr = "";
+
+            for (const char of line) {
+                const isBlank = char === "⠀" || char === " ";
+                const type = isBlank ? "blank" : "dots";
+
+                if (type !== currentType) {
+                    if (currentStr) {
+                        parts.push("%c" + currentStr);
+                        styles.push(currentType === "blank" ? blankStyle : dotStyle);
+                    }
+                    currentStr = char;
+                    currentType = type;
+                } else {
+                    currentStr += char;
+                }
+            }
+            if (currentStr) {
+                parts.push("%c" + currentStr);
+                styles.push(currentType === "blank" ? blankStyle : dotStyle);
+            }
+            console.log(parts.join(""), ...styles);
+        });
+
+        console.log("%cChimera Kasane Teto is watching your console! 🥖", "color: #FF3366; font-family: monospace; font-size: 12px; font-weight: bold;");
 
 
         const style = document.createElement("style");

templates/index.html

@@ -655,8 +655,39 @@ <h2 class="title group flex items-center gap-2 font-bold font-mono tracking-tigh
 ⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢻⣿⣿⡇⢸⣿⣿⣿⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀
 ⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢸⣿⣿⡇⢸⣿⣿⣿⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀
 ⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠈⠉⠉⠀⠘⠛⠛⠋⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀`;
-        console.log("%c" + tetoAscii, "color: #FF3366; font-family: monospace; font-size: 8px; line-height: 1.1; font-weight: bold;");
-        console.log("%cI ❤️ teto", "color: #FF3366; font-family: monospace; font-size: 12px; font-weight: bold;");
+
+        const blankStyle = "color: rgba(255, 51, 102, 0.08); font-family: monospace; font-size: 8px; line-height: 1.15;";
+        const dotStyle = "color: rgb(255, 51, 102); font-family: monospace; font-size: 8px; line-height: 1.15; font-weight: bold;";
+
+        tetoAscii.split("\n").forEach((line) => {
+            const parts = [];
+            const styles = [];
+            let currentType = null;
+            let currentStr = "";
+
+            for (const char of line) {
+                const isBlank = char === "⠀" || char === " ";
+                const type = isBlank ? "blank" : "dots";
+
+                if (type !== currentType) {
+                    if (currentStr) {
+                        parts.push("%c" + currentStr);
+                        styles.push(currentType === "blank" ? blankStyle : dotStyle);
+                    }
+                    currentStr = char;
+                    currentType = type;
+                } else {
+                    currentStr += char;
+                }
+            }
+            if (currentStr) {
+                parts.push("%c" + currentStr);
+                styles.push(currentType === "blank" ? blankStyle : dotStyle);
+            }
+            console.log(parts.join(""), ...styles);
+        });
+
+        console.log("%cChimera Kasane Teto is watching your console! 🥖", "color: #FF3366; font-family: monospace; font-size: 12px; font-weight: bold;");
 
 
         const style = document.createElement("style");