Links are in a grid layout

This commit is contained in:
Violet 2024-04-16 20:01:16 +00:00 committed by GitHub
parent a65c5c129e
commit f44d193dfb
2 changed files with 11 additions and 2 deletions

View file

@ -45,14 +45,14 @@
<hr> <hr>
<div> <div>
<p style="padding: 10px;">Hi! I'm Violet, a 15 year old web and game developer. I aspire to make server-sided dynamic websites, with no Javascript required! I'm currently making games in the Godot Engine, and my dynamic sites in NodeJS.</p> <p style="padding: 10px;">Hi! I'm Violet, a 15 year old web and game developer. I aspire to make server-sided dynamic websites, with no Javascript required! I'm currently making games in the Godot Engine, and my dynamic sites in NodeJS.</p>
<div class="linkContainer">
<a class="chip" href="./socials/">Socials</a> <a class="chip" href="./socials/">Socials</a>
<a class="chip" href="./faq">Nerd FAQ</a> <a class="chip" href="./faq">Nerd FAQ</a>
<a class="chip" href="./stats">Stats</a> <a class="chip" href="./stats">Stats</a>
<br>
<a class="chip" href="https://{BRANCH_SUB}violets-purgatory.dev">{BRANCH_NAME} site</a> <a class="chip" href="https://{BRANCH_SUB}violets-purgatory.dev">{BRANCH_NAME} site</a>
<a class="chip" href="https://blog.violets-purgatory.dev">Blog</a> <a class="chip" href="https://blog.violets-purgatory.dev">Blog</a>
<a class="chip" href="https://fs.violets-purgatory.dev">FileShare</a> <a class="chip" href="https://fs.violets-purgatory.dev">FileShare</a>
</div>
<br> <br>
{CUSTOM_STATUS} {CUSTOM_STATUS}
</div> </div>

View file

@ -24,6 +24,15 @@
box-shadow: outset rgb(35, 20, 60) 0px 0px 20px; box-shadow: outset rgb(35, 20, 60) 0px 0px 20px;
} }
@media screen and (min-width: 400px) {
.linkContainer {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
max-width: 500px;
margin: auto;
}
}
.animatedTitle { .animatedTitle {
animation: mainText 2s cubic-bezier(0.075, 0.82, 0.165, 1); animation: mainText 2s cubic-bezier(0.075, 0.82, 0.165, 1);
margin: auto; margin: auto;