first commit

This commit is contained in:
2025-05-15 16:06:00 +01:00
commit e8cf8acbbc
129 changed files with 3796 additions and 0 deletions

4
scripts/export.sh Normal file
View File

@@ -0,0 +1,4 @@
cd ../..
mv ailyaut.com.zip ailyaut.com_old.zip
zip -r ailyaut.com.zip ailyaut.com
bash export_ailyaut.com.sh

206
scripts/markdown_to_html.py Normal file
View File

@@ -0,0 +1,206 @@
import os
import time
import math
import markdown
#templates
with open('templates/blog_post.html', 'r') as file: blog_post_temp = file.readlines()
with open('templates/head.html', 'r') as file: head_temp = file.readlines()
with open('templates/header.html', 'r') as file: header_temp = file.readlines()
with open('templates/footer.html', 'r') as file: footer_temp = file.readlines()
with open('templates/blog.html', 'r') as file: blog_temp = file.readlines()
with open('templates/blog_card.html', 'r') as file: blog_card_temp = file.readlines()
with open('templates/blog_list.html', 'r') as file: blog_list_temp = file.readlines()
with open('templates/index.html', 'r') as file: index_temp = file.readlines()
with open('templates/rss.xml', 'r') as file: rss_temp = file.readlines()
with open('templates/rss_item.xml', 'r') as file: rss_item_temp = file.readlines()
root = '../blog/'
posts = os.listdir(str(root + 'md/'))
posts.remove('draft')
# unix_time = int(time.time())
# rss_time = print(time.strftime("%a, %d %b %Y %H:%M:%S %z", time.localtime(unix_time)))
# MD TO HTML ==============================================================
for post in posts:
#read file
path = str(root + 'md/' + post)
with open(path, 'r') as file:
text = file.readlines()
#read metadata
for line in text:
if 'title = ' in line: title = line.replace('title = ', '')
if 'timestamp = ' in line: timestamp = line.replace('timestamp = ', '')
if 'preview = ' in line: preview = line.replace('preview = ', '')
if 'thumb = ' in line: thumb = line.replace('thumb = ', '')
if 'auto' in timestamp:
timestamp = str(int(time.time())) # !! should write this into the md file later
#delete metadata before converting
index = 0
for i in range(len(text)):
if '+++' in text[i]:
index = i
text = text[index+2:] #remove lines before '+++' and 2 more
#convert to HTML
text = ''.join(text)
html = markdown.markdown(text)
#add title, pubication date and reading time
date = str(time.strftime("%d/%m/%Y", time.localtime(int(timestamp))))
word_count = len(text.split())
reading_time = str(math.ceil(word_count / 200))
insert = str('<h1>' + title + '</h1>' + '<p class="light">' + date + ' · ' + reading_time + ' min</p>' + '<div class="spacer" style="--size: 1em"></div>')
html = str(insert + html)
#insert in template
head = head_temp.copy()
for i in range(len(head_temp)):
if '$title$' in head_temp[i]: head[i] = head[i].replace('$title$', title)
if '$preview$' in head_temp[i]: head[i] = head[i].replace('$preview$', preview)
if '$thumb$' in head_temp[i]: head[i] = head[i].replace('$thumb$', thumb)
header = header_temp.copy()
footer = footer_temp.copy()
blog = blog_post_temp.copy()
for i in range(len(blog_post_temp)):
if '$head.html$' in blog_post_temp[i]: blog[i] = blog[i].replace('$head.html$', ''.join(head))
if '$header.html$' in blog_post_temp[i]: blog[i] = blog[i].replace('$header.html$', ''.join(header))
if '$footer.html$' in blog_post_temp[i]: blog[i] = blog[i].replace('$footer.html$', ''.join(footer))
if '$post$' in blog_post_temp[i]: blog[i] = blog[i].replace('$post$', ''.join(html))
html = ''.join(blog)
#export to HTML file
output_filename = post[:-3] #remove .md extension
index = 0
for i in range(len(output_filename)):
if output_filename[i] == '+':
index = i
output_filename = output_filename[index+1:] #remove date from filename for cleaner URL
output_path = str(root + output_filename + '.html')
if not os.path.isfile(output_path): #check that file doesn't exist to prevent overwriting it
print('CREATE\t', output_path)
with open(output_path, 'w') as output:
output.write(html)
output.close()
else: print('SKIP\t',output_path)
# GEN LIST ==============================================================
post_list = []
for post in posts:
#read file
path = str(root + 'md/' + post)
with open(path, 'r') as file:
text = file.readlines()
#read metadata
for line in text:
if 'title = ' in line: title = line.replace('title = ', '')
if 'timestamp = ' in line: timestamp = line.replace('timestamp = ', '')
if 'preview = ' in line: preview = line.replace('preview = ', '')
if 'thumb = ' in line: thumb = line.replace('thumb = ', '')
if 'auto' in timestamp:
timestamp = str(int(time.time()))
output_filename = post[:-3] #remove .md extension
index = 0
for i in range(len(output_filename)):
if output_filename[i] == '+':
index = i
output_filename = output_filename[index+1:] #remove date from filename for cleaner URL
url = str('blog/' + output_filename + '.html')
#fill post_list dict
post_list.append([title, timestamp, preview, thumb, url])
# GEN PAGES ===============================================================
#create blog cards
latest_posts = post_list[-3:]
latest_posts.reverse()
latest_posts_cards = ''
for post in latest_posts:
blog_card = blog_card_temp.copy()
title = post[0]
timestamp = post[1]
preview = post[2]
thumb = post[3]
url = post[4]
for i in range(len(blog_card_temp)):
if '$title$' in blog_card_temp[i]: blog_card[i] = blog_card[i].replace('$title$', title)
if '$preview$' in blog_card_temp[i]: blog_card[i] = blog_card[i].replace('$preview$', preview)
if '$thumb$' in blog_card_temp[i]: blog_card[i] = blog_card[i].replace('$thumb$', thumb)
if '$url$' in blog_card_temp[i]: blog_card[i] = blog_card[i].replace('$url$', url)
latest_posts_cards = str(latest_posts_cards + ''.join(blog_card))
#replace in index
index = index_temp.copy()
for i in range(len(index_temp)):
if '$blog_card$' in index_temp[i]: index[i] = index[i].replace('$blog_card$', latest_posts_cards)
index = ''.join(index)
with open('../index.html', 'w') as output:
output.write(index)
output.close()
#replace in rss
post_list.reverse()
rss_items = ''
for post in post_list:
rss_item = rss_item_temp.copy()
title = post[0]
timestamp = post[1]
preview = post[2]
thumb = post[3]
url = post[4]
for i in range(len(rss_item_temp)):
if '$title$' in rss_item[i]: rss_item[i] = rss_item[i].replace('$title$', title)
if '$preview$' in rss_item[i]: rss_item[i] = rss_item[i].replace('$preview$', preview)
if '$thumb$' in rss_item[i]: rss_item[i] = rss_item[i].replace('$thumb$', thumb)
if '$url$' in rss_item[i]: rss_item[i] = rss_item[i].replace('$url$', url)
if '$date$' in rss_item[i]: rss_item[i] = rss_item[i].replace('$date$', time.strftime("%a, %d %b %Y %H:%M:%S %z", time.localtime(int(timestamp))))
rss_items = str(rss_items + ''.join(rss_item))
rss = rss_temp.copy()
for i in range(len(rss_temp)):
if '$items$' in rss_temp[i]: rss[i] = rss[i].replace('$items$', rss_items)
with open('../rss.xml', 'w') as output:
output.writelines(rss)
output.close()
#replace in blog
year = '0000'
blog_post_list = ''
for post in post_list: #replace blog list
blog_list = blog_list_temp.copy()
title = post[0]
timestamp = post[1]
preview = post[2]
thumb = post[3]
url = post[4]
blog_list[0] = blog_list[0].replace('$title$', title)
blog_list[0] = blog_list[0].replace('$date$', time.strftime("%d/%m", time.localtime(int(timestamp))))
blog_list[0] = blog_list[0].replace('$url$', url)
if time.strftime("%Y", time.localtime(int(timestamp))) != year:
year = time.strftime("%Y", time.localtime(int(timestamp)))
blog_post_list = str(blog_post_list + '<hr><h3>' + year + '</h3>')
blog_post_list = str(blog_post_list + ''.join(blog_list))
blog = blog_temp.copy()
for i in range(len(blog_temp)):
if '$blog_card$' in blog_temp[i]: blog[i] = blog[i].replace('$blog_card$', latest_posts_cards)
if '$blog_list$' in blog_temp[i]: blog[i] = blog[i].replace('$blog_list$', blog_post_list)
blog = ''.join(blog)
with open('../blog.html', 'w') as output:
output.write(blog)
output.close()

20
scripts/minify_css.py Normal file
View File

@@ -0,0 +1,20 @@
import os
with open( '../style_expanded.css' , 'r' ) as file:
css = file.read()
css = css.replace('\n', '')
css = css.replace('\t', '')
css = css.replace(' ', ' ')
css = css.replace(' ', ' ')
css = css.replace(' ', ' ')
css = css.replace(' { ', '{')
css = css.replace(' } ', '}')
css = css.replace('; ', ';')
css = css.replace(', ', ',')
css = css.replace(': ', ':')
css = css.replace(' (', '(')
with open('../style.css', 'w') as output:
output.write(css)
output.close()

View File

@@ -0,0 +1,92 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Blog Ailyaut's blog</title>
<link rel="icon" type="image/png" href="media/icons/favicon-16x16.png" sizes="16x16">
<link rel="stylesheet" href="style.css" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta property="og:title" content="Blog Ailyaut's blog" />
<meta property="og:type" content="blog" />
<meta property="og:url" content="https://ailyaut.com/" />
<meta property="og:image" content="https://ailyaut.com/media/preview.png" />
<meta property="og:description" content="Hi! I'm Ailyaut, a 24-year-old everything-designer with a particular interest in open source and card games." />
<meta property="og:locale" content="en_US" />
<meta property="og:locale:alternate" content="fr_FR" />
</head>
<body>
<header>
<div id="header_box">
<div>
<a href="index.html" id="header_title">Ailyaut's blog</a>
</div>
<nav id="header_nav">
<a href="blog.html" class="nav_button_active">Blog</a>
<a href="gallery.html" class="nav_button">Gallery</a>
<a href="projects.html" class="nav_button">Projects</a>
<a href="about.html" class="nav_button">About</a>
</nav>
</div>
</header>
<main>
<div class="box">
<h1>Blog</h1>
</div>
<!-- Blog -->
<div class="spacer" style="--size: 1em;"></div>
<div class="box">
<div class="column" style="width: 100%;">
<div class="row align_vertical" style="justify-content: space-between; height: min-content;">
<div class="row align_vertical" style="gap: 0.75em;">
<h2 style="margin-bottom: 0; margin-top: 0;">Recent posts</h2>
<a href="rss.xml" style="position: relative; top: 0.2em;"><img class="icon" src="media/icons/rss.png"></a>
</div>
</div>
<div class="spacer" style="--size: 1em"></div>
<div class="row" style="gap: 2em">
<!-- blog -->
$blog_card$
</div>
</div>
</div>
<div class="spacer" style="--size: 2em;"></div>
<div class="box">
<div class="column" style="width: 100%;">
<h2 id="all">All posts</h2>
$blog_list$
</div>
</div>
<div class="spacer" style="--size: 2em"></div>
<a href="#" class="btt"><img class="bttimg" src="media/icons/arrow_upward.png"/></a>
</main>
<footer>
<div id="footer_box">
<div class="footer_item">
<p>Copyright © 2025 Ailyaut</p>
</div>
<div class="footer_item">
<a target="_blank" href="https://www.websitecarbon.com/website/ailyaut-robotfumeur-fr-index-html/" style="text-decoration: none;">
<p style="color: black; background-color: var(--accent); padding: 0.2em 0.6em 0.2em 0.6em ; border-radius: 1em;">
0.02g of CO₂/view
</p>
</a>
</div>
<div class="footer_item" style="justify-content: flex-end; gap: 1.75em;">
<a rel="me" href="https://mastodon.online/@ailyaut" target="_blank"><img src="media/icons/mastodon.png" class="icon" alt="Mastodon" title="Mastodon"/></a>
<a href="https://www.youtube.com/@ailyaut" target="_blank"><img src="media/icons/youtube.png" class="icon" alt="YouTube" title="YouTube"/></a>
<a href="https://ailyaut.bandcamp.com/" target="_blank"><img src="media/icons/bandcamp.png" class="icon" alt="Bandcamp" title="Bandcamp"/></a>
<a href="https://codeberg.org/ailyaut" target="_blank"><img src="media/icons/git.png" class="icon" alt="Git" title="Git"/></a>
<a href="rss.xml"><img src="media/icons/rss.png" class="icon" alt="RSS feed" title="RSS feed"/></a>
</div>
</div>
</footer>
</body>

View File

@@ -0,0 +1,13 @@
<div class="column" style="--custom_width: 33%; gap: 1em">
<a href="$url$" class="card" style="text-decoration: none;">
<img src="$thumb$" alt="$title$" title="$title$" class="card_image"/>
<div class="box">
<div class="column" style="width: 100%;">
<h3 class="card_title">$title$</h3>
<p class="card_text">
$preview$
</p>
</div>
</div>
</a>
</div>

View File

@@ -0,0 +1 @@
<p class="light">$date$&emsp;<a href="$url$">$title$</a></p>

View File

@@ -0,0 +1,14 @@
$head.html$
<body>
$header.html$
<main>
<div class="box">
<div class="column" style="--custom_width: 60%;">
$post$
</div>
</div>
<div class="spacer" style="--size: 2em"></div>
<a href="#" class="btt"><img class="bttimg" src="../media/icons/arrow_upward.png"/></a>
</main>
$footer.html$
</body>

View File

@@ -0,0 +1,21 @@
<footer>
<div id="footer_box">
<div class="footer_item">
<p>Copyright © 2025 Ailyaut</p>
</div>
<div class="footer_item">
<a target="_blank" href="https://www.websitecarbon.com/website/ailyaut-robotfumeur-fr-index-html/" style="text-decoration: none;">
<p style="color: black; background-color: var(--accent); padding: 0.2em 0.6em 0.2em 0.6em ; border-radius: 1em;">
0.02g of CO₂/view
</p>
</a>
</div>
<div class="footer_item" style="justify-content: flex-end; gap: 1.75em;">
<a rel="me" href="https://mastodon.online/@ailyaut" target="_blank"><img src="../media/icons/mastodon.png" class="icon" alt="Mastodon" title="Mastodon"/></a>
<a href="https://www.youtube.com/@ailyaut" target="_blank"><img src="../media/icons/youtube.png" class="icon" alt="YouTube" title="YouTube"/></a>
<a href="https://ailyaut.bandcamp.com/" target="_blank"><img src="../media/icons/bandcamp.png" class="icon" alt="Bandcamp" title="Bandcamp"/></a>
<a href="https://codeberg.org/ailyaut" target="_blank"><img src="../media/icons/git.png" class="icon" alt="Git" title="Git"/></a>
<a href="../rss.xml"><img src="../media/icons/rss.png" class="icon" alt="RSS feed" title="RSS feed"/></a>
</div>
</div>
</footer>

View File

@@ -0,0 +1,17 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>$title$ Ailyaut's blog</title>
<link rel="icon" type="image/png" href="../media/icons/favicon-16x16.png" sizes="16x16">
<link rel="stylesheet" href="../style.css" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta property="og:title" content="$title$ Ailyaut's blog" />
<meta property="og:type" content="blog" />
<meta property="og:url" content="https://ailyaut.com/" />
<meta property="og:image" content="https://ailyaut.com/$thumb$" />
<meta property="og:description" content="$preview$" />
<meta property="og:locale" content="en_US" />
</head>

View File

@@ -0,0 +1,13 @@
<header>
<div id="header_box">
<div>
<a href="../index.html" id="header_title">Ailyaut's blog</a>
</div>
<nav id="header_nav">
<a href="../blog.html" class="nav_button_active">Blog</a>
<a href="../gallery.html" class="nav_button">Gallery</a>
<a href="../projects.html" class="nav_button">Projects</a>
<a href="../about.html" class="nav_button">About</a>
</nav>
</div>
</header>

View File

@@ -0,0 +1,128 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Ailyaut's blog</title>
<link rel="icon" type="image/png" href="media/icons/favicon-16x16.png" sizes="16x16">
<link rel="stylesheet" href="style.css" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta property="og:title" content="Ailyaut's blog" />
<meta property="og:type" content="blog" />
<meta property="og:url" content="https://ailyaut.com/" />
<meta property="og:image" content="https://ailyaut.com/media/preview.png" />
<meta property="og:description" content="Hi! I'm Ailyaut, a 24-year-old everything-designer with a particular interest in open source and card games." />
<meta property="og:locale" content="en_US" />
<meta property="og:locale:alternate" content="fr_FR" />
</head>
<body>
<header>
<div id="header_box">
<div>
<a href="index.html" id="header_title">Ailyaut's blog</a>
</div>
<nav id="header_nav">
<a href="blog.html" class="nav_button">Blog</a>
<a href="gallery.html" class="nav_button">Gallery</a>
<a href="projects.html" class="nav_button">Projects</a>
<a href="about.html" class="nav_button">About</a>
</nav>
</div>
</header>
<main>
<!-- intro -->
<div class="box">
<div class="column" style="--custom_width:25%">
<div class="align_vertical">
<div class="align_horizontal">
<img src="media/ailyaut.png" alt="Ailyaut" title="Ailyaut" id="portrait"/>
</div>
</div>
</div>
<div class="spacer" style="--size: 2em"></div>
<div class="column" style="--custom_width:75%">
<h1>Heyo!</h1>
<p>I'm Ailyaut, a 24-year-old everything-designer with a particular interest in open source and card games.<br>
I have studied 3D animation and now work as a UI & product designer, sometimes programmer.
</p>
<p class="light" style="margin-bottom: 0;">
Je m'appelle Ailyaut, je suis un designer touche-à-tout de 24 ans qui s'intéresse particulièrement à l'open source et aux jeux de carte.
J'ai étudié l'animation 3D et je travaille actuellement comme designer UI & produit, et parfois comme programmeur.
</p>
</div>
</div>
<!-- Featured project -->
<div class="spacer" style="--size: 6em"></div>
<div class="box">
<div class="column" style="width: 100%;">
<div class="row align_vertical" style="justify-content: space-between; height: min-content;">
<div class="row align_vertical" style="gap: 0.75em;">
<h2 style="margin-bottom: 0; margin-top: 0;">Featured project</h2>
<img class="icon" src="media/icons/verified.png">
</div>
<p style="min-width: max-content; position: relative; top: 0.75em;"><a href="projects.html" class="light">All projects ></a></p>
</div>
<div class="spacer" style="--size: 1em"></div>
<div class="row" style="background-color: var(--surface); border-radius: 2em; padding: 1.25em; gap: 2em; border: 1px solid var(--outline);">
<div class="column" style="max-width: 400px; width: 100%;">
<img src="projects/gang/thumb.png" style="border-radius: 1.5em;" title="Gang" alt="A red chinese dragon drawn in a manga style";/>
</div>
<div class="column">
<h2 style="margin-top: 0;">Gang</h2>
<p>A complete redesign of the famous card game "Gang of Four" in my own style, with a focus on being clean and accessible to colorblind people.
The whole game was made using only open source software and printed by a small company in Alsace (France). The PDF files are available for free printing.</p>
<p><a href="projects/gang/index.html">Learn more ></a></p>
</div>
</div>
</div>
</div>
<!-- Blog -->
<div class="spacer" style="--size: 4em"></div>
<div class="box">
<div class="column" style="width: 100%;">
<div class="row align_vertical" style="justify-content: space-between; height: min-content;">
<div class="row align_vertical" style="gap: 0.75em;">
<h2 style="margin-bottom: 0; margin-top: 0;">Blog</h2>
<a href="rss.xml" style="position: relative; top: 0.2em;"><img class="icon" src="media/icons/rss.png"></a>
</div>
<p style="min-width: max-content; position: relative; top: 0.75em;"><a href="blog.html" class="light">All posts ></a></p>
</div>
<div class="spacer" style="--size: 1em"></div>
<div class="row" style="gap: 2em">
<!-- blog -->
$blog_card$
</div>
</div>
</div>
<div class="spacer" style="--size: 4em"></div>
</main>
<footer>
<div id="footer_box">
<div class="footer_item">
<p>Copyright © 2025 Ailyaut</p>
</div>
<div class="footer_item">
<a target="_blank" href="https://www.websitecarbon.com/website/ailyaut-robotfumeur-fr-index-html/" style="text-decoration: none;">
<p style="color: black; background-color: var(--accent); padding: 0.2em 0.6em 0.2em 0.6em ; border-radius: 1em;">
0.02g of CO₂/view
</p>
</a>
</div>
<div class="footer_item" style="justify-content: flex-end; gap: 1.75em;">
<a rel="me" href="https://mastodon.online/@ailyaut" target="_blank"><img src="media/icons/mastodon.png" class="icon" alt="Mastodon" title="Mastodon"/></a>
<a href="https://www.youtube.com/@ailyaut" target="_blank"><img src="media/icons/youtube.png" class="icon" alt="YouTube" title="YouTube"/></a>
<a href="https://ailyaut.bandcamp.com/" target="_blank"><img src="media/icons/bandcamp.png" class="icon" alt="Bandcamp" title="Bandcamp"/></a>
<a href="https://codeberg.org/ailyaut" target="_blank"><img src="media/icons/git.png" class="icon" alt="Git" title="Git"/></a>
<a href="rss.xml"><img src="media/icons/rss.png" class="icon" alt="RSS feed" title="RSS feed"/></a>
</div>
</div>
</footer>
</body>

17
scripts/templates/rss.xml Normal file
View File

@@ -0,0 +1,17 @@
<?xml version="1.0" encoding="utf-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
<channel>
<title>Ailyaut's Blog</title>
<link>https://ailyaut.com</link>
<image>
<url>https://ailyaut.com/media/icons/favicon-32x32.png</url>
<title>Ailyaut's Blog</title>
<link>https://ailyaut.com</link>
</image>
<atom:link href="https://ailyaut.com/rss.xml" rel="self" type="application/rss+xml" />
$items$
</channel>
</rss>

View File

@@ -0,0 +1,12 @@
<item>
<title>$title$</title>
<link>https://ailyaut.com/$url$</link>
<description>$preview$</description>
<category>posts</category>
<guid>https://ailyaut.com/$url$</guid>
<dc:creator>Ailyaut</dc:creator>
<pubDate>$date$</pubDate>
<image>https://ailyaut.com/$thumb$</image>
</item>