From 7cb0732467f982bb8b7f4003fd07bb2d891d6e71 Mon Sep 17 00:00:00 2001
From: Tim <53166177+TimMcCool@users.noreply.github.com>
Date: Sun, 12 Jan 2025 02:11:50 +0100
Subject: [PATCH] Revert "[website] fixed navbar and added a new mobile menu.
 also fixed the codeboxes going off screen in the getting started section."

---
 website/source/css/style.css | 43 +++---------------------------------
 website/source/index.html    | 43 +++---------------------------------
 2 files changed, 6 insertions(+), 80 deletions(-)

diff --git a/website/source/css/style.css b/website/source/css/style.css
index 50e91f56..8526c142 100644
--- a/website/source/css/style.css
+++ b/website/source/css/style.css
@@ -1,23 +1,11 @@
-
-
-@media only screen and (max-width: 800px) {
+@media (max-width: 768px) {
     .nav-buttons {
         display: none; /* Hides the navigation buttons */
     }
-    #menu-button {
-        display: block!important;
-    }
-    .nav-buttons {
-        display: none!important; /* Hides the navigation buttons */
-    }
 
     /* You can also hide the logo if needed */
     .logo {
-        display: block; /* Hides the logo */
-    }
-
-    .logo img {
-        width: 100px!important;
+        display: none; /* Hides the logo */
     }
 
     /* Stack columns in section 1 */
@@ -38,20 +26,12 @@
     margin: 0;
     padding: 0;
     box-sizing: border-box;
-    /* overflow-x: hidden; */
-}
-
-#menu-button {
-    background-color: rgba(107, 0, 0, 0);
-    color: white;
-    border: none;
 }
 
 body {
     font-family: 'IBM Plex Sans', sans-serif;
     background-color: #121212;
     color: #ffffff;
-    overflow-x: hidden;
 }
 
 /* Sticky Header */
@@ -64,9 +44,8 @@ header {
     border-bottom: 1px solid #333;
     position: sticky;
     top: 0;
-    z-index: 10000000000000000000000000000000000000;
+    z-index: 1000;
     box-shadow: 0 4px 8px rgba(0, 0, 0, 0.25); /* Added shadow for the header */
-    height: 6vh;
 }
 
 .logo-section {
@@ -488,20 +467,4 @@ a {
     font-size: 14px; /* Font size for author */
     color: #aaa; /* Slightly lighter color for author */
     margin: 0;
-}
-
-.menu {
-    top: 6vh;
-    position: absolute;
-    width: 100vw;
-    height: 100vh;
-    background-color: rgba(0, 0, 0, 0.767);
-    backdrop-filter: blur(10px);
-    margin: 0;
-    left: 0;
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    justify-content: center;
-    gap: 10%;
 }
\ No newline at end of file
diff --git a/website/source/index.html b/website/source/index.html
index e9e32196..e32c7147 100644
--- a/website/source/index.html
+++ b/website/source/index.html
@@ -28,42 +28,7 @@ <h1 style="font-family: 'Fira Code', monospace; cursor: pointer;" onclick="scrol
                 <i data-feather="download" class="icon"></i> Install
             </button>
         </div>
-
-        <button onclick="openorclose();" class=" filled-btn" id="menu-button" style="display: none">
-            <i data-feather="more-vertical" class="icon"></i>
-        </button>
-
-        <div class="menu" style="display: none" id="menu">
-            <button onclick="openwin('https://github.com/TimMcCool/scratchattach/wiki/Documentation', '_blank');" class="">
-            </i>Documentation
-        </button>
-        <button onclick="openwin('https://github.com/TimMcCool/scratchattach/', '_blank');" class="">
-            <i data-feather="github" class="icon"></i> Source
-        </button>
-        <button onclick="scrollToSection('installation');" class="filled-btn">
-            <i data-feather="download" class="icon"></i> Install
-        </button>
-        </div>
     </header>
-
-    <script>
-    let open = 0;
-    function openorclose() {
-        if (open === 0) {
-            document.getElementById('menu').style = "display: flex;";
-            open = 1;
-        } else { 
-            document.getElementById('menu').style = "display: none;";
-            open = 0;
-        }
-    }
-
-    function openwin(win, target) {
-        window.open(win, target);
-    }
-    </script>
-
-
     <div class="background-container">
         <div class="background-image"></div> <!-- New div for the background image -->
         <section class="section-1" id="intro">
@@ -206,19 +171,19 @@ <h3>... and more!</h3>
         <div class="content">
             <h2 style="padding-top:20px">Getting started</h2>
             <p style="margin-bottom:20px">Log in with your Scratch account:</p>
-            <div class="expand-box" data-width="90%" id="logInCmd">
+            <div class="expand-box" data-width="700px" id="logInCmd">
                 <p id="expandText0" data-text="import scratchattach as sa" margin="0"></p>
                 <p id="expandText1" data-text="session = sa.login('username', 'password')" margin="0"></p>
             </div>                    
             <p style="margin-bottom:20px">Set and get cloud variables anytime:</p>
-            <div class="expand-box" data-width="90%" id="cloudCmd">
+            <div class="expand-box" data-width="700px" id="cloudCmd">
                 <p id="expandText0" data-text="cloud = session.connect_cloud('project_id')"></p>
                 <p id="expandText1" data-text="‎"></p>
                 <p id="expandText2" data-text="cloud.set_var('variable', 'value')"></p>
                 <p id="expandText3" data-text="cloud.get_var('variable')"></p>
             </div>                    
             <p style="margin-bottom:20px">Follow users, love their projects and comment:</p>
-            <div class="expand-box" data-width="90%" id="siteCmd">
+            <div class="expand-box" data-width="700px" id="siteCmd">
                 <p id="expandText0" data-text="user = session.connect_user('username')"></p>
                 <p id="expandText1" data-text="user.follow()"></p>
                 <p id="expandText2" data-text="‎"></p>
@@ -277,8 +242,6 @@ <h2 style="padding-top:20px">Community Projects</h2>
             const section = document.getElementById(sectionId);
             const elementPosition = section.getBoundingClientRect().top + window.scrollY; // Add current scroll position
             window.scrollTo({ behavior: 'smooth', top: elementPosition-75});
-            document.getElementById('menu').style = "display: none;";
-            open = 0;
         }
 
     </script>