💄 random backgrounds and phrases

2025-11-20 13:39:12 +10:00
parent f8037aa233
commit f9f5625d5a
1 changed files with 36 additions and 1 deletions
--- a/site/index.html
+++ b/site/index.html
@@ -8,8 +8,43 @@
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Permanent+Marker&family=Special+Elite&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="styles.css">
+    <script>
+        // Randomize background color on page load
+        const colors = [
+            '#f5d9e3', // muted rose
+            '#f5e3d9', // muted peach
+            '#e3d9f5', // muted lavender
+            '#f5f5d9', // muted yellow
+            '#d9f5e3', // muted teal
+            '#f5d9d9', // muted coral
+            '#d9e3f5', // muted blue
+            '#f5dfe3'  // muted peach-pink
+        ];
+        const randomColor = colors[Math.floor(Math.random() * colors.length)];
+        document.documentElement.style.setProperty('--bg-color', randomColor);
+
+        // Randomize byline on page load
+        const bylines = [
+            'vamos a la casa',
+            'population: 3 (7 if you count the dogs, 8 with the cat)',
+            'don\'t look now it\'s right behind you',
+            'time will forget (it\'s mutual)',
+            'blink and you\'ll miss it (please don\'t)',
+            '*whispers* everyone knows your business',
+            'too abstract for maps',
+            'who needs productivity when you can nap',
+            'arros con gris y puerco lechon por favor',
+            'established sometime, perhaps',
+            'it is a little pig'
+        ];
+
+        document.addEventListener('DOMContentLoaded', function() {
+            const randomByline = bylines[Math.floor(Math.random() * bylines.length)];
+            document.querySelector('.byline').textContent = randomByline;
+        });
+    </script>
 </head>
-<body>
+<body style="background-color: var(--bg-color);">
    <div class="container">
        <header>
            <h1>Puercito Fiction</h1>