formatting for articles

css/styleHF.css

@@ -202,10 +202,35 @@ header {
   flex-grow: 1;
   position: relative;
   width: 85%; /* Adjusted width to accommodate the article list */
-  padding-left: 20%;
+  padding-left: 45%;
   padding-right: 20%; /* Add some padding for spacing */
 }
 
+#article-container h1 {
+  text-align: center;
+}
+
+#article-container h3 {
+  text-align: left;
+  position: absolute;
+  left: 20%;
+  margin-top: 2%;
+}
+
+#article-container h6 {
+  text-align: left;
+  position: absolute;
+  left: 20%;
+  margin-top: 5%;
+}
+
+#article-container p {
+  text-align: left;
+  position: absolute;
+  left: 20%;
+  margin-top: 8%;
+}
+
 /* Responsive styles for smaller screens */
 @media screen and (max-width: 768px) {
   body {

js/rants.js

@@ -51,7 +51,7 @@ const articles = [
   
   function extractTitleAndSubtitle(markdownContent) {
     const lines = markdownContent.split('\n');
-    const title = lines[0] ? lines[0].replace(/^#*\s*/, '').trim() : 'Untitled';
+    const title = lines[0] ? lines[0].replace(/^#+\s*/, '').trim() : 'Untitled';
     const subtitle = lines[3] ? lines[3].trim() : '';
     return { title, subtitle };
   }

md/rants/discord.md

@@ -1,10 +1,10 @@
 # Discord
-20th December 2023
-
-Here's the reason I hate Discord.
-
+###### 20th December 2023 - Zoey
+<br>
+### Here's the reason I hate Discord.
+<br>
 lorem ipsum butts and cakes, you are now my favourite person who bakes  
 this is still the same paragraph
 yeah
-
+<br>
 butts

md/rants/electron

@@ -1,4 +0,0 @@
-# Wayland
-21th December 2023
-
-Electron is awful and here's why.

md/rants/electron.md

@@ -1,4 +1,4 @@
 # Electron
-21th December 2023
-
-Electron is awful and here's why.
+###### 21th December 2023 - Zoey
+<br>
+### Electron is awful and here's why.

md/rants/wayland.md

@@ -1,4 +1,4 @@
 # Wayland
-*22th December 2023*  
-
-Insane defaults.
+######22th December 2023
+<br>
+### Insane defaults.