From 224898afacbf939e4221cf446a2c6420d0808fdb Mon Sep 17 00:00:00 2001
From: "HerpieDerpie@example.com" <HerpieDerpie@example.com>
Date: Thu, 11 Jan 2024 12:10:38 +0100
Subject: [PATCH] changed some more styling, and responsiveness

---
 httpdocs/project.html |  7 ++++---
 scripts/project.js    |  1 -
 styles/project.css    | 29 +++++++++++++++++++++++++----
 3 files changed, 29 insertions(+), 8 deletions(-)

diff --git a/httpdocs/project.html b/httpdocs/project.html
index 1525fbe..6fe486a 100755
--- a/httpdocs/project.html
+++ b/httpdocs/project.html
@@ -13,9 +13,10 @@
     <div id="main">
         <div id="container" onload="loadData()">
             <h1 id="title"></h1>
-            <button id="editProjectName" onclick="editProjectName()">Edit Name</button>
-            <button id="exportProject" onclick="exportProject()">Export Project</button>
-            <h2 id="description"></h2><br>
+            <div id="projectButtons">
+                <button id="editProjectName" onclick="editProjectName()">Edit Name</button>
+                <button id="exportProject" onclick="exportProject()">Export Project</button>
+            </div>
             <h3 id="section-title">Commands:</h3>
             <div id="grid" class="bot-list"> 
                 
diff --git a/scripts/project.js b/scripts/project.js
index bbdc931..9cab80c 100755
--- a/scripts/project.js
+++ b/scripts/project.js
@@ -204,7 +204,6 @@ function loadData() {
             let jsonResponse = JSON.parse(xhr.responseText);
             if (jsonResponse != {}){
                 document.querySelector("#title").innerHTML = jsonResponse.projectName.toUpperCase();
-                document.querySelector("#description").innerHTML = "Project Id: "+jsonResponse.projectId;
             }
         } else {
             console.error('Request failed. Status: ' + xhr.status);
diff --git a/styles/project.css b/styles/project.css
index 1d1a76d..7315b6c 100755
--- a/styles/project.css
+++ b/styles/project.css
@@ -60,12 +60,19 @@
     font-size: large;
 }
 
-#editProjectName,
-#exportProject {
-    color: black !important;
+#projectButtons {
+    display: flex;
+    justify-content: space-around;
+    height: 80px;
+    width: 80%;
 }
 
-
+#projectButtons > button {
+    width: 35% !important;
+    background: var(--dark-steel);
+    border: 1px solid var(--discord-blue);
+    border-radius: 10px;
+}
 
 @media only screen and (max-width: 768px) {
     #main {
@@ -94,11 +101,25 @@
         grid-auto-rows: 200px;
         gap:10px !important;
     }
+    #grid:last-child {
+        margin-bottom: 30px;
+    }
 
     .grid-btn {
         width: 100% !important;
         height: 100% !important;
     }
+
+    #projectButtons {
+        flex-direction: column;
+        align-items: center;
+        height: 200px !important;
+        row-gap: 5px;
+    }
+    #projectButtons > button {
+        width: 40% !important;
+        height: 80px;
+    }
 }
 
 @media only screen and (max-width: 768px) and (min-width: 500px) {