diff --git a/public/pageReqs/links/bluesky.svg b/public/pageReqs/links/bluesky.svg
new file mode 100644
index 0000000..861ecf9
--- /dev/null
+++ b/public/pageReqs/links/bluesky.svg
@@ -0,0 +1,18 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="154.4882mm"
+   height="136.00954mm"
+   viewBox="0 0 154.4882 136.00954"
+   version="1.1"
+   id="svg1"
+   xml:space="preserve"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg"><defs
+     id="defs1" /><g
+     id="layer1"
+     transform="translate(-221.0349,-26.972274)"><path
+       style="display:inline;fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:0.0661458;stroke-linecap:butt;stroke-linejoin:miter;stroke-dasharray:none;stroke-opacity:1"
+       d="m 272.25197,162.84012 c -9.62,1.07883 -16.40428,-4.17199 -23.15131,-10.02866 -9.64393,-8.37129 -15.58694,-20.84267 -7.54544,-30.61195 7.78927,-9.46285 23.28565,-11.77913 23.28565,-11.77913 0,0 -18.89623,2.48323 -30.65991,-7.98418 -5.99916,-5.338105 -9.36413,-12.318548 -10.19831,-20.394328 -1.07304,-10.388161 -2.82303,-31.643022 -2.94375,-39.490085 -0.13647,-8.871245 3.22639,-14.801606 9.08635,-15.454261 14.02204,-1.561709 30.4939,11.631424 46.50076,31.140877 15.55777,18.962099 21.65301,32.375541 21.65301,32.375541 0,0 6.09521,-13.413442 21.653,-32.375541 16.00684,-19.509453 32.4787,-32.702586 46.50074,-31.140877 5.85997,0.652655 9.22282,6.583016 9.08636,15.454261 -0.12066,7.847063 -1.87072,29.101924 -2.94376,39.490085 -0.83418,8.07578 -4.19914,15.056223 -10.19831,20.394328 -11.76368,10.46741 -30.65991,7.98418 -30.65991,7.98418 0,0 15.49638,2.31628 23.28567,11.77913 8.04149,9.76928 2.09847,22.24066 -7.54546,30.61195 -6.74702,5.85667 -13.53131,11.10749 -23.1513,10.02866 -17.49817,-1.9623 -26.02703,-34.57088 -26.02703,-34.57088 0,0 -8.52888,32.60858 -26.02705,34.57088 z"
+       id="path1-2" /></g></svg>
diff --git a/public/pageReqs/links/discord.svg b/public/pageReqs/links/discord.svg
new file mode 100644
index 0000000..d8b70b3
--- /dev/null
+++ b/public/pageReqs/links/discord.svg
@@ -0,0 +1,32 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   width="284"
+   height="216.47047"
+   viewBox="0 0 284 216.47048"
+   fill="none"
+   version="1.1"
+   id="svg4"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:dc="http://purl.org/dc/elements/1.1/">
+  <metadata
+     id="metadata10">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <defs
+     id="defs8" />
+  <path
+     d="M 240.418,17.944222 C 222.3168,9.6386216 202.906,3.5194216 182.6108,0.01470161 c -0.3696,-0.06764 -0.7388,0.1014 -0.9292,0.43948 -2.4964,4.44003999 -5.2616,10.23244039 -7.198,14.78524039 -21.8288,-3.268 -43.5456,-3.268 -64.9268,0 -1.9368,-4.654 -4.8024,-10.3452004 -7.31,-14.78524039 -0.1904,-0.3268 -0.5596,-0.49584 -0.9292,-0.43948 C 81.0336,3.5082216 61.6228,9.6274216 43.5104,17.944222 c -0.1568,0.0676 -0.2912,0.1804 -0.3804,0.3268 C 6.3118028,73.276621 -3.7742472,126.93022 1.1736328,179.91862 c 0.0224,0.2592 0.16791,0.5072 0.36941,0.6648 24.2915972,17.8392 47.8221572,28.6692 70.9157572,35.8476 0.3696,0.1128 0.7612,-0.0224 0.9964,-0.3268 5.4628,-7.46 10.3324,-15.326 14.5076,-23.598 0.2464,-0.4844 0.0112,-1.0592 -0.4924,-1.2508 -7.724,-2.93 -15.0788,-6.5024 -22.1536,-10.5592 -0.5596,-0.3268 -0.6044,-1.1272 -0.0896,-1.5104 1.4888,-1.1156 2.978,-2.2764 4.3996,-3.4484 0.2572,-0.214 0.6156,-0.2592 0.918,-0.124 46.4784,21.2204 96.7968,21.2204 142.7268,0 0.3024,-0.1464 0.6608,-0.1012 0.9292,0.1128 1.422,1.172 2.9108,2.344 4.4108,3.4596 0.5148,0.3832 0.4812,1.1836 -0.0784,1.5104 -7.0748,4.1356 -14.4296,7.6292 -22.1648,10.548 -0.5036,0.1916 -0.7276,0.7776 -0.4812,1.262 4.2648,8.2604 9.1344,16.1264 14.4964,23.5868 0.224,0.3156 0.6268,0.4508 0.9964,0.338 23.2056,-7.1784 46.736,-18.0084 71.0276,-35.8476 0.2128,-0.1576 0.3472,-0.3944 0.3696,-0.6536 5.9216,-61.2604 -9.9184,-114.473999 -41.99,-161.647598 -0.0784,-0.1576 -0.2124,-0.2704 -0.3692,-0.338 z M 94.9036,147.65422 c -13.9932,0 -25.5232,-12.8468 -25.5232,-28.624 0,-15.7772 11.3064,-28.623999 25.5232,-28.623999 14.3284,0 25.7468,12.959599 25.5228,28.623999 0,15.7772 -11.3064,28.624 -25.5228,28.624 z m 94.3676,0 c -13.9928,0 -25.5228,-12.8468 -25.5228,-28.624 0,-15.7772 11.306,-28.623999 25.5228,-28.623999 14.3288,0 25.7468,12.959599 25.5232,28.623999 0,15.7772 -11.1944,28.624 -25.5232,28.624 z"
+     fill="#000000"
+     id="path2"
+     style="stroke-width:4;stroke:none;fill:#ffffff;fill-opacity:1" />
+</svg>
diff --git a/public/pageReqs/links/github.svg b/public/pageReqs/links/github.svg
new file mode 100644
index 0000000..19fb1dc
--- /dev/null
+++ b/public/pageReqs/links/github.svg
@@ -0,0 +1,70 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+
+<svg
+   version="1.1"
+   id="Capa_1"
+   x="0px"
+   y="0px"
+   width="438.549px"
+   height="438.549px"
+   viewBox="0 0 438.549 438.549"
+   style="enable-background:new 0 0 438.549 438.549;"
+   xml:space="preserve"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg"><defs
+   id="defs6760" />
+<g
+   id="g6725"
+   style="stroke:none;fill:#ffffff;fill-opacity:1">
+	<path
+   d="M409.132,114.573c-19.608-33.596-46.205-60.194-79.798-79.8C295.736,15.166,259.057,5.365,219.271,5.365   c-39.781,0-76.472,9.804-110.063,29.408c-33.596,19.605-60.192,46.204-79.8,79.8C9.803,148.168,0,184.854,0,224.63   c0,47.78,13.94,90.745,41.827,128.906c27.884,38.164,63.906,64.572,108.063,79.227c5.14,0.954,8.945,0.283,11.419-1.996   c2.475-2.282,3.711-5.14,3.711-8.562c0-0.571-0.049-5.708-0.144-15.417c-0.098-9.709-0.144-18.179-0.144-25.406l-6.567,1.136   c-4.187,0.767-9.469,1.092-15.846,1c-6.374-0.089-12.991-0.757-19.842-1.999c-6.854-1.231-13.229-4.086-19.13-8.559   c-5.898-4.473-10.085-10.328-12.56-17.556l-2.855-6.57c-1.903-4.374-4.899-9.233-8.992-14.559   c-4.093-5.331-8.232-8.945-12.419-10.848l-1.999-1.431c-1.332-0.951-2.568-2.098-3.711-3.429c-1.142-1.331-1.997-2.663-2.568-3.997   c-0.572-1.335-0.098-2.43,1.427-3.289c1.525-0.859,4.281-1.276,8.28-1.276l5.708,0.853c3.807,0.763,8.516,3.042,14.133,6.851   c5.614,3.806,10.229,8.754,13.846,14.842c4.38,7.806,9.657,13.754,15.846,17.847c6.184,4.093,12.419,6.136,18.699,6.136   c6.28,0,11.704-0.476,16.274-1.423c4.565-0.952,8.848-2.383,12.847-4.285c1.713-12.758,6.377-22.559,13.988-29.41   c-10.848-1.14-20.601-2.857-29.264-5.14c-8.658-2.286-17.605-5.996-26.835-11.14c-9.235-5.137-16.896-11.516-22.985-19.126   c-6.09-7.614-11.088-17.61-14.987-29.979c-3.901-12.374-5.852-26.648-5.852-42.826c0-23.035,7.52-42.637,22.557-58.817   c-7.044-17.318-6.379-36.732,1.997-58.24c5.52-1.715,13.706-0.428,24.554,3.853c10.85,4.283,18.794,7.952,23.84,10.994   c5.046,3.041,9.089,5.618,12.135,7.708c17.705-4.947,35.976-7.421,54.818-7.421s37.117,2.474,54.823,7.421l10.849-6.849   c7.419-4.57,16.18-8.758,26.262-12.565c10.088-3.805,17.802-4.853,23.134-3.138c8.562,21.509,9.325,40.922,2.279,58.24   c15.036,16.18,22.559,35.787,22.559,58.817c0,16.178-1.958,30.497-5.853,42.966c-3.9,12.471-8.941,22.457-15.125,29.979   c-6.191,7.521-13.901,13.85-23.131,18.986c-9.232,5.14-18.182,8.85-26.84,11.136c-8.662,2.286-18.415,4.004-29.263,5.146   c9.894,8.562,14.842,22.077,14.842,40.539v60.237c0,3.422,1.19,6.279,3.572,8.562c2.379,2.279,6.136,2.95,11.276,1.995   c44.163-14.653,80.185-41.062,108.068-79.226c27.88-38.161,41.825-81.126,41.825-128.906   C438.536,184.851,428.728,148.168,409.132,114.573z"
+   id="path6723"
+   style="stroke:none;fill:#ffffff;fill-opacity:1" />
+</g>
+<g
+   id="g6727">
+</g>
+<g
+   id="g6729">
+</g>
+<g
+   id="g6731">
+</g>
+<g
+   id="g6733">
+</g>
+<g
+   id="g6735">
+</g>
+<g
+   id="g6737">
+</g>
+<g
+   id="g6739">
+</g>
+<g
+   id="g6741">
+</g>
+<g
+   id="g6743">
+</g>
+<g
+   id="g6745">
+</g>
+<g
+   id="g6747">
+</g>
+<g
+   id="g6749">
+</g>
+<g
+   id="g6751">
+</g>
+<g
+   id="g6753">
+</g>
+<g
+   id="g6755">
+</g>
+</svg>
diff --git a/public/pageReqs/links/spotify.svg b/public/pageReqs/links/spotify.svg
new file mode 100644
index 0000000..b8a2179
--- /dev/null
+++ b/public/pageReqs/links/spotify.svg
@@ -0,0 +1,17 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   height="168px"
+   width="168px"
+   version="1.1"
+   viewBox="0 0 168 168"
+   id="svg1938"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <defs
+     id="defs1942" />
+  <path
+     fill="#1ED760"
+     d="m83.996 0.277c-46.249 0-83.743 37.493-83.743 83.742 0 46.251 37.494 83.741 83.743 83.741 46.254 0 83.744-37.49 83.744-83.741 0-46.246-37.49-83.738-83.745-83.738l0.001-0.004zm38.404 120.78c-1.5 2.46-4.72 3.24-7.18 1.73-19.662-12.01-44.414-14.73-73.564-8.07-2.809 0.64-5.609-1.12-6.249-3.93-0.643-2.81 1.11-5.61 3.926-6.25 31.9-7.291 59.263-4.15 81.337 9.34 2.46 1.51 3.24 4.72 1.73 7.18zm10.25-22.805c-1.89 3.075-5.91 4.045-8.98 2.155-22.51-13.839-56.823-17.846-83.448-9.764-3.453 1.043-7.1-0.903-8.148-4.35-1.04-3.453 0.907-7.093 4.354-8.143 30.413-9.228 68.222-4.758 94.072 11.127 3.07 1.89 4.04 5.91 2.15 8.976v-0.001zm0.88-23.744c-26.99-16.031-71.52-17.505-97.289-9.684-4.138 1.255-8.514-1.081-9.768-5.219-1.254-4.14 1.08-8.513 5.221-9.771 29.581-8.98 78.756-7.245 109.83 11.202 3.73 2.209 4.95 7.016 2.74 10.733-2.2 3.722-7.02 4.949-10.73 2.739z"
+     id="path1936"
+     style="fill:#ffffff;fill-opacity:1;stroke:none" />
+</svg>
diff --git a/public/pageReqs/links/steam.svg b/public/pageReqs/links/steam.svg
new file mode 100644
index 0000000..0d2acc9
--- /dev/null
+++ b/public/pageReqs/links/steam.svg
@@ -0,0 +1,49 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   version="1.1"
+   viewBox="0 0 233 233"
+   id="svg3538"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <defs
+     id="defs3532">
+    <linearGradient
+       id="a"
+       x2="50%"
+       x1="50%"
+       y2="100%">
+      <stop
+         stop-color="#111D2E"
+         offset="0"
+         id="stop3517" />
+      <stop
+         stop-color="#051839"
+         offset=".21248"
+         id="stop3519" />
+      <stop
+         stop-color="#0A1B48"
+         offset=".40695"
+         id="stop3521" />
+      <stop
+         stop-color="#132E62"
+         offset=".58110"
+         id="stop3523" />
+      <stop
+         stop-color="#144B7E"
+         offset=".73760"
+         id="stop3525" />
+      <stop
+         stop-color="#136497"
+         offset=".87279"
+         id="stop3527" />
+      <stop
+         stop-color="#1387B8"
+         offset="1"
+         id="stop3529" />
+    </linearGradient>
+  </defs>
+  <path
+     id="path3534"
+     d="M 116.50195 0 C 54.761015 0 4.2419491 48.028826 0.25195312 108.75977 C 0.27018051 108.79037 0.28456079 108.8171 0.30273438 108.84766 C 0.30273732 108.8476 0.30273491 108.83008 0.30273438 108.83008 L 62.900391 134.59961 C 64.603389 133.47961 66.418471 132.5107 68.355469 131.7207 C 72.749464 129.9107 77.383958 129.10055 82.001953 129.31055 L 110.50977 87.898438 C 110.49977 87.714438 110.5 87.518265 110.5 87.322266 C 110.5 62.88229 130.35002 43 154.75 43 C 179.15998 43 199 62.88229 199 87.322266 C 199 111.76024 179.15998 131.66016 154.75 131.66016 C 154.42 131.66016 154.08 131.65062 153.75 131.64062 L 112.96094 160.78906 C 113.08094 165.28906 112.2507 169.79961 110.4707 174.09961 C 103.63071 190.54959 84.671499 198.37976 68.228516 191.50977 C 58.178526 187.31977 51.366529 178.60968 49.144531 168.67969 L 5.0429688 150.48242 C 19.586866 198.24726 63.982414 233 116.50195 233 C 180.84189 233 233.00195 180.83994 233.00195 116.5 C 233.00195 52.159064 180.84189 0 116.50195 0 z M 154.75 57.792969 C 138.50002 57.792969 125.26953 71.047282 125.26953 87.322266 C 125.26953 103.61025 138.50002 116.85938 154.75 116.85938 C 171.00998 116.85938 184.24023 103.61025 184.24023 87.322266 C 184.24023 71.047282 171.00998 57.792969 154.75 57.792969 z M 154.80078 65.085938 C 167.03077 65.085938 176.94922 75.024356 176.94922 87.277344 C 176.94922 99.531331 167.03077 109.46094 154.80078 109.46094 C 142.58079 109.46094 132.66016 99.531331 132.66016 87.277344 C 132.66016 75.024356 142.58079 65.085938 154.80078 65.085938 z M 80.917969 136.68945 C 77.803847 136.66445 74.734325 137.23031 71.861328 138.32031 L 86.753906 144.49023 C 96.111897 148.39023 100.54071 159.14954 96.636719 168.51953 C 92.744723 177.87952 82.001663 182.31992 72.638672 178.41992 L 58.234375 172.44922 C 60.785372 177.77921 65.207459 182.24946 71.064453 184.68945 C 83.76044 189.97945 98.366162 183.95022 103.66016 171.24023 C 106.22015 165.10024 106.22922 158.30062 103.69922 152.14062 C 101.16922 145.98063 96.395181 141.15961 90.242188 138.59961 C 87.190691 137.32961 84.032091 136.71445 80.917969 136.68945 z "
+     style="stroke:none;fill:#ffffff;fill-opacity:1" />
+</svg>
diff --git a/public/pageReqs/links/twitch.svg b/public/pageReqs/links/twitch.svg
new file mode 100644
index 0000000..a1a583f
--- /dev/null
+++ b/public/pageReqs/links/twitch.svg
@@ -0,0 +1,34 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   width="118px"
+   height="138px"
+   viewBox="0 0 118 138"
+   version="1.1"
+   id="svg5132"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:dc="http://purl.org/dc/elements/1.1/">
+  <defs
+     id="defs5136" />
+  <!-- Generator: Sketch 57.1 (83088) - https://sketch.com -->
+  <title
+     id="title5124">logo / glitch / black</title>
+  <desc
+     id="desc5126">Created with Sketch.</desc>
+  <path
+     d="M 117.605,0 V 68.605 L 73.503,112.704 H 53.904 L 29.401,137.207 V 112.704 H 0 V 24.502 L 24.5,0 Z m -9.8,9.801 H 29.401 v 73.503 h 22.051 v 17.15 L 68.605,83.304 H 88.206 L 107.805,63.703 Z M 93.1042,26.9518 v 29.4 h -9.8 v -29.4 z m -26.951,0 v 29.4 h -9.8 v -29.4 z"
+     id="Combined-Shape"
+     fill="#000000"
+     style="fill-rule:evenodd;stroke:none;stroke-width:1;fill:#ffffff;fill-opacity:1" />
+  <metadata
+     id="metadata5988">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:title>logo / glitch / black</dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+</svg>
diff --git a/public/pageReqs/links/twitter.svg b/public/pageReqs/links/twitter.svg
new file mode 100644
index 0000000..ec2a6fb
--- /dev/null
+++ b/public/pageReqs/links/twitter.svg
@@ -0,0 +1,32 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="1390"
+   height="1129"
+   viewBox="0 0 367.77083 298.71458"
+   version="1.1"
+   id="svg859"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:dc="http://purl.org/dc/elements/1.1/">
+  <defs
+     id="defs853" />
+  <metadata
+     id="metadata856">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <path
+     d="m 115.66115,298.71458 c 138.79074,0 214.68466,-114.9134 214.68466,-214.558434 0,-3.263934 -0.0666,-6.513143 -0.21301,-9.747661 C 344.86583,63.764007 357.67174,50.480448 367.77083,35.359094 354.25144,41.364996 339.7023,45.408146 324.43964,47.231241 340.0186,37.895244 351.97861,23.126765 357.62026,5.520719 343.04169,14.158336 326.8964,20.436243 309.7066,23.825119 295.93713,9.166898 276.33474,0 254.62872,0 c -41.66885,0 -75.45996,33.771258 -75.45996,75.400895 0,5.917679 0.66197,11.673658 1.95655,17.194364 C 118.41242,89.441616 62.804908,59.434165 25.5935,13.805485 19.11331,24.949849 15.37673,37.895244 15.37673,51.70808 c 0,26.162806 13.32078,49.26017 33.57779,62.77162 -12.37927,-0.38226 -24.00831,-3.77852 -34.17361,-9.43156 -0.0111,0.3164 -0.0111,0.62486 -0.0111,0.963 0,36.52058 26.00902,67.01322 60.535688,73.9233 -6.34043,1.72754 -13.01187,2.65378 -19.8966,2.65378 -4.854628,0 -9.584208,-0.47752 -14.181368,-1.35994 9.60625,29.96334 37.461488,51.76688 70.48764,52.37704 -25.825142,20.23039 -58.35846,32.27897 -93.71628,32.27897 -6.08301,0 -12.09243,-0.34579 -17.99889,-1.04389 33.39394,21.39192 73.047378,33.87418 115.66506,33.87418"
+     style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:1.23377"
+     id="path3611-8" />
+</svg>
diff --git a/public/pageReqs/links/youtube.svg b/public/pageReqs/links/youtube.svg
new file mode 100644
index 0000000..9e82951
--- /dev/null
+++ b/public/pageReqs/links/youtube.svg
@@ -0,0 +1,24 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Generator: Adobe Illustrator 22.0.1, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+
+<svg
+   version="1.1"
+   id="Layer_1"
+   x="0px"
+   y="0px"
+   width="1000px"
+   height="700.0002441px"
+   viewBox="0 0 1000 700.0002441"
+   enable-background="new 0 0 1000 700.0002441"
+   xml:space="preserve"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg"><defs
+   id="defs9106">
+	
+	
+</defs>
+<path
+   id="path9097"
+   d="M 500 0 C 500 0 187.29158 0.00046727104 109.30664 20.896484 C 66.281743 32.397064 32.397114 66.281843 20.896484 109.30664 C 0.00051727099 187.29148 -2.3684734e-15 350 0 350 C 0 350 0.00051527099 512.70852 20.896484 590.69336 C 32.397112 633.71816 66.281745 667.60292 109.30664 679.10352 C 187.29158 699.99954 500 700 500 700 C 500 700 812.7084 699.99954 890.69336 679.10352 C 933.71822 667.60292 967.60286 633.71816 979.10352 590.69336 C 999.99944 512.70852 1000 350 1000 350 C 1000 350 999.99943 187.29147 979.10352 109.30664 C 967.60286 66.281833 933.71822 32.39706 890.69336 20.896484 C 812.70839 0.00046327104 500 0 500 0 z M 400 200 L 659.79688 350.00391 L 400 500 L 400 200 z "
+   style="fill:#ffffff;fill-opacity:1;stroke:none" />
+</svg>
diff --git a/src/components/Footer.astro b/src/components/Footer.astro
index da5a7ad..dc0b836 100644
--- a/src/components/Footer.astro
+++ b/src/components/Footer.astro
@@ -8,11 +8,16 @@
         padding: 0.5rem;
         background-color: #71578e50;
         backdrop-filter: blur(10px);
+		
+        display: flex;
+        justify-content: center;
     }
     .frame {
         display: flex;
         flex-direction: row;
         justify-content: center;
+		width: 100%;
+        max-width: 120ch;
     }
 </style>
 
diff --git a/src/components/Header.astro b/src/components/Header.astro
index f2ab4e1..422fe05 100644
--- a/src/components/Header.astro
+++ b/src/components/Header.astro
@@ -2,12 +2,6 @@
 import HeaderButton from './buttons/HeaderButton.astro';
 ---
 <style>
-    nav {
-        display: flex;
-        align-items: flex-end;
-        justify-content: flex-start;
-        height: 100%;
-    }
     a {
         text
         margin: 0.2em;
@@ -19,7 +13,40 @@ import HeaderButton from './buttons/HeaderButton.astro';
         padding-bottom: 0;
         background-color: #71578e50;
         backdrop-filter: blur(10px);
+
+        display: flex;
+        justify-content: center;
     }
+    nav {
+        display: flex;
+        align-items: flex-end;
+        justify-content: flex-start;
+        height: 100%;
+        width: 100%;
+        max-width: 120ch;
+    }
+
+	.wipTab {
+        padding-left: 0.4rem;
+        padding-right: 0.4rem;
+        margin-left: 0.1rem;
+        margin-right: 0.1rem;
+
+        width: 5rem;
+        height: 2.5rem;
+        border-top-left-radius: 0.5rem;
+        border-top-right-radius: 0.5rem;
+
+        display: flex;
+        justify-content:center;
+        align-items: center;
+
+        font-weight: bold;
+        color: #202020;
+        background: #f1ad8a;
+        text-decoration: none;
+    }
+
 </style>
 
 <script>
@@ -33,6 +60,7 @@ import HeaderButton from './buttons/HeaderButton.astro';
 <header>
     <nav>
         <img class="logo" src="/melogo.svg" height=45px />
+		<div class="wipTab"><h2>WIP</h2></div>
         <HeaderButton location="/" text="home" class="homeBtn" />
         <HeaderButton location="/links/" text="my links" class="linksBtn" />
         <HeaderButton location="/thoughts/" text="thoughts" class="thoughtsBtn" />
diff --git a/src/components/buttons/Social.astro b/src/components/buttons/Social.astro
index 2dca10e..158e270 100644
--- a/src/components/buttons/Social.astro
+++ b/src/components/buttons/Social.astro
@@ -1,31 +1,77 @@
 ---
-const { platform, username } = Astro.props;
+const { name, icon, username, link, buttonColor, buttonHover } = Astro.props;
 ---
-<style>
+<style define:vars={{ buttonColor, buttonHover }}>
     a {
-        margin: 1rem 0;
+        text-decoration: none;
+
+        display: inline-block;
+
         width: 100%;
-        height: 3rem;
-        border-radius: 0.5rem;
+        height: 4rem;
+    }
+	div {
+		position: relative;
+		overflow: hidden;
 
         display: flex;
+		flex-direction: column;
         justify-content: center;
         align-items: center;
 
-        font-size: 1.5rem;
-        font-weight: bold;
+        width: 100%;
+        height: 100%;
+
+		border-radius: 0.75rem;
+		background: var(--buttonColor);
+
+		transition: all 0.1s ease-in-out;
+	}
+	p {
+		margin: 0;
         color: #f5f5f5;
-        background: #cbabee;
-        text-decoration: none;
-    }
-    a:hover {
-        transition: 0.2s;
-        background-color: #856c9f;
+	}
+	.icon {
+		position: absolute;
+		left: -0.75rem;
+		top: 15%;
+
+		object-fit:contain;
+		object-position: top left;
+
+		mask-image: linear-gradient(90deg, rgba(0, 0, 0, 0.80) 0%, transparent 90%);
+
+		width: 10rem;
+		height: 70%;
+
+	}
+	.platname {
+		font-family: 'Comfortaa';
+		font-weight: bold;
+        font-size: 1.5rem;
+	}
+	.username {
+		font-family: 'Bahnschrift';
+		font-weight: 600;
+        font-size: 1rem;
+	}
+    a:hover > div {
+		width: calc(100% + 0.3rem);
+		height: calc(100% + 0.3rem);
+		margin: -0.15rem;
+        background-color: var(--buttonHover);
     }
-    a:active {
-        transition: 0.1s;
-        background-color: #e0bb65;
+    a:active > div {
+		width: calc(100% - 0.5rem);
+		height: calc(100% - 0.5rem);
+		margin: 0.25rem;
     }
 </style>
 
-<a href={`https://www.${platform}.com/${username}`}>{platform}</a>
\ No newline at end of file
+<a href={link}>
+	<div>
+		<p class="platname">{name}</p>
+		<p class="username">{username}</p>
+		<img class="icon" src={icon} />
+	</div>
+</a>
\ No newline at end of file
diff --git a/src/layouts/BaseLayout.astro b/src/layouts/BaseLayout.astro
index 493e5c7..dd3ec17 100644
--- a/src/layouts/BaseLayout.astro
+++ b/src/layouts/BaseLayout.astro
@@ -16,29 +16,26 @@ const { pageTitle } = Astro.props;
 	</head>
 
 	<style>
-		html, body {
-			height: 100%;
+		html {margin: 0}
+		body {
+			min-height: 100vh;
 			margin: 0;
 			display: flex;
-  			flex-flow: column;
+  			flex-direction: column;
 		}
-		.header {
-			position: sticky;
-			top: 0;
+		.header, .footer {
+			width: 100%;
 		}
 		.main {
+			flex: 1;
+
 			height: 100%;
 			width: 100%;
 			margin: 0 auto;
-			max-width: 80ch;
+			max-width: 100ch;
 			padding-left: 1rem;
 			padding-right: 1rem;
 		}
-		.footer {
-			position: sticky;
-			bottom: 0;
-			margin-block-start: auto;
-		}
 	</style>
 	
 	<body>
diff --git a/src/pages/index.astro b/src/pages/index.astro
index 469fa68..8f88f58 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -6,8 +6,28 @@ const pageTitle = "home";
 <!-- <script type="module" src="https://unpkg.com/@fluentui/web-components">
 </script> -->
 
+<style>
+	h3 {
+		margin: 0;
+		color: #202020;
+	}
+
+	.warning {
+		border-radius: 0.5rem;
+		background-color: #f1ad8a;
+		padding: 0.5rem;
+		margin-top: 2rem;
+
+		display: flex;
+		justify-content: center;
+	}
+</style>
+
 <BaseLayout pageTitle={pageTitle}>
-	<h2>hey all, rin here</h2>
-    <h3>minorly stupid and majorly silly</h3>
-	<p>im doing trolling here soon</p>
+	<div class="warning">
+		<h3>this site is still a massive WIP, so yeah. you can mess around but there isnt a lot to look at yet</h3>
+	</div>
+
+	<h1>welcome to the rinzone</h1>
+	<p>the future home for... something</p>
 </BaseLayout>
\ No newline at end of file
diff --git a/src/pages/links.astro b/src/pages/links.astro
index 784a728..302aa19 100644
--- a/src/pages/links.astro
+++ b/src/pages/links.astro
@@ -1,11 +1,23 @@
 ---
 import BaseLayout from "../layouts/BaseLayout.astro";
 import Social from '../components/buttons/Social.astro';
+import socialLinks from '../resources/socialLinks.json';
+
 const pageTitle = "my links";
 ---
 
 <style>
+
+	.discordLink {
+		margin-bottom: 0.5rem;
+	}
+
     ul {
+		display: grid;
+		grid-template-columns: 1fr 1fr 1fr;
+		column-gap: 0.5rem;
+		row-gap: 0.5rem;
+
         list-style-type: none; /* Remove bullets */
         padding: 0; /* Remove padding */
         margin: 0; /* Remove margins */
@@ -21,8 +33,12 @@ const pageTitle = "my links";
     
     <h2 class="headerthingy">how 2 find me</h2>
 
-    <ul>
-        <Social platform='twitter', username='rinuwaii'/>
-        <Social platform='youtube', username='@rinuwaii'/>
+	<div class="discordLink">
+		<Social name={socialLinks.discord.platname} icon={socialLinks.discord.icon} username={socialLinks.discord.username} link={socialLinks.discord.link} buttonColor={socialLinks.discord.buttonColor} buttonHover={socialLinks.discord.hoverColor} />
+	</div>
+    <ul class="mainLinks">
+		{socialLinks.platforms.map((link) => (
+			<Social name={link.platname} icon={link.icon} username={link.username} link={link.link} buttonColor={link.buttonColor} buttonHover={link.hoverColor} />
+		))}
     </ul>
 </BaseLayout>
\ No newline at end of file
diff --git a/src/resources/socialLinks.json b/src/resources/socialLinks.json
new file mode 100644
index 0000000..57b2ba0
--- /dev/null
+++ b/src/resources/socialLinks.json
@@ -0,0 +1,84 @@
+{
+	"discord":{
+		"platname":"orbit hangout",
+		"icon":"/pageReqs/links/discord.svg",
+		"username":"me & my friends internet oasis",
+		"link":"https://discord.gg/qfcheraFa4",
+		"buttonColor":"#7289da",
+		"hoverColor":"#5768a6"
+	},
+	"platforms":[
+	   {
+		"platname":"twitter",
+		"icon":"/pageReqs/links/twitter.svg",
+		"username":"@rinuwaii",
+		"link":"https://twitter.com/rinuwaii",
+		"buttonColor":"#1A91DA",
+		"hoverColor":"#125A87"
+	   },
+	   {
+		"platname":"bluesky",
+		"icon":"/pageReqs/links/bluesky.svg",
+		"username":"@rin.orbithub.xyz",
+		"link":"https://bsky.app/profile/rin.orbithub.xyz",
+		"buttonColor":"#006acc",
+		"hoverColor":"#004f99"
+	   },
+	   {
+		"platname":"main spotify playlist",
+		"icon":"/pageReqs/links/spotify.svg",
+		"username":"",
+		"link":"https://open.spotify.com/playlist/2ThKG2YcUXUykX4AzAe40h",
+		"buttonColor":"#1ED360",
+		"hoverColor":"#16a048"
+	   },
+	   {
+		"platname":"youtube",
+		"icon":"/pageReqs/links/youtube.svg",
+		"username":"@rinuwaii",
+		"link":"https://youtube.com/@rinuwaii",
+		"buttonColor":"#ff0000",
+		"hoverColor":"#a50000"
+	   },
+	   {
+		"platname":"yt - music posting",
+		"icon":"/pageReqs/links/youtube.svg",
+		"username":"@fitemusic",
+		"link":"https://youtube.com/@fitemusic",
+		"buttonColor":"#ff0000",
+		"hoverColor":"#a50000"
+	   },
+	   {
+		"platname":"yt - stream archives",
+		"icon":"/pageReqs/links/youtube.svg",
+		"username":"@fitestreams",
+		"link":"https://youtube.com/@fitestreams",
+		"buttonColor":"#ff0000",
+		"hoverColor":"#a50000"
+	   },
+	   {
+		"platname":"twitch",
+		"icon":"/pageReqs/links/twitch.svg",
+		"username":"fiteuwu",
+		"link":"https:/twitch.tv/fiteuwu",
+		"buttonColor":"#9147FF",
+		"hoverColor":"#7338cc"
+	   },
+	   {
+		"platname":"steam",
+		"icon":"/pageReqs/links/steam.svg",
+		"username":"rinuwaii",
+		"link":"https://steamcommunity.com/id/rinuwaii/",
+		"buttonColor":"#72b2e4",
+		"hoverColor":"#588ab1"
+	   },
+	   {
+		"platname":"github",
+		"icon":"/pageReqs/links/github.svg",
+		"username":"rinuwaii",
+		"link":"https://github.com/rinuwaii",
+		"buttonColor":"#000000",
+		"hoverColor":"#202020"
+	   }
+	]
+ }
\ No newline at end of file