formatting
crispy-caesus 114518720+crispy-caesus@users.noreply.github.com
Sat, 22 Feb 2025 22:48:07 +0100
2 files changed,
94 insertions(+),
121 deletions(-)
M
static/index.css
→
static/index.css
@@ -16,8 +16,8 @@ align-items: flex-start;
min-height: 100vh; padding: 15em; padding-top: 2em; - font-size: 1.3em; - overflow: hidden; + padding-bottom: 2em; + font-size: 1em; } /* Center the main container */@@ -52,7 +52,7 @@ gap: 1em;
} .links { - width: 22em; + width: 30em; text-align: justify; }@@ -68,7 +68,6 @@ }
h2 { font-size: 1.5em; - margin-top: 1em; margin-bottom: 0.5em; }
M
templates/index.html
→
templates/index.html
@@ -1,135 +1,109 @@
<!doctype html> <html lang="en"> - <head> + +<head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>banana square</title> <link rel="stylesheet" href="static/index.css" /> <link rel="icon" type="image/png" href="static/banan_icon.png" /> - </head> +</head> - <body> +<body> <div class="top"> - <div - style="background-color: #9fa127; display: flex; flex-direction: column" - > - <div class="box container" style="min-height: 90%"> - <article> - <h1>hi</h1> - <img - src="static/banan.png" - alt="my profile picture" - class="banana-img" - /> - <p> - I'm an 18-year-old student from Germany, aspiring to become a - system administrator. I like tinkering around with my Linux system - and write a little program here and there. - </p> - <p> - Currently I'm learning a bunch about server monitoring, as part of - a school project - </p> - </article> - </div> - <div class="small-box container" style="min-height: 10%"> - cool people - <br /> - <a href="https://crispy-caesus.eu" - ><img src="static/crispybutton.png" - /></a> - <a href="https://erine.dev"><img src="static/crispybutton.png" /></a> + <div style="background-color: #9fa127; display: flex; flex-direction: column"> + <div class="box container" style="min-height: 90%"> + <article> + <h1>hi</h1> + <img src="static/banan.png" alt="my profile picture" class="banana-img" /> + <p> + I'm an 18-year-old student from Germany, aspiring to become a + system administrator. I like tinkering around with my Linux system + and write a little program here and there. + </p> + <p> + Currently I'm learning a bunch about server monitoring, as part of + a school project + </p> + </article> + </div> + <div class="small-box container" style="min-height: 10%"> + cool people + <br /> + <a href="https://crispy-caesus.eu"><img src="static/crispybutton.png" /></a> + <a href="https://erine.dev"><img src="static/crispybutton.png" /></a> + </div> </div> - </div> - <div class="box links"> - <h2>some links</h2> - <ul> - <li> - <a - title="Github" - href="https://github.com/crispy-caesus" - target="_blank" - rel="noopener nofererrer" - >github</a - > - <p> - contains most of my little projects, as well as my dotfiles for my - Linux configuration - </p> - </li> + <div class="box links"> + <h2>some links</h2> + <ul> + <li> + <a title="Github" href="https://github.com/crispy-caesus" target="_blank" + rel="noopener nofererrer">Github</a> - crispy-caesus + <p> + Contains most of my little projects, as well as my dotfiles for my + Linux configuration + </p> + </li> - <li> - <a - title="Anilist" - href="https://anilist.co/user/crispycaesus/" - target="_blank" - rel="noopener nofererrer" - >anilist</a - > - <p> - a list of the anime I have watched and plan to watch and some - ratings and thoughts on them - </p> - </li> + <li> + <a title="Anilist" href="https://anilist.co/user/crispycaesus/" target="_blank" + rel="noopener nofererrer">Anilist</a> - crispycaesus + <p> + A list of the anime I have watched and plan to watch and some + ratings and thoughts on them + </p> + </li> - <li> - <a - title="Discord" - href="https://discord.com/users/621759962280099840" - target="_blank" - rel="noopener nofererrer" - > - Discord - </a> - <p>crispy.caesus</p> - </li> + <li> + <a title="Discord" href="https://discord.com/users/621759962280099840" target="_blank" + rel="noopener nofererrer"> + Discord + </a> - crispy.caesus + <p> + I don't love the platform but it's probably one of the best developed and had the largest + communities. I've also learned a bunch, setting up servers with their permissions and what not + </p> + </li> - <li> - <a - title="Matrix" - href="https://matrix.to/#/@crispy-caesus:matrix.org" - target="_blank" - rel="noopener nofererrer" - > - Matrix - </a> - <p>@crispy-caesus:matrix.org</p> - </li> + <li> + <a title="Matrix" href="https://matrix.to/#/@crispy-caesus:matrix.org" target="_blank" + rel="noopener nofererrer"> + Matrix + </a> - @crispy-caesus:matrix.org + <p> + Amazing decentralized platform with a lot of epic clients. It's what I prefer for my personal + communication. + </p> + </li> - <li> - <a - title="toothbrushing music" - href="https://listen.tidal.com/playlist/2216bae3-7d2c-415f-9583-903ecda9d202" - target="_blank" - rel="noopener nofererrer" - > - toothbrushing music - </a> - <br /> - <img - src="static/toothrush.png" - alt="toothbrush vibing" - class="toothbrush-img" - /> - </li> - </ul> - </div> + <li> + <a title="toothbrushing music" + href="https://listen.tidal.com/playlist/2216bae3-7d2c-415f-9583-903ecda9d202" target="_blank" + rel="noopener nofererrer"> + toothbrushing music + </a> + <br /> + <img src="static/toothrush.png" alt="toothbrush vibing" class="toothbrush-img" /> + <p> + I generally like to buy my music DRM-free, but since I can't buy all the music in the world + Tidal is what I currently use as my streaming provider + </p> + </li> + </ul> + </div> </div> <div> - <footer> - <div class="box footer"> - <div class="credits"> - <br />art drawn by the amazing - <a - title="VanillaPunkk Instagram" - href="https://www.instagram.com/vannillapunkk/" - target="_blank" - rel="noopener nofererrer" - >VanillaPunkk</a - > - </div> - </div> - </footer> + <footer> + <div class="box footer"> + <div class="credits"> + <br />art drawn by the amazing + <a title="VanillaPunkk Instagram" href="https://www.instagram.com/vannillapunkk/" target="_blank" + rel="noopener nofererrer">VanillaPunkk</a> + </div> + </div> + </footer> </div> - </body> +</body> + </html>