Add images and branding [docs]

bboonstra · Oct 20, 2024 · 3c0190a · 3c0190a
1 parent 0739641
commit 3c0190a
Show file tree

Hide file tree

Showing 8 changed files with 17 additions and 7 deletions.
diff --git a/.DS_Store b/.DS_Store
diff --git a/docs/images/bannerlogo.png b/docs/images/bannerlogo.png
diff --git a/docs/images/bannerlogotextbottom.png b/docs/images/bannerlogotextbottom.png
diff --git a/docs/images/bannerlogotextright.png b/docs/images/bannerlogotextright.png
diff --git a/docs/images/squarelogo.png b/docs/images/squarelogo.png
diff --git a/docs/images/squarelogotext.png b/docs/images/squarelogotext.png
diff --git a/docs/index.html b/docs/index.html
@@ -10,7 +10,7 @@
     <body>
         <main>
             <h1 class="effortless">Databases should be <i>Effortless</i>.</h1>
-            <!-- Rest of your content -->
+            <img src="./images/bannerlogotextright.png" alt="Effortless Logo" class="banner-logo">
         </main>
     </body>
 </html>
diff --git a/docs/styles.css b/docs/styles.css
@@ -1,7 +1,7 @@
 :root {
-    --primary-color: #3498db;
-    --secondary-color: #2c3e50;
-    --text-color: #333;
+    --primary-color: #6a8eff;
+    --secondary-color: #373737;
+    --text-color: #373737;
     --background-color: #f4f4f4;
     --sidebar-width: 20%;
     --sidebar-collapsed-width: 0px;
@@ -55,9 +55,9 @@ nav ul li a:hover {
 }
 
 main {
-    max-width: 800px;
     margin: 5rem auto 2rem;
     padding: 0 1rem;
+    margin-left: 0px;
 }
 
 h1,
@@ -86,6 +86,12 @@ a:hover {
     text-decoration: underline;
 }
 
+.banner-logo {
+    width: 80vw;
+    height: auto;
+    padding: 0px;
+    margin: 0px;
+}
 #sidebarToggle {
     background: none;
     border: none;
@@ -113,8 +119,8 @@ a:hover {
     top: 0;
     bottom: 0;
     width: var(--sidebar-width);
-    background-color: var(--secondary-color);
-    color: white;
+    background-color: var(--text-color);
+    color: var(--background-color);
     padding: 1rem;
     padding-top: 5rem;
     overflow-y: auto;
@@ -132,6 +138,10 @@ a:hover {
     display: none;
 }
 
+#sidebar a {
+    color: var(--background-color);
+}
+
 main {
     padding: 1rem;
 }