Adjusted styling

.idea/PersonalWebsite_Static.iml

@@ -5,6 +5,7 @@
       <excludeFolder url="file://$MODULE_DIR$/temp" />
       <excludeFolder url="file://$MODULE_DIR$/.tmp" />
       <excludeFolder url="file://$MODULE_DIR$/tmp" />
+      <excludeFolder url="file://$MODULE_DIR$/build" />
     </content>
     <orderEntry type="inheritedJdk" />
     <orderEntry type="sourceFolder" forTests="false" />

src/components/AboutMe/AboutMe.scss

@@ -1,6 +1,7 @@
 #about-me-parent {
   margin-left: 10px;
   margin-right: 10px;
+  margin-bottom: 10px;
   display: flex;
   flex-direction: row;
   justify-content: center;

src/components/ProjectGrid.scss

@@ -18,12 +18,21 @@ $breakpoints: (x-small: 430px, small: 660px, medium: 1000px, large: 1300px, x-la
   margin: 10px;
 
   @include media(">=medium")  {
-    width: 90%;
+    width: 95%;
     margin: auto;
   }
 
+  @include media(">=large")  {
+    width: 90%;
+    margin: auto;
+  }
 
   @include media(">=x-large")  {
+    width: 85%;
+    margin: auto;
+  }
+
+  @include media(">=xx-large")  {
     width: 80%;
     max-width: 1900px;
     margin: auto;
@@ -45,7 +54,7 @@ $breakpoints: (x-small: 430px, small: 660px, medium: 1000px, large: 1300px, x-la
     h2 {
       margin-bottom: 0;
       font-family: "Fira Code", monospace;
-      font-size: 24px;
+      font-size: 30px;
     }
 
     p {

src/components/ProjectGrid.tsx

@@ -288,18 +288,6 @@ export function ProjectGrid() {
             }
             link={"https://event.codeday.org/sandiego"}
           />
-          <SmallElementPic
-              image_url={KatSite}
-              image_alt={"Kat's Logo"}
-              title={"Shushicate"}
-              org={"Random Projects"}
-              text={
-                `An art gallery website for my friend, made in svelte. The images are optimized and compressed at 
-                compiletime, creating a few versions and allowing the browser to choose which to display using imageset.
-                 The full resolution image is only sent when selecting an image, keeping the site performant.`
-              }
-              link={"https://www.shushicate.com/"}
-          />
           <LargeElementPic
             image_url={Foresight}
             image_alt={"Foresight Sports Logo"}
@@ -321,6 +309,17 @@ export function ProjectGrid() {
             link={"https://github.com/JakeCover/ScoreSaverExtention"}
           />
 
+          <SmallElement
+              title={"Assorted Discord Bots"}
+              org={"Random Projects"}
+              text={
+                `I've made quite a number of discord bots over time! Some of them, like ReplyBot, which added a reply
+              functionality to Discord years before they finally implemented it first-party, have been obsoleted
+              nowadays, others like DiscordChannelMirror really aren't significantly notable, and many more have been
+              lost to time and past me's lack of understanding of the importance of backup. I digress, however I really
+               do love writing these sorts of applications!`
+              }
+          />
           <MediumElement
             image_url={Hashicorp}
             image_alt={"HashiCorp Logo"}
@@ -352,16 +351,17 @@ export function ProjectGrid() {
               networking configuration across many jobs easily.`
             }
           />
-          <SmallElement
+          <SmallElementPic
-            title={"Assorted Discord Bots"}
+              image_url={KatSite}
-            org={"Random Projects"}
+              image_alt={"Kat's Logo"}
-            text={
+              title={"Shushicate"}
-              `I've made quite a number of discord bots over time! Some of them, like ReplyBot, which added a reply
+              org={"Random Projects"}
-              functionality to Discord years before they finally implemented it first-party, have been obsoleted
+              text={
-              nowadays, others like DiscordChannelMirror really aren't significantly notable, and many more have been
+                `An art gallery website for my friend, made in svelte. The images are optimized and compressed at 
-              lost to time and past me's lack of understanding of the importance of backup. I digress, however I really
+                compiletime, creating a few versions and allowing the browser to choose which to display using imageset.
-               do love writing these sorts of applications!`
+                 The full resolution image is only sent when selecting an image, keeping the site performant.`
-            }
+              }
+              link={"https://www.shushicate.com/"}
           />
           <SmallElement
             title={"OVRTools"}