new file: images/steam-icon.svg

modified: index.css modified: index.html new file: popdxo/index.html I added my profile to the site instead of using carrd. Still not finished but I'm tired
popdxo · Jun 4, 2024 · 76947ba · 76947ba
1 parent da1a502
commit 76947ba
Show file tree

Hide file tree

Showing 4 changed files with 107 additions and 11 deletions.
diff --git a/images/steam-icon.svg b/images/steam-icon.svg
diff --git a/index.css b/index.css
@@ -10,14 +10,13 @@ h1 {
     font-weight: 800;
     margin:auto;
 }
-#introdiv {
-    background-image: url(images/aurora.jpg);
+.introdiv {
     background-size: cover;
     background-position: center;
     background-repeat: no-repeat;
     margin: 0 -8px;
 }
-#introtext {
+.introtext {
     text-align: center;
     color: white;
     font-family: "Comfortaa", sans-serif;
@@ -32,13 +31,14 @@ h1 {
     border: solid rgba(0, 0, 0, 0);
     border-radius: 2vw;
     padding: 1vw;
+
 }
 .linkbutton {
     font-family: "Comfortaa", sans-serif;
     color:aqua;
     text-decoration: none;
     text-align: center;
-    font-size: 2.5vw;
+    font-size: 3.5vw;
     margin: .4vw;
     padding:.78vw;
     display:block;
@@ -47,11 +47,14 @@ h1 {
 .linkicon{
     vertical-align: middle;
     padding-left: 1vw;
-    width: 3vw;
+    width: 4vw;
 }
 .flex{
     display:flex;
     align-items: stretch;
     justify-content: center;
 }
 /* styling this made me actually want to end it*/
+.kms{
+    color: white;
+}
diff --git a/index.html b/index.html
@@ -9,18 +9,15 @@
 
 <body>
     <h1>popd</h1>
-    <div id="introdiv">
+    <div class="introdiv" style="background-image: url(images/aurora.jpg);">
         <div style="backdrop-filter: brightness(80%) blur(0.7px) saturate(125%);">
             <div style="margin: 10px; padding: 120px 20%;">
-                <P class="frostedglass" id="introtext">A WIP site made to learn more web development</P>
+                <P class="frostedglass introtext">A WIP site made to learn more web development</P>
                 <div class="flex">
                     <a href="https://github.com/popdxo/popd.site" class="frostedglass linkbutton">GitHub
                         <img src="images/github-mark-white.svg" class="linkicon">
                     <a>
-                    <a href="https://discordapp.com/users/445022016060260358/" class="frostedglass linkbutton">Discord
-                        <img src="images/discord-mark-white.svg" class="linkicon">
-                    <a>
-                    <a href="" class="frostedglass linkbutton" style="color: gray;">Carrd (TBA)<a>
+                    <a href="./popdxo" class="frostedglass linkbutton">Profile<a>
                 </div>
             </div>
         </div>

diff --git a/popdxo/index.html b/popdxo/index.html
@@ -0,0 +1,37 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <link rel="stylesheet" href="/index.css">
+    <link href='https://fonts.googleapis.com/css?family=Comfortaa' rel='stylesheet'>
+    <title>popd</title>
+</head>
+<body>
+    <h1>popd</h1>
+    <div class="introdiv" style="background-image: linear-gradient(to bottom right, pink, lightcyan); margin-top:10px">
+        <div class="flex" style="padding: 5px;">
+            <div class="frostedglass introtext" style="margin: 10px; font-size: 6vw;">popdxo
+                <img src="https://avatars.githubusercontent.com/u/63986294?v=4" style="border-radius:2vw; width: 27vw; padding-top: 1vw;">
+            </div>
+            <div class="frostedglass introtext" style="margin: 10px;">
+                Highschool student that has interestests in everything computer related n stuff. I think I'm generally chilled out person. I'm interested in design, reverse engineering, and coding. When I touch grass I play Pickelball.
+            </div>
+        </div>
+        <div class="flex" style="margin: -5px 10px 0 10px; padding-bottom: 5px;">
+            <a href="https://github.com/popdxo" class="frostedglass linkbutton">GitHub
+                <img src="/images/github-mark-white.svg" class="linkicon">
+            </a>
+            <a href="https://discordapp.com/users/445022016060260358/" class="frostedglass linkbutton">Discord
+                <img src="/images/discord-mark-white.svg" class="linkicon">
+            </a>
+            <a href="https://steamcommunity.com/id/popdxo/" class="frostedglass linkbutton">Steam
+                <img src="/images/steam-icon.svg" class="linkicon">
+            </a>
+        </div>
+    </div>
+    <div class="introdiv" style="background-color: dimgray;"><h1 style="font-family: Comfortaa; padding: 10px;">Projects</h1></div>
+    <div class="introdiv flex" style="background-color: rgb(58,58,58); padding: 1vw;">
+        <p class="frostedglass linkbutton kms">popd.site</p>
+        <p class="frostedglass linkbutton kms">popdMC server</p>
+        <p class="frostedglass linkbutton kms">Matrix Private Server</p>
+    </div>
+</html>