Compare commits
	
		
			26 Commits
		
	
	
		
			27fbade9f1
			...
			c++-crow-b
		
	
	| Author | SHA1 | Date | |
|---|---|---|---|
| 6360b41e9a | |||
| 217adf91e9 | |||
| a7404fed3d | |||
| bfb1b8a21e | |||
| ef459d728a | |||
| 5690bcadf9 | |||
| 8b5b80f7c5 | |||
| 66806ad922 | |||
| b29a61a44b | |||
| a0562330a3 | |||
| df59a2c097 | |||
| 8209f52fa7 | |||
| b029eba456 | |||
| 1b2425a493 | |||
| e66f7e0588 | |||
| d48dd04af9 | |||
| f3d5cb9d53 | |||
| da447939bb | |||
| 968a4cb442 | |||
| 189d63d7ba | |||
| 4a577e928a | |||
| e95e424a1e | |||
| 2b6ae9c640 | |||
| 0115328180 | |||
| f2cffc4400 | |||
| 30884ecaa4 | 
							
								
								
									
										33
									
								
								.gitea/workflows/deploy.yaml
									
									
									
									
									
										Normal file
									
								
							
							
						
						@@ -0,0 +1,33 @@
 | 
			
		||||
name: Build and push container image
 | 
			
		||||
run-name: ${{ gitea.actor }} is building and pushing container image
 | 
			
		||||
on:
 | 
			
		||||
  push:
 | 
			
		||||
    branches:
 | 
			
		||||
      - main
 | 
			
		||||
 | 
			
		||||
env:
 | 
			
		||||
  GITEA_DOMAIN: git.alfieking.dev
 | 
			
		||||
  GITEA_REGISTRY_USER: acetheking987
 | 
			
		||||
  RESULT_IMAGE_NAME: acetheking987/alfieking.dev
 | 
			
		||||
 | 
			
		||||
jobs:
 | 
			
		||||
  build-and-push-image:
 | 
			
		||||
    runs-on: ubuntu-latest
 | 
			
		||||
    container:
 | 
			
		||||
      image: catthehacker/ubuntu:act-latest
 | 
			
		||||
    steps:
 | 
			
		||||
      - name: Checkout
 | 
			
		||||
        uses: actions/checkout@v4
 | 
			
		||||
      - name: Set up Docker Buildx
 | 
			
		||||
        uses: docker/setup-buildx-action@v3
 | 
			
		||||
      - name: Log in to registry
 | 
			
		||||
        uses: docker/login-action@v3
 | 
			
		||||
        with:
 | 
			
		||||
          registry: ${{ env.GITEA_DOMAIN }}
 | 
			
		||||
          username: ${{ env.GITEA_REGISTRY_USER }}
 | 
			
		||||
          password: ${{ secrets.CONTAINER_REGISTRY_TOKEN }}
 | 
			
		||||
      - name: Build and push image
 | 
			
		||||
        uses: docker/build-push-action@v6
 | 
			
		||||
        with:
 | 
			
		||||
          push: true
 | 
			
		||||
          tags: ${{ env.GITEA_DOMAIN }}/${{ env.RESULT_IMAGE_NAME }}:latest
 | 
			
		||||
							
								
								
									
										2
									
								
								.gitignore
									
									
									
									
										vendored
									
									
										Normal file
									
								
							
							
						
						@@ -0,0 +1,2 @@
 | 
			
		||||
build/
 | 
			
		||||
.vscode/
 | 
			
		||||
							
								
								
									
										6
									
								
								.gitmodules
									
									
									
									
										vendored
									
									
										Normal file
									
								
							
							
						
						@@ -0,0 +1,6 @@
 | 
			
		||||
[submodule "thirdparty/inja"]
 | 
			
		||||
	path = thirdparty/inja
 | 
			
		||||
	url = https://github.com/pantor/inja
 | 
			
		||||
[submodule "thirdparty/nlohmann"]
 | 
			
		||||
	path = thirdparty/nlohmann
 | 
			
		||||
	url = https://github.com/nlohmann/json
 | 
			
		||||
							
								
								
									
										15
									
								
								include/errors.hpp
									
									
									
									
									
										Normal file
									
								
							
							
						
						@@ -0,0 +1,15 @@
 | 
			
		||||
#ifndef ERRORS_HPP
 | 
			
		||||
#define ERRORS_HPP
 | 
			
		||||
 | 
			
		||||
#include <crow.h>
 | 
			
		||||
#include "templating.hpp"
 | 
			
		||||
 | 
			
		||||
extern Templating templating;
 | 
			
		||||
 | 
			
		||||
struct CustomErrorHandler {
 | 
			
		||||
    struct context {};
 | 
			
		||||
    void before_handle(crow::request& req, crow::response& res, context&) {}
 | 
			
		||||
    void after_handle(crow::request& req, crow::response& res, context&);
 | 
			
		||||
};
 | 
			
		||||
 | 
			
		||||
#endif
 | 
			
		||||
							
								
								
									
										25
									
								
								include/templating.hpp
									
									
									
									
									
										Normal file
									
								
							
							
						
						@@ -0,0 +1,25 @@
 | 
			
		||||
#ifndef TEMPLATING_HPP
 | 
			
		||||
#define TEMPLATING_HPP
 | 
			
		||||
 | 
			
		||||
#include <inja/inja.hpp>
 | 
			
		||||
#include <crow.h>
 | 
			
		||||
#include <string>
 | 
			
		||||
 | 
			
		||||
class Templating {
 | 
			
		||||
public:
 | 
			
		||||
    explicit Templating(const std::string& template_dir);
 | 
			
		||||
 | 
			
		||||
    crow::response render_template(const std::string& template_name, const inja::json& data);
 | 
			
		||||
    crow::response render_template(const std::string& template_name);
 | 
			
		||||
 | 
			
		||||
    std::string render_template_string(const std::string& template_name, const inja::json& data);
 | 
			
		||||
    std::string render_template_string(const std::string& template_name);
 | 
			
		||||
 | 
			
		||||
private:
 | 
			
		||||
    inja::Environment inja_env;
 | 
			
		||||
    std::string template_dir;  // absolute path to templates
 | 
			
		||||
 | 
			
		||||
    std::string preprocess_template(const std::string& template_name);
 | 
			
		||||
};
 | 
			
		||||
 | 
			
		||||
#endif
 | 
			
		||||
							
								
								
									
										201
									
								
								index.html
									
									
									
									
									
								
							
							
						
						@@ -1,201 +0,0 @@
 | 
			
		||||
<!DOCTYPE html>
 | 
			
		||||
<html lang="en">
 | 
			
		||||
<head>
 | 
			
		||||
    <meta charset="UTF-8">
 | 
			
		||||
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
 | 
			
		||||
    <title>Alfie's basement</title>
 | 
			
		||||
    <link rel="icon" href="/static/content/icon.webp">
 | 
			
		||||
    <link rel="stylesheet" href="/static/css/index.css">
 | 
			
		||||
    <meta name="description" content="Alfie's basement">
 | 
			
		||||
    <meta name="keywords" content="Alfie King, Alfie, King, Alfieking, Alfieking.dev, dev, server">
 | 
			
		||||
    <meta name="author" content="Alfie King">
 | 
			
		||||
    <meta name="robots" content="all">
 | 
			
		||||
    <meta name="theme-color" content="#63de90" data-react-helmet="true">
 | 
			
		||||
    <meta property="og:site_name" content="Alfieking.dev">
 | 
			
		||||
    <meta property="og:url" content="https://alfieking.dev">
 | 
			
		||||
    <meta property="og:title" content="Alfie's basement">
 | 
			
		||||
    <meta property="og:description" content="server backend survivor">
 | 
			
		||||
    <meta property="og:image" content="static/content/icon.webp">
 | 
			
		||||
</head>
 | 
			
		||||
<body>
 | 
			
		||||
    <div id="furry"></div>
 | 
			
		||||
    <div id="sidebar">
 | 
			
		||||
        <nav>
 | 
			
		||||
            <section>
 | 
			
		||||
                <h1>Things to see :3</h1>
 | 
			
		||||
                <ul>
 | 
			
		||||
                    <li><a href="#Home" onclick="alert('ur already here :3')">Home</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>
 | 
			
		||||
                    <li><a href="https://open.spotify.com/user/xz02oolstlvwxqu1pfcua9exz?si=14396e637f284e03">Spotify</a></li>
 | 
			
		||||
                    <li><a href="https://steamcommunity.com/id/acetheking987/">Steam</a></li>
 | 
			
		||||
                    <li><a href="https://www.youtube.com/@acetheking987">YouTube</a></li>
 | 
			
		||||
                    <li><a href="https://acetheking987.tumblr.com/">Tumblr</a></li>
 | 
			
		||||
                    <li><a href="https://www.reddit.com/user/acetheking987">Reddit</a></li>
 | 
			
		||||
                </ul>
 | 
			
		||||
            </section>
 | 
			
		||||
        </nav>
 | 
			
		||||
        <section>
 | 
			
		||||
            <h6 class="irken">heya, try typing "furry" and "irken" into this page!</h6>
 | 
			
		||||
        </section>
 | 
			
		||||
        <section id="buttons">
 | 
			
		||||
            <h1>BUTTONS</h1>
 | 
			
		||||
            <ul>
 | 
			
		||||
                <li><a href="https://dimden.dev/"><img src="https://dimden.dev/services/images/88x31.gif" alt="dimden"></a></li>
 | 
			
		||||
                <li><a href="https://ne0nbandit.neocities.org/"><img src="https://ne0nbandit.github.io/assets/img/btn/mine/nbbanner.png" alt="ne0nbandit"></a></li>
 | 
			
		||||
                <li><a href="https://thinliquid.dev"><img src="https://thinliquid.dev/thnlqd.png" alt="thinliquid"></a></li>
 | 
			
		||||
                <li><a href="https://nekoweb.org/"><img src="https://nekoweb.org/assets/buttons/button6.gif" alt="nekoweb"></a><!-- button by s1nez.nekoweb.org --></li>
 | 
			
		||||
                <li><a href="https://s1nez.nekoweb.org/"><img src="https://s1nez.nekoweb.org/BUTTON.gif" alt="s1nez"></a></li>
 | 
			
		||||
                <li><a href="https://beeps.website"><img src="https://beeps.website/assets/images/88x31-d.gif" alt="beeps"></a></li>
 | 
			
		||||
                <li><a href="https://itsnotstupid.com"><img src="https://itsnotstupid.com/pics/button1.gif" alt="itsnotstupid"></a></li>
 | 
			
		||||
                <li><a href='https://blinkies.cafe'><img src='https://blinkies.cafe/b/display/blinkiesCafe-badge.gif' alt='blinkies.cafe | make your own blinkies!'></a></li>
 | 
			
		||||
                <li><a href="https://eightyeightthirty.one"><img src="https://eightyeightthirty.one/88x31.png" alt="88x31"></a></li>
 | 
			
		||||
                <li><a href="https://neocities.org"><img src="https://cyber.dabamos.de/88x31/neocities-now.gif" alt="neocities"></a></li>
 | 
			
		||||
                <li><a href="https://tuxedodragon.art"><img src="https://tuxedodragon.art/tuxedodragon%2088x31.gif" alt="tuxedodragon"></a></li>
 | 
			
		||||
            </ul>
 | 
			
		||||
        </section>
 | 
			
		||||
        <section>
 | 
			
		||||
            <pre class="vsmoltext">      |\      _,,,---,,_<br>ZZZzz /,`.-'`'    -.  ;-;;,_<br>     |,4-  ) )-,_. ,\ (  `'-'<br>    '---''(_/--'  `-'\_)</pre>
 | 
			
		||||
        </section>
 | 
			
		||||
        <img src="static/content/haj.gif" alt="haj" class="haj">
 | 
			
		||||
    </div>
 | 
			
		||||
    <main id="main">
 | 
			
		||||
        <header id="home">
 | 
			
		||||
            <div class="row">
 | 
			
		||||
                <img src="/static/content/icon.webp">
 | 
			
		||||
                <div>
 | 
			
		||||
                    <h1>Alfie King</h1>
 | 
			
		||||
                    <h2 id="typing">server backend survivor</h2>
 | 
			
		||||
                </div>
 | 
			
		||||
            </div>
 | 
			
		||||
        </header>
 | 
			
		||||
        <nav id="alt-nav">
 | 
			
		||||
            <ul>
 | 
			
		||||
                <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>
 | 
			
		||||
                <li><a href="https://open.spotify.com/user/xz02oolstlvwxqu1pfcua9exz?si=14396e637f284e03">Spotify</a></li>
 | 
			
		||||
                <li><a href="https://steamcommunity.com/id/acetheking987/">Steam</a></li>
 | 
			
		||||
                <li><a href="https://www.youtube.com/@acetheking987">YouTube</a></li>
 | 
			
		||||
                <li><a href="https://acetheking987.tumblr.com/">Tumblr</a></li>
 | 
			
		||||
                <li><a href="https://www.reddit.com/user/acetheking987">Reddit</a></li>
 | 
			
		||||
            </ul>
 | 
			
		||||
        </nav>
 | 
			
		||||
        <section>
 | 
			
		||||
            <h1>A lil bit abt me</h1>
 | 
			
		||||
            <p>
 | 
			
		||||
                Im not good with writing so dont expect much here. I am a student who is learning c++ and python. I've Done a few projects that i think
 | 
			
		||||
                are decent enough to show off, so I have put them on this website. I like to mess around with linux and have a few servers that I run. I've
 | 
			
		||||
                been running a server for a few years now, and I have learned a lot from it. I have also switched to linux on my main computer, which has been
 | 
			
		||||
                slightly annoying at times (mainly because one of my most played games' anticheat doesn't support on linux atm. Also, the lack of photoshop is
 | 
			
		||||
                a pain).
 | 
			
		||||
                <br><br>
 | 
			
		||||
                I would like to make some more projects in the future, but I am not sure what I want to make yet. I tend to make thing on impulse a lot, and motivation
 | 
			
		||||
                is "lacking" at times. So the few ideas I do have may never come to fruition. I hope to get better at art so i could hopefully make a game that is somewhat
 | 
			
		||||
                interesting. But im at a lack of ideas at the moment.
 | 
			
		||||
                <br><br>
 | 
			
		||||
                I would also like to have a functional blog on this site, but I bearly talk about much so I dont know what I would write about. I like to ramble on about
 | 
			
		||||
                random things, but I dont think that would be very interesting to read, and I think that I would forget to update it. I have a tumblr that I have had for a few
 | 
			
		||||
                years now, but I dont post on it (the social anxiety is too much for me :<). However I hope to get better at that in the future.
 | 
			
		||||
            </p>
 | 
			
		||||
        </section>
 | 
			
		||||
        <section class="blinkies">
 | 
			
		||||
            <img src="https://adriansblinkiecollection.neocities.org/x45.gif" alt="">
 | 
			
		||||
            <img src="https://adriansblinkiecollection.neocities.org/t3.gif" alt="">
 | 
			
		||||
            <img src="https://adriansblinkiecollection.neocities.org/k25.gif" alt="">
 | 
			
		||||
            <img src="https://s1nez.nekoweb.org/img/52475686_BP77MK3UdnLmIQk.gif" alt="">
 | 
			
		||||
            <img src="https://s1nez.nekoweb.org/img/hc/hc%20(79).gif" alt="">
 | 
			
		||||
            <img src="https://dewside.neocities.org/blinkies/bisigns.gif" alt="">
 | 
			
		||||
            <img src="https://s1nez.nekoweb.org/g/ggg/gg%20(32).gif" alt="">
 | 
			
		||||
            <img src="https://s1nez.nekoweb.org/img/7dcd20d4.gif" alt="">
 | 
			
		||||
        </section>
 | 
			
		||||
        <section class="rowsect">
 | 
			
		||||
            <a href="" id="spotify-link">
 | 
			
		||||
                <div id="spotify">
 | 
			
		||||
                    <h1 id="spotify-title"></h1>
 | 
			
		||||
                    <h2 id="spotify-artist"></h2>
 | 
			
		||||
                </div>
 | 
			
		||||
            </a>
 | 
			
		||||
            <div class="stamps">
 | 
			
		||||
                <img src="https://s1nez.nekoweb.org/img/other/ba4ba47a.png" alt="">
 | 
			
		||||
                <img src="https://s1nez.nekoweb.org/img/fa02abd7.png" alt="">
 | 
			
		||||
                <img src="https://s1nez.nekoweb.org/img/hc/hc%20(172).gif" alt="">
 | 
			
		||||
                <img src="https://gligar.neocities.org/furret2.png" alt="">
 | 
			
		||||
                <img src="https://gligar.neocities.org/ralsei2.png" alt="">
 | 
			
		||||
                <img src="https://gligar.neocities.org/tism.png" alt="">
 | 
			
		||||
                <img src="https://64.media.tumblr.com/11957593416710af9ff049ff6ae7ab63/tumblr_pbb7cd42Ln1xz2nuuo4_100.gif" alt="">
 | 
			
		||||
                <img src="https://dewside.neocities.org/stamps/dogofwisdom.gif" alt="">
 | 
			
		||||
                <img src="https://dewside.neocities.org/stamps/kazookid.gif" alt="">
 | 
			
		||||
                <img src="https://64.media.tumblr.com/3085aeace24ca0c5ddf08aac37cc3ab4/45a30eb92e06a85c-3a/s100x200/b7bfb2e91adbc310f712f4492e668298bd0779de.gif" alt="">
 | 
			
		||||
                <img src="https://s1nez.nekoweb.org/img/hc/hc%20(27).png" alt="">
 | 
			
		||||
                <img src="https://s1nez.nekoweb.org/g/ggg/gg%20(13).gif" alt="">
 | 
			
		||||
                <img src="https://kopawz.neocities.org/stamphoard/stamps2/kriswhere.png" alt="">
 | 
			
		||||
                <img src="https://adriansblinkiecollection.neocities.org/stamps/g5.gif" alt="">
 | 
			
		||||
                <img src="https://adriansblinkiecollection.neocities.org/stamps/e40.gif" alt="">
 | 
			
		||||
                <img src="https://adriansblinkiecollection.neocities.org/stamps/e43.gif" alt="">
 | 
			
		||||
            </div>
 | 
			
		||||
        </section>
 | 
			
		||||
        <section>
 | 
			
		||||
            <h1>Projects & stuff</h1>
 | 
			
		||||
            <p>just some projects ive worked on over time</p>
 | 
			
		||||
            <ul>
 | 
			
		||||
                <li>
 | 
			
		||||
                    <h2>alfieking.dev</h2>
 | 
			
		||||
                    <p>
 | 
			
		||||
                        This website is a project that I have been working on for a while now. I have made a few versions of it, but I have 
 | 
			
		||||
                        never been happy with them. I am quite happy with this version atm since it is more organized and has a design that I
 | 
			
		||||
                        like.
 | 
			
		||||
                        <a href="https://git.alfieking.dev/acetheking987/alfieking.dev">source code</a>
 | 
			
		||||
                    </p>
 | 
			
		||||
                </li>
 | 
			
		||||
                <li>
 | 
			
		||||
                    <h2>owo (the terminal command)</h2>
 | 
			
		||||
                    <p>
 | 
			
		||||
                        I made this project as a joke, I can't remember exactly what I baised it off other than the fact that it was somthing 
 | 
			
		||||
                        similar to this but in a different language. I originally made it in python, but I have since rewritten it in c++ so 
 | 
			
		||||
                        that it would be faster and so that I could learn c++.
 | 
			
		||||
                        <a href="https://git.alfieking.dev/acetheking987/term-owo-cpp">source code</a>
 | 
			
		||||
                    </p>
 | 
			
		||||
                </li>
 | 
			
		||||
                <li>
 | 
			
		||||
                    <h2>prismic</h2>
 | 
			
		||||
                    <p>
 | 
			
		||||
                        Prismic is a basic message board that I made, it was mainly made to learn how to use templating and more backend
 | 
			
		||||
                        web development. it uses flask for the web framework and uses a sqlite database to store the messages. I have thought
 | 
			
		||||
                        about remaking it in c++ since I found a c++ web framework that I would like to try out.
 | 
			
		||||
                        <a href="https://prismic.alfieking.dev">Primic</a> | <a href="https://git.alfieking.dev/acetheking987/prismic">source code</a>
 | 
			
		||||
                    </p>
 | 
			
		||||
                </li>
 | 
			
		||||
            </ul>
 | 
			
		||||
        </section>
 | 
			
		||||
        <section>
 | 
			
		||||
            <h1>The button collection™</h1>
 | 
			
		||||
            <div id="button-collection">
 | 
			
		||||
            </div>
 | 
			
		||||
        </section>
 | 
			
		||||
        <section>
 | 
			
		||||
            <h1>Some News</h1>
 | 
			
		||||
            <h6>(dont expect this to be updated often tho :P)</h6>
 | 
			
		||||
            <ul>
 | 
			
		||||
                <li>
 | 
			
		||||
                    <h2>18-06-2025</h2>
 | 
			
		||||
                    <p>
 | 
			
		||||
                        I plan on updating the site soon, I have a few ideas that I want to implement. I want to make it more 
 | 
			
		||||
                        interactive and fun to use. I also want to add a blog section so that I can write about random things that I find interesting. I also 
 | 
			
		||||
                        want to add a few more projects that I have been working on. Annoyingly I think it would be a good idea to remake this site with some sort of
 | 
			
		||||
                        framework so i can use templating, however this kinda bothers me since I like the simplicity of this site. And prefer to keep it as a static site
 | 
			
		||||
                        that i can just throw at nginx.
 | 
			
		||||
                    </p>
 | 
			
		||||
                </li>
 | 
			
		||||
            </ul>
 | 
			
		||||
        </section>
 | 
			
		||||
        <section>
 | 
			
		||||
            <footer>
 | 
			
		||||
                <p>legal stuff idk :3 | icba to © this :P | made with ♥ and caffine</p>
 | 
			
		||||
            </footer>
 | 
			
		||||
        </section>
 | 
			
		||||
    </main>
 | 
			
		||||
    <script src="/static/js/index.js"></script>
 | 
			
		||||
</body>
 | 
			
		||||
</html>
 | 
			
		||||
							
								
								
									
										51
									
								
								makefile
									
									
									
									
									
										Normal file
									
								
							
							
						
						@@ -0,0 +1,51 @@
 | 
			
		||||
# Directories
 | 
			
		||||
INCLUDE_DIRS = include thirdparty/inja/include thirdparty/nlohmann/include
 | 
			
		||||
SRC_DIR = src
 | 
			
		||||
BUILD_DIR = build
 | 
			
		||||
 | 
			
		||||
# Compiler and linker settings
 | 
			
		||||
CXX = g++
 | 
			
		||||
LIBS = 
 | 
			
		||||
CXXFLAGS = -std=c++17 $(foreach dir,$(INCLUDE_DIRS),-I$(dir))
 | 
			
		||||
 | 
			
		||||
# Source and object files
 | 
			
		||||
SRC = $(wildcard $(SRC_DIR)/*.cpp)
 | 
			
		||||
 | 
			
		||||
# Target executable
 | 
			
		||||
UNAME := $(shell uname -s)
 | 
			
		||||
BUILD_DIR := $(BUILD_DIR)/$(UNAME)
 | 
			
		||||
OBJ_DIR := $(BUILD_DIR)/objs
 | 
			
		||||
BIN = $(BUILD_DIR)/main
 | 
			
		||||
 | 
			
		||||
# Object files corresponding to the source files (now in obj directory)
 | 
			
		||||
OBJS = $(addprefix $(OBJ_DIR)/, $(addsuffix .o, $(basename $(notdir $(SRC)))))
 | 
			
		||||
 | 
			
		||||
# development target with debugging
 | 
			
		||||
dev: CXXFLAGS += -g -Wall -Wformat
 | 
			
		||||
dev: all
 | 
			
		||||
 | 
			
		||||
# Release target
 | 
			
		||||
release: CXXFLAGS += -O3
 | 
			
		||||
release: all
 | 
			
		||||
 | 
			
		||||
# Create directories for build output
 | 
			
		||||
dirs:
 | 
			
		||||
	@mkdir -p $(BUILD_DIR)
 | 
			
		||||
	@mkdir -p $(OBJ_DIR)
 | 
			
		||||
 | 
			
		||||
# Clear build directory
 | 
			
		||||
clear:
 | 
			
		||||
	@find $(OBJ_DIR) -type f -name '*.o' -exec rm -f {} +
 | 
			
		||||
 | 
			
		||||
# Pattern rule for source files in src directory
 | 
			
		||||
$(OBJ_DIR)/%.o: $(SRC_DIR)/%.cpp
 | 
			
		||||
	$(CXX) $(CXXFLAGS) -c -o $@ $<
 | 
			
		||||
 | 
			
		||||
all: dirs clear $(BIN)
 | 
			
		||||
	@echo Build complete
 | 
			
		||||
 | 
			
		||||
$(BIN): $(OBJS)
 | 
			
		||||
	$(CXX) -o $@ $^ $(CXXFLAGS) $(LIBS)
 | 
			
		||||
 | 
			
		||||
clean:
 | 
			
		||||
	rm -rf $(BUILD_DIR)
 | 
			
		||||
@@ -1,6 +0,0 @@
 | 
			
		||||
<?xml version="1.0" encoding="UTF-8"?>
 | 
			
		||||
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
 | 
			
		||||
  <url>
 | 
			
		||||
    <loc>https://www.example.com/index.html</loc>
 | 
			
		||||
  </url>
 | 
			
		||||
</urlset>
 | 
			
		||||
							
								
								
									
										13
									
								
								src/errors.cpp
									
									
									
									
									
										Normal file
									
								
							
							
						
						@@ -0,0 +1,13 @@
 | 
			
		||||
#include "errors.hpp"
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
std::string render_404_template(const crow::request& req) {
 | 
			
		||||
    return templating.render_template_string("errors/404.html", {{"requested_url", req.url}});
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
void CustomErrorHandler::after_handle(crow::request& req, crow::response& res, context&) {
 | 
			
		||||
    if (res.code == 404 && res.body.empty()) {
 | 
			
		||||
        res.set_header("Content-Type", "text/html");
 | 
			
		||||
        res.body = render_404_template(req);
 | 
			
		||||
    }
 | 
			
		||||
}
 | 
			
		||||
							
								
								
									
										18
									
								
								src/main.cpp
									
									
									
									
									
										Normal file
									
								
							
							
						
						@@ -0,0 +1,18 @@
 | 
			
		||||
#define CROW_STATIC_DIRECTORY "../static"
 | 
			
		||||
#include "templating.hpp"
 | 
			
		||||
#include "errors.hpp"
 | 
			
		||||
#include <crow.h>
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
Templating templating{"../templates"};
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
int main() {
 | 
			
		||||
    crow::App<CustomErrorHandler> app;
 | 
			
		||||
 | 
			
		||||
    CROW_ROUTE(app, "/")([]() {
 | 
			
		||||
        return templating.render_template("index.html");
 | 
			
		||||
    });
 | 
			
		||||
 | 
			
		||||
    app.port(8080).multithreaded().run();
 | 
			
		||||
}
 | 
			
		||||
							
								
								
									
										76
									
								
								src/templating.cpp
									
									
									
									
									
										Normal file
									
								
							
							
						
						@@ -0,0 +1,76 @@
 | 
			
		||||
#include "templating.hpp"
 | 
			
		||||
#include <filesystem>
 | 
			
		||||
#include <fstream>
 | 
			
		||||
#include <regex>
 | 
			
		||||
#include <stdexcept>
 | 
			
		||||
 | 
			
		||||
Templating::Templating(const std::string& template_dir)
 | 
			
		||||
    : inja_env(std::filesystem::canonical(template_dir).string()),
 | 
			
		||||
      template_dir(std::filesystem::canonical(template_dir).string())
 | 
			
		||||
{
 | 
			
		||||
    inja_env.set_search_included_templates_in_files(true);
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
std::string Templating::preprocess_template(const std::string& template_name) {
 | 
			
		||||
    namespace fs = std::filesystem;
 | 
			
		||||
 | 
			
		||||
    fs::path abs_template_dir = fs::path(template_dir);
 | 
			
		||||
    fs::path abs_template_file = fs::canonical(abs_template_dir / template_name);
 | 
			
		||||
 | 
			
		||||
    std::ifstream file(abs_template_file);
 | 
			
		||||
    if (!file.is_open()) {
 | 
			
		||||
        throw std::runtime_error("Failed to open template file: " + abs_template_file.string());
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    std::string content((std::istreambuf_iterator<char>(file)), std::istreambuf_iterator<char>());
 | 
			
		||||
 | 
			
		||||
    std::regex extends_regex(R"(\{\%\s*extends\s*(['"])(.+?)\1\s*\%\})");
 | 
			
		||||
    std::smatch match;
 | 
			
		||||
 | 
			
		||||
    if (std::regex_search(content, match, extends_regex)) {
 | 
			
		||||
        std::string quote = match[1].str();
 | 
			
		||||
        std::string original_path = match[2].str();
 | 
			
		||||
 | 
			
		||||
        if (original_path.find("/") == std::string::npos &&
 | 
			
		||||
            !original_path.empty() &&
 | 
			
		||||
            original_path.front() != '/') {
 | 
			
		||||
 | 
			
		||||
            fs::path abs_extended_template = fs::canonical(abs_template_dir / original_path);
 | 
			
		||||
            fs::path rel_path = fs::relative(abs_extended_template, abs_template_file.parent_path());
 | 
			
		||||
 | 
			
		||||
            std::string new_path = rel_path.generic_string();
 | 
			
		||||
 | 
			
		||||
            content = std::regex_replace(content, extends_regex,
 | 
			
		||||
                "{% extends " + quote + new_path + quote + " %}");
 | 
			
		||||
        }
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    return content;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
crow::response Templating::render_template(const std::string& template_name, const inja::json& data) {
 | 
			
		||||
    try {
 | 
			
		||||
        std::string preprocessed = preprocess_template(template_name);
 | 
			
		||||
        inja::Template tpl = inja_env.parse(preprocessed);
 | 
			
		||||
        std::string rendered = inja_env.render(tpl, data);
 | 
			
		||||
        return crow::response(rendered);
 | 
			
		||||
 | 
			
		||||
    } catch (const std::exception& e) {
 | 
			
		||||
        return crow::response(500, e.what());
 | 
			
		||||
    }
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
crow::response Templating::render_template(const std::string& template_name) {
 | 
			
		||||
    return render_template(template_name, inja::json{});
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
std::string Templating::render_template_string(const std::string& template_name, const inja::json& data) {
 | 
			
		||||
    std::string preprocessed = preprocess_template(template_name);
 | 
			
		||||
    inja::Template tpl = inja_env.parse(preprocessed);
 | 
			
		||||
    return inja_env.render(tpl, data);
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
std::string Templating::render_template_string(const std::string& template_name) {
 | 
			
		||||
    return render_template_string(template_name, inja::json{});
 | 
			
		||||
}
 | 
			
		||||
| 
		 After Width: | Height: | Size: 3.6 MiB  | 
| 
		 After Width: | Height: | Size: 4.6 MiB  | 
| 
		 After Width: | Height: | Size: 3.2 MiB  | 
| 
		 After Width: | Height: | Size: 2.0 MiB  | 
| 
		 After Width: | Height: | Size: 4.6 MiB  | 
| 
		 After Width: | Height: | Size: 3.3 MiB  | 
| 
		 After Width: | Height: | Size: 3.5 MiB  | 
| 
		 After Width: | Height: | Size: 2.7 MiB  | 
| 
		 After Width: | Height: | Size: 3.5 MiB  | 
| 
		 After Width: | Height: | Size: 3.3 MiB  | 
| 
		 After Width: | Height: | Size: 4.0 MiB  | 
| 
		 After Width: | Height: | Size: 4.5 MiB  | 
| 
		 After Width: | Height: | Size: 4.7 MiB  | 
| 
		 Before Width: | Height: | Size: 743 KiB After Width: | Height: | Size: 743 KiB  | 
| 
		 Before Width: | Height: | Size: 4.5 KiB After Width: | Height: | Size: 4.5 KiB  | 
| 
		 Before Width: | Height: | Size: 49 KiB After Width: | Height: | Size: 49 KiB  | 
							
								
								
									
										
											BIN
										
									
								
								static/content/other/favicon.ico
									
									
									
									
									
										Normal file
									
								
							
							
						
						| 
		 After Width: | Height: | Size: 240 KiB  | 
@@ -1,6 +1,8 @@
 | 
			
		||||
User-agent: *
 | 
			
		||||
Allow: /
 | 
			
		||||
Disallow: /404.html
 | 
			
		||||
Disallow: /404
 | 
			
		||||
Disallow: /500
 | 
			
		||||
Disallow: /400
 | 
			
		||||
 | 
			
		||||
Sitemap: https://alfieking.dev/sitemap.xml
 | 
			
		||||
 | 
			
		||||
							
								
								
									
										18
									
								
								static/content/other/sitemap.xml
									
									
									
									
									
										Normal file
									
								
							
							
						
						@@ -0,0 +1,18 @@
 | 
			
		||||
<?xml version="1.0" encoding="UTF-8"?>
 | 
			
		||||
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
 | 
			
		||||
  <url>
 | 
			
		||||
    <loc>https://alfieking.dev/</loc>
 | 
			
		||||
  </url>
 | 
			
		||||
  <url>
 | 
			
		||||
    <loc>https://alfieking.dev/toaster</loc>
 | 
			
		||||
  </url>
 | 
			
		||||
  <url>
 | 
			
		||||
    <loc>https://alfieking.dev/events</loc>
 | 
			
		||||
  </url>
 | 
			
		||||
  <url>
 | 
			
		||||
    <loc>https://alfieking.dev/events/paws-n-pistons</loc>
 | 
			
		||||
  </url>
 | 
			
		||||
  <url>
 | 
			
		||||
    <loc>https://alfieking.dev/events/crittersmk</loc>
 | 
			
		||||
  </url>
 | 
			
		||||
</urlset>
 | 
			
		||||
							
								
								
									
										
											BIN
										
									
								
								static/content/toaster/Toaster_v1.0_Dark.png
									
									
									
									
									
										Normal file
									
								
							
							
						
						| 
		 After Width: | Height: | Size: 2.7 MiB  | 
							
								
								
									
										3
									
								
								static/css/400.css
									
									
									
									
									
										Normal file
									
								
							
							
						
						@@ -0,0 +1,3 @@
 | 
			
		||||
section h2 {
 | 
			
		||||
    margin-top: 2rem !important;
 | 
			
		||||
}
 | 
			
		||||
							
								
								
									
										8
									
								
								static/css/500.css
									
									
									
									
									
										Normal file
									
								
							
							
						
						@@ -0,0 +1,8 @@
 | 
			
		||||
.bluescreen {
 | 
			
		||||
    background-color: #0077D6;
 | 
			
		||||
    color: #fff;
 | 
			
		||||
    padding:40px;
 | 
			
		||||
    display: flex;
 | 
			
		||||
    flex-direction: column;
 | 
			
		||||
    gap: 20px;
 | 
			
		||||
}
 | 
			
		||||
							
								
								
									
										378
									
								
								static/css/base.css
									
									
									
									
									
										Normal file
									
								
							
							
						
						@@ -0,0 +1,378 @@
 | 
			
		||||
@import url('https://fonts.googleapis.com/css2?family=Fredoka:wdth,wght@125,700&family=Space+Mono:ital,wght@0,400;0,700;1,400;1,700&display=swap');
 | 
			
		||||
@font-face {
 | 
			
		||||
    font-family:"Irken";
 | 
			
		||||
    src:url("/static/content/fonts/Irken-Like-AllCaps.woff") format("woff");
 | 
			
		||||
    font-weight:normal;
 | 
			
		||||
    font-style:normal;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
:root {
 | 
			
		||||
    --primary-color: #5cdd8b;
 | 
			
		||||
    --primary-color-but-slightly-transparent: #5cdd8b44;
 | 
			
		||||
    --text-color: #b1b8c0;
 | 
			
		||||
    --background-color: #020205;
 | 
			
		||||
    --secondary-background-color: #090914;
 | 
			
		||||
    --secondary-background-color-but-slightly-transparent: #09091444;
 | 
			
		||||
    --font-size: 0.5cm;
 | 
			
		||||
    --font-family: "Space Mono", "serif";
 | 
			
		||||
    --title-font: 'Roboto Mono', sans-serif;
 | 
			
		||||
    --irken-font: 'Irken';
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
body {
 | 
			
		||||
    background-color: var(--background-color);
 | 
			
		||||
    background-image: url("https://blinkies.cafe/purple-stars-bg.gif");
 | 
			
		||||
    color: var(--text-color);
 | 
			
		||||
    font-size: var(--font-size);
 | 
			
		||||
    font-family: var(--font-family);
 | 
			
		||||
    display: grid;
 | 
			
		||||
    grid-template-columns: auto auto;
 | 
			
		||||
    grid-template-rows: 1fr;
 | 
			
		||||
    grid-template-areas: "main sidebar";
 | 
			
		||||
    margin: 7% auto 7% auto;
 | 
			
		||||
    gap: 1rem;
 | 
			
		||||
    justify-content: center;
 | 
			
		||||
    width: 940px;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#sidebar {
 | 
			
		||||
    grid-area: sidebar;
 | 
			
		||||
    display: flex;
 | 
			
		||||
    flex-direction: column;
 | 
			
		||||
    gap: 1rem;
 | 
			
		||||
    width: 174px;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#sidebar section {
 | 
			
		||||
    backdrop-filter: blur(2px) brightness(0.6);
 | 
			
		||||
    border: var(--secondary-background-color) 2px solid;
 | 
			
		||||
    border-radius: 10px;
 | 
			
		||||
    padding: 10px;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#sidebar ul {
 | 
			
		||||
    list-style-type: none;
 | 
			
		||||
    margin: 0;
 | 
			
		||||
    padding: 0;
 | 
			
		||||
    display: flex;
 | 
			
		||||
    flex-direction: column;  
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#sidebar ul li {
 | 
			
		||||
    width: fit-content;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#sidebar ul li a {
 | 
			
		||||
    color: var(--text-color);
 | 
			
		||||
    text-decoration: none;
 | 
			
		||||
    font-weight: 100;
 | 
			
		||||
    transition: all 0.2s ease-in-out
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#sidebar ul li a:hover {
 | 
			
		||||
    color: var(--primary-color);
 | 
			
		||||
    font-weight: 900;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#sidebar ul li img {
 | 
			
		||||
    transition: all 0.2s ease-in-out;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#sidebar ul li img:hover {
 | 
			
		||||
    transform: scale(1.1);
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#sidebar h1 {
 | 
			
		||||
    font-family: var(--title-font);
 | 
			
		||||
    font-size: 1.5rem;
 | 
			
		||||
    font-weight: 900;
 | 
			
		||||
    margin: 0;
 | 
			
		||||
    padding: 0;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#sidebar h6 {
 | 
			
		||||
    font-weight: 100;
 | 
			
		||||
    margin: 0;
 | 
			
		||||
    padding: 0;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#buttons {
 | 
			
		||||
    text-align: center;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#buttons h1 {
 | 
			
		||||
    font-family: var(--title-font);
 | 
			
		||||
    font-size: 1.3rem;
 | 
			
		||||
    font-weight: 900;
 | 
			
		||||
    margin: 0;
 | 
			
		||||
    padding: 0;
 | 
			
		||||
    text-shadow: var(--text-color) 1px 0 10px;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#buttons ul {
 | 
			
		||||
    list-style-type: none;
 | 
			
		||||
    margin: 0;
 | 
			
		||||
    padding: 0;
 | 
			
		||||
    display: flex;
 | 
			
		||||
    flex-direction: column;
 | 
			
		||||
    margin-top: 5px;
 | 
			
		||||
    align-items: center;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.vsmoltext {
 | 
			
		||||
    font-size: 0.5rem;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
main {
 | 
			
		||||
    grid-area: main;
 | 
			
		||||
    width: 761px;
 | 
			
		||||
    height: 100%;
 | 
			
		||||
    display: flex;
 | 
			
		||||
    flex-direction: column;
 | 
			
		||||
    gap: 1rem;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
header {
 | 
			
		||||
    backdrop-filter: blur(2px) brightness(0.6);
 | 
			
		||||
    border: var(--secondary-background-color) 2px solid;
 | 
			
		||||
    border-radius: 10px;
 | 
			
		||||
    padding: 15px;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
header div.row {
 | 
			
		||||
    display: flex;
 | 
			
		||||
    flex-direction: row;
 | 
			
		||||
    margin: 0;
 | 
			
		||||
    gap: 1.5rem;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
header div.column {
 | 
			
		||||
    display: flex;
 | 
			
		||||
    flex-direction: column;
 | 
			
		||||
    justify-content: center;
 | 
			
		||||
    margin: 0;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
header img {
 | 
			
		||||
    width: 9rem;
 | 
			
		||||
    height: 9rem;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
header h1 {
 | 
			
		||||
    font-family: var(--title-font);
 | 
			
		||||
    font-size: 5rem;
 | 
			
		||||
    font-weight: 900;
 | 
			
		||||
    padding: 0;
 | 
			
		||||
    margin: 0;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
header h2 {
 | 
			
		||||
    font-family: var(--title-font);
 | 
			
		||||
    font-size: 1.75rem;
 | 
			
		||||
    font-weight: 100;
 | 
			
		||||
    padding: 0;
 | 
			
		||||
    margin: 0;
 | 
			
		||||
    position: relative;
 | 
			
		||||
    top: -1rem;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
main section {
 | 
			
		||||
    backdrop-filter: blur(2px) brightness(0.6);
 | 
			
		||||
    width: 100%;
 | 
			
		||||
    display: flex;
 | 
			
		||||
    flex-direction: column;
 | 
			
		||||
    border: var(--secondary-background-color) 2px solid;
 | 
			
		||||
    border-radius: 10px;
 | 
			
		||||
    padding: 15px;
 | 
			
		||||
    box-sizing: border-box;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
main section h1 {
 | 
			
		||||
    font-size: 3rem;
 | 
			
		||||
    font-weight: 900;
 | 
			
		||||
    margin: 0;
 | 
			
		||||
    padding: 0;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
main section h2 {
 | 
			
		||||
    font-size: 1.5rem;
 | 
			
		||||
    font-weight: 900;
 | 
			
		||||
    margin: 0;
 | 
			
		||||
    padding: 0;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
main section h6 {
 | 
			
		||||
    font-size: 0.7rem;
 | 
			
		||||
    font-weight: 100;
 | 
			
		||||
    margin: 0;
 | 
			
		||||
    padding: 0;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
main section p {
 | 
			
		||||
    font-size: 1rem;
 | 
			
		||||
    margin: 0;
 | 
			
		||||
    padding: 0;
 | 
			
		||||
    font-weight: 300;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
main section a {
 | 
			
		||||
    color: var(--primary-color);
 | 
			
		||||
    text-decoration: none;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#furry {
 | 
			
		||||
    position: fixed;
 | 
			
		||||
    left: 0;
 | 
			
		||||
    top: 0;
 | 
			
		||||
    right: 0;
 | 
			
		||||
    bottom: 0;
 | 
			
		||||
    opacity: 0.1;
 | 
			
		||||
    background-image: url('/static/content/general_images/background.png');
 | 
			
		||||
    background-repeat: no-repeat;
 | 
			
		||||
    background-position: 50% 0;
 | 
			
		||||
    background-size: cover;
 | 
			
		||||
    z-index: -1;
 | 
			
		||||
    display: none;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.haj {
 | 
			
		||||
    width: 100%;
 | 
			
		||||
    filter: drop-shadow(0 0 0.5rem rgb(88, 214, 245));
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.irken {
 | 
			
		||||
    font-family: var(--irken-font);
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#alt-nav {
 | 
			
		||||
    display: none;
 | 
			
		||||
    backdrop-filter: blur(2px) brightness(0.6);
 | 
			
		||||
    width: 100%;
 | 
			
		||||
    border: var(--secondary-background-color) 2px solid;
 | 
			
		||||
    border-radius: 10px;
 | 
			
		||||
    padding: 15px;
 | 
			
		||||
    box-sizing: border-box;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#alt-nav ul {
 | 
			
		||||
    list-style-type: none;
 | 
			
		||||
    margin: 0;
 | 
			
		||||
    padding: 0;
 | 
			
		||||
    display: flex;
 | 
			
		||||
    flex-wrap: wrap;
 | 
			
		||||
    flex-direction: row;
 | 
			
		||||
    gap: 1.5rem;
 | 
			
		||||
    justify-content: center;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#alt-nav ul li {
 | 
			
		||||
    width: fit-content;
 | 
			
		||||
}
 | 
			
		||||
#alt-nav ul li a {
 | 
			
		||||
    color: var(--text-color);
 | 
			
		||||
    text-decoration: none;
 | 
			
		||||
    font-weight: 100;
 | 
			
		||||
    transition: all 0.2s ease-in-out
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#alt-nav ul li a:hover {
 | 
			
		||||
    color: var(--primary-color);
 | 
			
		||||
    font-weight: 900;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.title-font {
 | 
			
		||||
    font-family: var(--title-font);
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.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;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
a {
 | 
			
		||||
    text-decoration: none;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
@media screen and (max-width: 1000px) {
 | 
			
		||||
    body {
 | 
			
		||||
        background-color: var(--background-color);
 | 
			
		||||
        background-image: url("https://blinkies.cafe/purple-stars-bg.gif");
 | 
			
		||||
        color: var(--text-color);
 | 
			
		||||
        font-size: var(--font-size);
 | 
			
		||||
        font-family: var(--font-family);
 | 
			
		||||
        display: grid;
 | 
			
		||||
        grid-template-columns: auto;
 | 
			
		||||
        grid-template-rows: 1fr;
 | 
			
		||||
        grid-template-areas: "main";
 | 
			
		||||
        margin: 7% 0 7% 0;
 | 
			
		||||
        gap: 1rem;
 | 
			
		||||
        justify-content: center;
 | 
			
		||||
        width: 100%;
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    #sidebar {
 | 
			
		||||
        display: none;
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    #alt-nav {
 | 
			
		||||
        display: block;
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    main {
 | 
			
		||||
        width: 100%;
 | 
			
		||||
        box-sizing: border-box;
 | 
			
		||||
        padding: 0 1rem 0 1rem;
 | 
			
		||||
    }
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
@media screen and (max-width: 650px) {
 | 
			
		||||
    .flex-row {
 | 
			
		||||
        flex-direction: column;
 | 
			
		||||
    }
 | 
			
		||||
    
 | 
			
		||||
    .flex-col {
 | 
			
		||||
        flex-direction: row;
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    header img {
 | 
			
		||||
        display: none;
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    header div.row {
 | 
			
		||||
        justify-content: center;
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    header div {
 | 
			
		||||
        text-align: center;
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    header h2 {
 | 
			
		||||
        display: none;
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    div#spotify {
 | 
			
		||||
        box-sizing: border-box;
 | 
			
		||||
        background-repeat: no-repeat;
 | 
			
		||||
        background-size: contain;
 | 
			
		||||
        height: 100%;
 | 
			
		||||
        width: auto;
 | 
			
		||||
        aspect-ratio: 1/1;
 | 
			
		||||
        display: flex;
 | 
			
		||||
        flex-direction: column;
 | 
			
		||||
    }
 | 
			
		||||
}
 | 
			
		||||
							
								
								
									
										13
									
								
								static/css/directory.css
									
									
									
									
									
										Normal file
									
								
							
							
						
						@@ -0,0 +1,13 @@
 | 
			
		||||
section#directory ul {
 | 
			
		||||
    list-style: none;
 | 
			
		||||
    padding: 0;
 | 
			
		||||
    margin: 0;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
section#directory li {
 | 
			
		||||
    margin: 0.5rem 0;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
section#directory a:hover {
 | 
			
		||||
    scale: 1.05;
 | 
			
		||||
}
 | 
			
		||||
							
								
								
									
										17
									
								
								static/css/gallery.css
									
									
									
									
									
										Normal file
									
								
							
							
						
						@@ -0,0 +1,17 @@
 | 
			
		||||
.gallery {
 | 
			
		||||
    display: flex;
 | 
			
		||||
    flex-wrap: wrap;
 | 
			
		||||
    justify-content: space-between;
 | 
			
		||||
    gap: 1rem;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.gallery img {
 | 
			
		||||
    max-width: 100%;
 | 
			
		||||
    height: auto;
 | 
			
		||||
    border-radius: 10px;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.gallery-date {
 | 
			
		||||
    margin: 1rem 0 .25rem 0;
 | 
			
		||||
    font-size: 2rem;
 | 
			
		||||
}
 | 
			
		||||
@@ -1,240 +1,3 @@
 | 
			
		||||
@import url('https://fonts.googleapis.com/css2?family=Fredoka:wdth,wght@125,700&family=Space+Mono:ital,wght@0,400;0,700;1,400;1,700&display=swap');
 | 
			
		||||
@font-face {
 | 
			
		||||
    font-family:"Irken";
 | 
			
		||||
    src:url("/static/content/Irken-Like-AllCaps.woff") format("woff");
 | 
			
		||||
    font-weight:normal;
 | 
			
		||||
    font-style:normal;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
:root {
 | 
			
		||||
    --primary-color: #5cdd8b;
 | 
			
		||||
    --primary-color-but-slightly-transparent: #5cdd8b44;
 | 
			
		||||
    --text-color: #b1b8c0;
 | 
			
		||||
    --background-color: #020205;
 | 
			
		||||
    --secondary-background-color: #090914;
 | 
			
		||||
    --secondary-background-color-but-slightly-transparent: #09091444;
 | 
			
		||||
    --font-size: 0.5cm;
 | 
			
		||||
    --font-family: "Space Mono", "serif";
 | 
			
		||||
    --title-font: 'Roboto Mono', sans-serif;
 | 
			
		||||
    --irken-font: 'Irken';
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
body {
 | 
			
		||||
    background-color: var(--background-color);
 | 
			
		||||
    background-image: url("https://blinkies.cafe/purple-stars-bg.gif");
 | 
			
		||||
    color: var(--text-color);
 | 
			
		||||
    font-size: var(--font-size);
 | 
			
		||||
    font-family: var(--font-family);
 | 
			
		||||
    display: grid;
 | 
			
		||||
    grid-template-columns: auto auto;
 | 
			
		||||
    grid-template-rows: 1fr;
 | 
			
		||||
    grid-template-areas: "main sidebar";
 | 
			
		||||
    margin: 7% auto 7% auto;
 | 
			
		||||
    gap: 1rem;
 | 
			
		||||
    justify-content: center;
 | 
			
		||||
    width: 940px;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#sidebar {
 | 
			
		||||
    grid-area: sidebar;
 | 
			
		||||
    display: flex;
 | 
			
		||||
    flex-direction: column;
 | 
			
		||||
    gap: 1rem;
 | 
			
		||||
    width: 174px;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#sidebar section {
 | 
			
		||||
    backdrop-filter: blur(2px) brightness(0.6);
 | 
			
		||||
    border: var(--secondary-background-color) 2px solid;
 | 
			
		||||
    border-radius: 10px;
 | 
			
		||||
    padding: 10px;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#sidebar ul {
 | 
			
		||||
    list-style-type: none;
 | 
			
		||||
    margin: 0;
 | 
			
		||||
    padding: 0;
 | 
			
		||||
    display: flex;
 | 
			
		||||
    flex-direction: column;  
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#sidebar ul li {
 | 
			
		||||
    width: fit-content;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#sidebar ul li a {
 | 
			
		||||
    color: var(--text-color);
 | 
			
		||||
    text-decoration: none;
 | 
			
		||||
    font-weight: 100;
 | 
			
		||||
    transition: all 0.2s ease-in-out
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#sidebar ul li a:hover {
 | 
			
		||||
    color: var(--primary-color);
 | 
			
		||||
    font-weight: 900;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#sidebar ul li img {
 | 
			
		||||
    transition: all 0.2s ease-in-out;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#sidebar ul li img:hover {
 | 
			
		||||
    transform: scale(1.1);
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#sidebar h1 {
 | 
			
		||||
    font-family: var(--title-font);
 | 
			
		||||
    font-size: 1.5rem;
 | 
			
		||||
    font-weight: 900;
 | 
			
		||||
    margin: 0;
 | 
			
		||||
    padding: 0;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#sidebar h6 {
 | 
			
		||||
    font-weight: 100;
 | 
			
		||||
    margin: 0;
 | 
			
		||||
    padding: 0;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#buttons {
 | 
			
		||||
    text-align: center;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#buttons h1 {
 | 
			
		||||
    font-family: var(--title-font);
 | 
			
		||||
    font-size: 1.3rem;
 | 
			
		||||
    font-weight: 900;
 | 
			
		||||
    margin: 0;
 | 
			
		||||
    padding: 0;
 | 
			
		||||
    text-shadow: var(--text-color) 1px 0 10px;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#buttons ul {
 | 
			
		||||
    list-style-type: none;
 | 
			
		||||
    margin: 0;
 | 
			
		||||
    padding: 0;
 | 
			
		||||
    display: flex;
 | 
			
		||||
    flex-direction: column;
 | 
			
		||||
    margin-top: 5px;
 | 
			
		||||
    align-items: center;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.vsmoltext {
 | 
			
		||||
    font-size: 0.5rem;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
main {
 | 
			
		||||
    grid-area: main;
 | 
			
		||||
    width: 761px;
 | 
			
		||||
    height: 100%;
 | 
			
		||||
    display: flex;
 | 
			
		||||
    flex-direction: column;
 | 
			
		||||
    gap: 1rem;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
header {
 | 
			
		||||
    backdrop-filter: blur(2px) brightness(0.6);
 | 
			
		||||
    border: var(--secondary-background-color) 2px solid;
 | 
			
		||||
    border-radius: 10px;
 | 
			
		||||
    padding: 15px;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
header div.row {
 | 
			
		||||
    display: flex;
 | 
			
		||||
    flex-direction: row;
 | 
			
		||||
    margin: 0;
 | 
			
		||||
    gap: 1.5rem;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
header div.column {
 | 
			
		||||
    display: flex;
 | 
			
		||||
    flex-direction: column;
 | 
			
		||||
    justify-content: center;
 | 
			
		||||
    margin: 0;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
header img {
 | 
			
		||||
    width: 9rem;
 | 
			
		||||
    height: 9rem;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
header h1 {
 | 
			
		||||
    font-family: var(--title-font);
 | 
			
		||||
    font-size: 5rem;
 | 
			
		||||
    font-weight: 900;
 | 
			
		||||
    padding: 0;
 | 
			
		||||
    margin: 0;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
header h2 {
 | 
			
		||||
    font-family: var(--title-font);
 | 
			
		||||
    font-size: 1.75rem;
 | 
			
		||||
    font-weight: 100;
 | 
			
		||||
    padding: 0;
 | 
			
		||||
    margin: 0;
 | 
			
		||||
    position: relative;
 | 
			
		||||
    top: -1rem;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
main section {
 | 
			
		||||
    backdrop-filter: blur(2px) brightness(0.6);
 | 
			
		||||
    width: 100%;
 | 
			
		||||
    display: flex;
 | 
			
		||||
    flex-direction: column;
 | 
			
		||||
    border: var(--secondary-background-color) 2px solid;
 | 
			
		||||
    border-radius: 10px;
 | 
			
		||||
    padding: 15px;
 | 
			
		||||
    box-sizing: border-box;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
main section h1 {
 | 
			
		||||
    font-size: 3rem;
 | 
			
		||||
    font-weight: 900;
 | 
			
		||||
    margin: 0;
 | 
			
		||||
    padding: 0;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
main section h2 {
 | 
			
		||||
    font-size: 1.5rem;
 | 
			
		||||
    font-weight: 900;
 | 
			
		||||
    margin: 0;
 | 
			
		||||
    padding: 0;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
main section h6 {
 | 
			
		||||
    font-size: 0.7rem;
 | 
			
		||||
    font-weight: 100;
 | 
			
		||||
    margin: 0;
 | 
			
		||||
    padding: 0;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
main section p {
 | 
			
		||||
    font-size: 1rem;
 | 
			
		||||
    margin: 0;
 | 
			
		||||
    padding: 0;
 | 
			
		||||
    font-weight: 300;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
main section a {
 | 
			
		||||
    color: var(--primary-color);
 | 
			
		||||
    text-decoration: none;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#furry {
 | 
			
		||||
    position: fixed;
 | 
			
		||||
    left: 0;
 | 
			
		||||
    top: 0;
 | 
			
		||||
    right: 0;
 | 
			
		||||
    bottom: 0;
 | 
			
		||||
    opacity: 0.1;
 | 
			
		||||
    background-image: url('/static/content/background.png');
 | 
			
		||||
    background-repeat: no-repeat;
 | 
			
		||||
    background-position: 50% 0;
 | 
			
		||||
    background-size: cover;
 | 
			
		||||
    z-index: -1;
 | 
			
		||||
    display: none;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.blinkies {
 | 
			
		||||
    justify-content: center;
 | 
			
		||||
    display: flex;
 | 
			
		||||
@@ -256,22 +19,6 @@ main section a {
 | 
			
		||||
    transform: scale(1.1) rotate(-5deg);
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
section.rowsect {
 | 
			
		||||
    width: 100%;
 | 
			
		||||
    display: grid;
 | 
			
		||||
    grid-template-columns: auto auto;
 | 
			
		||||
    gap: 1rem;
 | 
			
		||||
    backdrop-filter: none;
 | 
			
		||||
    border: none;
 | 
			
		||||
    padding: 0;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
section.rowsect>div {
 | 
			
		||||
    backdrop-filter: blur(2px) brightness(0.6);
 | 
			
		||||
    border: var(--secondary-background-color) 2px solid;
 | 
			
		||||
    border-radius: 10px;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.stamps {
 | 
			
		||||
    display: flex;
 | 
			
		||||
    flex-direction: row;
 | 
			
		||||
@@ -329,15 +76,6 @@ section.rowsect>div {
 | 
			
		||||
    mix-blend-mode: difference;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.haj {
 | 
			
		||||
    width: 100%;
 | 
			
		||||
    filter: drop-shadow(0 0 0.5rem rgb(88, 214, 245));
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.irken {
 | 
			
		||||
    font-family: var(--irken-font);
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#button-collection {
 | 
			
		||||
    display: flex;
 | 
			
		||||
    flex-direction: row;
 | 
			
		||||
@@ -357,93 +95,7 @@ section.rowsect>div {
 | 
			
		||||
    transform: scale(1.1) rotate(-5deg);
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#alt-nav {
 | 
			
		||||
    display: none;
 | 
			
		||||
    backdrop-filter: blur(2px) brightness(0.6);
 | 
			
		||||
    width: 100%;
 | 
			
		||||
    border: var(--secondary-background-color) 2px solid;
 | 
			
		||||
    border-radius: 10px;
 | 
			
		||||
    padding: 15px;
 | 
			
		||||
    box-sizing: border-box;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#alt-nav ul {
 | 
			
		||||
    list-style-type: none;
 | 
			
		||||
    margin: 0;
 | 
			
		||||
    padding: 0;
 | 
			
		||||
    display: flex;
 | 
			
		||||
    flex-wrap: wrap;
 | 
			
		||||
    flex-direction: row;
 | 
			
		||||
    gap: 1.5rem;
 | 
			
		||||
    justify-content: center;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#alt-nav ul li {
 | 
			
		||||
    width: fit-content;
 | 
			
		||||
}
 | 
			
		||||
#alt-nav ul li a {
 | 
			
		||||
    color: var(--text-color);
 | 
			
		||||
    text-decoration: none;
 | 
			
		||||
    font-weight: 100;
 | 
			
		||||
    transition: all 0.2s ease-in-out
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#alt-nav ul li a:hover {
 | 
			
		||||
    color: var(--primary-color);
 | 
			
		||||
    font-weight: 900;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
@media screen and (max-width: 1000px) {
 | 
			
		||||
    body {
 | 
			
		||||
        background-color: var(--background-color);
 | 
			
		||||
        background-image: url("https://blinkies.cafe/purple-stars-bg.gif");
 | 
			
		||||
        color: var(--text-color);
 | 
			
		||||
        font-size: var(--font-size);
 | 
			
		||||
        font-family: var(--font-family);
 | 
			
		||||
        display: grid;
 | 
			
		||||
        grid-template-columns: auto;
 | 
			
		||||
        grid-template-rows: 1fr;
 | 
			
		||||
        grid-template-areas: "main";
 | 
			
		||||
        margin: 7% 0 7% 0;
 | 
			
		||||
        gap: 1rem;
 | 
			
		||||
        justify-content: center;
 | 
			
		||||
        width: 100%;
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    #sidebar {
 | 
			
		||||
        display: none;
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    #alt-nav {
 | 
			
		||||
        display: block;
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    main {
 | 
			
		||||
        width: 100%;
 | 
			
		||||
        box-sizing: border-box;
 | 
			
		||||
        padding: 0 1rem 0 1rem;
 | 
			
		||||
    }
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
@media screen and (max-width: 650px) {
 | 
			
		||||
    header img {
 | 
			
		||||
        display: none;
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    header div.row {
 | 
			
		||||
        justify-content: center;
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    section.rowsect {
 | 
			
		||||
        width: 100%;
 | 
			
		||||
        display: flex;
 | 
			
		||||
        flex-direction: column;
 | 
			
		||||
        gap: 1rem;
 | 
			
		||||
        backdrop-filter: none;
 | 
			
		||||
        border: none;
 | 
			
		||||
        padding: 0;
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    div#spotify {
 | 
			
		||||
        box-sizing: border-box;
 | 
			
		||||
        background-repeat: no-repeat;
 | 
			
		||||
 
 | 
			
		||||
							
								
								
									
										84
									
								
								static/css/toaster.css
									
									
									
									
									
										Normal file
									
								
							
							
						
						@@ -0,0 +1,84 @@
 | 
			
		||||
ul#toaster-specs {
 | 
			
		||||
    padding: 0;
 | 
			
		||||
    margin: 5px 0;
 | 
			
		||||
    display: flex;
 | 
			
		||||
    flex-direction: column;
 | 
			
		||||
    gap: 2px;
 | 
			
		||||
    min-width: 400px;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
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);
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.fill-height {
 | 
			
		||||
    height: 100%;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.fur-meet-gallery-small {
 | 
			
		||||
    display: flex;
 | 
			
		||||
    flex-wrap: wrap;
 | 
			
		||||
    gap: 5px;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.fur-meet-gallery-small img {
 | 
			
		||||
    width: 150px;
 | 
			
		||||
    height: 150px;
 | 
			
		||||
    object-fit: cover;
 | 
			
		||||
    border-radius: 10px;
 | 
			
		||||
    border: 2px solid var(--secondary-background-color);
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.fur-meet-gallery-small img:hover {
 | 
			
		||||
    transform: scale(1.05);
 | 
			
		||||
    transition: transform 0.2s ease-in-out;
 | 
			
		||||
    cursor: pointer;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#fur-meets {
 | 
			
		||||
    list-style: none;
 | 
			
		||||
    padding: 0;
 | 
			
		||||
    margin: 10px;
 | 
			
		||||
    display: flex;
 | 
			
		||||
    flex-direction: column;
 | 
			
		||||
    gap: 10px;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
@media screen and (max-width: 740px) {
 | 
			
		||||
    .flex-row {
 | 
			
		||||
        flex-direction: column;
 | 
			
		||||
    }
 | 
			
		||||
    
 | 
			
		||||
    .flex-col {
 | 
			
		||||
        flex-direction: row;
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    #toaster-img {
 | 
			
		||||
        width: 100%;
 | 
			
		||||
    }
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
@media screen and (max-width: 690px) {
 | 
			
		||||
    .flex-col {
 | 
			
		||||
        flex-direction: column;
 | 
			
		||||
    }
 | 
			
		||||
}
 | 
			
		||||
@@ -1,5 +1,3 @@
 | 
			
		||||
// TYPERWRITER
 | 
			
		||||
 | 
			
		||||
const values = [
 | 
			
		||||
    "Web developer", 
 | 
			
		||||
    "Pc games enjoyer", 
 | 
			
		||||
@@ -22,12 +20,12 @@ const values = [
 | 
			
		||||
    "Loud Music enjoyer",
 | 
			
		||||
    "part time femboy :<",
 | 
			
		||||
];
 | 
			
		||||
var direction = 1;
 | 
			
		||||
var text = "";
 | 
			
		||||
var speed = 100; 
 | 
			
		||||
var selectedValue = 0;
 | 
			
		||||
var currentValueIndex = 0;
 | 
			
		||||
var pause = false;
 | 
			
		||||
let typing_direction = 1;
 | 
			
		||||
let text = "";
 | 
			
		||||
let speed = 100; 
 | 
			
		||||
let selectedValue = 0;
 | 
			
		||||
let currentValueIndex = 0;
 | 
			
		||||
let pause = false;
 | 
			
		||||
 | 
			
		||||
function randomValue() {
 | 
			
		||||
    selectedValue = Math.floor(Math.random() * values.length);
 | 
			
		||||
@@ -35,12 +33,12 @@ function randomValue() {
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
function type() {
 | 
			
		||||
    if (direction == 1) {
 | 
			
		||||
    if (typing_direction == 1) {
 | 
			
		||||
        if (currentValueIndex < values[selectedValue].length) {
 | 
			
		||||
            text += values[selectedValue][currentValueIndex];
 | 
			
		||||
            currentValueIndex++;
 | 
			
		||||
        } else {
 | 
			
		||||
            direction = -1;
 | 
			
		||||
            typing_direction = -1;
 | 
			
		||||
            pause = true;
 | 
			
		||||
        }
 | 
			
		||||
    } else {
 | 
			
		||||
@@ -48,7 +46,7 @@ function type() {
 | 
			
		||||
            text = text.slice(0, -1);
 | 
			
		||||
            currentValueIndex--;
 | 
			
		||||
        } else {
 | 
			
		||||
            direction = 1;
 | 
			
		||||
            typing_direction = 1;
 | 
			
		||||
            randomValue();
 | 
			
		||||
        }
 | 
			
		||||
    }
 | 
			
		||||
@@ -57,7 +55,7 @@ function type() {
 | 
			
		||||
function typing() {
 | 
			
		||||
    type();
 | 
			
		||||
    document.getElementById("typing").innerHTML = "$ " + text;
 | 
			
		||||
    if (direction == 1) {
 | 
			
		||||
    if (typing_direction == 1) {
 | 
			
		||||
        speed = 80 + Math.random() * 100;
 | 
			
		||||
    } else {
 | 
			
		||||
        speed = 60 + (Math.random() * 100) / 2;
 | 
			
		||||
@@ -74,7 +72,7 @@ typing();
 | 
			
		||||
 | 
			
		||||
// HIDDEN STUFF (shh don't tell anyone >:3)
 | 
			
		||||
 | 
			
		||||
var last5Chars = "";
 | 
			
		||||
let last5Chars = "";
 | 
			
		||||
 | 
			
		||||
document.addEventListener('keydown', function(event) {
 | 
			
		||||
    last5Chars += event.key;
 | 
			
		||||
@@ -120,7 +118,7 @@ if (document.getElementById('spotify')) {
 | 
			
		||||
// load buttons
 | 
			
		||||
 | 
			
		||||
function loadButtons() {
 | 
			
		||||
    fetch('/static/content/buttons.txt').then(response => {
 | 
			
		||||
    fetch('/static/content/other/buttons.txt').then(response => {
 | 
			
		||||
        return response.text();
 | 
			
		||||
    }).then(data => {
 | 
			
		||||
        container = document.getElementById('button-collection');
 | 
			
		||||
							
								
								
									
										174
									
								
								static/js/snake.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						@@ -0,0 +1,174 @@
 | 
			
		||||
const canvas = document.getElementById('snakeCanvas');
 | 
			
		||||
const ctx = canvas.getContext('2d');
 | 
			
		||||
 | 
			
		||||
const gridSize = 20;
 | 
			
		||||
const tileSize = 100;
 | 
			
		||||
const snakeSize = 60;
 | 
			
		||||
const foodSize = 80;
 | 
			
		||||
canvas.width = gridSize * tileSize;
 | 
			
		||||
canvas.height = gridSize * tileSize;
 | 
			
		||||
 | 
			
		||||
let snake = [{ x: 10, y: 10 }, { x: 10, y: 11 }, { x: 10, y: 12 }];
 | 
			
		||||
let direction = { x: 0, y: 0 };
 | 
			
		||||
let food = { x: Math.floor(Math.random() * gridSize), y: Math.floor(Math.random() * gridSize) };
 | 
			
		||||
let score = 0;
 | 
			
		||||
let gameOver = false;
 | 
			
		||||
 | 
			
		||||
function draw() {
 | 
			
		||||
    ctx.clearRect(0, 0, canvas.width, canvas.height);
 | 
			
		||||
 | 
			
		||||
    // draw grid of checkerboard pattern
 | 
			
		||||
    for (let x = 0; x < gridSize; x++) {
 | 
			
		||||
        for (let y = 0; y < gridSize; y++) {
 | 
			
		||||
            ctx.fillStyle = (x + y) % 2 === 0 ? 
 | 
			
		||||
            getComputedStyle(document.documentElement).getPropertyValue('--background-color') : 
 | 
			
		||||
            getComputedStyle(document.documentElement).getPropertyValue('--secondary-background-color');
 | 
			
		||||
            ctx.fillRect(x * tileSize, y * tileSize, tileSize, tileSize);
 | 
			
		||||
        }
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    // Draw snake
 | 
			
		||||
    snake.forEach(segment => {
 | 
			
		||||
        let nextVec = { x: 0, y: 0 };
 | 
			
		||||
        // if there is a segment after the current segment
 | 
			
		||||
        if (snake.indexOf(segment) < snake.length - 1) {
 | 
			
		||||
            const nextSegment = snake[snake.indexOf(segment) + 1];
 | 
			
		||||
            nextVec.x = nextSegment.x - segment.x;
 | 
			
		||||
            nextVec.y = nextSegment.y - segment.y;
 | 
			
		||||
        }
 | 
			
		||||
 | 
			
		||||
        ctx.fillStyle = getComputedStyle(document.documentElement).getPropertyValue('--primary-color');
 | 
			
		||||
        if (nextVec.x === 0 && nextVec.y === 0) {
 | 
			
		||||
            ctx.fillRect(
 | 
			
		||||
                segment.x * tileSize + (tileSize - snakeSize) / 2,
 | 
			
		||||
                segment.y * tileSize + (tileSize - snakeSize) / 2,
 | 
			
		||||
                snakeSize,
 | 
			
		||||
                snakeSize
 | 
			
		||||
            );
 | 
			
		||||
        } else if (nextVec.x > 0 || nextVec.y > 0) {
 | 
			
		||||
            ctx.fillRect(
 | 
			
		||||
                segment.x * tileSize + (tileSize - snakeSize) / 2,
 | 
			
		||||
                segment.y * tileSize + (tileSize - snakeSize) / 2,
 | 
			
		||||
                snakeSize + nextVec.x * (tileSize - snakeSize),
 | 
			
		||||
                snakeSize + nextVec.y * (tileSize - snakeSize)
 | 
			
		||||
            );
 | 
			
		||||
        } else {
 | 
			
		||||
            ctx.fillRect(
 | 
			
		||||
                segment.x * tileSize + (tileSize - snakeSize) / 2 + nextVec.x * (tileSize - snakeSize),
 | 
			
		||||
                segment.y * tileSize + (tileSize - snakeSize) / 2 + nextVec.y * (tileSize - snakeSize),
 | 
			
		||||
                snakeSize + Math.abs(nextVec.x) * (tileSize - snakeSize),
 | 
			
		||||
                snakeSize + Math.abs(nextVec.y) * (tileSize - snakeSize)
 | 
			
		||||
            );
 | 
			
		||||
        }
 | 
			
		||||
        
 | 
			
		||||
    });
 | 
			
		||||
 | 
			
		||||
    // Draw food
 | 
			
		||||
    ctx.fillStyle = '#ff4d4d';
 | 
			
		||||
    ctx.fillRect(
 | 
			
		||||
        food.x * tileSize + (tileSize - foodSize) / 2,
 | 
			
		||||
        food.y * tileSize + (tileSize - foodSize) / 2,
 | 
			
		||||
        foodSize,
 | 
			
		||||
        foodSize
 | 
			
		||||
    );
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
function update() {
 | 
			
		||||
    if (gameOver) return;
 | 
			
		||||
 | 
			
		||||
    // Move snake
 | 
			
		||||
    const head = { x: snake[0].x + direction.x, y: snake[0].y + direction.y };
 | 
			
		||||
 | 
			
		||||
    // Add new head
 | 
			
		||||
    snake.unshift(head);
 | 
			
		||||
 | 
			
		||||
    // Check for food collision
 | 
			
		||||
    if (head.x === food.x && head.y === food.y) {
 | 
			
		||||
        score += 10; // Increase score
 | 
			
		||||
        placeFood();
 | 
			
		||||
    } else {
 | 
			
		||||
        snake.pop(); // Remove tail if no food eaten
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    // Check for wall collision
 | 
			
		||||
    if (head.x < 0 || head.x >= gridSize || head.y < 0 || head.y >= gridSize) {
 | 
			
		||||
        gameOver = true;
 | 
			
		||||
        return;
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    // Check for self collision
 | 
			
		||||
    for (let i = 1; i < snake.length; i++) {
 | 
			
		||||
        if (head.x === snake[i].x && head.y === snake[i].y) {
 | 
			
		||||
            gameOver = true;
 | 
			
		||||
            return;
 | 
			
		||||
        }
 | 
			
		||||
    }
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
function placeFood() {
 | 
			
		||||
    do {
 | 
			
		||||
        food.x = Math.floor(Math.random() * gridSize);
 | 
			
		||||
        food.y = Math.floor(Math.random() * gridSize);
 | 
			
		||||
    } while (snake.some(segment => segment.x === food.x && segment.y === food.y));
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
function changeDirection(event) {
 | 
			
		||||
    switch (event.key) {
 | 
			
		||||
        case 'w':
 | 
			
		||||
            if (direction.y === 0) direction = { x: 0, y: -1 };
 | 
			
		||||
            break;
 | 
			
		||||
        case 's':
 | 
			
		||||
            if (direction.y === 0) direction = { x: 0, y: 1 };
 | 
			
		||||
            break;
 | 
			
		||||
        case 'a':
 | 
			
		||||
            if (direction.x === 0) direction = { x: -1, y: 0 };
 | 
			
		||||
            break;
 | 
			
		||||
        case 'd':
 | 
			
		||||
            if (direction.x === 0) direction = { x: 1, y: 0 };
 | 
			
		||||
            break;
 | 
			
		||||
    }
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// Menu to start the game
 | 
			
		||||
function menu() {
 | 
			
		||||
    ctx.clearRect(0, 0, canvas.width, canvas.height);
 | 
			
		||||
 | 
			
		||||
    ctx.fillStyle = getComputedStyle(document.documentElement).getPropertyValue('--background-color');
 | 
			
		||||
    ctx.fillRect(0, 0, canvas.width, canvas.height);
 | 
			
		||||
 | 
			
		||||
    ctx.textAlign = 'center';
 | 
			
		||||
    ctx.fillStyle = getComputedStyle(document.documentElement).getPropertyValue('--text-color');
 | 
			
		||||
    ctx.font = '200px Arial';
 | 
			
		||||
    ctx.fillText('Snake Game', canvas.width / 2, canvas.height / 2);
 | 
			
		||||
    ctx.font = '100px Arial';
 | 
			
		||||
    ctx.fillText('Press W/A/S/D to move', canvas.width / 2, canvas.height / 2 + 100);
 | 
			
		||||
    ctx.fillText('Click to start', canvas.width / 2, canvas.height / 2 + 200);
 | 
			
		||||
 | 
			
		||||
    canvas.addEventListener('click', startGame);
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
function gameLoop() {
 | 
			
		||||
    if (!gameOver) {
 | 
			
		||||
        update();
 | 
			
		||||
        draw();
 | 
			
		||||
        setTimeout(gameLoop, 100);
 | 
			
		||||
    } else {
 | 
			
		||||
        document.removeEventListener('keydown', changeDirection);
 | 
			
		||||
        document.getElementById('score').value = score;
 | 
			
		||||
        alert(`Game Over! Your score: ${score}`);
 | 
			
		||||
        menu();
 | 
			
		||||
    }
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
function startGame() {
 | 
			
		||||
    snake = [{ x: 10, y: 10 }, { x: 10, y: 11 }, { x: 10, y: 12 }];
 | 
			
		||||
    direction = { x: 1, y: 0 };
 | 
			
		||||
    food = { x: Math.floor(Math.random() * gridSize), y: Math.floor(Math.random() * gridSize) };
 | 
			
		||||
    score = 0;
 | 
			
		||||
    gameOver = false;
 | 
			
		||||
    canvas.removeEventListener('click', startGame);
 | 
			
		||||
    document.addEventListener('keydown', changeDirection);
 | 
			
		||||
    gameLoop();
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
menu();
 | 
			
		||||
@@ -3,19 +3,21 @@
 | 
			
		||||
<head>
 | 
			
		||||
    <meta charset="UTF-8">
 | 
			
		||||
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
 | 
			
		||||
    <title>Alfie's basement</title>
 | 
			
		||||
    <link rel="icon" href="/static/content/icon.webp">
 | 
			
		||||
    <link rel="stylesheet" href="/static/css/index.css">
 | 
			
		||||
    <meta name="description" content="Alfie's basement">
 | 
			
		||||
    <meta name="keywords" content="Alfie King, Alfie, King, Alfieking, Alfieking.dev, dev, server">
 | 
			
		||||
    <title>{% block title %}Alfie's basement{% endblock %}</title>
 | 
			
		||||
    <link rel="icon" href="/static/content/general_images/icon.webp">
 | 
			
		||||
    <link rel="stylesheet" href="/static/css/base.css">
 | 
			
		||||
    <meta name="description" content="{% block description %}server backend survivor{% endblock %}">
 | 
			
		||||
    <meta name="keywords" content="{% block keywords %}Alfie King, Alfie, King, Alfieking, Alfieking.dev, dev, server, developer, backend, selfhost, homelab{% endblock %}">
 | 
			
		||||
    <meta name="author" content="Alfie King">
 | 
			
		||||
    <meta name="robots" content="all">
 | 
			
		||||
    <meta name="theme-color" content="#63de90" data-react-helmet="true">
 | 
			
		||||
    <meta property="og:site_name" content="Alfieking.dev">
 | 
			
		||||
    <meta property="og:url" content="https://alfieking.dev">
 | 
			
		||||
    <meta property="og:title" content="Alfie's basement">
 | 
			
		||||
    <meta property="og:description" content="server backend survivor">
 | 
			
		||||
    <meta property="og:image" content="static/content/icon.webp">
 | 
			
		||||
    <meta property="og:url" content="https://alfieking.dev/">
 | 
			
		||||
    <meta property="og:title" content="{% block og-title %}Home - Alfie's basement{% endblock %}">
 | 
			
		||||
    <meta property="og:description" content="{% block og-description %}server backend survivor{% endblock %}">
 | 
			
		||||
    <meta property="og:image" content="{% block og_image %}/static/content/general_images/icon.webp{% endblock %}">
 | 
			
		||||
    {% block head %}
 | 
			
		||||
    {% endblock %}
 | 
			
		||||
</head>
 | 
			
		||||
<body>
 | 
			
		||||
    <div id="furry"></div>
 | 
			
		||||
@@ -25,13 +27,15 @@
 | 
			
		||||
                <h1>Things to see :3</h1>
 | 
			
		||||
                <ul>
 | 
			
		||||
                    <li><a href="/">Home</a></li>
 | 
			
		||||
                    <li><a href="/toaster">Toaster</a></li>
 | 
			
		||||
                    <li><a href="/events">Events</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>
 | 
			
		||||
                    <li><a href="https://open.spotify.com/user/xz02oolstlvwxqu1pfcua9exz?si=14396e637f284e03">Spotify</a></li>
 | 
			
		||||
                    <li><a href="https://steamcommunity.com/id/acetheking987/">Steam</a></li>
 | 
			
		||||
                    <li><a href="https://www.youtube.com/@acetheking987">YouTube</a></li>
 | 
			
		||||
                    <li><a href="https://acetheking987.tumblr.com/">Tumblr</a></li>Instagram
 | 
			
		||||
                    <li><a href="https://acetheking987.tumblr.com/">Tumblr</a></li>
 | 
			
		||||
                    <li><a href="https://www.reddit.com/user/acetheking987">Reddit</a></li>
 | 
			
		||||
                </ul>
 | 
			
		||||
            </section>
 | 
			
		||||
@@ -58,30 +62,40 @@
 | 
			
		||||
        <section>
 | 
			
		||||
            <pre class="vsmoltext">      |\      _,,,---,,_<br>ZZZzz /,`.-'`'    -.  ;-;;,_<br>     |,4-  ) )-,_. ,\ (  `'-'<br>    '---''(_/--'  `-'\_)</pre>
 | 
			
		||||
        </section>
 | 
			
		||||
        <img src="static/content/haj.gif" alt="haj" class="haj">
 | 
			
		||||
        <img src="/static/content/general_images/haj.gif" alt="haj" class="haj">
 | 
			
		||||
    </div>
 | 
			
		||||
    <main id="main">
 | 
			
		||||
        <header id="home">
 | 
			
		||||
            <div class="row">
 | 
			
		||||
                <img src="/static/content/icon.webp">
 | 
			
		||||
                <img src="/static/content/general_images/icon.webp">
 | 
			
		||||
                <div>
 | 
			
		||||
                    <h1>Alfie King</h1>
 | 
			
		||||
                    <h2 id="typing">server backend survivor</h2>
 | 
			
		||||
                </div>
 | 
			
		||||
            </div>
 | 
			
		||||
        </header>
 | 
			
		||||
        <section>
 | 
			
		||||
            <h1>404</h1>
 | 
			
		||||
            <p>
 | 
			
		||||
                It seems like the thing you are looking for is not here :[
 | 
			
		||||
            </p>
 | 
			
		||||
        </section>
 | 
			
		||||
        <nav id="alt-nav">
 | 
			
		||||
            <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>
 | 
			
		||||
                <li><a href="https://open.spotify.com/user/xz02oolstlvwxqu1pfcua9exz?si=14396e637f284e03">Spotify</a></li>
 | 
			
		||||
                <li><a href="https://steamcommunity.com/id/acetheking987/">Steam</a></li>
 | 
			
		||||
                <li><a href="https://www.youtube.com/@acetheking987">YouTube</a></li>
 | 
			
		||||
                <li><a href="https://acetheking987.tumblr.com/">Tumblr</a></li>
 | 
			
		||||
                <li><a href="https://www.reddit.com/user/acetheking987">Reddit</a></li>
 | 
			
		||||
            </ul>
 | 
			
		||||
        </nav>
 | 
			
		||||
        {% block content %}{% endblock %}
 | 
			
		||||
        <section>
 | 
			
		||||
            <footer>
 | 
			
		||||
                <p>legal stuff idk :3 | icba to © this :P | made with ♥ and caffine</p>
 | 
			
		||||
            </footer>
 | 
			
		||||
        </section>
 | 
			
		||||
    </main>
 | 
			
		||||
    <script src="/static/js/index.js"></script>
 | 
			
		||||
    {% block scripts %}{% endblock %}
 | 
			
		||||
    <script src="/static/js/base.js"></script>
 | 
			
		||||
</body>
 | 
			
		||||
</html>
 | 
			
		||||
							
								
								
									
										22
									
								
								templates/bases/directory.html
									
									
									
									
									
										Normal file
									
								
							
							
						
						@@ -0,0 +1,22 @@
 | 
			
		||||
{% extends "base.html" %}
 | 
			
		||||
 | 
			
		||||
{% block title %}/{{ directory }} - Alfie's basement{% endblock %}
 | 
			
		||||
{% block description %}server backend survivor{% endblock %}
 | 
			
		||||
 | 
			
		||||
{% block head %}
 | 
			
		||||
<link rel="stylesheet" href="/static/css/directory.css">
 | 
			
		||||
{% endblock %}
 | 
			
		||||
 | 
			
		||||
{% block scripts %}
 | 
			
		||||
{% endblock %}
 | 
			
		||||
 | 
			
		||||
{% block content %}
 | 
			
		||||
<section id="directory">
 | 
			
		||||
    <h1>/{{ directory }}</h1>
 | 
			
		||||
    <ul>
 | 
			
		||||
        {% for page in pages %}
 | 
			
		||||
            <li><a href="/{{ directory }}{{ page.split('.')[0] }}">{{ page.split('.')[0] }}</a></li>
 | 
			
		||||
        {% endfor %}
 | 
			
		||||
    </ul>
 | 
			
		||||
</section>
 | 
			
		||||
{% endblock %}
 | 
			
		||||
							
								
								
									
										29
									
								
								templates/errors/400.html
									
									
									
									
									
										Normal file
									
								
							
							
						
						@@ -0,0 +1,29 @@
 | 
			
		||||
{% extends "bases/base.html" %}
 | 
			
		||||
 | 
			
		||||
{% block title %}400 - Internal Server Error{% endblock %}
 | 
			
		||||
{% block description %}Bad request. The server could not understand the request due to invalid syntax.{% endblock %}
 | 
			
		||||
 | 
			
		||||
{% block head %}
 | 
			
		||||
<link rel="stylesheet" href="/static/css/400.css">
 | 
			
		||||
{% endblock %}
 | 
			
		||||
 | 
			
		||||
{% block content %}
 | 
			
		||||
<section>
 | 
			
		||||
    <h1>400 - Bad Request</h1>
 | 
			
		||||
    <p>
 | 
			
		||||
        What did you do? The server could not understand the request due to invalid syntax. Please check your request and try again.
 | 
			
		||||
    </p>
 | 
			
		||||
    <h2>The fuckup in question</h2>
 | 
			
		||||
    <p>
 | 
			
		||||
        {% if error %}
 | 
			
		||||
            {{ error }}
 | 
			
		||||
        {% else %}
 | 
			
		||||
            No specific error message provided.
 | 
			
		||||
        {% endif %}
 | 
			
		||||
    </p>
 | 
			
		||||
    <h2>What to do now</h2>
 | 
			
		||||
    <p>
 | 
			
		||||
        idk :P
 | 
			
		||||
    </p>
 | 
			
		||||
</section>
 | 
			
		||||
{% endblock %}
 | 
			
		||||
							
								
								
									
										20
									
								
								templates/errors/404.html
									
									
									
									
									
										Normal file
									
								
							
							
						
						@@ -0,0 +1,20 @@
 | 
			
		||||
{% extends "bases/base.html" %}
 | 
			
		||||
 | 
			
		||||
{% block title %}404 - Not Found{% endblock %}
 | 
			
		||||
{% block description %}The page you are looking for does not exist.{% endblock %}
 | 
			
		||||
 | 
			
		||||
{% block content %}
 | 
			
		||||
<section>
 | 
			
		||||
    <h1>404</h1>
 | 
			
		||||
    <p>
 | 
			
		||||
        Hey so you know that thing you were looking for? Yeah, it doesn't exist. :P
 | 
			
		||||
        <br><br>
 | 
			
		||||
        So why not try going back to the <a href="/">homepage</a>?
 | 
			
		||||
    </p>
 | 
			
		||||
</section>
 | 
			
		||||
<section>
 | 
			
		||||
    <h2>The actual error for the 2 ppl who care</h2>
 | 
			
		||||
    <p>
 | 
			
		||||
        404: {{ requested_url }} not found :3
 | 
			
		||||
    </p>
 | 
			
		||||
</section>
 | 
			
		||||
							
								
								
									
										17
									
								
								templates/errors/500.html
									
									
									
									
									
										Normal file
									
								
							
							
						
						@@ -0,0 +1,17 @@
 | 
			
		||||
{% extends "bases/base.html" %}
 | 
			
		||||
 | 
			
		||||
{% block title %}500 - Internal Server Error{% endblock %}
 | 
			
		||||
{% block description %}An unexpected error occurred on the server.{% endblock %}
 | 
			
		||||
 | 
			
		||||
{% block head %}
 | 
			
		||||
<link rel="stylesheet" href="/static/css/500.css">
 | 
			
		||||
{% endblock %}
 | 
			
		||||
 | 
			
		||||
{% block content %}
 | 
			
		||||
<section class="bluescreen">
 | 
			
		||||
    <h1>:(</h1>
 | 
			
		||||
    <p>
 | 
			
		||||
        Oopsie Woopsie! Uwu We made a fucky wucky!! A wittle fucko boingo! The code monkeys at our headquarters are working VEWY HAWD to fix this!
 | 
			
		||||
    </p>
 | 
			
		||||
</section>
 | 
			
		||||
{% endblock %}
 | 
			
		||||
							
								
								
									
										132
									
								
								templates/index.html
									
									
									
									
									
										Normal file
									
								
							
							
						
						@@ -0,0 +1,132 @@
 | 
			
		||||
{% extends "bases/base.html" %}
 | 
			
		||||
 | 
			
		||||
{% block title %}Home - Alfie's basement{% endblock %}
 | 
			
		||||
{% block description %}server backend survivor{% endblock %}
 | 
			
		||||
{% block og-title %}Home - Alfie's basement{% endblock %}
 | 
			
		||||
{% block og-description %}server backend survivor{% endblock %}
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
{% block head %}
 | 
			
		||||
<link rel="stylesheet" href="/static/css/index.css">
 | 
			
		||||
{% endblock %}
 | 
			
		||||
 | 
			
		||||
{% block content %}
 | 
			
		||||
<section>
 | 
			
		||||
    <h1>A lil bit abt me</h1>
 | 
			
		||||
    <p>
 | 
			
		||||
        Im not good with writing so dont expect much here. I am a student who is learning c++ and python. I've Done a few projects that i think
 | 
			
		||||
        are decent enough to show off, so I have put them on this website. I like to mess around with linux and have a few servers that I run. I've
 | 
			
		||||
        been running a server for a few years now, and I have learned a lot from it. I have also switched to linux on my main computer, which has been
 | 
			
		||||
        slightly annoying at times (mainly because one of my most played games' anticheat doesn't support on linux atm. Also, the lack of photoshop is
 | 
			
		||||
        a pain).
 | 
			
		||||
        <br><br>
 | 
			
		||||
        I would like to make some more projects in the future, but I am not sure what I want to make yet. I tend to make thing on impulse a lot, and motivation
 | 
			
		||||
        is "lacking" at times. So the few ideas I do have may never come to fruition. I hope to get better at art so i could hopefully make a game that is somewhat
 | 
			
		||||
        interesting. But im at a lack of ideas at the moment.
 | 
			
		||||
        <br><br>
 | 
			
		||||
        I would also like to have a functional blog on this site, but I bearly talk about much so I dont know what I would write about. I like to ramble on about
 | 
			
		||||
        random things, but I dont think that would be very interesting to read, and I think that I would forget to update it. I have a tumblr that I have had for a few
 | 
			
		||||
        years now, but I dont post on it (the social anxiety is too much for me :<). However I hope to get better at that in the future.
 | 
			
		||||
    </p>
 | 
			
		||||
</section>
 | 
			
		||||
<section class="blinkies">
 | 
			
		||||
    <img src="https://adriansblinkiecollection.neocities.org/x45.gif" alt="">
 | 
			
		||||
    <img src="https://adriansblinkiecollection.neocities.org/t3.gif" alt="">
 | 
			
		||||
    <img src="https://adriansblinkiecollection.neocities.org/k25.gif" alt="">
 | 
			
		||||
    <img src="https://s1nez.nekoweb.org/img/52475686_BP77MK3UdnLmIQk.gif" alt="">
 | 
			
		||||
    <img src="https://s1nez.nekoweb.org/img/hc/hc%20(79).gif" alt="">
 | 
			
		||||
    <img src="https://dewside.neocities.org/blinkies/bisigns.gif" alt="">
 | 
			
		||||
    <img src="https://s1nez.nekoweb.org/g/ggg/gg%20(32).gif" alt="">
 | 
			
		||||
    <img src="https://s1nez.nekoweb.org/img/7dcd20d4.gif" alt="">
 | 
			
		||||
</section>
 | 
			
		||||
<div class="flex-row">
 | 
			
		||||
    <a href="" id="spotify-link">
 | 
			
		||||
        <div id="spotify">
 | 
			
		||||
            <h1 id="spotify-title"></h1>
 | 
			
		||||
            <h2 id="spotify-artist"></h2>
 | 
			
		||||
        </div>
 | 
			
		||||
    </a>
 | 
			
		||||
    <section class="stamps">
 | 
			
		||||
        <img src="https://s1nez.nekoweb.org/img/other/ba4ba47a.png" alt="">
 | 
			
		||||
        <img src="https://s1nez.nekoweb.org/img/fa02abd7.png" alt="">
 | 
			
		||||
        <img src="https://s1nez.nekoweb.org/img/hc/hc%20(172).gif" alt="">
 | 
			
		||||
        <img src="https://gligar.neocities.org/furret2.png" alt="">
 | 
			
		||||
        <img src="https://gligar.neocities.org/ralsei2.png" alt="">
 | 
			
		||||
        <img src="https://gligar.neocities.org/tism.png" alt="">
 | 
			
		||||
        <img src="https://64.media.tumblr.com/11957593416710af9ff049ff6ae7ab63/tumblr_pbb7cd42Ln1xz2nuuo4_100.gif" alt="">
 | 
			
		||||
        <img src="https://dewside.neocities.org/stamps/dogofwisdom.gif" alt="">
 | 
			
		||||
        <img src="https://dewside.neocities.org/stamps/kazookid.gif" alt="">
 | 
			
		||||
        <img src="https://64.media.tumblr.com/3085aeace24ca0c5ddf08aac37cc3ab4/45a30eb92e06a85c-3a/s100x200/b7bfb2e91adbc310f712f4492e668298bd0779de.gif" alt="">
 | 
			
		||||
        <img src="https://s1nez.nekoweb.org/img/hc/hc%20(27).png" alt="">
 | 
			
		||||
        <img src="https://s1nez.nekoweb.org/g/ggg/gg%20(13).gif" alt="">
 | 
			
		||||
        <img src="https://kopawz.neocities.org/stamphoard/stamps2/kriswhere.png" alt="">
 | 
			
		||||
        <img src="https://adriansblinkiecollection.neocities.org/stamps/g5.gif" alt="">
 | 
			
		||||
        <img src="https://adriansblinkiecollection.neocities.org/stamps/e40.gif" alt="">
 | 
			
		||||
        <img src="https://adriansblinkiecollection.neocities.org/stamps/e43.gif" alt="">
 | 
			
		||||
    </section>
 | 
			
		||||
</div>
 | 
			
		||||
<section>
 | 
			
		||||
    <h1>Projects & stuff</h1>
 | 
			
		||||
    <p>just some projects ive worked on over time</p>
 | 
			
		||||
    <ul>
 | 
			
		||||
        <li>
 | 
			
		||||
            <h2>alfieking.dev</h2>
 | 
			
		||||
            <p>
 | 
			
		||||
                This website is a project that I have been working on for a while now. I have made a few versions of it, but I have 
 | 
			
		||||
                never been happy with them. I am quite happy with this version atm since it is more organized and has a design that I
 | 
			
		||||
                like.
 | 
			
		||||
                <a href="https://git.alfieking.dev/acetheking987/alfieking.dev">source code</a>
 | 
			
		||||
            </p>
 | 
			
		||||
        </li>
 | 
			
		||||
        <li>
 | 
			
		||||
            <h2>owo (the terminal command)</h2>
 | 
			
		||||
            <p>
 | 
			
		||||
                I made this project as a joke, I can't remember exactly what I baised it off other than the fact that it was somthing 
 | 
			
		||||
                similar to this but in a different language. I originally made it in python, but I have since rewritten it in c++ so 
 | 
			
		||||
                that it would be faster and so that I could learn c++.
 | 
			
		||||
                <a href="https://git.alfieking.dev/acetheking987/term-owo-cpp">source code</a>
 | 
			
		||||
            </p>
 | 
			
		||||
        </li>
 | 
			
		||||
        <li>
 | 
			
		||||
            <h2>prismic</h2>
 | 
			
		||||
            <p>
 | 
			
		||||
                Prismic is a basic message board that I made, it was mainly made to learn how to use templating and more backend
 | 
			
		||||
                web development. it uses flask for the web framework and uses a sqlite database to store the messages. I have thought
 | 
			
		||||
                about remaking it in c++ since I found a c++ web framework that I would like to try out.
 | 
			
		||||
                <a href="https://prismic.alfieking.dev">Primic</a> | <a href="https://git.alfieking.dev/acetheking987/prismic">source code</a>
 | 
			
		||||
            </p>
 | 
			
		||||
        </li>
 | 
			
		||||
    </ul>
 | 
			
		||||
</section>
 | 
			
		||||
<section>
 | 
			
		||||
    <h1>The button collection™</h1>
 | 
			
		||||
    <div id="button-collection">
 | 
			
		||||
    </div>
 | 
			
		||||
</section>
 | 
			
		||||
<section>
 | 
			
		||||
    <h1>Some News</h1>
 | 
			
		||||
    <h6>(dont expect this to be updated often tho :P)</h6>
 | 
			
		||||
    <ul>
 | 
			
		||||
        <li>
 | 
			
		||||
            <h2>28-06-2025</h2>
 | 
			
		||||
            <p>
 | 
			
		||||
                I have updated the site a bit, I have added a few more featues, but the main update is that the site is now using flask as a backend.
 | 
			
		||||
                I didn't want to use a framework at first, mainly because I like the simplicity of a static site, but it allows me to use templatiing and makes
 | 
			
		||||
                adding new features easier and more organized. The site is also more interacive now, with a few secrets on some of the pages. I still plan on adding
 | 
			
		||||
                more secrets and features. I also plan on adding a blog section, that I will move this to, so that I can give updates on the site and other things
 | 
			
		||||
                that I find interesting.
 | 
			
		||||
            </p>
 | 
			
		||||
        </li>
 | 
			
		||||
        <li>
 | 
			
		||||
            <h2>18-06-2025</h2>
 | 
			
		||||
            <p>
 | 
			
		||||
                I plan on updating the site soon, I have a few ideas that I want to implement. I want to make it more 
 | 
			
		||||
                interactive and fun to use. I also want to add a blog section so that I can write about random things that I find interesting. I also 
 | 
			
		||||
                want to add a few more projects that I have been working on. Annoyingly I think it would be a good idea to remake this site with some sort of
 | 
			
		||||
                framework so i can use templating, however this kinda bothers me since I like the simplicity of this site. And prefer to keep it as a static site
 | 
			
		||||
                that i can just throw at nginx.
 | 
			
		||||
            </p>
 | 
			
		||||
        </li>
 | 
			
		||||
    </ul>
 | 
			
		||||
</section>
 | 
			
		||||
{% endblock %}
 | 
			
		||||
							
								
								
									
										45
									
								
								templates/pages/events/crittersmk.html
									
									
									
									
									
										Normal file
									
								
							
							
						
						@@ -0,0 +1,45 @@
 | 
			
		||||
{% extends "bases/base.html" %}
 | 
			
		||||
 | 
			
		||||
{% block title %}Critters MK - Alfie's basement{% endblock %}
 | 
			
		||||
{% block description %}furry corner{% endblock %}
 | 
			
		||||
{% block og_image %}/static/content/Toaster_v1.0_Dark.png{% endblock %}
 | 
			
		||||
{% block keywords %}
 | 
			
		||||
Alfie King, Alfie, King, Alfieking, Alfieking.dev, dev, server, developer, backend, selfhost, homelab, furry, protogen, toaster, 
 | 
			
		||||
fursona, fur, furmeet, fursuit, persona, character, protogen fursona, protogen character, protogen fursona design, 
 | 
			
		||||
protogen character design, critters mk, critters cmk, paws n pistons, paws'n'pistons, paws n pistons furry meet, paws'n'pistons furry meet, 
 | 
			
		||||
protogen v1.0, toaster v1.0
 | 
			
		||||
{% endblock %}
 | 
			
		||||
 | 
			
		||||
{% block head %}
 | 
			
		||||
<link rel="stylesheet" href="/static/css/gallery.css">
 | 
			
		||||
{% endblock %}
 | 
			
		||||
 | 
			
		||||
{% block content %}
 | 
			
		||||
<section>
 | 
			
		||||
    <h1>Critters MK</h1>
 | 
			
		||||
    <p>
 | 
			
		||||
        Critters Mk is a fur meet based in Milton Keynes, UK. They hold a meet once a month on saturdays around the area, usually at local parks. They are a
 | 
			
		||||
        therian friendly group, and there are a variety of fursuiters and non-fursuiters that attend. The group is very welcoming to newcomers, and the meets 
 | 
			
		||||
        are a great way to meet new people in the furry community. There is also atleast one fursuit maker in the group to my knowledge, so if you are looking
 | 
			
		||||
        for a fursuit, you may be able to find one there. The group is also very active on Telegram, and they have a Twitter page where they post updates about 
 | 
			
		||||
        the meets.
 | 
			
		||||
        <br><br>
 | 
			
		||||
        I have attended a few of the meets, and I enjoyed talking to the people there. I plan on attending every meet I can in the future, as well as any other local events
 | 
			
		||||
        that I can find. If you are in the area, I highly recommend checking them out. You can find more information about the group on their
 | 
			
		||||
        <a href="https://x.com/cmkfurmeet" target="_blank">Twitter page</a> (I don't know if I can link their Telegram group :<)
 | 
			
		||||
    </p>
 | 
			
		||||
</section>
 | 
			
		||||
<section>
 | 
			
		||||
    <h1>Photos :3</h1>
 | 
			
		||||
    <p>
 | 
			
		||||
        Here are some photos from the meets I have attended. I will add more as I attend more meets.
 | 
			
		||||
    </p>
 | 
			
		||||
    <h2 class="gallery-date">26th July 2025</h2>
 | 
			
		||||
    <div class="gallery">
 | 
			
		||||
        <img src="/static/content/fur_meets/26-07-2025_critters_mk/PXL_20250726_152110445.jpg" alt="Critters MK">
 | 
			
		||||
        <img src="/static/content/fur_meets/26-07-2025_critters_mk/PXL_20250726_155134418.jpg" alt="Critters MK">
 | 
			
		||||
        <img src="/static/content/fur_meets/26-07-2025_critters_mk/PXL_20250726_155226274.jpg" alt="Critters MK">
 | 
			
		||||
        <img src="/static/content/fur_meets/26-07-2025_critters_mk/PXL_20250726_155434701.jpg" alt="Critters MK">
 | 
			
		||||
    </div>
 | 
			
		||||
</section>
 | 
			
		||||
{% endblock %}
 | 
			
		||||
							
								
								
									
										64
									
								
								templates/pages/events/paws-n-pistons.html
									
									
									
									
									
										Normal file
									
								
							
							
						
						@@ -0,0 +1,64 @@
 | 
			
		||||
{% extends "bases/base.html" %}
 | 
			
		||||
 | 
			
		||||
{% block title %}Paws'N'Pistons - Alfie's basement{% endblock %}
 | 
			
		||||
{% block description %}furry corner{% endblock %}
 | 
			
		||||
{% block og_image %}/static/content/Toaster_v1.0_Dark.png{% endblock %}
 | 
			
		||||
{% block keywords %}
 | 
			
		||||
Alfie King, Alfie, King, Alfieking, Alfieking.dev, dev, server, developer, backend, selfhost, homelab, furry, protogen, toaster, 
 | 
			
		||||
fursona, fur, furmeet, fursuit, persona, character, protogen fursona, protogen character, protogen fursona design, 
 | 
			
		||||
protogen character design, critters mk, critters cmk, paws n pistons, paws'n'pistons, paws n pistons furry meet, paws'n'pistons furry meet, 
 | 
			
		||||
protogen v1.0, toaster v1.0
 | 
			
		||||
{% endblock %}
 | 
			
		||||
 | 
			
		||||
{% block head %}
 | 
			
		||||
<link rel="stylesheet" href="/static/css/gallery.css">
 | 
			
		||||
<style>
 | 
			
		||||
    #woooooo {
 | 
			
		||||
        max-width: 50%;
 | 
			
		||||
        height: auto;
 | 
			
		||||
        border-radius: 10px;
 | 
			
		||||
        margin: 10px;
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    @media (max-width: 600px) {
 | 
			
		||||
        #woooooo {
 | 
			
		||||
            max-width: 100%;
 | 
			
		||||
        }
 | 
			
		||||
    }
 | 
			
		||||
</style>
 | 
			
		||||
{% endblock %}
 | 
			
		||||
 | 
			
		||||
{% block content %}
 | 
			
		||||
<section>
 | 
			
		||||
    <h1>Paws'N'Pistons</h1>
 | 
			
		||||
    <p>
 | 
			
		||||
        Paws'N'Pistons is a furry car meet that takes place across the UK. They are a very welcoming group that is open to all furries, regardless 
 | 
			
		||||
        of whether you have a car or not. Their meets last all day and involve multiple hours of driving across the country to various locations. They
 | 
			
		||||
        also have a <a href="https://pawsnpistons.com" target="_blank">shop</a> where you can buy car stickers and other merch. They also hand out free
 | 
			
		||||
        stickers at their meets. Their main social media is their <a href="https://www.instagram.com/paws_n_pistons/" target="_blank">Instagram</a>, where 
 | 
			
		||||
        they post photos from their meets and updates about upcoming events.
 | 
			
		||||
        <br><br>
 | 
			
		||||
        I've only attended one meet on the 3rd of August 2025, and it was a great experience. The people were very chill and I enjoyed driving around with them. 
 | 
			
		||||
        ALSO, one of them offered to let me try their fursuit!!! Im now going to speedrun going broke trying to get a fursuit of my own cus of this :3 (I was 
 | 
			
		||||
        already planning on getting one, but this just made me want one more).
 | 
			
		||||
        <br>
 | 
			
		||||
        <img src="/static/content/fur_meets/03-08-2025_paws_n_pistons/PXL_20250803_200906329.jpg" alt="me in a fursuit" id="woooooo">
 | 
			
		||||
        <br>
 | 
			
		||||
        The fursuit belongs to <a href="https://www.tiktok.com/@trickythefox" target="_blank">Tricky the Fox</a>, they are a very chill person and I had a great time talking to them ^w^.
 | 
			
		||||
    <h1>Photos :3</h1>
 | 
			
		||||
    <p>
 | 
			
		||||
        Here are some photos from the meets I have attended. I will add more as I attend more meets.
 | 
			
		||||
    </p>
 | 
			
		||||
    <h2 class="gallery-date">3rd Aug 2025</h2>
 | 
			
		||||
    <div class="gallery">
 | 
			
		||||
        <img src="/static/content/fur_meets/03-08-2025_paws_n_pistons/PXL_20250803_141943558.jpg" alt="Paws'N'Pistons">
 | 
			
		||||
        <img src="/static/content/fur_meets/03-08-2025_paws_n_pistons/PXL_20250803_150138054.jpg" alt="Paws'N'Pistons">
 | 
			
		||||
        <img src="/static/content/fur_meets/03-08-2025_paws_n_pistons/PXL_20250803_150249916.jpg" alt="Paws'N'Pistons">
 | 
			
		||||
        <img src="/static/content/fur_meets/03-08-2025_paws_n_pistons/PXL_20250803_183614897.jpg" alt="Paws'N'Pistons">
 | 
			
		||||
        <img src="/static/content/fur_meets/03-08-2025_paws_n_pistons/PXL_20250803_140629639.jpg" alt="Paws'N'Pistons">
 | 
			
		||||
        <img src="/static/content/fur_meets/03-08-2025_paws_n_pistons/PXL_20250803_141242090.jpg" alt="Paws'N'Pistons">
 | 
			
		||||
        <img src="/static/content/fur_meets/03-08-2025_paws_n_pistons/PXL_20250803_182023562.jpg" alt="Paws'N'Pistons">
 | 
			
		||||
        <img src="/static/content/fur_meets/03-08-2025_paws_n_pistons/PXL_20250803_184321576.jpg" alt="Paws'N'Pistons">
 | 
			
		||||
    </div>
 | 
			
		||||
</section>
 | 
			
		||||
{% endblock %}
 | 
			
		||||
							
								
								
									
										107
									
								
								templates/pages/toaster.html
									
									
									
									
									
										Normal file
									
								
							
							
						
						@@ -0,0 +1,107 @@
 | 
			
		||||
{% extends "bases/base.html" %}
 | 
			
		||||
 | 
			
		||||
{% block title %}Toaster - Alfie's basement{% endblock %}
 | 
			
		||||
{% block description %}furry corner{% endblock %}
 | 
			
		||||
{% block og_image %}/static/content/Toaster_v1.0_Dark.png{% endblock %}
 | 
			
		||||
{% block keywords %}
 | 
			
		||||
Alfie King, Alfie, King, Alfieking, Alfieking.dev, dev, server, developer, backend, selfhost, homelab, furry, protogen, toaster, 
 | 
			
		||||
fursona, fur, furmeet, fursuit, persona, character, protogen fursona, protogen character, protogen fursona design, 
 | 
			
		||||
protogen character design, critters mk, critters cmk, paws n pistons, paws'n'pistons, paws n pistons furry meet, paws'n'pistons furry meet, 
 | 
			
		||||
protogen v1.0, toaster v1.0
 | 
			
		||||
{% 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 using Toaster more. So he may become the main mascot of my website "soon ish".
 | 
			
		||||
    </p>
 | 
			
		||||
</section>
 | 
			
		||||
<div class="flex-row">
 | 
			
		||||
    <section>
 | 
			
		||||
        <h1>Specs</h1>
 | 
			
		||||
        <h6>(Additional specs coming "soon ish", Very subject to change :P)</h6>
 | 
			
		||||
        <ul id="toaster-specs">
 | 
			
		||||
            <li><b>Species:</b><span>Protogen</span></li>
 | 
			
		||||
            <li><b>Version:</b><span>v1.0</span></li>
 | 
			
		||||
            <li><b>Height:</b><span>1.73m</span></li>
 | 
			
		||||
            <li><b>Weight:</b><span>Mild Chonk</span></li>
 | 
			
		||||
            <li><b>Base Color:</b><span class="color" style="background-color: #0e0c11">#0e0c11</span></li>
 | 
			
		||||
            <li><b>Accent Color:</b><span class="color" style="background-color: #a685c6">#a685c6</span></li>
 | 
			
		||||
            <li><b>Operating System:</b><span>Proot OS™</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>
 | 
			
		||||
            <li><b>Ports:</b><span>USB-C</span></li> <!-- You know exactly where this is dont you :3 (note: this is a joke (probably), there are ports are behind the round screens tho)-->
 | 
			
		||||
            <li><b>Accessories:</b><span>"Neck Armor"</span></li>
 | 
			
		||||
            <li><b>Bugs:</b><span>Anxiety<sup>2</sup></span></li>
 | 
			
		||||
            <li><b>Gender:</b><span>Male</span></li>
 | 
			
		||||
        </ul>
 | 
			
		||||
    </section>
 | 
			
		||||
    <div class="flex-col">
 | 
			
		||||
        <img src="/static/content/toaster/Toaster_v1.0_Dark.png" alt="toaster" id="toaster-img">
 | 
			
		||||
        <section class="fill-height">
 | 
			
		||||
            <p>
 | 
			
		||||
                NEW AND IMPROVED! Toaster v1.0 is here!
 | 
			
		||||
                <br><br>
 | 
			
		||||
                Toaster v1.0 is the first version of Toaster that I have drawn that I am actually happy with.
 | 
			
		||||
                Im still working on the design, so it may change in the future, but I think I like this enough to keep it for now.
 | 
			
		||||
            </p>
 | 
			
		||||
        </section>
 | 
			
		||||
    </div>
 | 
			
		||||
</div>
 | 
			
		||||
<section>
 | 
			
		||||
    <h1>Plans</h1>
 | 
			
		||||
    <p>
 | 
			
		||||
        I plan on drawing Toaster "properly" soon, im quite happy with the current design, but I want to add more detail and personality to him.
 | 
			
		||||
        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. So rn 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>
 | 
			
		||||
<section>
 | 
			
		||||
    <h1>Events</h1>
 | 
			
		||||
    <p>
 | 
			
		||||
        There are a few events that ive been to, however I plan on trying to go to more in the future.
 | 
			
		||||
        <br>
 | 
			
		||||
    </p>
 | 
			
		||||
    <ul id="fur-meets">
 | 
			
		||||
        <li>
 | 
			
		||||
            <a href="/events/crittersmk"><b>Critters MK</b></a> - A furmeet in Milton Keynes.
 | 
			
		||||
            <div class="fur-meet-gallery-small">
 | 
			
		||||
                <img src="/static/content/fur_meets/26-07-2025_critters_mk/PXL_20250726_152110445.jpg" alt="Critters MK">
 | 
			
		||||
                <img src="/static/content/fur_meets/26-07-2025_critters_mk/PXL_20250726_155134418.jpg" alt="Critters MK">
 | 
			
		||||
                <img src="/static/content/fur_meets/26-07-2025_critters_mk/PXL_20250726_155226274.jpg" alt="Critters MK">
 | 
			
		||||
                <img src="/static/content/fur_meets/26-07-2025_critters_mk/PXL_20250726_155434701.jpg" alt="Critters MK">
 | 
			
		||||
            </div>
 | 
			
		||||
        </li>
 | 
			
		||||
        <li>
 | 
			
		||||
            <a href="/events/paws-n-pistons"><b>Paws'N'Pistons</b></a> - A furry car meet around the UK.
 | 
			
		||||
            <div class="fur-meet-gallery-small">
 | 
			
		||||
                <img src="/static/content/fur_meets/03-08-2025_paws_n_pistons/PXL_20250803_141943558.jpg" alt="Paws'N'Pistons">
 | 
			
		||||
                <img src="/static/content/fur_meets/03-08-2025_paws_n_pistons/PXL_20250803_150138054.jpg" alt="Paws'N'Pistons">
 | 
			
		||||
                <img src="/static/content/fur_meets/03-08-2025_paws_n_pistons/PXL_20250803_150249916.jpg" alt="Paws'N'Pistons">
 | 
			
		||||
                <img src="/static/content/fur_meets/03-08-2025_paws_n_pistons/PXL_20250803_183614897.jpg" alt="Paws'N'Pistons">
 | 
			
		||||
            </div>
 | 
			
		||||
        </li>
 | 
			
		||||
        <p>Click on the links to view more photos from each event :3</p>
 | 
			
		||||
    </ul>
 | 
			
		||||
</section>
 | 
			
		||||
{% endblock %}
 | 
			
		||||