Improved responsive design and fixed typos

This commit is contained in:
Lucia Zehentner 2025-04-04 20:45:44 +02:00
parent 651b8b581f
commit c3c1ffea20
8 changed files with 18 additions and 126 deletions

1
.htaccess Normal file
View file

@ -0,0 +1 @@
ErrorDocument 404 /404.html

BIN
assets/img/88x31/html.gif Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.5 KiB

View file

@ -1,51 +0,0 @@
<!DOCTYPE html>
<html lang="">
<head>
<meta charset="utf-8">
<title>Hello World!</title>
<link rel="stylesheet" href="style.css">
<link rel="stylesheet" href="assets/fonts/Hack/Hack.css">
</head>
<body>
<header> =================================================================================
// ___ ___ ___ _________ ___ _____ _____ //
// / / / / / / / ______/ / / / | / | //
// / / / / / / / / / / / /| | / /| | //
// / / / / / / / / / / / /_| | / /_| | //
// / / / / / / / / / / / ___ |/ ___ | //
// / /______ / /___/ / / /______ / / / / | | / | | //
// /_________/ /_________/ /_________/ /__/ /__/ |__|_/ |__| //
// //
================================================================================= </header>
<main>
<h1>Hello World!</h1>
<div id="author_date">
Written by Lucia Zehentner on 2025-03-01
</div>
<div id="blog-body">
<p>This is the first blog entry on my website, generated out of a Markdown input file and a JSON using my own blog engine <a href="https://codeberg.org/Schlecknits/CatGirlBlogEngine">CatGirlBlogEngine</a>.</p>
<h2>What you can expect on this blog</h2>
<p>For the most part I'll cover topics that interest me personally, particually:</p>
<ul>
<li>Programming</li>
<li>Geoinformatics</li>
<li>Electronics</li>
<li>Gender transistion</li>
<li>Cooking and baking</li>
</ul>
<p>Let's see what the future might hold in store. If you are interested in a particual topic I'll try to tag each blog entry properly, so one can search for whatever is of interest to them.</p>
<p>Until then, best of luck to you :3</p>
</div>
<div id="tags">
Tags:
<a href="tags/test.html">#test</a>,
<a href="tags/programming.html">#programming</a>
</div>
<div class="overview-backlink">
<a href="blog.html"><-- go back to general overview</a>
</div>
</main>
<footer></footer>
</body>
</html>

View file

@ -386,11 +386,12 @@ footer{
.three-gallery>figure{ .three-gallery>figure{
margin-bottom: 10px; margin-bottom: 10px;
max-width: 50%;
} }
} }
@media (max-width: 800px){ @media (max-width: 500px){
.three-gallery>figure{ .three-gallery>figure{
max-width: 100%; max-width: 100%;
} }
} }
@ -410,5 +411,13 @@ footer{
.vertical-divider-nav{ .vertical-divider-nav{
display: none; display: none;
} }
.overview{
flex-direction: column;
}
.tags>ul>li{
white-space: nowrap;
display: inline list-item;
}
} }

View file

@ -1,34 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<title>Overview for programming</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<base href="../">
<link rel="stylesheet" href="style.css">
<link rel="stylesheet" href="assets/fonts/Hack/Hack.css">
</head>
<body>
<header> =================================================================================
// ___ ___ ___ _________ ___ _____ _____ //
// / / / / / / / ______/ / / / | / | //
// / / / / / / / / / / / /| | / /| | //
// / / / / / / / / / / / /_| | / /_| | //
// / / / / / / / / / / / ___ |/ ___ | //
// / /______ / /___/ / / /______ / / / / | | / | | //
// /_________/ /_________/ /_________/ /__/ /__/ |__|_/ |__| //
// //
================================================================================= </header>
<main>
<h1>overview for tag 'programming'</h1>
<div class="overview">
<div class="entries">
<h1>entries</h1>
<ul>
<li>2025-03-01 - <a href="hello_world.html">Hello World!</a></li>
</ul>
</div>
<a href="blog.html"><-- go back to general overview</a>
</div>
</main>
</body>
</html>

View file

@ -1,34 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<title>Overview for test</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<base href="../">
<link rel="stylesheet" href="style.css">
<link rel="stylesheet" href="assets/fonts/Hack/Hack.css">
</head>
<body>
<header> =================================================================================
// ___ ___ ___ _________ ___ _____ _____ //
// / / / / / / / ______/ / / / | / | //
// / / / / / / / / / / / /| | / /| | //
// / / / / / / / / / / / /_| | / /_| | //
// / / / / / / / / / / / ___ |/ ___ | //
// / /______ / /___/ / / /______ / / / / | | / | | //
// /_________/ /_________/ /_________/ /__/ /__/ |__|_/ |__| //
// //
================================================================================= </header>
<main>
<h1>overview for tag 'test'</h1>
<div class="overview">
<div class="entries">
<h1>entries</h1>
<ul>
<li>2025-03-01 - <a href="hello_world.html">Hello World!</a></li>
</ul>
</div>
<a href="blog.html"><-- go back to general overview</a>
</div>
</main>
</body>
</html>

View file

@ -4,7 +4,7 @@
<h1><span class="spacer"></span><span class="additional-spacer">=====</span> about me <span class="additional-spacer">=====</span><span class="spacer"></span></h1> <h1><span class="spacer"></span><span class="additional-spacer">=====</span> about me <span class="additional-spacer">=====</span><span class="spacer"></span></h1>
<p class="flowing-text"> <p class="flowing-text">
Hello, Hello,
I'm Lucia (with a singular a). On the Internet you'll probably are more likely to find me going by the name Schlecknits.<br>I live in Rum, near Innsbruck, Austria. I like working with electronics and 3d designing and printing stuff. Sometimes I also do programming and/or web design. Otherwise, I like cute animals, reading on and researching things I'm currently interested in, trains and public transport in general as well as cooking and baking.<br>On this website you'll find my personal blog (topics vary widely) as well as some of my projects. If you wanna follow me on social media or contact me reference this <a href="#socials">list of methods to reach me</a> (if you are using an adblocker, this section might be blocked). I'm Lucia (with a singular a). On the Internet you are more likely to find me going by the name schlecknits.<br>I live in Rum, near Innsbruck, Austria. I like working with electronics and 3d designing and printing stuff. Sometimes I also do programming and/or web design. Otherwise, I like cute animals, reading on and researching things I'm currently interested in, trains and public transport in general as well as cooking and baking.<br>On this website you'll find my personal blog (topics vary widely) as well as some of my projects. If you wanna follow me on social media or contact me reference this <a href="#contact">list of methods to reach me</a> (if you are using an adblocker, this section might be blocked). For more information on me check my <a href="faq.html">FAQ</a>.
</p> </p>
<p class="flowing-text"> <p class="flowing-text">
For those interested in such things, I also have an 88x31 button which you can either link directly or rehost on your website: For those interested in such things, I also have an 88x31 button which you can either link directly or rehost on your website:
@ -17,7 +17,7 @@
<div id="about-this-website"> <div id="about-this-website">
<h1><span class="spacer"></span> about this website <span class="spacer"></span></h1> <h1><span class="spacer"></span> about this website <span class="spacer"></span></h1>
<p class="flowing-text"> <p class="flowing-text">
This website is held intentionally minimalist, as I'm not the biggest fan of bloated ressorce-intensive websites and unnessercary eyecandy. The only non-text-based content you'll find on this page are some 88x31 buttons and the background image, which is itself rather tiny. This website is fully navigable with purely text-based browsers such as <a href="https://lynx.invisible-island.net/">lynx</a>, full screenreader compatiblity is currently unfortunatly not tested. Some links might link to nowhere as I've gotten around to publishing all code or related blog articles of my projects, but will do so in the future.</p> This website is held intentionally minimalist, as I'm not the biggest fan of bloated ressource-intensive websites and unnessercary eyecandy. The only non-text-based content you'll find on this page are some 88x31 buttons, the background image, which is itself rather tiny and images within the blog-section. This website is fully navigable with purely text-based browsers such as <a href="https://lynx.invisible-island.net/">lynx</a>, full screenreader compatiblity is currently unfortunatly not tested.</p>
</div> </div>
<div id="projects"> <div id="projects">
<h1><span class="spacer"></span><span class="additional-spacer">=</span> personal projects <span class="spacer"></span></h1> <h1><span class="spacer"></span><span class="additional-spacer">=</span> personal projects <span class="spacer"></span></h1>
@ -38,7 +38,7 @@
</div> </div>
<div class="project"> <div class="project">
<h2><a href="https://codeberg.org/Schlecknits/CatGirlBlogEngine">CatGirlBlogEngine</a></h2> <h2><a href="https://codeberg.org/Schlecknits/CatGirlBlogEngine">CatGirlBlogEngine</a></h2>
<p>A blog engine for cat girls and everyone else as well. It's written in python and soon will be in use on this very website.</p> <p>A blog engine for cat girls and everyone else as well. It's written in Python and is used to generate the blog section of this website.</p>
</div> </div>
<div class="project"> <div class="project">
<h2><a href="https://github.com/Schlecknits/hitomezashi">Hitomezashi Generator</a></h2> <h2><a href="https://github.com/Schlecknits/hitomezashi">Hitomezashi Generator</a></h2>
@ -50,7 +50,7 @@
</div> </div>
</div> </div>
</div> </div>
<div id="socials"> <div id="contact">
<h1><span class="spacer"></span><span class="additional-spacer">====</span> meow at me <span class="additional-spacer">====</span><span class="spacer"></span></h1> <h1><span class="spacer"></span><span class="additional-spacer">====</span> meow at me <span class="additional-spacer">====</span><span class="spacer"></span></h1>
<div class="socials-grid"> <div class="socials-grid">
<div class="social"> <div class="social">

View file

@ -51,6 +51,7 @@
<img src="assets/img/88x31/anti-nft.gif" alt="This is an Anti-NFT site"> <img src="assets/img/88x31/anti-nft.gif" alt="This is an Anti-NFT site">
<img src="assets/img/88x31/trans-your-gender.gif" alt="Trans your gender"> <img src="assets/img/88x31/trans-your-gender.gif" alt="Trans your gender">
<img src="assets/img/88x31/trans-rights.gif" alt="Trans rights NOW!"> <img src="assets/img/88x31/trans-rights.gif" alt="Trans rights NOW!">
<img src="assets/img/88x31/html.gif" alt="HTML learn it now">
<img src="assets/img/88x31/css-is-difficult.png" alt="CSS is difficult"> <img src="assets/img/88x31/css-is-difficult.png" alt="CSS is difficult">
<img src="assets/img/88x31/best-viewed-1024x768.gif" alt="Best viewed in 1024 by 768, 16 bit."> <img src="assets/img/88x31/best-viewed-1024x768.gif" alt="Best viewed in 1024 by 768, 16 bit.">
<img src="assets/img/88x31/best-viewed-computer.gif" alt="Best viewed with a computer."> <img src="assets/img/88x31/best-viewed-computer.gif" alt="Best viewed with a computer.">