Compare commits
29 Commits
05961e2a3c
...
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 | |||
27fbade9f1 | |||
e97255897c | |||
392e788d91 |
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
|
192
index.html
@@ -1,192 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Alfieking.dev</title>
|
||||
<link rel="icon" href="/static/content/icon.webp">
|
||||
<link rel="stylesheet" href="/static/css/main.css">
|
||||
<meta name="description" content="Alfie King's personal website.">
|
||||
<meta name="keywords" content="Alfie King, Alfie, King, Alfieking, Alfieking.dev">
|
||||
<meta name="author" content="Alfie King">
|
||||
<meta name="robots" content="all">
|
||||
|
||||
<meta name="theme-color" content="#63de90">
|
||||
<meta property="og:site_name" content="Alfieking.dev">
|
||||
<meta property="og:url" content="https://alfieking.dev">
|
||||
<meta property="og:title" content="Alfie King">
|
||||
<meta property="og:description" content="server backend survivor">
|
||||
<meta property="og:type" content="website">
|
||||
<meta name="og:image" itemprop="image" content="static/content/icon.webp">
|
||||
</head>
|
||||
<body>
|
||||
<nav>
|
||||
<ul>
|
||||
<li><a href="#home"><img src="/static/content/icon.webp"></a></li>
|
||||
<li><a href="#about">About</a></li>
|
||||
<li><a href="#projects">Projects</a></li>
|
||||
<li><a href="#links">Links</a></li>
|
||||
<li id="music">
|
||||
<img id="music-icon" src="" alt="">
|
||||
<div id="music-expand">
|
||||
<h1 id="music-title"></h1>
|
||||
<h2 id="music-info"></h2>
|
||||
<div id="music-progress"></div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
<main>
|
||||
<header id="home">
|
||||
<div class="row">
|
||||
<img src="/static/content/icon.webp">
|
||||
<div class="column">
|
||||
<h1>Alfie King</h1>
|
||||
<h2 id="typing">server backend survivor</h2>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
<section id="about">
|
||||
<h1>About</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 am also a fan of some 2000s internet culture, so I intend to "Eventualy" make a alternitive website that is a bit more like that. I have seen a
|
||||
few sites that I like, such as <a href="https://ne0nbandit.neocities.org/">ne0nbandit street</a>. Neocities is a great place to find sites like that.
|
||||
<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.
|
||||
<br><br>
|
||||
I will probably put this site on my git server at some point, but I dont know when that will be. I have a few other projects that I want to put on there, but
|
||||
I have been lazy and havent done it yet (or maybe I have and just forgot to update this).
|
||||
<br><br>
|
||||
At this point i'm just trying to fill up space so that this site looks more interesting. I hope that I can make this site more interesting in the future, but
|
||||
for now have this cat. :3
|
||||
<br><br>
|
||||
<pre>
|
||||
|\ _,,,---,,_
|
||||
ZZZzz /,`.-'`' -. ;-;;,_
|
||||
|,4- ) )-,_. ,\ ( `'-'
|
||||
'---''(_/--' `-'\_)
|
||||
</pre>
|
||||
</p>
|
||||
</section>
|
||||
<section id="projects">
|
||||
<h1>Projects</h1>
|
||||
<div class="projects">
|
||||
<div class="project">
|
||||
<img src="static/content/game_project.webp" alt="">
|
||||
<div class="project-info">
|
||||
<h2>Game without a name</h2>
|
||||
<p>
|
||||
This is a game that I made in c++ using sdl. It is a simple platformer at the moment and will probably
|
||||
change in the future. It is supposed to be a school project, but I am mainly working on it to learn c++.
|
||||
I hope to create a more interesting game in the future, but for now, this is what I have.
|
||||
<br><br>
|
||||
It is fully open source, but at the moment I havent got around to uploading it on my git server. However,
|
||||
it does require sdl to run, so you will need to install that if you want to run it.
|
||||
<br><br>
|
||||
I plan on making a better "engine" for it in the future, with more quality of life features and a functioning
|
||||
collision system. Currently, there i a very basic level editor that I made from recyling the code from the game.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="project">
|
||||
<img src="static/content/term owo.png" alt="">
|
||||
<div class="project-info">
|
||||
<h2>Term owo</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++.
|
||||
<br><br>
|
||||
It is mostly just a bunch of regex replacements, but I plan on adding more features in the future that add more ":3" and such to the
|
||||
output. It currently has a few features, such as reading and writing to files, and automatically putting the output to the clipboard.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section id="links">
|
||||
<h1>Links</h1>
|
||||
<div class="links">
|
||||
<a href="https://neocities.org/">
|
||||
<img src="static/content/neocities-Logo.webp" alt="neocities">
|
||||
</a>
|
||||
<a href="https://git.alfieking.dev">
|
||||
<img src="static/content/Gitea_Logo.webp" alt="gitea">
|
||||
</a>
|
||||
<div class="blinkies">
|
||||
<a href="https://acetheking987.tumblr.com/">
|
||||
<img src="/static/content/tumblr.gif" alt="tumblr">
|
||||
</a>
|
||||
<a href="https://www.twitch.tv/acetheking987">
|
||||
<img src="/static/content/twitch.gif" alt="twitch">
|
||||
</a>
|
||||
</div>
|
||||
<a href="https://blinkies.cafe/">
|
||||
<img src="static/content/blinikes-cafe.webp" alt="blinkies cafe">
|
||||
</a>
|
||||
<a href="https://12ft.io/">
|
||||
<img src="static/content/12ft-ladder.webp" alt="12ft.io">
|
||||
</a>
|
||||
<a href="https://www.badinternetbills.com/">
|
||||
<img src="static/content/bad_internet_bills.webp" alt="badinternetbills">
|
||||
</a>
|
||||
<a href="https://aur.archlinux.org/packages?K=acetheking987&SeB=m">
|
||||
<img src="static/content/Arch-linux-logo.webp" alt="aur">
|
||||
</a>
|
||||
<div class="blinkies">
|
||||
<a href="https://ne0nbandit.neocities.org/">
|
||||
<img class="btn" src="https://ne0nbandit.github.io/assets/img/btn/mine/nbbanner.png">
|
||||
</a>
|
||||
<a href="https://dimden.dev/">
|
||||
<img class="btn" src="https://dimden.dev/images/88x31.gif">
|
||||
</a>
|
||||
</div>
|
||||
<iframe width="120" height="120" style="border:none" src="https://dimden.neocities.org/navlink/" name="neolink"></iframe>
|
||||
<div class="blinkies">
|
||||
<a href="https://thinliquid.dev">
|
||||
<img class="btn" src="https://thinliquid.dev/thnlqd.png" alt="thinliquid's button" />
|
||||
</a>
|
||||
<a href="https://nekoweb.org/">
|
||||
<img class="btn" src="https://nekoweb.org/assets/buttons/button3.gif">
|
||||
</a>
|
||||
</div>
|
||||
<div class="blinkies">
|
||||
<a href="https://beeps.website/">
|
||||
<img class="btn" src="static/content/bleeps.gif" alt="bleeps website" />
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<h2>Buttons!!! :3</h2>
|
||||
<div class="btns">
|
||||
<img src="static/content/btns/archlinux.gif" alt="archlinux">
|
||||
<img src="static/content/btns/discord.gif" alt="discord">
|
||||
<img src="static/content/btns/firefoxget.gif" alt="firefox">
|
||||
<img src="static/content/btns/handcoded.gif" alt="handcoded">
|
||||
<img src="static/content/btns/use-discord.gif" alt="use discord">
|
||||
<img src="static/content/btns/vscbutton.gif" alt="vscode">
|
||||
<img src="static/content/btns/deltarune.png" alt="deltarune">
|
||||
<img src="static/content/btns/no_web3.gif" alt="no web3">
|
||||
<img src="static/content/btns/learn_html.gif" alt="learn html">
|
||||
<img src="static/content/btns/ublock_origin_now.png" alt="ublock origin">
|
||||
<img src="static/content/btns/anything_but_chrome.gif" alt="naythong but chrome">
|
||||
<img src="static/content/btns/made_with_paws.png" alt="made with paws">
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
</body>
|
||||
<script src="/static/js/typing.js"></script>
|
||||
<script src="/static/js/music.js"></script>
|
||||
<script src="/static/js/links.js"></script>
|
||||
</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)
|
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{});
|
||||
}
|
Before Width: | Height: | Size: 29 KiB |
Before Width: | Height: | Size: 24 KiB |
Before Width: | Height: | Size: 20 KiB |
Before Width: | Height: | Size: 31 KiB |
Before Width: | Height: | Size: 3.7 KiB |
Before Width: | Height: | Size: 168 B |
Before Width: | Height: | Size: 1.8 KiB |
Before Width: | Height: | Size: 3.0 KiB |
Before Width: | Height: | Size: 1.6 KiB |
Before Width: | Height: | Size: 297 B |
Before Width: | Height: | Size: 9.1 KiB |
Before Width: | Height: | Size: 5.1 KiB |
Before Width: | Height: | Size: 1.5 KiB |
Before Width: | Height: | Size: 3.6 KiB |
Before Width: | Height: | Size: 1.7 KiB |
Before Width: | Height: | Size: 483 B |
Before Width: | Height: | Size: 1.7 KiB |
Before Width: | Height: | Size: 9.8 KiB |
Before Width: | Height: | Size: 1.9 KiB |
BIN
static/content/fonts/Irken-Like-AllCaps.woff
Normal file
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: 96 KiB |
BIN
static/content/general_images/background.png
Normal file
After Width: | Height: | Size: 743 KiB |
BIN
static/content/general_images/haj.gif
Normal file
After Width: | Height: | Size: 4.5 KiB |
Before Width: | Height: | Size: 49 KiB After Width: | Height: | Size: 49 KiB |
Before Width: | Height: | Size: 31 KiB |
36
static/content/other/buttons.txt
Normal file
@@ -0,0 +1,36 @@
|
||||
https://cyber.dabamos.de/88x31/88x31.gif
|
||||
https://cyber.dabamos.de/88x31/anythingbut.gif
|
||||
https://cyber.dabamos.de/88x31/bestdesktop.gif
|
||||
https://kopawz.neocities.org/buttonhoard/buttonsfldr2/diagnosedwithGAY.gif
|
||||
https://kopawz.neocities.org/indexgraphics/buttondecor/ilikecomputer.png
|
||||
https://identity-crisis.carrd.co/assets/images/gallery04/ad4f8d52.jpg?v=4e55d939
|
||||
https://anlucas.neocities.org/best_viewed_with_eyes.gif
|
||||
https://anlucas.neocities.org/html_learn_it_today.gif
|
||||
https://highway.eightyeightthirty.one/badge/5d58a8f32b007d4897db6f862a895a81674fb35f5cc3947fc66595817ca174db
|
||||
https://cyber.dabamos.de/88x31/keep.gif
|
||||
https://cyber.dabamos.de/88x31/js-warning.gif
|
||||
https://cyber.dabamos.de/88x31/linuxnow2.gif
|
||||
https://cyber.dabamos.de/88x31/nano2.gif
|
||||
https://cyber.dabamos.de/88x31/nocookie.gif
|
||||
https://cyber.dabamos.de/88x31/nofuckingthanks.gif
|
||||
https://cyber.dabamos.de/88x31/nyan.gif
|
||||
https://cyber.dabamos.de/88x31/pgp-now.gif
|
||||
https://cyber.dabamos.de/88x31/phonechump.gif
|
||||
https://cyber.dabamos.de/88x31/pinguonline.gif
|
||||
https://cyber.dabamos.de/88x31/piracy.gif
|
||||
https://cyber.dabamos.de/88x31/proxmox.gif
|
||||
https://cyber.dabamos.de/88x31/pride.gif
|
||||
https://cyber.dabamos.de/88x31/relax-now.gif
|
||||
https://cyber.dabamos.de/88x31/skirt.gif
|
||||
https://cyber.dabamos.de/88x31/steam.gif
|
||||
https://cyber.dabamos.de/88x31/svenbutton.gif
|
||||
https://cyber.dabamos.de/88x31/tfnow.gif
|
||||
https://cyber.dabamos.de/88x31/vscbutton.gif
|
||||
https://cyber.dabamos.de/88x31/reddit.gif
|
||||
https://cyber.dabamos.de/88x31/ralseismokingadart.gif
|
||||
https://cyber.dabamos.de/88x31/blender.gif
|
||||
https://cyber.dabamos.de/88x31/bob.gif
|
||||
https://cyber.dabamos.de/88x31/censor_14c.gif
|
||||
https://cyber.dabamos.de/88x31/chrmevil.gif
|
||||
https://cyber.dabamos.de/88x31/dark-mode.gif
|
||||
https://cyber.dabamos.de/88x31/firefox3.gif
|
BIN
static/content/other/favicon.ico
Normal file
After Width: | Height: | Size: 240 KiB |
9
static/content/other/robots.txt
Normal file
@@ -0,0 +1,9 @@
|
||||
User-agent: *
|
||||
Allow: /
|
||||
Disallow: /404
|
||||
Disallow: /500
|
||||
Disallow: /400
|
||||
|
||||
Sitemap: https://alfieking.dev/sitemap.xml
|
||||
|
||||
# hewwo :3
|
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>
|
Before Width: | Height: | Size: 18 KiB |
BIN
static/content/toaster/Toaster_v1.0_Dark.png
Normal file
After Width: | Height: | Size: 2.7 MiB |
Before Width: | Height: | Size: 3.4 KiB |
Before Width: | Height: | Size: 3.2 KiB |
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;
|
||||
}
|
109
static/css/index.css
Normal file
@@ -0,0 +1,109 @@
|
||||
.blinkies {
|
||||
justify-content: center;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.blinkies img {
|
||||
width: 150px;
|
||||
height: 20px;
|
||||
transition: all 0.2s ease-in-out;
|
||||
}
|
||||
|
||||
.blinkies img:hover {
|
||||
transform: scale(1.1) rotate(5deg);
|
||||
}
|
||||
|
||||
.blinkies img:nth-child(odd):hover {
|
||||
transform: scale(1.1) rotate(-5deg);
|
||||
}
|
||||
|
||||
.stamps {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
padding: 10px;
|
||||
gap: 5px;
|
||||
justify-content: center;
|
||||
align-content: center;
|
||||
}
|
||||
|
||||
.stamps img {
|
||||
width: 99px;
|
||||
height: 56px;
|
||||
transition: all 0.2s ease-in-out;
|
||||
}
|
||||
|
||||
.stamps img:hover {
|
||||
transform: scale(1.1) rotate(5deg);
|
||||
}
|
||||
|
||||
.stamps img:nth-child(odd):hover {
|
||||
transform: scale(1.1) rotate(-5deg);
|
||||
}
|
||||
|
||||
#spotify {
|
||||
background-image: none;
|
||||
backdrop-filter: blur(2px) brightness(0.6);
|
||||
border: var(--secondary-background-color) 2px solid;
|
||||
border-radius: 10px;
|
||||
padding: 15px;
|
||||
box-sizing: border-box;
|
||||
background-repeat: no-repeat;
|
||||
background-size: contain;
|
||||
height: 300px;
|
||||
width: 300px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
#spotify-title {
|
||||
font-size: 1.5rem;
|
||||
font-weight: 900;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
mix-blend-mode: difference;
|
||||
color: white;
|
||||
}
|
||||
|
||||
#spotify-artist {
|
||||
color: white;
|
||||
font-size: 1rem;
|
||||
font-weight: 900;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
mix-blend-mode: difference;
|
||||
}
|
||||
|
||||
#button-collection {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
#button-collection img {
|
||||
transition: all 0.2s ease-in-out;
|
||||
}
|
||||
|
||||
#button-collection img:hover {
|
||||
transform: scale(1.1) rotate(5deg);
|
||||
}
|
||||
|
||||
#button-collection img:nth-child(odd):hover {
|
||||
transform: scale(1.1) rotate(-5deg);
|
||||
}
|
||||
|
||||
@media screen and (max-width: 650px) {
|
||||
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;
|
||||
}
|
||||
}
|
@@ -1,318 +0,0 @@
|
||||
:root {
|
||||
--primary-color: #5cdd8b;
|
||||
--text-color: #b1b8c0;
|
||||
--background-color: #090c10;
|
||||
--secondary-background-color: #0d1117;
|
||||
--font-size: 0.5cm;
|
||||
--font-family: 'Roboto Mono', sans-serif;
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: var(--background-color);
|
||||
color: var(--text-color);
|
||||
font-size: var(--font-size);
|
||||
font-family: var(--font-family);
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
display: flex;
|
||||
overflow-y: hidden;
|
||||
}
|
||||
|
||||
nav {
|
||||
height: 100vh;
|
||||
width: 4rem;
|
||||
}
|
||||
|
||||
nav ul {
|
||||
list-style-type: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
nav ul li {
|
||||
writing-mode: vertical-lr;
|
||||
text-orientation: upright;
|
||||
padding: 2rem 0rem 0rem 1.4rem;
|
||||
width: fit-content;
|
||||
}
|
||||
|
||||
nav ul li a {
|
||||
color: var(--text-color);
|
||||
text-decoration: none;
|
||||
font-weight: 100;
|
||||
font-family: 'Impact', sans-serif;
|
||||
transition: all 0.3s ease-in-out
|
||||
}
|
||||
|
||||
nav ul li a img {
|
||||
width: 1.5rem;
|
||||
height: 1.5rem;
|
||||
transition: all 0.3s ease-in-out;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
nav ul li a:hover {
|
||||
color: var(--primary-color);
|
||||
font-weight: 900;
|
||||
}
|
||||
|
||||
nav ul li a:hover img {
|
||||
border-radius: 35%;
|
||||
}
|
||||
|
||||
nav ul li#music {
|
||||
z-index: 100;
|
||||
margin-top: auto;
|
||||
padding-bottom: 2rem;
|
||||
display: none;
|
||||
transition: all 0.3s ease-in-out;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
nav ul li#music img {
|
||||
width: 1.5rem;
|
||||
height: 1.5rem;
|
||||
transition: all 0.3s ease-in-out;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
nav ul li#music div#music-expand {
|
||||
display: none;
|
||||
width: 0rem;
|
||||
height: 0rem;
|
||||
border-radius: 0 500px 500px 0;
|
||||
background-color: var(--secondary-background-color);
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
box-sizing: border-box;
|
||||
transition: all 0.3s ease-in-out;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
nav ul li#music h1 {
|
||||
display: none;
|
||||
font-size: 100%;
|
||||
max-width: 90%;
|
||||
writing-mode: horizontal-tb;
|
||||
margin: 0.5rem 0 0 0.5rem;
|
||||
transition: all 0.3s ease-in-out;
|
||||
}
|
||||
|
||||
nav ul li#music h2 {
|
||||
display: none;
|
||||
font-size: 1rem;
|
||||
max-width: 90%;
|
||||
writing-mode: horizontal-tb;
|
||||
margin: 0;
|
||||
font-weight: 100;
|
||||
margin: 0.5rem 0 0 0.5rem;
|
||||
transition: all 0.3s ease-in-out;
|
||||
}
|
||||
|
||||
nav ul li#music div#music-progress {
|
||||
display: none;
|
||||
width: 100%;
|
||||
margin-top: auto;
|
||||
height: 1rem;
|
||||
background-color: var(--primary-color);
|
||||
transition: all 3s ease;
|
||||
}
|
||||
|
||||
main {
|
||||
width: 100%;
|
||||
height: 100vh;
|
||||
overflow: scroll;
|
||||
scrollbar-width: none;
|
||||
scroll-behavior: smooth;
|
||||
}
|
||||
|
||||
header {
|
||||
width: 100%;
|
||||
height: 100vh;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
header div.row {
|
||||
position: relative;
|
||||
left: -3rem;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin: 0;
|
||||
gap: 1.5rem;
|
||||
}
|
||||
|
||||
header div.column {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
header img {
|
||||
width: 13rem;
|
||||
height: 13rem;
|
||||
}
|
||||
|
||||
header h1 {
|
||||
font-size: 5rem;
|
||||
font-weight: 900;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
header h2 {
|
||||
font-size: 1.75rem;
|
||||
font-weight: 100;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
position: relative;
|
||||
top: -1rem;
|
||||
}
|
||||
|
||||
main section {
|
||||
width: 100%;
|
||||
min-height: 100vh;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
box-sizing: border-box;
|
||||
padding: 4rem;
|
||||
}
|
||||
|
||||
main section h1 {
|
||||
font-size: 4.5rem;
|
||||
font-weight: 900;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
main section h2 {
|
||||
font-size: 1.75rem;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
main section p {
|
||||
font-size: 1.25rem;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
font-weight: 300;
|
||||
}
|
||||
|
||||
main section a {
|
||||
color: var(--primary-color);
|
||||
text-decoration: none;
|
||||
transition: all 0.3s ease-in-out;
|
||||
}
|
||||
|
||||
main section a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.projects {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
gap: 2rem;
|
||||
margin-top: 2rem;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.project {
|
||||
width: 30%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.project img {
|
||||
width: 100%;
|
||||
aspect-ratio: 5/2;
|
||||
border-radius: 1rem 1rem 0 0;
|
||||
}
|
||||
|
||||
.project .project-info {
|
||||
padding: 0 1rem 1rem 1rem;
|
||||
background-color: var(--secondary-background-color);
|
||||
border-radius: 0 0 1rem 1rem;
|
||||
}
|
||||
|
||||
.links {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
gap: 2rem;
|
||||
margin-top: 2rem;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.links a img {
|
||||
height: 120px;
|
||||
transition: all 0.2s ease-in-out;
|
||||
}
|
||||
|
||||
.links a:nth-child(even) img:hover {
|
||||
transform: scale(1.1) rotate(5deg);
|
||||
}
|
||||
|
||||
.links a:nth-child(odd) img:hover {
|
||||
transform: scale(1.1) rotate(-5deg);
|
||||
}
|
||||
|
||||
.links iframe {
|
||||
height: 120px;
|
||||
transition: all 0.2s ease-in-out;
|
||||
}
|
||||
|
||||
.links iframe:hover {
|
||||
transform: scale(1.1);
|
||||
}
|
||||
|
||||
.blinkies {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.blinkies a img {
|
||||
height: 60px;
|
||||
transition: all 0.2s ease-in-out;
|
||||
}
|
||||
|
||||
.blinkies a {
|
||||
height: 60px;
|
||||
}
|
||||
|
||||
img.btn {
|
||||
height: 60px !important;
|
||||
transition: all 0.2s ease-in-out;
|
||||
}
|
||||
|
||||
#links h2 {
|
||||
margin-top: 2rem;
|
||||
}
|
||||
|
||||
.btns {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
gap: 0.5rem;
|
||||
margin-top: 2rem;
|
||||
}
|
||||
|
||||
.btns img {
|
||||
height: 40px;
|
||||
transition: all 0.2s ease-in-out;
|
||||
}
|
||||
|
||||
.btns img:hover:nth-child(even) {
|
||||
transform: scale(1.3) rotate(5deg);
|
||||
}
|
||||
|
||||
.btns img:hover:nth-child(odd) {
|
||||
transform: scale(1.3) rotate(-5deg);
|
||||
}
|
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;
|
||||
}
|
||||
}
|
138
static/js/base.js
Normal file
@@ -0,0 +1,138 @@
|
||||
const values = [
|
||||
"Web developer",
|
||||
"Pc games enjoyer",
|
||||
"Server backend survivor",
|
||||
"python programmer",
|
||||
"Javascript disliker",
|
||||
"I use Arch btw",
|
||||
"Owo, what's this?",
|
||||
"Ultimate procrastinator",
|
||||
"Ultrakill gaming",
|
||||
"00111010 00110011",
|
||||
"fistful of dollar",
|
||||
"Thy end is now!!!",
|
||||
"Possibly a furry",
|
||||
"Prepare thyself!!!",
|
||||
"Spegatti code master",
|
||||
"Ethernet cable untangler",
|
||||
"Caffeine addict",
|
||||
"I'm not a robot ☑",
|
||||
"Loud Music enjoyer",
|
||||
"part time femboy :<",
|
||||
];
|
||||
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);
|
||||
currentValueIndex = 0;
|
||||
}
|
||||
|
||||
function type() {
|
||||
if (typing_direction == 1) {
|
||||
if (currentValueIndex < values[selectedValue].length) {
|
||||
text += values[selectedValue][currentValueIndex];
|
||||
currentValueIndex++;
|
||||
} else {
|
||||
typing_direction = -1;
|
||||
pause = true;
|
||||
}
|
||||
} else {
|
||||
if (currentValueIndex > 0) {
|
||||
text = text.slice(0, -1);
|
||||
currentValueIndex--;
|
||||
} else {
|
||||
typing_direction = 1;
|
||||
randomValue();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function typing() {
|
||||
type();
|
||||
document.getElementById("typing").innerHTML = "$ " + text;
|
||||
if (typing_direction == 1) {
|
||||
speed = 80 + Math.random() * 100;
|
||||
} else {
|
||||
speed = 60 + (Math.random() * 100) / 2;
|
||||
}
|
||||
if (!pause) {
|
||||
setTimeout(typing, speed);
|
||||
} else {
|
||||
setTimeout(typing, 500);
|
||||
pause = false;
|
||||
}
|
||||
}
|
||||
|
||||
typing();
|
||||
|
||||
// HIDDEN STUFF (shh don't tell anyone >:3)
|
||||
|
||||
let last5Chars = "";
|
||||
|
||||
document.addEventListener('keydown', function(event) {
|
||||
last5Chars += event.key;
|
||||
if (last5Chars == "furry") {
|
||||
console.log("owo, whats this?");
|
||||
document.getElementById('furry').style.display = 'block';
|
||||
}
|
||||
if (last5Chars == "irken") {
|
||||
console.log("doom doom doom!");
|
||||
document.querySelector(":root").style.setProperty('--font-family', 'Irken');
|
||||
document.querySelector(":root").style.setProperty('--title-font', '1.5em');
|
||||
}
|
||||
while (last5Chars.length >= 5) {
|
||||
last5Chars = last5Chars.slice(1);
|
||||
}
|
||||
});
|
||||
|
||||
// Spotify API
|
||||
|
||||
function getSpotify() {
|
||||
fetch('https://api.alfieking.dev/spotify/nowplaying/xz02oolstlvwxqu1pfcua9exz').then(response => {
|
||||
return response.json();
|
||||
}).then(data => {
|
||||
if (data.item == null) {
|
||||
document.getElementById('spotify').style.backgroundImage = "none";
|
||||
document.getElementById('spotify-title').innerHTML = "Spotify is not playing anything";
|
||||
document.getElementById('spotify-artist').innerHTML = ":(";
|
||||
document.getElementById('spotify-link').href = "https://open.spotify.com/";
|
||||
return;
|
||||
}
|
||||
document.getElementById('spotify').style.backgroundImage = "url(" + data.item.album.images[0].url + ")";
|
||||
document.getElementById('spotify-title').innerHTML = data.item.name;
|
||||
document.getElementById('spotify-artist').innerHTML = data.item.artists[0].name;
|
||||
document.getElementById('spotify-link').href = data.item.external_urls.spotify;
|
||||
});
|
||||
}
|
||||
|
||||
if (document.getElementById('spotify')) {
|
||||
getSpotify();
|
||||
setInterval(getSpotify, 15000);
|
||||
}
|
||||
|
||||
// load buttons
|
||||
|
||||
function loadButtons() {
|
||||
fetch('/static/content/other/buttons.txt').then(response => {
|
||||
return response.text();
|
||||
}).then(data => {
|
||||
container = document.getElementById('button-collection');
|
||||
for (let line of data.split('\n')) {
|
||||
if (line == "") {
|
||||
continue;
|
||||
}
|
||||
let img = document.createElement('img');
|
||||
img.src = line;
|
||||
container.appendChild(img);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
if (document.getElementById('button-collection')) {
|
||||
loadButtons();
|
||||
}
|
@@ -1,78 +0,0 @@
|
||||
var enableMusic = true;
|
||||
|
||||
document.getElementById('music').addEventListener('mouseover', function() { musicHover(); });
|
||||
|
||||
function musicHover() {
|
||||
if (!enableMusic) {
|
||||
return;
|
||||
}
|
||||
let icon = document.getElementById('music-icon');
|
||||
icon.style.width = '8rem';
|
||||
icon.style.height = '8rem';
|
||||
icon.style.borderRadius = '500px 0 0 500px';
|
||||
let div = document.getElementById('music-expand');
|
||||
div.style.display = 'flex';
|
||||
div.style.width = '20rem';
|
||||
div.style.height = '8rem';
|
||||
let title = document.getElementById('music-title');
|
||||
title.style.display = 'block';
|
||||
let info = document.getElementById('music-info');
|
||||
info.style.display = 'block';
|
||||
let progress = document.getElementById('music-progress');
|
||||
progress.style.display = 'block';
|
||||
}
|
||||
|
||||
document.getElementById('music').addEventListener('mouseout', function() { musicOut(); });
|
||||
|
||||
function musicOut() {
|
||||
let icon = document.getElementById('music-icon');
|
||||
icon.style.width = '1.5rem';
|
||||
icon.style.height = '1.5rem';
|
||||
icon.style.borderRadius = '50%';
|
||||
let div = document.getElementById('music-expand');
|
||||
div.style = '';
|
||||
let title = document.getElementById('music-title');
|
||||
title.style.display = 'none';
|
||||
let info = document.getElementById('music-info');
|
||||
info.style.display = 'none';
|
||||
let progress = document.getElementById('music-progress');
|
||||
progress.style.display = 'none';
|
||||
}
|
||||
|
||||
function fetchData() {
|
||||
// allow cors
|
||||
let data = fetch('https://alfieking.dev/api/nowplaying')
|
||||
.then(response => response.json()).then(data => { return data; })
|
||||
.catch(error => { return null;});
|
||||
return data;
|
||||
}
|
||||
|
||||
function updateUi(data) {
|
||||
enableMusic = true;
|
||||
document.getElementById('music').style.display = 'flex';
|
||||
document.getElementById('music-icon').src = data.item.album.images[0].url;
|
||||
document.getElementById('music-title').innerText = data.item.name;
|
||||
document.getElementById('music-info').innerText = data.item.artists[0].name + ' - ' + data.item.album.name;
|
||||
let progress = data.progress_ms / data.item.duration_ms * 100;
|
||||
document.getElementById('music-progress').style.width = progress + '%';
|
||||
}
|
||||
|
||||
function hideUi() {
|
||||
enableMusic = false;
|
||||
document.getElementById('music').style.display = 'none';
|
||||
}
|
||||
|
||||
function update() {
|
||||
fetchData().then(data => {
|
||||
console.log(data);
|
||||
if (data.item != null) {
|
||||
updateUi(data);
|
||||
}
|
||||
else {
|
||||
hideUi();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
update();
|
||||
setInterval(update, 3000);
|
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();
|
@@ -1,71 +0,0 @@
|
||||
const values = [
|
||||
"Web developer",
|
||||
"Pc games enjoyer",
|
||||
"Server backend survivor",
|
||||
"python programmer",
|
||||
"Javascript disliker",
|
||||
"I use Arch btw",
|
||||
"Owo, what's this?",
|
||||
"Ultimate procrastinator",
|
||||
"Ultrakill gaming",
|
||||
"00111010 00110011",
|
||||
"fistful of dollar",
|
||||
"Thy end is now!!!",
|
||||
"Possibly a furry",
|
||||
"Prepare thyself!!!",
|
||||
"Spegatti code master",
|
||||
"Ethernet cable untangler",
|
||||
"Caffeine addict",
|
||||
"I'm not a robot ☑",
|
||||
"Loud Music enjoyer",
|
||||
"part time femboy :<",
|
||||
];
|
||||
var direction = 1;
|
||||
var text = "";
|
||||
var speed = 100;
|
||||
var selectedValue = 0;
|
||||
var currentValueIndex = 0;
|
||||
var pause = false;
|
||||
|
||||
function randomValue() {
|
||||
selectedValue = Math.floor(Math.random() * values.length);
|
||||
currentValueIndex = 0;
|
||||
}
|
||||
|
||||
function type() {
|
||||
if (direction == 1) {
|
||||
if (currentValueIndex < values[selectedValue].length) {
|
||||
text += values[selectedValue][currentValueIndex];
|
||||
currentValueIndex++;
|
||||
} else {
|
||||
direction = -1;
|
||||
pause = true;
|
||||
}
|
||||
} else {
|
||||
if (currentValueIndex > 0) {
|
||||
text = text.slice(0, -1);
|
||||
currentValueIndex--;
|
||||
} else {
|
||||
direction = 1;
|
||||
randomValue();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function typing() {
|
||||
type();
|
||||
document.getElementById("typing").innerHTML = "$ " + text;
|
||||
if (direction == 1) {
|
||||
speed = 80 + Math.random() * 100;
|
||||
} else {
|
||||
speed = 60 + (Math.random() * 100) / 2;
|
||||
}
|
||||
if (!pause) {
|
||||
setTimeout(typing, speed);
|
||||
} else {
|
||||
setTimeout(typing, 500);
|
||||
pause = false;
|
||||
}
|
||||
}
|
||||
|
||||
typing();
|
101
templates/bases/base.html
Normal file
@@ -0,0 +1,101 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<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="{% 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>
|
||||
<div id="sidebar">
|
||||
<nav>
|
||||
<section>
|
||||
<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>
|
||||
<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/general_images/haj.gif" alt="haj" class="haj">
|
||||
</div>
|
||||
<main id="main">
|
||||
<header id="home">
|
||||
<div class="row">
|
||||
<img src="/static/content/general_images/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="/">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>
|
||||
{% 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 %}
|