toaster

src/main.py

@@ -1,4 +1,4 @@
-from flask import Flask, request, render_template, send_from_directory
+from flask import Flask, request, render_template, send_from_directory, abort
 from flask_session import Session
 from dotenv import load_dotenv
 from os import getenv as env
@@ -29,7 +29,6 @@ db = database.Database(db_name=env('DB_NAME', default='db.sqlite'))
 
 @app.route('/')
 def index():
-    logging.info("Rendering index page")
     return render_template('index.html')
 
 
@@ -43,6 +42,14 @@ def web_stuffs():
     )
 
 
+@app.route('/<path:path>')
+def catch_all(path):
+    try:
+        return render_template(path + '.html')
+    except Exception as e:
+        abort(404)
+
+
 @app.route('/404')
 @app.errorhandler(404)
 def not_found():

static/css/base.css

@@ -393,6 +393,10 @@ section.rowsect>div {
     font-weight: 900;
 }
 
+.title-font {
+    font-family: var(--title-font);
+}
+
 @media screen and (max-width: 1000px) {
     body {
         background-color: var(--background-color);

static/css/toaster.css

@@ -0,0 +1,54 @@
+ul#toaster-specs {
+    padding: 0;
+    margin: 5px 0;
+    display: flex;
+    flex-direction: column;
+    gap: 2px;
+}
+
+ul#toaster-specs li {
+    display: flex;
+    justify-content: space-between;
+    gap: 2rem;
+    height: 35px;
+    align-items: center;
+}
+
+.color {
+    border-radius: 10px;
+    border: 2px solid var(--secondary-background-color);
+    padding: 1px 5px;
+    box-sizing: border-box;
+    height: min-content;
+}
+
+#toaster-img {
+    max-width: 100%;
+    object-fit: contain;
+    border-radius: 10px;
+    border: 2px solid var(--secondary-background-color);
+}
+
+.flex-col {
+    display: flex;
+    flex-direction: column;
+    gap: 1rem;
+}
+
+.flex-row {
+    display: flex;
+    flex-direction: row;
+    gap: 1rem;
+}
+
+.no-sect {
+    backdrop-filter: none;
+    border: none;
+    border-radius: 0;
+    padding: 0;
+    box-sizing: border-box;
+}
+
+.fill-height {
+    height: 100%;
+}

templates/base.html

@@ -27,6 +27,7 @@
                 <h1>Things to see :3</h1>
                 <ul>
                     <li><a href="/">Home</a></li>
+                    <li><a href="/toaster">Toaster</a></li>
                     <li><a href="https://git.alfieking.dev/acetheking987">Gitea</a></li>
                     <li><a href="https://www.last.fm/user/acetheking987">LastFm</a></li>
                     <li><a href="https://prismic.alfieking.dev">Prismic</a></li>

templates/index.html

@@ -1,6 +1,6 @@
 {% extends "base.html" %}
 
-{% block title %}Alfie's basement{% endblock %}
+{% block title %}Home - Alfie's basement{% endblock %}
 {% block description %}server backend survivor{% endblock %}
 
 {%block content %}

templates/toaster.html

@@ -0,0 +1,63 @@
+{% extends "base.html" %}
+
+{% block title %}Toaster - Alfie's basement{% endblock %}
+{% block description %}furry corner{% endblock %}
+
+{% block head %}
+<link rel="stylesheet" href="/static/css/toaster.css">
+{% endblock %}
+
+{% block content %}
+<section>
+    <h1>Toaster</h1>
+    <p>
+        heya, you may have guessed by now that I am a furry. Specifically my fursona is a protogen called Toaster. I didn't actually choose the name,
+        I just couldn't think of a name and a few people just started calling me Toaster because I am a protogen.
+        <br><br>
+        Originally (before I was a furry), I had a unnamed charcater that was just saved as "lil_guy.png" in my files. He is the tv head character
+        that I the main "mascot" of my website, I drew him a while ago when I was planning to make a functional tv head.
+        <br><br>
+        Once I eventually got out of the furry closet, I was trying to think of a species to choose and I thought that protogens are a mix of having a
+        screen for a face and being fluffy, so I thought it would be a good fit. I still want to keep the tv head character in some places since I rly like him,
+        however I plan on hopefully drawing Toaster properly soon. Once i do, I may make him the main mascot of my website.
+    </p>
+</section>
+<section class="flex-row no-sect">
+    <section>
+        <h1>Specs</h1>
+        <h6>(Very subject to change, Im still trying to figure out what I want :P)</h6>
+        <ul id="toaster-specs">
+            <li><b>Species:</b><span>Protogen</span></li>
+            <li><b>Base Color:</b><span class="color" style="background-color: #000">#000000</span></li>
+            <li><b>Accent Color:</b><span class="color" style="background-color: #8136cd">#8136cd</span></li>
+            <li><b>Alt Accent Color:</b><span class="color" style="background-color: #1d147c">#1d147c</span></li>
+            <li><b>Operating System:</b><span>Proot OS&trade;</span></li>
+            <li><b>Processor:</b><span>Fried Potato</span></li>
+            <li><b>RAM:</b><span>Not Enough</span></li>
+            <li><b>Storage:</b><span>1.44MB Floppy</span></li>
+        </ul>
+    </section>
+    <div class="flex-col">
+        <img src="/static/content/toaster.png" alt="toaster" id="toaster-img">
+        <section class="fill-height">
+            <p>
+                A old image of Toaster, I will draw a new one soon. (Hopefully)
+            </p>
+        </section>
+    </div>
+</section>
+<section>
+    <h1>Plans</h1>
+    <p>
+        I plan on drawing Toaster properly soon, I have a few ideas for his design but I am not sure what I want to do yet.
+        I also want to make a proper ref sheet for him, so it looks like I have a decent idea of what im doing, cus im kinda winging it right now.
+        <br><br>
+        I also wanna try make a fursuit head of Toaster, but I am not sure how well that will go. I can handle the electronics and I know a few people
+        with 3d printers, so I can get the base printed. However I have never made a fursuit before, so idk how well it will go, expecially with the fur.
+        I have no clue how to make the fur look good, so I may just end up getting someone else to help me with that. Budget is also a concern, cus im
+        clinically broke, rn so Im working of whatever I can buy from shady chinese websites for electronics and whatever I can find in my local area for the fur.
+        <br><br>
+        If I end up making a fursuit, I will probably make a post about it on my site and maybe even make a video of it (but dont hold me to that).
+    </p>
+</section>
+{% endblock %}