michaeIwave · imgbot · Jan 11, 2022 · Apr 3, 2022 · May 13, 2022
diff --git a/404.html b/404.html
@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Polygon - 404</title>
+</head>
+<body>
+
+</body>
+</html>
diff --git a/CNAME b/CNAME
@@ -0,0 +1 @@
+interstellar.eu.org
diff --git a/css/style.css b/css/style.css
@@ -0,0 +1,89 @@
+* {
+    box-sizing: border-box;
+}
+
+:root {
+    --light-brand: #64ffda;
+    --brand: #1de9b6;
+    --dark-brand: #00bfa5;
+}
+
+html, body {
+    margin: 0;
+    padding: 0;
+    font-family: 'Roboto', Arial, Helvetica, sans-serif;
+    font-size: 1.3rem;
+    color: #333;
+    background: #fafafa;
+    scroll-behavior: smooth;
+    scroll-padding: 5em;
+    -ms-overflow-style: none;
+    scrollbar-width: none;
+}
+
+html::-webkit-scrollbar, body::-webkit-scrollbar {
+    display: none;
+}
+
+h1, h2, h3, h4, h5, h6 {
+    font-weight: 800;
+    margin: 0;
+    padding: 0;
+    color: var(--brand);
+}
+
+section {
+    text-align: center;
+    padding: 5em 5em;
+}
+
+section.main {
+    background-image: url(/img/bgmVeyt.jpg);
+    background-size: cover;
+    background-position: center;
+    background-repeat: no-repeat;
+    background-attachment: fixed;
+    min-height: 100vh;
+}
+
+section.main>p {
+    color: #fff;
+}
+
+.project-container {
+    display: grid;
+    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
+    grid-gap: 1em;
+}
+
+.project-container>div>a>img {
+    width: 100%;
+    height: auto;
+    border-radius: 15px;
+    filter: drop-shadow(-5px 10px 5px rgba(0, 0, 0, 0.25));
+}
+
+.project-container>div>a>p {
+    text-decoration: none;
+    color: #333;
+}
+
+.contact {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    justify-content: center;
+    gap: 1em;
+}
+
+.contact>div>a>img {
+    width: 300px;
+    border-radius: 15px;
+    filter: drop-shadow(-5px 10px 5px rgba(0, 0, 0, 0.25));
+    margin-top: 1em;
+}
+
+.contact>div>a>p {
+    text-decoration: none;
+    color: #333;
+}
diff --git a/img/arrow.svg b/img/arrow.svg
diff --git a/img/bgmVeyt.jpg b/img/bgmVeyt.jpg
diff --git a/img/circlearrow.svg b/img/circlearrow.svg
diff --git a/img/discord.png b/img/discord.png
diff --git a/img/scratch.png b/img/scratch.png
diff --git a/img/youtube.png b/img/youtube.png
diff --git a/index.html b/index.html
@@ -4,96 +4,125 @@
     <meta charset="UTF-8">
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
-
-    <title>Polygon</title>
-
-    <link rel="shortcut icon" href="/src/images/logo.png" type="image/x-icon">
-
-    <link rel="preconnect" href="https://fonts.googleapis.com">
-    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
-    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;700;900&display=swap" rel="stylesheet"> 
-
-    <link rel="stylesheet" href="/src/css/style.css">
+    <title>Polygon - Home</title>
+    <link rel="stylesheet" href="/css/style.css">
+    <script src="https://kit.fontawesome.com/f5b105a0be.js" crossorigin="anonymous"></script>
 </head>
 <body>
-    <div class="section start-grid">
-        <div>
-            <h1 style="font-size: 5rem;">Polygon</h1>
-            <h2>Hello! Im Polygon and I'm the creator of Odyssey OS and a Website Developer for Aspect OS. <br>I have 100+ Followers and I create Animations on Scratch!</h2>
-        </div>
-        <img src="/src/images/logo.png" alt="">
-    </div>
+    <section class="main">
+        <h1>I'm Polygon</h1>
+        <p>I'm a Web Developer, Youtuber, Thursday Enthusiast and a Scratcher!</p>
+        <p>Go down below to see Other Stuff!</p>
+        <br><br><br>
+        <a href="#scratch"><img src="/img/circlearrow.svg" alt="" width="75px"></a>
+    </section>
+    <section>
+        <h1 id="scratch">Scratch Projects</h1>
+        <p>Below is some of my Projects that are either bad animations with no quality at all or Games</p>
+        <div class="project-container">
+            <div>
+                <a href="https://scratch.mit.edu/projects/634594212/">
+                    <img src="https://uploads.scratch.mit.edu/projects/thumbnails/634594212.png" alt="Sorry but the project image is somehow deleted from scrackts servers :(">
+                    <p>Getting a snack at 3AM</p>
+                </a>
+            </div>
+            <div>
+                <a href="https://scratch.mit.edu/projects/474612720/">
+                    <img src="https://uploads.scratch.mit.edu/projects/thumbnails/474612720.png" alt="Sorry but the project image is somehow deleted from scrackts servers :(">
+                    <p>Tangerine Clicker - Polygon</p>
+                </a>
+            </div>
+            <div>
+                <a href="https://scratch.mit.edu/projects/472251121/">
+                    <img src="https://uploads.scratch.mit.edu/projects/thumbnails/472251121.png" alt="Sorry but the project image is somehow deleted from scrackts servers :(">
+                    <p>Find The Triangle - Polygon</p>
+                </a>
+            </div>
+            <div>
+                <a href="https://scratch.mit.edu/projects/477738644/">
+                    <img src="https://uploads.scratch.mit.edu/projects/thumbnails/477738644.png" alt="Sorry but the project image is somehow deleted from scrackts servers :(">
+                    <p>Recreating User Icons - Polygon</p>
+                </a>
+            </div>
+            <div>
+                <a href="https://scratch.mit.edu/projects/575123362/">
+                    <img src="https://uploads.scratch.mit.edu/projects/thumbnails/575123362.png" alt="Sorry but the project image is somehow deleted from scrackts servers :(">
+                    <p>Old Artworks!</p>
 
-    <div class="section">
-        <h1 style="text-align: center; font-size: 3rem; margin-bottom: 0;">My Most Popular Projects</h1>
-        <p style="text-align: center; margin-bottom: 2em;">(last updated 11/01/2022)</p>
-        <div class="grid">
-            <div><img class="round" src="https://uploads.scratch.mit.edu/projects/thumbnails/474612720.png" alt=""><p><a href="https://scratch.mit.edu/projects/474612720/">Tangerine Clicker - Polygon</a></p></div>
-            <div><img class="round" src="https://uploads.scratch.mit.edu/projects/thumbnails/472251121.png" alt=""><p><a href="https://scratch.mit.edu/projects/472251121/">Find the Triangle - Polygon</a></p></div>
-            <div><img class="round" src="https://uploads.scratch.mit.edu/projects/thumbnails/477738644.png" alt=""><p><a href="https://scratch.mit.edu/projects/477738644/">Recreating User Icons - Polygon</a></p></div>
-            <div><img class="round" src="https://uploads.scratch.mit.edu/projects/thumbnails/505168624.png" alt=""><p><a href="https://scratch.mit.edu/projects/505168624/">"animations" but I read the rant</a></p></div>
-            <div><img class="round" src="https://uploads.scratch.mit.edu/projects/thumbnails/575123362.png" alt=""><p><a href="https://scratch.mit.edu/projects/575123362/">Old Artworks!</a></p></div>
-            <div><img class="round" src="https://uploads.scratch.mit.edu/projects/thumbnails/500944654.png" alt=""><p><a href="https://scratch.mit.edu/projects/500944654/">Skydive and Collect Balloons</a></p></div>
-            <div><img class="round" src="https://uploads.scratch.mit.edu/projects/thumbnails/584213213.png" alt=""><p><a href="https://scratch.mit.edu/projects/584213213/">Roblox: Powering Imagination</a></p></div>
-            <div><img class="round" src="https://uploads.scratch.mit.edu/projects/thumbnails/579181890.png" alt=""><p><a href="https://scratch.mit.edu/projects/579181890/">Ghastly Ghost!</a></p></div>
-            <div><img class="round" src="https://uploads.scratch.mit.edu/projects/thumbnails/561519854.png" alt=""><p><a href="https://scratch.mit.edu/projects/561519854/">Larry the Cucumber</a></p></div>
+                </a>
+            </div>
+            <div>
+                <a href="https://scratch.mit.edu/projects/500944654/">
+                    <img src="https://uploads.scratch.mit.edu/projects/thumbnails/500944654.png" alt="Sorry but the project image is somehow deleted from scrackts servers :(">
+                    <p>Skydive and Collect Balloons</p>
+                </a>
+            </div>
         </div>
-    </div>
-
-    <div class="section">
-        <h1 style="text-align: center; font-size: 3rem; margin-bottom: 0;">My Most Popular Videos</h1>
-        <p style="text-align: center; margin-bottom: 2em;">(last updated 11/01/2022)</p>
-        <div class="grid">
-            <div><img class="round" src="https://i.ytimg.com/vi/Lne_-0F1LRs/hqdefault.jpg?sqp=-oaymwEcCPYBEIoBSFXyq4qpAw4IARUAAIhCGAFwAcABBg==&rs=AOn4CLBYL_vd9Lccmd0mCRiWwcU3GdhHtQ" alt=""><p><a href="https://www.youtube.com/watch?v=Lne_-0F1LRs">How to Hack Scratch Accounts</a></p></div>
-            <div><img class="round" src="https://i.ytimg.com/vi/kgRMfN-gfHc/hqdefault.jpg?sqp=-oaymwEcCPYBEIoBSFXyq4qpAw4IARUAAIhCGAFwAcABBg==&rs=AOn4CLBwId3Tl42Uoc5v0RcNl-eMN5pl6w" alt=""><p><a href="https://www.youtube.com/watch?v=kgRMfN-gfHc">Scratch Speedrun Ban%</a></p></div>
-            <div><img class="round" src="https://i.ytimg.com/vi/yo2HtejhlEU/hqdefault.jpg?sqp=-oaymwEcCPYBEIoBSFXyq4qpAw4IARUAAIhCGAFwAcABBg==&rs=AOn4CLCAbDwUu9475KCDzqpHzxHw6ToJOA" alt=""><p><a href="https://www.youtube.com/watch?v=yo2HtejhlEU">No Context Scratch (p1)</a></p></div>
-            <div><img class="round" src="https://i.ytimg.com/vi/j5UCAOkFajI/hqdefault.jpg?sqp=-oaymwEcCPYBEIoBSFXyq4qpAw4IARUAAIhCGAFwAcABBg==&rs=AOn4CLBb6AHnEr_i5RYaSNQJY3K5Gex7WQ" alt=""><p><a href="https://www.youtube.com/watch?v=j5UCAOkFajI">No Context s c r a t c h (p2)</a></p></div>
-            <div><img class="round" src="https://i.ytimg.com/vi/t3XoNmF4CcM/hqdefault.jpg?sqp=-oaymwEcCPYBEIoBSFXyq4qpAw4IARUAAIhCGAFwAcABBg==&rs=AOn4CLAExplC5Ngpbr9d6pIAOt8rTg07BA" alt=""><p><a href="https://www.youtube.com/watch?v=t3XoNmF4CcM">No Context Scratch P4</a></p></div>
-            <div><img class="round" src="https://i.ytimg.com/vi/YatYl1KLg00/hqdefault.jpg?sqp=-oaymwEcCPYBEIoBSFXyq4qpAw4IARUAAIhCGAFwAcABBg==&rs=AOn4CLDY7Tw0IbzR_LNX9AUHBVz0V9J2Fw" alt=""><p><a href="https://www.youtube.com/watch?v=YatYl1KLg00">The Scratch Team When Update</a></p></div>
-            <div><img class="round" src="https://i.ytimg.com/vi/uFFX7gy3hLA/hqdefault.jpg?sqp=-oaymwEcCPYBEIoBSFXyq4qpAw4IARUAAIhCGAFwAcABBg==&rs=AOn4CLAWDGGfrl8DgoSl1O1W49VwAIA-Zg" alt=""><p><a href="https://www.youtube.com/watch?v=uFFX7gy3hLA">No Context Scratch P3</a></p></div>
-            <div><img class="round" src="https://i.ytimg.com/vi/q4VWCg9msZo/hqdefault.jpg?sqp=-oaymwEcCPYBEIoBSFXyq4qpAw4IARUAAIhCGAFwAcABBg==&rs=AOn4CLApbYB2L_1o0L_f00PHN8JwhNIPWw" alt=""><p><a href="https://www.youtube.com/watch?v=q4VWCg9msZo">Day in the life of a Namesniper</a></p></div>
-            <div><img class="round" src="https://i.ytimg.com/vi/zLVcakcFweQ/hqdefault.jpg?sqp=-oaymwEcCPYBEIoBSFXyq4qpAw4IARUAAIhCGAFwAcABBg==&rs=AOn4CLCUlgKO1aWU8SGrzXcWJg-LQ6LqcA" alt=""><p><a href="https://www.youtube.com/watch?v=zLVcakcFweQ">Advanced Topics in Under 100 Seconds</a></p></div>
+    </section>
+    <section>
+        <h1>Youtube Videos</h1>
+        <p>Basically all of these are Bad Videos, Meme Reviews or No Context Scratch.</p>
+        <div class="project-container">
+            <div>
+                <a href="https://www.youtube.com/watch?v=Lne_-0F1LRs">
+                    <img src="https://i.ytimg.com/vi/Lne_-0F1LRs/hqdefault.jpg?sqp=-oaymwEcCPYBEIoBSFXyq4qpAw4IARUAAIhCGAFwAcABBg==&rs=AOn4CLBYL_vd9Lccmd0mCRiWwcU3GdhHtQ" alt="">
+                    <p>How to Hack Scratch Accounts</p>
+                </a>
+            </div>
+            <div>
+                <a href="https://www.youtube.com/watch?v=kgRMfN-gfHc">
+                    <img src="https://i.ytimg.com/vi/kgRMfN-gfHc/hqdefault.jpg?sqp=-oaymwEcCPYBEIoBSFXyq4qpAw4IARUAAIhCGAFwAcABBg==&rs=AOn4CLBwId3Tl42Uoc5v0RcNl-eMN5pl6w" alt="">
+                    <p>Scratch Speedrun Ban%</p>
+                </a>
+            </div>
+            <div>
+                <a href="https://www.youtube.com/watch?v=yo2HtejhlEU">
+                    <img src="https://i.ytimg.com/vi/yo2HtejhlEU/hqdefault.jpg?sqp=-oaymwEcCPYBEIoBSFXyq4qpAw4IARUAAIhCGAFwAcABBg==&rs=AOn4CLCAbDwUu9475KCDzqpHzxHw6ToJOA" alt="">
+                    <p>No Context Scratch (P1)</p>
+                </a>
+            </div>
+            <div>
+                <a href="https://www.youtube.com/watch?v=y2VwcvAMNyc">
+                    <img src="https://i.ytimg.com/vi/y2VwcvAMNyc/hqdefault.jpg?sqp=-oaymwEcCPYBEIoBSFXyq4qpAw4IARUAAIhCGAFwAcABBg==&rs=AOn4CLB6Qp4Shg1MZt9d4PSLx__HBbG6Pg" alt="">
+                    <p>Why is Mike Floating? | 5. No Context Scratch</p>
+                </a>
+            </div>
+            <div>
+                <a href="https://www.youtube.com/watch?v=j5UCAOkFajI">
+                    <img src="https://i.ytimg.com/vi/j5UCAOkFajI/hqdefault.jpg?sqp=-oaymwEcCPYBEIoBSFXyq4qpAw4IARUAAIhCGAFwAcABBg==&rs=AOn4CLBb6AHnEr_i5RYaSNQJY3K5Gex7WQ" alt="">
+                    <p>No Context Scratch (P2)</p>
+                </a>
+            </div>
+            <div>
+                <a href="https://www.youtube.com/watch?v=uVc8tr8D-qU">
+                    <img src="https://i.ytimg.com/vi/uVc8tr8D-qU/hqdefault.jpg?sqp=-oaymwEcCPYBEIoBSFXyq4qpAw4IARUAAIhCGAFwAcABBg==&rs=AOn4CLB9Cf0R7uyP9Bwzj_KoBLv9lE-Kkg" alt="">
+                    <p>LGBTQ+ Google Easter Egg! Flag Emoji!</p>
+                </a>
+            </div>
         </div>
-    </div>
-
-    <div class="section">
-        <!-- contacts -->
-        <h1 style="text-align: center; font-size: 3rem;">Contact Me</h1>
-        <div class="grid">
-            <div style="display: flex; justify-content: center; align-content: center; text-align: center;">
-                <a href="https://scratch.mit.edu/users/PoIygon">
-                    <img width="100px" src="https://is1-ssl.mzstatic.com/image/thumb/Purple116/v4/1c/e7/03/1ce70372-5d0c-a172-3eaf-d0f278c68d0d/Scratch_3.png/1200x630bb.png" alt="">
-                    <p>Polygon</p>
+    </section>
+    <section>
+        <h1>Contacts</h1>
+        <div class="contact">
+            <div>
+                <a href="https://scratch.mit.edu.users/PoIygon">
+                    <img src="/img/scratch.png" alt="">
+                    <p>PoIygon</p>
                 </a>
             </div>
-            <div style="display: flex; justify-content: center; align-content: center; text-align: center;">
-                <a href="https://discord.com/app">
-                    <img width="100px" src="https://cdn-icons-png.flaticon.com/512/2111/2111370.png" alt="">
+            <div>
+                <a href="">
+                    <img src="/img/discord.png" alt="">
                     <p>Polygon#3250</p>
                 </a>
             </div>
-            <div style="display: flex; justify-content: center; align-content: center; text-align: center;">
-                <a href="https://www.youtube.com/Polygon360/">
-                    <img width="100px" src="https://cliply.co/wp-content/uploads/2019/04/371903520_SOCIAL_ICONS_YOUTUBE.png" alt="">
+            <div>
+                <a href="https://www.youtube.com/c/Polygon360">
+                    <img src="/img/youtube.png" alt="">
                     <p>OneMiWay</p>
                 </a>
             </div>
         </div>
-    </div>
-    <div class="section footer">
-        <dl>
-            <dt class="p">Socials</dt>
-            <dd class="p"><a href="">Scratch</a></dd>
-            <dd class="p"><a href="">Discord</a></dd>
-            <dd class="p"><a href="">Youtube</a></dd>
-        </dl>
-        <dl>
-            <dt class="p">Missilanious Pages</dt>
-            <dd class="p"></dd>
-            <dd class="p"></dd>
-            <dd class="p"></dd>
-            <dd class="p"></dd>
-        </dl>
-    </div>
+    </section>
 </body>
 </html>