From 999eaf1570b89827918dd3e064ac5283fcd97b3d Mon Sep 17 00:00:00 2001
From: Alex <alex@scerba.org>
Date: Sat, 10 Feb 2024 13:19:15 -0500
Subject: Site restructure and blog post

---
 .../media/20240209_Bike-ride-group-sidex1000.jpg   | Bin 0 -> 340377 bytes
 static/style.css                                   |  76 +++++++++++++++------
 2 files changed, 54 insertions(+), 22 deletions(-)
 create mode 100644 static/media/20240209_Bike-ride-group-sidex1000.jpg

(limited to 'static')

diff --git a/static/media/20240209_Bike-ride-group-sidex1000.jpg b/static/media/20240209_Bike-ride-group-sidex1000.jpg
new file mode 100644
index 0000000..b0ece39
Binary files /dev/null and b/static/media/20240209_Bike-ride-group-sidex1000.jpg differ
diff --git a/static/style.css b/static/style.css
index 89dcbe1..caf9776 100644
--- a/static/style.css
+++ b/static/style.css
@@ -50,17 +50,17 @@ main {
     padding: 1.75rem;
     padding-top: 5rem;
     padding-bottom: 3rem;
-    max-width: 85rem;
+    max-width: 80rem;
     margin-left: auto;
     margin-right: auto;
 }
 
-header {
+.top-bar {
     position: fixed;
     width: 100%;
     display: flex;
     align-items: center;
-    padding: 1rem;
+    padding: .7rem 1.5rem;
     background-color: white;
 }
 
@@ -75,23 +75,37 @@ header {
     filter: invert(70%)
 }
 
-.name {
-    font-size: 2rem;
-    font-weight: bold;
-    margin: auto 1rem;
-    color: rgb(100, 100, 100)
-}
-
 .landing-page {
   padding: 0;
-  height: 100vh;
+  min-height: 100vh;
+  min-height: 100svh;
   display: flex;
   align-items: center;
   justify-content: center;
 }
 
+.landing-text {
+  display: flex;
+  flex-direction: column;
+}
+
+.landing-page span {
+  font-size: 2rem;
+  font-weight: bolder;
+}
+
+.down-arrow {
+  position: absolute;
+  bottom: 4rem;
+  border: solid black;
+  border-width: 0 3px 3px 0;
+  display: block;
+  padding: 1rem;
+  transform: rotate(45deg);
+}
+
 h1 {
-  font-size: 5rem;
+  font-size: 2.5rem;
   color: rgb(190, 190, 190);
   margin: 0;
 }
@@ -118,24 +132,32 @@ b {
 h2, h3, h4, h5, h6 {
   margin-top: 2rem;
   margin-bottom: 0.7rem;
+  font-size: 1.5rem;
 }
 
 h3, h4, h5, h6 {
   opacity: 50%;
 }
 
+.name {
+  font-weight: bold;
+  margin: auto .3rem;
+  color: rgb(100, 100, 100)
+}
+
 .main-nav-position {
     display: flex;
     justify-content: right;
     flex-grow: 1;
-    padding-right: 2rem;
 }
 
 .main-nav {
     display: flex;
     gap: 2rem;
-    padding-top: .5rem;
-    padding-bottom: .5rem;
+}
+
+.main-nav a {
+  font-size: .8rem;
 }
 
 .toggler, .hamburger {
@@ -148,8 +170,24 @@ h3, h4, h5, h6 {
     gap: 1rem;
 }
 
+figure {
+  max-width: 30rem;
+  margin: 2rem auto;
+}
+
+figcaption {
+  font-style: italic;
+  color: rgb(177, 177, 177);
+  margin-top: 0.3rem;
+}
+
 img {
     max-width: 100%;
+    height: auto;
+    display: block;
+    font-style: italic;
+    color: rgb(177, 177, 177);
+    background-color: rgb(73, 73, 73);
 }
 
 .thumbnail img {
@@ -204,9 +242,6 @@ blockquote {
 }
 
 @media screen and (max-width: 45rem) {
-    .landing-text h1 {
-      font-size: 3rem;
-    }
     nav {
       display: none;
     }
@@ -214,10 +249,6 @@ blockquote {
       height: 1.5rem;
     }
 
-    header {
-        width: 100%;
-    }
-
     .even-2-col-grid {
         grid-template-columns: 1fr;
     }
@@ -247,6 +278,7 @@ blockquote {
       padding: 5px;
       /*border-bottom-left-radius: 8px;
       background-color: var(--dark-transparent);*/
+      background-color: white;
     
     /* FOR DISPLAYING EVERY ELEMENT IN THE CENTER : */
     
-- 
cgit v1.2.3