From c7a70fc5fc7b48a59e49fd03d991cb69e1633864 Mon Sep 17 00:00:00 2001
From: Looki2000 <electro.brzostek@gmail.com>
Date: Tue, 21 Mar 2023 12:03:05 +0100
Subject: [PATCH] sussy commit now theres commin soon on itchio sus sussybaka

---
 index.html |  8 ++++++--
 script.js  | 33 +++++++++++++++++++++++++++++++++
 style.css  | 30 ++++++++++++++++++++++++++++++
 3 files changed, 69 insertions(+), 2 deletions(-)
 create mode 100644 script.js
diff --git a/index.html b/index.html
index 2e2a92d..539b82c 100644
--- a/index.html
+++ b/index.html
@@ -8,8 +8,9 @@
     </head>
 
     <body>
+        <script src="script.js"></script>
 
-        <video autoplay muted loop width="100%" height="100%" id="back_video">
+        <video muted loop width="100%" height="100%" id="back_video">
             <source src="assets/video.mp4" type="video/mp4">
         </video>
 
@@ -27,8 +28,11 @@
                     <img alt='Get it on Google Play' src='https://play.google.com/intl/en_us/badges/static/images/badges/en_badge_web_generic.png' id="google_play_badge"/>
                 </a>
 
-                <a href="" id="itchio_badge_link">
+                <a href="https://www.youtube.com/watch?v=dQw4w9WgXcQ" id="itchio_badge_link">
                     <img alt="Available on itch.io" src="assets/itchio_badge.png" id="itchio_badge"/>
+                    <div id="rotated_text">
+                        <p>coming soon!</p>
+                    </div>
                 </a>
                 
             </div>
diff --git a/script.js b/script.js
new file mode 100644
index 0000000..c9e3d96
--- /dev/null
+++ b/script.js
@@ -0,0 +1,33 @@
+document.addEventListener('DOMContentLoaded', () => {
+
+    console.log('DOM fully loaded and parsed');
+
+    var rotated_text = document.getElementById('rotated_text');
+
+    var old_width = rotated_text.offsetWidth;
+    var width;
+
+    // animation frame loop
+    function loop() {
+        
+        // get widt of div with id="rotated_text"
+        width = rotated_text.offsetWidth;
+
+        // if width has changed
+        if (width != old_width) {
+            // set new width
+            old_width = width;
+
+            // set font-size of p inside rotated_text to width * n
+            rotated_text.children[0].style.fontSize = width * 0.15 + 'px';
+        }
+
+
+
+        requestAnimationFrame(loop);
+    }
+
+    // start the loop
+    requestAnimationFrame(loop);
+
+});
\ No newline at end of file
diff --git a/style.css b/style.css
index fb4d218..0fa58fb 100644
--- a/style.css
+++ b/style.css
@@ -81,6 +81,7 @@ h1 {
 
 #itchio_badge_link {
     padding: 6.6%;
+    position: relative;
 }
 
 #itchio_badge {
@@ -88,6 +89,35 @@ h1 {
     margin-bottom: -4px;
 }
 
+#rotated_text {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+
+    /* bold font*/
+    font-weight: bold;
+
+    /* center text vertically */
+    display: flex;
+    align-items: center;
+    justify-content: center;
+
+    color: #cebf82;
+
+}
+
+#rotated_text p {
+    margin: 0;
+
+    /* rotate text */
+    transform: rotate(13deg);
+
+    text-shadow: 0 0 15px #000
+}
+
+
 footer {
     --footer-height: 50px;
 
