HTML document, Unicode text, UTF-8 text
1
<!DOCTYPE html>
2
<html lang="en">
3
<head>
4
<meta charset="UTF-8">
5
<title>web</title>
6
<link rel="stylesheet" href="/static/style.css">
7
<meta name="viewport" content="width=device-width, initial-scale=1.0">
8
</head>
9
<body>
10
<header>
11
<a href="#main" id="skip-link">Skip navigation</a>
12
<nav>
13
<ul>
14
<li><a href="/">Home</a></li>
15
<li><a href="/projects">Projects</a></li>
16
<li><a href="/index">Index</a></li>
17
<li><a href="/about">About</a></li>
18
<li><a href="https://roundabout-host.com/roundabout">Roundabout-host</a></li>
19
</ul>
20
<ul>
21
<li><a href="mailto:root@roundabout-host.com" id="mail-link">root@roundabout-host.com</a></li>
22
</ul>
23
</nav>
24
</header>
25
<main id="main">
26
27
<h1>web</h1>
28
<div class="topic-posts">
30
31
<article class="content-area">
32
<h2><a href="/articles/font-stacks.html" class="article-title">Proposed system font stacks</a></h2>
33
<div class="home-article-date">2024-12-27</div>
34
<p><p>I've seen <a href="https://modernfontstacks.com/">Modern Font Stacks</a>. I agree that there are many cases
35
where system fonts are fine, but the stacks there have some problems, especially with GNU/Linux
36
devices.
37
</p></p>
38
</article>
39
40
<article class="content-area">
41
<h2><a href="/articles/semantic-css.html" class="article-title">Let's write more semantic CSS</a></h2>
42
<div class="home-article-date">2024-05-18</div>
43
<p><p>You probably wrote something like this at least once in your life:
44
</p><pre data-language="html"><div class="card card--rounded card--primary">
45
<div class="card__image-container">
46
<img src="image.jpg" alt="A nice image" class="card__image">
47
<span class="card__image-caption">A nice image</span>
48
</div>
49
<div class="card__content">
50
<div class="card__header">
51
<div class="card__title">Hello, world!</div>
52
</div>
53
<p class="card__text">
54
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
55
</p>
56
</div>
57
<div class="card__footer">
58
<button class="btn btn--primary btn--raised btn--accent card__button card__button--primary">Click me!</button>
59
<button class="btn btn--secondary btn--raised btn--accent card__button card__button--secondary">Click me!</button>
60
</div>
61
</div>
62
</pre><p>Or this:
63
</p><pre data-language="html"><div class="max-w-sm rounded overflow-hidden shadow-lg">
64
<div>
65
<img class="w-full" src="image.jpg" alt="A nice image">
66
<span class="text-gray-500 text-base">A nice image</span>
67
</div>
68
<div class="px-6 py-4">
69
<div>
70
<div class="font-bold text-xl mb-2">Hello, world!</div>
71
</div>
72
<p class="text-gray-700 text-base">
73
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
74
</p>
75
</div>
76
<div class="px-6 py-4">
77
<button class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded">Click me!</button>
78
<button class="bg-transparent hover:bg-blue-500 text-blue-700 font-semibold hover:text-white py-2 px-4 border border-blue-500 hover:border-transparent rounded">Click me!</button>
79
</div>
80
</div>
81
</pre></p>
82
</article>
83
84
<article class="content-area">
85
<h2><a href="/articles/browsers-are-doing-too-much.html" class="article-title">Browsers are doing way too much nowadays</a></h2>
86
<div class="home-article-date">2024-05-07</div>
87
<p><p>Ooh, shiny! Chrome is now forcing me to view my bookmarks in a ✨side panel✨! It's not like
88
we have windowing environments for that, right? Doesn't matter, it's modern, new so it's cool
89
and automatically better even though it sucks!
90
</p></p>
91
</article>
92
93
<article class="content-area">
94
<h2><a href="/projects/ampoule.html" class="article-title">Ampoule</a></h2>
95
<div class="home-article-date">2025-02-02</div>
96
<p><p>Ampoule is a lightweight, simple yet flexible, static site generator written in Python.
97
It uses Jinja2 for templating. This site was generated using Ampoule.
98
</p></p>
99
</article>
100
101
<article class="content-area">
102
<h2><a href="/projects/echo.html" class="article-title">Echo</a></h2>
103
<div class="home-article-date">2024-04-29</div>
104
<p><p>Echo is a very basic status tracker for web endpoints. I don't recommend you use it. It was
105
made for a programming competition (hackathon) organised by the Automation and Computing faculty
106
of the Politehnica University of Timișoara, in 3 days, alone. I decided to publish it because
107
it might be useful for someone and doesn't hurt me to have it online, and the contest encourages
108
publishing the works.
109
</p></p>
110
</article>
111
112
<article class="content-area">
113
<h2><a href="/projects/gigadata.html" class="article-title">Gigadata</a></h2>
114
<div class="home-article-date">2024-10-15</div>
115
<p><p>Gigadata is an image dataset collection and annotation platform. It allows anyone
116
to easily contribute to the dataset by uploading images and annotating objects,
117
and to use the dataset for training machine learning models.
118
</p></p>
119
</article>
120
121
<article class="content-area">
122
<h2><a href="/projects/roundabout.html" class="article-title">The roundabout</a></h2>
123
<div class="home-article-date">2025-02-02</div>
124
<p><p>The roundabout is a <strong class="emphasis-2">git repository hosting</strong> server software. It is designed to be a complete
125
alternative to GitHub, GitLab, BitBucket, Gogs/Gitea/Forgejo, and other similar services. It
126
is still in development and not yet ready for production use. As of version 0.3.0 development
127
stage, it supports:
128
</p></p>
129
</article>
130
131
</div>
132
</main>
134
<footer>
135
<p>Page generated on Sunday, 4 May 2025 at 15:06:42</p>
136
<p xmlns:cc="http://creativecommons.org/ns#" >This work is marked with <a href="https://creativecommons.org/publicdomain/zero/1.0/?ref=chooser-v1" target="_blank" rel="license noopener noreferrer" style="display:inline-block;">CC0 1.0 Universal</a> (🄍). No rights reserved.</p>
137
<p>Hosted at <a href="https://roundabout-host.com/roundabout">Roundabout-host</a> using the static site service, and generated with <a href="/projects/ampoule.html">Ampoule</a>.</p>
138
<a href="#">Back to top</a>
139
</footer>
140
</body>
141
</html>