added members section (and a few other things)

goldstargloww · Jan 8, 2024 · 0933883 · 0933883
1 parent b079e90
commit 0933883
Show file tree

Hide file tree

Showing 3 changed files with 102 additions and 7 deletions.
diff --git a/site/index.html b/site/index.html
@@ -5,6 +5,7 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>starglowwOS</title>
     <link href="/style.css" rel="stylesheet" type="text/css" media="all">
+    <link href="/site/style.css" rel="stylesheet" type="text/css" media="all"> <!-- this guy's only for the local copy -->
   </head>
   <body>
 
@@ -21,7 +22,7 @@ <h1 class="center">starglowwOS</h1>
         a basic list of terms we use and how to refer to us is over at our <a href="https://pronouns.cc/@starglowwOS">prns.cc</a>, but here's a summary that goes into a bit more depth.
       </p>
       <p>
-        generally, you don't need to refer to us collectively unless that's specifically your goal — <a href="/gold">gold</a> is our very frontstuck host, so just use their terms.
+        generally, you don't need to refer to us collectively unless that's specifically your goal — <a href="/members/gold">gold</a> is our very frontstuck host, so just use their terms.
       </p>
       <p>
         collectively, we use <a href="https://pronouns.cc/pronouns/they/them/their/theirs/themselves,they%2Fthem">they/them</a>, <a href="https://pronouns.cc/pronouns/it/it/its/its/itself,it%2Fits">it/its</a>, and <a href="https://pronouns.cc/pronouns/.sys/.sys/.sys's/.sys's/.sysself,.sys%2F.sysself">.sys/.sysself</a> pronouns. with they/them and it/its, we usually add an &amp; to the end to signify you're talking about the collective. in terms of second person pronouns, <a href="https://pronouns.cc/pronouns/you%26/you%26/your%26/yours%26/yourselves%26,you%26%2Fyours%26">you&amp;/yours&amp;</a> is preferred :&gt;
@@ -32,6 +33,31 @@ <h1 class="center">starglowwOS</h1>
       <p>
         we use terms like headmates, members, and sysmates to refer to ourselves - please don't use terms like alters, parts, shards, or personalities to refer to us! we're fine with most terms in terms of the collective, though. plural and system are both fine — multiple is as well, though we prefer the other two.
       </p>
+
+      <h2 class="center">members</h2>
+
+      <div class="profile" id="gold">
+        <img src="https://files.catbox.moe/nwla4y.png" alt="gold's profile picture">
+        <h2 class="center name"><a href="/members/gold">gold</a></h2>
+        <p class="center pronouns">
+          <a href="https://pronouns.cc/pronouns/they/them/their/theirs/themself,they%2Fthem">they</a> <a href="https://pronouns.cc/pronouns/vae/vaem/vaer/vaers/vaemselves,vae%2Fvaem">vae</a> <a href="https://pronouns.cc/pronouns/voi/void/vois/voids/voidself,voi%2Fvoids">void</a> <a href="https://pronouns.cc/pronouns/end/ender/ends/enders/enderselves,end%2Fenders">ender</a> <a href="https://pronouns.cc/pronouns/it/it/its/its/itself,it%2Fits">it</a> <a href="https://pronouns.cc/@starglowwOS/goldstargloww">+</a>
+        </p>
+        <p class="art-credit center">
+          pfp by <a href="https://goldstargloww.neocities.org">goldstargloww</a>
+        </p>
+      </div>
+
+      <div class="profile" id="martyn">
+        <img src="https://files.catbox.moe/1cy8zj.png" alt="martyn's profile picture">
+        <h2 class="center name"><a href="/members/martyn">martyn</a></h2>
+        <p class="center pronouns">
+          <a href="https://pronouns.cc/pronouns/he/him/his/his/himself,he%2Fhim">he</a> <a href="https://pronouns.cc/pronouns/vae/vaem/vaer/vaers/vaemselves,vae%2Fvaem">vae</a>
+        </p>
+        <p class="art-credit center">
+          <a href="https://www.tumblr.com/cherrifire/715230722619850752">pfp</a> by <a href="https://cherrifire.tumblr.com/">cherrifire</a>
+        </p>
+      </div>
+
     </div>
 
   </body>

diff --git a/site/not_found.html b/site/not_found.html
@@ -3,13 +3,19 @@
   <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Not Found</title>
+    <title>[sgOS] page not found</title>
     <link href="/style.css" rel="stylesheet" type="text/css" media="all">
+    <link href="/site/style.css" rel="stylesheet" type="text/css" media="all"> <!-- this guy's only for the local copy -->
   </head>
   <body>
     <div class="main">
-      <h1>Page Not Found</h1>
-      <p>The requested page was not found.</p>
+      <h1 class="center">page not found</h1>
+      <p class="center">the page you're looking for isn't here.</p>
+      <p class="center">
+        <br>
+        <a class="button" href="javascript:history.back()">go back</a>
+      </p>
+
     </div>
 
   </body>

diff --git a/site/style.css b/site/style.css
@@ -3,6 +3,10 @@
   src: url('FairfaxHD.ttf');
 }
 
+* {
+  box-sizing: border-box;
+}
+
 .main {
   color: white;
   min-height: 99.8vh;
@@ -22,6 +26,12 @@ body {
   text-align: center;
 }
 
+.button {
+  background-color: black;
+  box-shadow: #FFF1 0px 0px 5px;
+  padding: 1em;
+}
+
 h1 {
   font-size: 2.5em;
 }
@@ -54,14 +64,67 @@ p {
   font-size: 1em;
 }
 
+a {
+  text-decoration: none;
+}
+
 a:link {
-  color: #ff9
+  color: #ff9;
 }
 
 a:visited {
-  color: #fA7
+  color: #fA7;
 }
 
 a:hover, a:active {
-  color: #fC7
+  color: #fC7;
+  cursor: pointer;
+}
+
+div.profile {
+  float: left;
+  background-color: black;
+  width: 45%;
+  margin: 2.5%;
+  padding: 1em;
+  border-radius: 2.5%
+}
+
+@media only screen and (max-width: 600px) {
+  div.profile {
+    width: 100%;
+  }
+}
+
+div.profile > img {
+  width: 100%;
+  border-radius: 2.5%;
+}
+
+.art-credit {
+  font-size: 0.5em;
+  color: #fff5;
+  margin: 0.5em;
+  padding: 0;
+}
+
+.art-credit > a:link {
+  color: #ff95;
+}
+
+.art-credit > a:visited {
+  color: #fA75;
+}
+
+.art-credit > a:hover, a:active {
+  color: #fC75;
+  cursor: pointer;
+}
+
+.pronouns {
+  margin: 0.5em;
+}
+
+.name {
+  margin: 0.25em;
 }