From 70a18c70eb719dcf30713bc38df364055c2841bc Mon Sep 17 00:00:00 2001
From: RGBCube <git@rgbcu.be>
Date: Fri, 16 Feb 2024 16:11:04 +0300
Subject: [PATCH] Fix styles

---
 site/404.tsx   | 18 ++++++++++--------
 site/index.tsx | 45 +++++++++++++++++++++++----------------------
 2 files changed, 33 insertions(+), 30 deletions(-)

diff --git a/site/404.tsx b/site/404.tsx
index 8e0d77e..0d25099 100644
--- a/site/404.tsx
+++ b/site/404.tsx
@@ -19,6 +19,15 @@ export default (_data: Lume.Data, helpers: Lume.Helpers) => {
 
   return (
     <>
+      <Cube
+        front={face}
+        back={face}
+        left={face}
+        right={face}
+        top={face}
+        bottom={face}
+      />
+
       <style
         dangerouslySetInnerHTML={{
           __html: `
@@ -44,6 +53,7 @@ export default (_data: Lume.Data, helpers: Lume.Helpers) => {
 
       .frame {
         position: absolute;
+        z-index: 99999;
 
         top: 50%;
         left: 50%;
@@ -55,14 +65,6 @@ export default (_data: Lume.Data, helpers: Lume.Helpers) => {
         }}
       >
       </style>
-      <Cube
-        front={face}
-        back={face}
-        left={face}
-        right={face}
-        top={face}
-        bottom={face}
-      />
     </>
   );
 };
diff --git a/site/index.tsx b/site/index.tsx
index 43b2914..3b8e7b2 100644
--- a/site/index.tsx
+++ b/site/index.tsx
@@ -4,6 +4,29 @@ export const title = "RGBCube";
 
 export default (
   <>
+    <Cube
+      front={
+        <a href="/about">
+          <div className="frame">about</div>
+        </a>
+      }
+      top={
+        <a href="https://github.com/RGBCube">
+          <div className="frame">github</div>
+        </a>
+      }
+      right={
+        <a href="/contact">
+          <div className="frame">contact</div>
+        </a>
+      }
+      left={
+        <a href="/blog">
+          <div className="frame">blog</div>
+        </a>
+      }
+    />
+
     <style
       dangerouslySetInnerHTML={{
         __html: `
@@ -77,27 +100,5 @@ export default (
       }}
     >
     </style>
-    <Cube
-      front={
-        <a href="/about">
-          <div className="frame">about</div>
-        </a>
-      }
-      top={
-        <a href="https://github.com/RGBCube">
-          <div className="frame">github</div>
-        </a>
-      }
-      right={
-        <a href="/contact">
-          <div className="frame">contact</div>
-        </a>
-      }
-      left={
-        <a href="/blog">
-          <div className="frame">blog</div>
-        </a>
-      }
-    />
   </>
 );