update the thing

index.html

@@ -72,6 +72,54 @@
         text-decoration: underline solid;
     }
 
+    .button {
+        display: inline-block;
+        padding: 3px 6px;
+        font-size: 16px;
+        text-align: center;
+        color: white;
+        background-color: black;
+        border: 1px solid white;
+        cursor: pointer;
+        text-decoration: none;
+        border-radius: 0;
+    }
+
+    .shiny {
+        position: relative;
+        overflow: hidden;
+    }
+
+    .shiny::before {
+        content: '';
+        position: absolute;
+        top: 0;
+        left: -110%;
+        width: 110%;
+        height: 100%;
+        background: rgba(255, 255, 255, 0.5);
+        transform: skewX(-30deg);
+        animation: shine 5s infinite;
+        animation-delay: 5s;
+        visibility: hidden;
+    }
+
+    @keyframes shine {
+        0% {
+            left: -110%;
+            visibility: hidden;
+        }
+
+        10% {
+            visibility: visible;
+            left: 110%;
+        }
+
+        100% {
+            left: 110%;
+        }
+    }
+
     div.buttons {
         display: flex;
         justify-content: center;
@@ -120,8 +168,7 @@
         'who are you',
         'lorem ipsum dolor sit amet',
         'hot garfields in your area',
-        'don\'t forget to drink water',
-        'do you like hurting other people?',
+        'remember to drink water',
     ];
     function setRandomText() {
         document.querySelector('#quote').textContent = texts[Math.floor(Math.random() * texts.length)];
@@ -129,7 +176,7 @@
     document.addEventListener('DOMContentLoaded', setRandomText);
 </script>
 <script>
-    const characters = ['♙', '♟'];
+    const characters = ['◇', '◆'];
     let currentIndex = 0;
     function cycleText() {
         document.querySelector('#bullet').textContent = characters[currentIndex];
@@ -147,8 +194,9 @@
     </div>
     <hr class="separator">
     <div class="box">
+        <script>let hire_me_message = "hey!\ncould use a second pair of hands with something? programming, sys administration, or otherwise technical?\n\ni would love to work with/for you! reach out to me via email [me@futile.eu] (even just to exchange info for another platform)! paying me is optional, just be upfront with what you wish to do."</script>
         <p class="content">
-            hello, my name is futile. i am a weird concept from the internet (or a person from europe, depending on who you ask).<br><br>i like programming (mostly rust), computers, linux, malicious software like game hacks and malware, and any vehicle whether it drives or flies.<br><br>if you want to contact me, email <a class="click" href="mailto:me@futile.eu">me@futile.eu</a>
+            hello, my name is futile. i am a weird concept from the internet (or a person from europe, depending on who you ask).<br><br>i like programming (mostly rust), computers, linux, malicious software like game hacks and malware, and any vehicle whether it drives or flies.<br><br>everything i know about the aforementioned things is self-taught. i also speak both english and russian fluently.<br><br>if you want to contact me, email <a class="click" href="mailto:me@futile.eu">me@futile.eu</a><br><br><a class="button shiny" onclick="alert(hire_me_message)">hire me!</a>
         </p>
     </div>
     <div style="position: absolute; bottom: 0; left: 0; right: 0;">
@@ -156,7 +204,7 @@
             <ul class="buttons">
                 <li><a href="https://futile.eu"><img src="buttons/futile.png" width="88px" height="31px" alt="button that says 'futile' in white, grotesque font, on a black background, with a white outline | by futile"></a></li>
                 <li><a href="https://xenia.blahaj.land/"><img src="buttons/rose_88x31.png" width="88px" height="31px" alt="button that says 'rose' with a rose growing out of the 'o', with milk-chan to the right of the text | by rose"></a></li>
-                <li><iframe src="//incr.easrng.net/badge?key=futile" style="background: url(https://incr.easrng.net/bg.gif)" title="increment badge" width="88" height="31" frameborder="0"></iframe></li>
+                <li><iframe src="https://incr.easrng.net/badge?key=futile" style="background: url(https://incr.easrng.net/bg.gif)" title="increment badge" width="88" height="31" frameborder="0"></iframe></li>
                 <li><a href="https://fedoraproject.org/spins/kde"><img src="buttons/fedora.png" width="88px" height="31px" alt="button that says 'powered by fedora' in white and blue, with the fedora logo to the left | by unknown; retouched by futile"></a></li>
                 <li><a href="https://mozilla.org/firef&nbsp;x"><img src="buttons/firefox4.gif" width="88px" height="31px" alt="button that flashes between the texts 'tested on' and 'firefox' in firefox's orange, yellow, and purple scheme, with the firefox logo to the left | by unknown"></a></li>
                 <li><a href="https://vscodium.com"><img src="buttons/vscodium.com.png" width="88px" height="31px" alt="button that says 'made with vscodium' in light blue, with the vscodium logo to the right | by unknown"></a></li>
@@ -168,7 +216,7 @@
         <div class="footer">
             <p id="quote">who are you</p>&nbsp;
             <p id="bullet" style="user-select: none;">◇</p>&nbsp;
-            <p><a class="click" target="_blank" href="https://codeberg.org/futile">codeberg</a></p>&nbsp;
+            <p><a class="click" target="_blank" href="https://codeberg.org/futile">git</a></p>&nbsp;
             <p><a class="click" target="_blank" href="https://steamcommunity.com/id/elituf">steam</a></p>
         </div>
     </div>