contact header
crispy-caesus 114518720+crispy-caesus@users.noreply.github.com
Fri, 01 Nov 2024 23:44:29 +0100
2 files changed,
76 insertions(+),
34 deletions(-)
M
static/index.css
→
static/index.css
@@ -1,5 +1,3 @@
-/* style.css */ - /* Basic reset */ * { margin: 0;@@ -7,25 +5,32 @@ padding: 0;
box-sizing: border-box; } -/* Centering and box styling */ +/* Body styling */ body { - display: flex; - justify-content: center; - align-items: center; - height: 100vh; background-color: #f5f5f5; font-family: Arial, sans-serif; color: #333; line-height: 1.6; + display: flex; + justify-content: center; + align-items: flex-start; + min-height: 100vh; } -article { +/* Center the main container */ +.container { max-width: 35em; width: 90%; padding: 1em; - border: 2px solid #333; + border: 2px solid #ccc; background-color: #fff; + margin-top: 1em; text-align: center; +} + +/* Article styling */ +article { + padding: 1em; } h1 {@@ -61,3 +66,25 @@
a:hover { text-decoration: underline; } + +/* Footer styling */ +footer { + margin-top: 20px; + padding: 10px; + background-color: #f3f3f3; + font-size: 1em; +} + +.contact-info { + display: flex; + justify-content: center; + gap: 15px; +} + +.contact-info span { + font-weight: bold; +} + +hr { + border: 1px solid #ccc; +}
M
templates/index.html
→
templates/index.html
@@ -9,32 +9,47 @@ <link rel="stylesheet" href="static/index.css">
</head> <body> - <article> - <h1>hi</h1> - <b>this is still a work in progress</b> - <p>I'm an 18-year-old student from Germany, aspiring to become a system administrator. I like tinkering - around - with my Linux 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> + <div class="container"> + <article> + <h1>hi</h1> + <b>this is still a work in progress</b> + <p>I'm an 18-year-old student from Germany, aspiring to become a system administrator. I like + tinkering + around + with my Linux 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> + + <h2>some links</h2> + <ul> + <li> + <a title="github" href="https://github.com/crispy-caesus">github</a> + <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/">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="stats.fm" href="https://stats.fm/caesus">stats.fm</a> + <p>the music I listened to on Spotify (have since switched to Tidal)</p> + </li> + </ul> + </article> + + <!-- Footer section --> + + <hr> - <h2>some links</h2> - <ul> - <li> - <a title="github" href="https://github.com/crispy-caesus">github</a> - <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/">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="stats.fm" href="https://stats.fm/caesus">stats.fm</a> - <p>the music I listened to on Spotify (have since switched to Tidal)</p> - </li> - </ul> - </article> + <footer> + <div class="contact-info"> + <span>Discord: crispy.caesus</span> + <span>Matrix: @crispy-caesus:matrix.org</span> + </div> + </footer> + </div> </body> </html>