Pronouns!
This commit is contained in:
parent
c8f5ec940b
commit
36c9ce6654
3 changed files with 112 additions and 3 deletions
|
@ -16,9 +16,10 @@
|
||||||
<hr>
|
<hr>
|
||||||
<h2>...Who?</h2>
|
<h2>...Who?</h2>
|
||||||
<p>Hi! I'm Violet, a 14 year old web and game developer. <br> If it wasn't already clear, though, I am not a graphic designer TwT.</p>
|
<p>Hi! I'm Violet, a 14 year old web and game developer. <br> If it wasn't already clear, though, I am not a graphic designer TwT.</p>
|
||||||
<p class="chip">Violet</p>
|
<p class="chip">Violet</p><br>
|
||||||
<p class="chip">They/Them</p>
|
<p class="chip">They/Them</p>
|
||||||
<p class="chip">Non-Binary</p>
|
<p class="chip">Non-Binary</p>
|
||||||
|
<p class="chip"><a href="p">(More info)</a></p>
|
||||||
<hr>
|
<hr>
|
||||||
<h2>Where you can find me:</h2>
|
<h2>Where you can find me:</h2>
|
||||||
<p class="chip" style="border-color: red;">Ko-Fi: <a href="https://ko-fi.com/bingus_violet" style="color: rgb(255, 100, 100)">bingus_violet</a> - Please donate!</p>
|
<p class="chip" style="border-color: red;">Ko-Fi: <a href="https://ko-fi.com/bingus_violet" style="color: rgb(255, 100, 100)">bingus_violet</a> - Please donate!</p>
|
||||||
|
|
47
static/p/index.html
Normal file
47
static/p/index.html
Normal file
|
@ -0,0 +1,47 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
|
||||||
|
<title>Pronouns - Violet's Purgatory</title>
|
||||||
|
|
||||||
|
<link rel="stylesheet" href="/style.css">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<h1>Preferences</h1>
|
||||||
|
<p class="chip love">Love</p>
|
||||||
|
<p class="chip like">Like</p>
|
||||||
|
<p class="chip silly">Fine if used Silly/Jokingly</p>
|
||||||
|
<p class="chip fine">Neutral</p>
|
||||||
|
<p class="chip hate">Hate</p>
|
||||||
|
<hr>
|
||||||
|
|
||||||
|
<h1>Names</h1>
|
||||||
|
<p class="chip love">Violet, Vivi, Vi, V</p>
|
||||||
|
<p class="chip like">Purple</p>
|
||||||
|
<p class="chip silly">Purple guy</p>
|
||||||
|
<hr>
|
||||||
|
|
||||||
|
<h1>Pronouns</h1>
|
||||||
|
<p class="chip love">They/Them</p>
|
||||||
|
<p class="chip like">She/Her</p>
|
||||||
|
<p class="chip fine">Other</p>
|
||||||
|
<p class="chip hate">He/Him</p>
|
||||||
|
<hr>
|
||||||
|
|
||||||
|
<h1>Words</h1>
|
||||||
|
<h2>Honorifics</h2>
|
||||||
|
<p class="chip like">Mrs/Ms, Miss, Ma'am</p>
|
||||||
|
<p class="chip silly">Sir, Mr</p>
|
||||||
|
<p class="chip fine">Mx</p>
|
||||||
|
|
||||||
|
<h2>Other words</h2>
|
||||||
|
<p class="chip love">Any silly Enby/Slime related terms</p>
|
||||||
|
<p class="chip like">Dude, Partner</p>
|
||||||
|
<p class="chip silly">Guy, Pardner</p>
|
||||||
|
|
||||||
|
<hr>
|
||||||
|
<h2>This page will be updated over time!</h2>
|
||||||
|
</body>
|
||||||
|
</html>
|
|
@ -1,7 +1,7 @@
|
||||||
@import url('https://fonts.googleapis.com/css2?family=Rubik:wght@300;400&display=swap');
|
/* @import url('https://fonts.googleapis.com/css2?family=Rubik:wght@300;400&display=swap'); */
|
||||||
|
|
||||||
:root {
|
:root {
|
||||||
font-family: 'Rubik', Verdana, Geneva, Tahoma, sans-serif;
|
font-family: Verdana, Geneva, Tahoma, sans-serif;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
|
@ -22,6 +22,10 @@ body {
|
||||||
margin: auto;
|
margin: auto;
|
||||||
background-color: black;
|
background-color: black;
|
||||||
max-width: 1100px;
|
max-width: 1100px;
|
||||||
|
|
||||||
|
animation-name: "fade-in";
|
||||||
|
animation-duration: 1.5s;
|
||||||
|
animation-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
|
||||||
}
|
}
|
||||||
|
|
||||||
a {
|
a {
|
||||||
|
@ -82,3 +86,60 @@ hr {
|
||||||
border-width: 2px;
|
border-width: 2px;
|
||||||
margin: 20px 10%;
|
margin: 20px 10%;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.love::before {
|
||||||
|
content: "<3 ";
|
||||||
|
color: rgb(255, 100, 150);
|
||||||
|
}
|
||||||
|
|
||||||
|
.like::before {
|
||||||
|
content: ":) ";
|
||||||
|
color: limegreen;
|
||||||
|
}
|
||||||
|
|
||||||
|
.silly::before {
|
||||||
|
content: ":P ";
|
||||||
|
color: aqua;
|
||||||
|
}
|
||||||
|
|
||||||
|
.fine::before {
|
||||||
|
content: ":/ ";
|
||||||
|
color: yellow;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hate::before {
|
||||||
|
content: ">:( ";
|
||||||
|
color: red;
|
||||||
|
}
|
||||||
|
|
||||||
|
.love {
|
||||||
|
border-color: rgb(255, 100, 150);
|
||||||
|
}
|
||||||
|
|
||||||
|
.like {
|
||||||
|
border-color: limegreen;
|
||||||
|
}
|
||||||
|
|
||||||
|
.silly {
|
||||||
|
border-color: aqua;
|
||||||
|
}
|
||||||
|
|
||||||
|
.fine {
|
||||||
|
border-color: yellow;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hate {
|
||||||
|
border-color: red;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes fade-in {
|
||||||
|
0% {
|
||||||
|
opacity: 0;
|
||||||
|
transform: translateY(20%)
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
opacity: 1;
|
||||||
|
transform: none;
|
||||||
|
}
|
||||||
|
}
|
Loading…
Reference in a new issue