New ui I guess ??

This commit is contained in:
Violet 2023-11-07 19:00:16 +00:00 committed by GitHub
parent f56f7fd9ab
commit 821dd7ff87
4 changed files with 43 additions and 59 deletions

View file

@ -5,7 +5,8 @@
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/css/bootstrap.min.css" integrity="sha384-rbsA2VBKQhggwzxH7pPCaAqO46MgnOM80zW1RWuH61DGLwZJEdK2Kadq2F9CUG65" crossorigin="anonymous">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/css/bootstrap.min.css"
integrity="sha384-rbsA2VBKQhggwzxH7pPCaAqO46MgnOM80zW1RWuH61DGLwZJEdK2Kadq2F9CUG65" crossorigin="anonymous">
<link rel="stylesheet" href="./style.css">
<title>Violet's Purgatory</title>
@ -13,53 +14,36 @@
<body>
<h1>Welcome to Violet's&nbsp;Purgatory</h1>
<hr>
<h2>...Who?</h2>
<p>Hi! I'm Violet, a generic web and game developer. <br> If it wasn't already clear, though, I am not a graphic
designer TwT.</p>
<br>
<div id="maindiv">
<div class="container-fluid row" id="card">
<h2>Violet</h2>
<div class="col-sm-6">
<img src="https://api.lanyard.rest/534132311781015564.png" class="pfp">
</div>
<div class="col-sm-6">
<p>Pronouns: They/Them</p>
<p>Gender: Non-binary</p>
<p>Game & web developer</p>
</div>
<div>
<br>
<a rel="me" style="display: none;" href="https://tech.lgbt/@Bingus_Violet" />
<p class="chip"><a href="s">Socials</a></p>
<p class="chip"><a href="p">Pronouns</a></p>
<p style="color: lightgray"><em>The world's worst developer</em></p>
</div>
</div>
<hr>
<div class="container-fluid row" id="card">
<div class="col-sm-6">
<img src="https://api.lanyard.rest/534132311781015564.png" class="pfp">
</div>
<div class="col-sm-6">
<p>Name: Violet</p>
<p>Pronouns: They/Them</p>
<p>Gender: Non-binary</p>
</div>
<p style="color: lightgray"><em>The world's worst developer</em></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>
<br><br>
<p>If you have any problems with the site, put up an issue on <a
href="https://codeberg.org/Bingus_Violet/Violets-Purgatory">codeberg!</a></p>
</div>
<hr>
<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>
<br><br>
<p class="chip" style="color: rgb(200, 175, 255);">Fedi: <a rel="me"
href="https://tech.lgbt/@Bingus_Violet">@Bingus_Violet@tech.lgbt</a></p>
<p class="chip"><span style="color: limegreen">Matrix</span>: @bingus_violet:catgirl.cloud</p>
<p class="chip"><span style="color: red;">Revolt</span>: BingusViolet#5573</p>
<p class="chip"><span style="color: rgb(125, 150, 225)">Discord</span>: bingus_violet</p>
<p class="chip"><a href="s">More</a></p>
<hr>
<h2>Where did you get this very original website design?</h2>
<p style="font-size: 1.35rem;">Uhmmmmmm..... nowhere :></p>
<p style="font-size: 0.9rem; color: gray">3 versions (including this one) of my website have been a direct rip off
of my <a href="https://lunasother.nl">girlfriend's websites</a> T^T</p>
<hr>
<h1>Stuff im hosting!</h1>
<p>If you have anything I should host, please put an issue up on <a
href="https://codeberg.org/Bingus_Violet/Violets-Purgatory">codeberg!</a></p>
<p class="chip">(New, please try! Report bugs!) NoJS Youtube Converter: <a
href="https://yt.violets-purgatory.dev">yt.violets-purgatory.dev</a></p>
<p class="chip">SearXNG: <a href="https://search.violets-purgatory.dev">search.violets-purgatory.dev</a></p>
<!-- <p class="chip">Osana Proxy: <a href="https://osana.violets-purgatory.dev">osana.violets-purgatory.dev</a></p> -->
<p class="chip">Fortnite (web): <a href="https://fortnite.violets-purgatory.dev">fortnite.violets-purgatory.dev</a>
</p>
<hr>
<p>If you have any problems with the site, put up an issue on <a
href="https://codeberg.org/Bingus_Violet/Violets-Purgatory">codeberg!</a></p>
</body>
</html>

View file

@ -39,7 +39,7 @@
<p class="chip fine">Mx</p>
<h2>Other words</h2>
<p class="chip love">Any silly Enby/Slime related terms</p>
<p class="chip love">Any silly Enby/Slime/Moth related terms</p>
<p class="chip like">Dude, Partner, Bro</p>
<p class="chip silly">Guy, Pardner</p>

View file

@ -9,21 +9,19 @@
<title>Socials - Violet's Purgatory</title>
</head>
<body>
<h1>Socials</h1>
<a class="chip" href="/">Home</a>
<h1>Socials<hr></h1>
<h2>Chat Applications:</h2>
<p class="chip"><span style="color: limegreen">Matrix</span>: @bingus_violet:catgirl.cloud</p>
<p class="chip"><span style="color: red;">Revolt</span>: BingusViolet#5573</p>
<p class="chip"><span style="color: rgb(125, 150, 225)">Discord</span>: bingus_violet</p>
<h2>Social media:</h2>
<p class="chip" style="color: rgb(200, 175, 255);">Fedi: <a href="https://tech.lgbt/@Bingus_Violet">@Bingus_Violet@tech.lgbt</a></p>
<p class="chip" style="color: rgb(255, 80, 80)">Youtube: <a href="https://www.youtube.com/channel/UChcrBJNJLZucy3TPyGyAY2g">Violet's Fiasco</a></p>
<br>
<h2>Git sites:</h2>
<p class="chip">Github: <a href="https://github.com/Violets-puragtory">Violets-puragtory</a></p>
<p class="chip" style="color: aqua">Codeberg: <a href="https://codeberg.org/Bingus_Violet">Bingus_Violet</a></p>
<h2>Game sites:</h2>
<p class="chip" style="color: darkgrey">Steam: <a href="https://steamcommunity.com/id/Violet-The-Thigh-high-obtainer/">Violet</a></p>
<h2>Chat Applications:</h2>
<p class="chip"><span style="color: limegreen">Matrix</span>: @bingus_violet:catgirl.cloud</p>
<p class="chip"><span style="color: red;">Revolt</span>: BingusViolet#5573</p>
<p class="chip"><span style="color: rgb(125, 150, 225)">Discord</span>: bingus_violet</p>
<br>
</body>
</html>

View file

@ -21,10 +21,12 @@ body {
margin: auto;
background-color: rgb(10, 5, 20);
max-width: 1100px;
}
animation-name: "fade-in";
animation-duration: 1.5s;
animation-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
#maindiv {
animation-name: fade-in;
animation-duration: .75s;
animation-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1);
}
a {
@ -66,8 +68,8 @@ p {
}
img {
width: 45%;
max-width: 175px;
width: 60%;
max-width: 135px;
border: darkgray 4px solid;
border-radius: 50%;
transform: scale(0.95);