add header + fediring + more buttons

index.html

@@ -22,13 +22,20 @@
             <header class="intro-text">
                 <h1 class="site-intro">hey, i'm ruben.</h1>
                 <h2 class="site-subtitle">welcome to my site.</h2>
-                <nav>
-                    <small class="nav"> <a href="#about-me">~/about-me</a> <span class="arrow">→</span> <a href="#links">~/links</a> <span class="arrow">→</span> <a href="#fun-facts">~/fun-facts</a> <span class="arrow">→</span> etc.</small>
-                </nav>
+                
             </header>
         </div>
     </div>
 
+    <div class="pixel-corners">
+        <header class="navbar">
+            <nav>
+                <small class="nav"> <a href="#about-me">~/about-me</a> <span class="arrow">→</span> <a href="#links">~/links</a> <span class="arrow">→</span> <a href="#fun-facts">~/fun-facts</a> <span class="arrow">→</span> <a href="#user-reviews">~/user-reviews</a> <span class="arrow">→</span> <a href="#buttons">~/buttons</a></small>
+                <p><a href="https://fediring.net/previous?host=sneexy.pages.gay">←</a> <a href="https://fediring.net/">Fediring</a> <a href="https://fediring.net/next?host=sneexy.pages.gay">→</a></p>
+            </nav>
+        </header>
+    </div>
+
     <div class="pixel-corners">
         <article id="about-me" class="about-me">
             <h1><span class="anchors"><a href="#about-me">~/about-me</a></span></h1>
@@ -181,7 +188,7 @@
     <div class="pixel-corners">
         <article id="user-reviews" class="user-reviews">
             <h1><span class="anchors"><a href="#user-reviews">~/user-reviews</a></span></h1>
-            <small>(note: some of these may or may not be related to me at all)</small>
+            <small>(note: some of these may or may not be related to me at all  <span class="dot">●</span> the blurred reviews may either contain vulgar language or just be incredibly gay)</small>
             <section class="quotes">
                 <section class="quote">
                     <p>god i fucking love men</p>
@@ -203,6 +210,16 @@
                     <small><i><a href="https://lea.pet/@SweetCoffy" target="_blank">SweetCoffy</a></i></small>
                 </section>
 
+                <section class="quote">
+                    <p>my favorite professional cheese consumer, 10/10</p>
+                    <small><i><a href="https://wetdry.world/@ultra0" target="_blank">ultra0</a></i></small>
+                </section>
+
+                <section class="quote">
+                    <p>10/10 epic website, stealing soon</p>
+                    <small><i><a href="https://lethallava.land/@atom" target="_blank">atom</a></i></small>
+                </section>
+
                 <section class="quote">
                     <p>t</p>
                     <small><i><a href="https://moth.zone/meowcatheorange" target="_blank">meowcatheorange</a></i></small>
@@ -213,11 +230,6 @@
                     <small><i><a href="https://lea.pet/@amy" target="_blank">amy</a></i></small>
                 </section>
 
-                <section class="quote">
-                    <p>10/10 epic website, stealing soon</p>
-                    <small><i><a href="https://lethallava.land/@atom" target="_blank">atom</a></i></small>
-                </section>
-
                 <section class="quote">
                     <p>SNEEXY WHAT ARE YOU SAYING LLLLHHGGGGG</p>
                     <small><i><a href="https://0w0.is/users/yassie_j" target="_blank">yassie_j</a></i></small>
@@ -240,12 +252,14 @@
                     <a href="https://whois.slipfox.xyz" target="_blank"><img src="https://files.slipfox.xyz/button.png" alt="Slips"/></a>
                     <a href="https://beebl.es" target="_blank"><img src="/assets/buttons/beebles.png" alt="Beebles"/></a>
                     <a href="https://soafen.love" target="_blank"><img src="https://soafen.love/img/88x31/soafen.gif" alt="soafen"/></a>
+                    <a href="https://ultra0.ar" target="_blank"><img src="https://ultra0.ar/assets/basement_button.a0b7aa9449f5faea97c00812a478a819.gif" alt="ultra0's basement"/></a>
                     <a href="https://sneexy.pages.gay" target="_blank"><img src="/assets/buttons/sneexy.gif" alt="Sneexy (button made by toby @ tobskep.com)"/></a>
                 </section>
 
                 <section class="buttons-img">
                     <a href="https://archlinux.org" target="_blank"><img src="/assets/buttons/poweredbyarch.png" alt="powered by arch btw"/></a>
                     <img src="/assets/buttons/yoshilore.gif" alt="Yoshi Lore"/>
+                    <img src="/assets/buttons/c4y.gif" alt="Crazy 4 Yoshis"/>
                     <a href="https://hshop.erista.me" target="_blank"><img src="/assets/buttons/3ds.png" alt="Nintendo 3DS"/></a>
                     <a href="https://mariocube.com" target="_blank"><img src="/assets/buttons/wii.png" alt="Nintendo Wii"/></a>
                     <a href="https://www.mozilla.org/en-US/firefox/new" target="_blank"><img src="/assets/buttons/getfirefox.gif" alt="Get Firefox"/></a>
@@ -254,6 +268,7 @@
                     <a href="https://www.tucows.com" target="_blank"><img src="/assets/buttons/tucows.gif" alt="tucows"/></a>
                     <a href="https://www.youtube.com/@ScottTheWoz" target="_blank"><img src="/assets/buttons/scotthere.gif" alt="hey all, scott here!"/></a>
                     <a href="https://homestarrunner.com/main" target="_blank"><img src="/assets/buttons/homestar.gif" alt="Homestar Runner dot com!"/></a>
+                    <a href="https://www.youtube.com/watch?v=WfYyBp4Ln2s" target="_blank"><img src="/assets/buttons/doinyourmom.gif" alt="DOIN UR MOM!!!!"/></a>
                     <img src="/assets/buttons/ravenow.gif" alt="Rave Now!"/>
                     <img src="/assets/buttons/nft.gif" alt="NFT: No Fucking Thanks"/>
                     <img src="/assets/buttons/discordnoway.gif" alt="Discord? No Thanks!"/>

style.css

@@ -337,6 +337,10 @@ footer > a {
     text-shadow: 0px 0px 8px var(--header-2);
 }
 
+nav > p {
+    margin-top: 10px;
+}
+
 .arrow {
     color: var(--accent-1);
     text-shadow: 0px 0px 8px var(--accent-1);
@@ -388,14 +392,14 @@ footer > .dot {
     color: var(--bg-t);
 }
 
-.intro-box, .links, .about-me, .fun-facts, .user-reviews, .buttons {
+.intro-box, .navbar, .about-me, .links, .fun-facts, .user-reviews, .buttons {
     position: relative;
     display: flex;
     padding: 30px;
     background-color: var(--bg);
 }
 
-.intro-text, .links, .about-me, .fun-facts, .user-reviews, .buttons {
+.intro-text, .navbar, .about-me, .links, .fun-facts, .user-reviews, .buttons {
     flex-direction: column;
 }
 
@@ -410,7 +414,13 @@ footer > .dot {
 
 .intro-text {
     text-align: center;
-    transform: translateY(4%)
+    transform: translateY(15%)
+}
+
+.navbar {
+    text-align: center;
+    margin-top: -15px;
+    margin-bottom: -15px;
 }
 
 /* -- below is all the css used only for the social cards, and its probably Very Bad so get a puke bag or something read -- */
@@ -572,10 +582,6 @@ footer > .dot {
     font-size: 28px;
 }
 
-.quote > p {
-    font-size: 24px;
-}
-
 .quote > small::before {
     content: "-";
     padding-right: 1em;
@@ -591,21 +597,24 @@ footer > .dot {
     font-size: 16px;
 }
 
-.quote:nth-child(7) {
-    grid-column: 1 / 3;
-    grid-row: 4;
-}
-
-.quote:nth-child(8) {
-    grid-column: 1 / 3;
-    grid-row: 5;
-}
-
 .quote:nth-child(9) {
     grid-column: 1 / 3;
     grid-row: 6;
 }
 
+.quote:nth-child(10) {
+    grid-column: 1 / 3;
+    grid-row: 7;
+}
+
+.quote:first-child, .quote:nth-child(10) {
+    filter: blur(1rem);
+}
+
+.quote:hover {
+    filter: blur(0px);
+}
+
 .buttons-area > small > a {
     font-size: 16px;
 }
@@ -613,8 +622,8 @@ footer > .dot {
 .buttons-img:first-child {
     display: grid;
     grid-template-rows: repeat(1, 1fr);
-    grid-template-columns: repeat(4, 1fr);
-    margin: 1em 16em 1em 16em;
+    grid-template-columns: repeat(5, 1fr);
+    margin: 1em 13em 1em 13em;
     place-items: center;
 }