Added typescript, added new logo, improved margins

src/components/navbar.astro

@@ -1,5 +1,5 @@
 ---
-import headerimg from "/link_192.png"
+import headerimg from "/logo.svg"
 ---
 
 <header>
@@ -9,7 +9,7 @@ import headerimg from "/link_192.png"
     <ul class="desktop">
         <slot />
     </ul>
-    <button class="mobile">
+    <button class="mobile" aria-label="Navigation Button">
         <ul>
             <slot />
         </ul>

src/components/technologyCard.astro

@@ -26,15 +26,15 @@ article {
     transition: transform var(--speed) var(--ease);
     height: auto;
     width: auto;
-    line-height: 128px;
+    line-height: 100px;
 }
 article:hover {
     transform: scale(var(--hover-scale));
 }
 article > div {
     background-size: contain;
-    width: 128px;
+    width: 100px;
-    height: 128px;
+    height: 100px;
 }
 
 article:hover h2 {
@@ -43,8 +43,8 @@ article:hover h2 {
     font-size: 18px;
     display: inline-block;
     vertical-align: center;
-    line-height: normal;
+    line-height: 150%;
-    width: 90%;
+    width: 95%;
     border-radius: 5px;
     opacity: 90%;
 }

src/layouts/baseSection.astro

@@ -32,7 +32,7 @@ const { title } = Astro.props;
 	}
     div > h1 {
         color: white;
-        margin: 0.5rem 0px;
+        margin: 0.5rem 0px 0.5rem 0.5em;
         padding: 0.25rem 0.75rem;
         width: max-content;
         background-color: #1e1e1e;

src/layouts/basicSection.astro

@@ -16,7 +16,7 @@ const { title } = Astro.props;
 <style>
     h1 {
         color: white;
-        margin: 0.5rem 0px;
+        margin: 0.5rem 0px 0.5rem 0.5em;
         padding: 0.25rem 0.75rem;
         width: max-content;
         background-color: #1e1e1e;

src/layouts/contactSection.astro

@@ -15,7 +15,7 @@ const { title } = Astro.props;
 <style>
 h1 {
     color: white;
-    margin: 0.5rem 0px;
+    margin: 0.5rem 0px 0.5rem 0.5em;
     padding: 0.25rem 0.75rem;
     width: max-content;
     background-color: #1e1e1e;

src/layouts/customFooter.astro

@@ -3,7 +3,7 @@
 ---
 
 <footer>
-    <div>Disclaimer:
+    <div>
         “Fate/Grand Order” is a trademark of Notes Co., Ltd. | Game Assets © Aniplex Inc. used under fair
         use. | View <a class="linker" href="https://fate-go.us" target="_blank" rel="noopener noreferrer">the
             official website</a> for

src/layouts/taSection.astro

@@ -25,7 +25,7 @@ const { title } = Astro.props;
     }
     h1 {
         color: white;
-        margin: 0.5rem 0px;
+        margin: 0.5rem 0px 0.5rem 0.5em;
         padding: 0.25rem 0.75rem;
         width: max-content;
         background-color: #1e1e1e;

src/pages/about.astro

@@ -18,12 +18,17 @@ const techologydata = [{
 		"title": "GitLab",
 		"link": "https://gitlab.io",
 		"image": "gitlab"
+	},
+	{
+		"title": "Typescript",
+		"link": "https://www.typescriptlang.org/",
+		"image": "typescript"
 	},]
 ---
 
 <Layout title="About - Firq FGO Site" currentpage="about">
     <BasicSection title="About">
-        This is a small sideproject that I'm creating.
+        This is a small sideproject that I'm creating. First time doing webdev in general, and first project using Typescript.
     </BasicSection>
     <BasicSection title="Technologies used">
         {techologydata.map((item) => (<TechnologyCard {...item}/>))}
@@ -31,7 +36,9 @@ const techologydata = [{
     <ContactSection title="Contact me">
 		{contactdata.map((item) => (<ContactCard {...item}/>))}
 	</ContactSection>
-    <CustomFooter />
+	<BasicSection title="Disclaimers">
+		<CustomFooter />
+	</BasicSection>
 </Layout>
 
 <style>

static/logo.svg

@@ -0,0 +1,58 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="110.08279mm"
+   height="101.08971mm"
+   viewBox="0 0 110.08279 101.08971"
+   version="1.1"
+   id="svg5"
+   xml:space="preserve"
+   inkscape:export-filename="bitmap.svg"
+   inkscape:export-xdpi="96"
+   inkscape:export-ydpi="96"
+   inkscape:version="1.2.2 (732a01da63, 2022-12-09)"
+   sodipodi:docname="logo_2.svg"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg"><sodipodi:namedview
+     id="namedview7"
+     pagecolor="#000000"
+     bordercolor="#000000"
+     borderopacity="0.25"
+     inkscape:showpageshadow="2"
+     inkscape:pageopacity="0"
+     inkscape:pagecheckerboard="true"
+     inkscape:deskcolor="#d1d1d1"
+     inkscape:document-units="mm"
+     showgrid="false"
+     inkscape:zoom="0.76880612"
+     inkscape:cx="165.84155"
+     inkscape:cy="226.32494"
+     inkscape:window-width="1920"
+     inkscape:window-height="1017"
+     inkscape:window-x="-8"
+     inkscape:window-y="-8"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="g429" /><defs
+     id="defs2" /><g
+     inkscape:label="Layer 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(160.03878,-49.932608)"><g
+       id="g429"
+       transform="translate(-210.61878,-24.090382)"
+       inkscape:export-filename="g429.svg"
+       inkscape:export-xdpi="96"
+       inkscape:export-ydpi="96"
+       inkscape:groupmode="layer"><path
+         style="fill:#ffffff;stroke-width:0.107"
+         d="m 87.179998,136.57997 v 23.84826 l 13.810092,-13.81009 v -9.79482 h 16.73028 l 12.50209,-12.50209 h -29.23237 v -9.94692 h 35.71155 l 12.16748,-12.16747 H 87.179998 v 22.14481 H 67.955379 Z"
+         id="path302" /><path
+         style="fill:#ffffff;stroke-width:0.107"
+         d="m 74.013398,131.76579 2.989789,1.97885 c 0,0 -24.434533,22.32662 -12.819526,37.81329 l 1.419613,-5.97957 c 0,0 15.830822,6.4958 44.094006,-10.36747 0,0 -0.6883,-12.26028 10.88369,-6.71089 0,0 13.20669,-8.08749 25.25188,-21.76738 -0.25811,-0.34415 -3.52752,-5.42034 -3.52752,-5.42034 l 0.086,-3.78563 5.3343,7.05504 c 0,0 23.23001,-28.048086 -8.77579,-24.09038 l -3.26936,-1.290557 c 0,0 39.2329,-8.861819 13.59385,27.703937 0,0 17.12138,25.89716 9.37805,39.6631 -7.74334,13.76593 -36.13558,-6.88297 -36.47973,-8.25956 -0.34414,-1.3766 24.95076,16.51912 33.72654,5.85052 8.77578,-10.6686 -9.80823,-37.51217 -8.60371,-35.10313 0,0 -13.07764,14.79838 -25.2949,22.02549 0,0 1.54867,10.75464 -10.06634,6.79693 0,0 -43.104576,26.15527 -59.19351,14.02405 0,0 -12.174247,-12.04519 21.272668,-40.1363 z"
+         id="path358" /><path
+         style="fill:#ffffff;stroke-width:0.107"
+         d="m 84.058227,118.30098 0.08604,-9.37804 c 0,0 -5.420336,-10.410486 -1.892816,-20.56286 -0.94641,-0.344147 -6.280709,0.602261 -6.280709,0.602261 0,0 15.400637,-16.51912 45.083428,10.152375 0.43019,0.172074 5.59241,0.08604 5.59241,0.08604 0,0 -28.134123,-30.543163 -48.524911,-24.348493 0,0 -17.293454,5.850508 5.936558,43.448717 z"
+         id="path360" /></g></g></svg>