Activities are back!
This commit is contained in:
Bingus_Violet
parent
a66a3a9198
commit
10ed08795a
9 changed files with 368 additions and 93 deletions
BIN
static/imgs/notFound.png
Normal file
BIN
static/imgs/notFound.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 27 KiB |
|
|
@ -25,7 +25,7 @@
|
|||
<main class="animatedMain">
|
||||
<p>{RANDOM_QUOTE}</p>
|
||||
<div id="card">
|
||||
<h2>Violet</h2>
|
||||
<h2>{Violet}</h2>
|
||||
<div style="display: flex; justify-content: center; align-items: center;">
|
||||
<img src="https://api.violets-purgatory.dev/v1/pfp" class="pfp">
|
||||
<div>
|
||||
|
|
@ -34,23 +34,19 @@
|
|||
<p>{DISCORD_STATUS}</p>
|
||||
</div>
|
||||
</div>
|
||||
<a class="chip" href="https://https://ko-fi.com/bingus_violet">Donate (Ko-fi)</a>
|
||||
<div>
|
||||
<p style="padding: 10px;">Hi! I'm Violet, a 15 year old web and game developer. <br> I aspire to make fast and Javascript free websites! I'm currently learning the Godot Engine, and have been becoming quite fluent in NodeJS.</p>
|
||||
<hr>
|
||||
<div>
|
||||
<p style="padding: 10px;">Hi! I'm Violet, a 15 year old web and game developer. <br> I aspire to make fast and Javascript free websites! I'm currently learning the Godot Engine, but most of my time recently has been spent learning NodeJS.</p>
|
||||
<a class="chip" href="https://beta.violets-purgatory.dev">Beta site</a>
|
||||
<a class="chip" href="https://blog.violets-purgatory.dev">Blog</a>
|
||||
<a class="chip" href="https://fs.violets-purgatory.dev">Clipdump</a>
|
||||
{CUSTOM_STATUS}
|
||||
</div>
|
||||
</div>
|
||||
{ACTIVITIES}
|
||||
|
||||
<div style="padding-bottom: 20px;">
|
||||
<h3>Main Projects</h3>
|
||||
<a class="chip" href="https://univerter.dev">Univerter</a>
|
||||
<a class="chip" href="https://codeberg.org/bingus_violet/steamrpc">{Steam}RPC</a>
|
||||
|
||||
</div>
|
||||
|
||||
<h2>Socials</h2>
|
||||
<hr>
|
||||
<h1>Socials</h1>
|
||||
{PATH_SOCIALS}
|
||||
</main>
|
||||
</body>
|
||||
|
|
|
|||
|
|
@ -11,8 +11,8 @@
|
|||
}
|
||||
|
||||
#card {
|
||||
background-color: rgb(75, 25, 100);
|
||||
padding: 15px;
|
||||
background-color: rgb(25, 5, 80);
|
||||
padding: 15px 5px;
|
||||
border: 2px white solid;
|
||||
margin: 20px auto;
|
||||
width: 95%;
|
||||
|
|
@ -43,6 +43,90 @@
|
|||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.activity {
|
||||
border-width: 3px;
|
||||
border-radius: 10px;
|
||||
overflow: hidden;
|
||||
margin: auto;
|
||||
padding: 0;
|
||||
display: flex;
|
||||
position: relative;
|
||||
z-index: 3;
|
||||
}
|
||||
|
||||
.activity>p {
|
||||
width: 100%;
|
||||
overflow-wrap: break-word;
|
||||
padding: 5px;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.activity>img {
|
||||
width: 128px;
|
||||
aspect-ratio: 1/1;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
.activity>.smallimg {
|
||||
width: 64px;
|
||||
height: 64px;
|
||||
position: absolute;
|
||||
bottom: 0px;
|
||||
left: 72px;
|
||||
border-radius: 50px;
|
||||
background: black;
|
||||
padding: 5px;
|
||||
/* border: 2px gray solid; */
|
||||
transform: scale(0.9);
|
||||
}
|
||||
|
||||
.activity>.smallimg:hover {
|
||||
transform: scale(1);
|
||||
}
|
||||
|
||||
img:not(.project-inner > div > img) {
|
||||
width: 100%;
|
||||
max-width: 135px;
|
||||
transition: all 2s cubic-bezier(0.075, 0.82, 0.165, 1);
|
||||
}
|
||||
|
||||
@media screen and (min-width: 750px) {
|
||||
.activity-container {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
grid-gap: 10px;
|
||||
}
|
||||
|
||||
.activity {
|
||||
margin: auto;
|
||||
width: 100%;
|
||||
align-content: center;
|
||||
/* border: 2px white solid; */
|
||||
}
|
||||
}
|
||||
|
||||
.lengthBar {
|
||||
background-color: rgb(50, 40, 60);
|
||||
display: inline-block;
|
||||
width: 80%;
|
||||
height: 10px;
|
||||
padding: 0;
|
||||
overflow: hidden;
|
||||
border-radius: 5px;
|
||||
margin-right: 1.9%;
|
||||
}
|
||||
|
||||
.lengthBar>span {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
width: 100%;
|
||||
background-color: rgb(200, 200, 230);
|
||||
height: 20px;
|
||||
display: block;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
|
||||
@keyframes mainText {
|
||||
0% {
|
||||
transform: translateY(calc(50vh - 6rem)) scale(1.5);
|
||||
|
|
|
|||
|
|
@ -23,44 +23,41 @@
|
|||
<body>
|
||||
<h1>Socials</h1>
|
||||
<main>
|
||||
<p>Here's most of the sites you can find me on- if you needed that for some reason?</p>
|
||||
<div class="grid-container">
|
||||
<div class="grid-child">
|
||||
<div>
|
||||
<h3>Social Media</h3>
|
||||
<a class="chip" href="https://www.youtube.com/channel/UChcrBJNJLZucy3TPyGyAY2g">Youtube: <span
|
||||
style="color: white;">{Violet}'s Fiasco</span></a>
|
||||
<a class="chip" href="https://ko-fi.com/bingus_violet">Ko-fi: <span
|
||||
style="color: white;">Bingus_{Violet}</span></a>
|
||||
<a class="chip" href="https://void.lgbt/bingus_violet" rel="me">Fedi: <span
|
||||
style="color: white;">bingus_violet​@void.lgbt</span></a>
|
||||
<a class="chip" href="https://www.youtube.com/channel/UChcrBJNJLZucy3TPyGyAY2g">Youtube: {Violet}'s Fiasco</a>
|
||||
<a class="chip" href="https://ko-fi.com/bingus_violet">Ko-fi: Bingus_{Violet}</a>
|
||||
<a class="chip" href="https://void.lgbt/bingus_violet" rel="me">Fedi: bingus_violet​@void.lgbt</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="grid-child">
|
||||
<div>
|
||||
<h3>Chat</h3>
|
||||
<a class="chip" href="https://matrix.to/#/@bingus_violet:catgirl.cloud">Matrix: <span
|
||||
style="color: white;">@bingus_violet:​catgirl.cloud</span></a>
|
||||
<a class="chip" href="https://matrix.to/#/@bingus_violet:catgirl.cloud">Matrix: @bingus_violet:​catgirl.cloud</a>
|
||||
<p class="chip">Discord: {DISCORD_USER}</p>
|
||||
<p class="chip">Revolt: Bingus{Violet}#5573</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="grid-child">
|
||||
<div>
|
||||
<h3>Coding</h3>
|
||||
<a class="chip" href="https://codeberg.org/Bingus_violet">Codeberg: <span
|
||||
style="color: white;">bingus_violet</span></a>
|
||||
<a class="chip" href="https://hub.docker.com/u/bingusviolet">Docker: <span
|
||||
style="color: white;">bingusviolet</span></a>
|
||||
<a class="chip" href="https://github.com/violets-puragtory">Github: <span
|
||||
style="color: white;">violets-puragtory</span></a>
|
||||
<a class="chip" href="https://codeberg.org/Bingus_violet">Codeberg: bingus_violet</a>
|
||||
<a class="chip" href="https://hub.docker.com/u/bingusviolet">Docker: bingusviolet</a>
|
||||
<a class="chip" href="https://github.com/violets-puragtory">Github: violets-puragtory</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="grid-child">
|
||||
<div>
|
||||
<h3>Games</h3>
|
||||
<a class="chip" href="https://steamcommunity.com/id/violet-The-Thigh-high-obtainer/">Steam: <span
|
||||
style="color: white;">{Violet}</span></a>
|
||||
<a class="chip" href="https://steamcommunity.com/id/violet-The-Thigh-high-obtainer/">Steam: {Violet}</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<p class="note">Please note I am extremely unhinged and gay on Fedi, I don't use Github, and I barely understand Docker.</p>
|
||||
</main>
|
||||
</body>
|
||||
|
||||
|
|
|
|||
|
|
@ -40,7 +40,7 @@
|
|||
transform: scale(1.05);
|
||||
}
|
||||
|
||||
#topbar > * {
|
||||
#topbar>* {
|
||||
display: inline-block;
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
|
|
@ -83,7 +83,7 @@ h3 {
|
|||
grid-template-columns: 1fr 1fr;
|
||||
grid-gap: 10px;
|
||||
}
|
||||
|
||||
|
||||
.grid-child {
|
||||
margin: auto;
|
||||
align-content: center;
|
||||
|
|
@ -91,8 +91,6 @@ h3 {
|
|||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
.chip {
|
||||
position: relative;
|
||||
z-index: 3;
|
||||
|
|
@ -129,8 +127,12 @@ h3 {
|
|||
}
|
||||
|
||||
hr {
|
||||
border: 2px gray solid;
|
||||
margin: 20px;
|
||||
color: white;
|
||||
border: white solid;
|
||||
opacity: 0.25;
|
||||
border-width: 2px;
|
||||
margin: 15px 10%;
|
||||
/* background-color: none; */
|
||||
}
|
||||
|
||||
p {
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue