denizk0461/pages
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

main page shenanigans; added dateUpdate attribute to blog posts; updated banner to display them

Browse Source
This commit is contained in:
denizk0461
2026-04-02 15:50:30 +02:00
parent 3484efc498
commit f932793b62
6 changed files with 97 additions and 71 deletions
Download Patch File Download Diff File Expand all files Collapse all files

107
src/routes/+page.svelte
View File

@@ -98,39 +98,43 @@
<hr>
<div>
<div class="split-intro-container">
<div>
<img class="me-img pixelated-img" src="me.webp" alt="Pixelated mirror selfie of the website creator wearing a green shirt, fitting the website theme. The face is obscured." title="hi!">
<img class="me-img pixelated-img" src="me.webp" alt="Pixelated mirror selfie of the website creator wearing a green shirt, fitting the website theme. The face is obscured." title="hi!">
<p>Hi! I'm Deniz. Welcome to my website! I keep rewriting this introduction but I'm REALLY bad at this type of stuff.</p>
<p>I made this website because I really don't like modern social media and I wanted a more creative way of expressing myself without giving in to the attention economy or submitting all my data including my soul to some megacorp. That's why you'll find a bunch of stuff here that interests me: programming, gamedev, 3D modelling, electronic music, drawing, electronics and microcontroller programming, Linux and self-hosting, and probably some other stuff too. I am currently developing at least one game and I am also posting random things on my blog, both of which you can find linked above and below.</p>
<p>I listen to A LOT of music (fav artists: <a href="https://acloudyskye.bandcamp.com/">acloudyskye</a>, <a href="https://jaronsteele.bandcamp.com/">Jaron</a>, <a href="https://janeremover.bandcamp.com/">Jane Remover</a>) and I enjoy dabbling around in <a href="https://godotengine.org/">Godot</a> and <a href="https://blender.org/">Blender</a>. I also use <a href="https://fedoraproject.org/">Fedora KDE</a>... btw. Want to know more about me and this website? Firstly, <i>why?</i> But also, <a href="/meta/about">here</a>!</p>
<p>irl I am from 🇩🇪 Northern Germany and studying to become a secondary school teacher.</p>
</div>
<p>Hi! I'm Deniz. Welcome to my website! I keep rewriting this introduction but I'm REALLY bad at this type of stuff.</p>
<p>I made this website because I really don't like modern social media and I wanted a more creative way of expressing myself without giving in to the attention economy or submitting all my data including my soul to some megacorp. That's why you'll find a bunch of stuff here that interests me: programming, gamedev, 3D modelling, electronic music, drawing, electronics and microcontroller programming, Linux and self-hosting, and probably some other stuff too. I am currently developing at least one game and I am also posting random things on my blog, both of which you can find linked above and below.</p>
<p>I listen to A LOT of music (fav artists: <a href="https://acloudyskye.bandcamp.com/">acloudyskye</a>, <a href="https://jaronsteele.bandcamp.com/">Jaron</a>, <a href="https://janeremover.bandcamp.com/">Jane Remover</a>) and I enjoy dabbling around in <a href="https://godotengine.org/">Godot</a> and <a href="https://blender.org/">Blender</a>. I also use <a href="https://fedoraproject.org/">Fedora KDE</a>... btw. Want to know more about me and this website? Firstly, <i>why?</i> But also, <a href="/meta/about">here</a>!</p>
<p>irl I am from 🇩🇪 Northern Germany and studying to become a secondary school teacher.</p>
</div>
<div class="split-container">
<div class="meta-vertical-container">
<div class="meta-container info-container">
<a class="status-header-link" href="/"><h4 class="update-header">latest status</h4></a>
<p class="status-content">{latestStatusContent}</p>
<span class="status-timestamp">:: {latestStatusTimestamp}</span>
</div>
<div class="meta-container info-container">
<h4 class="update-header">heads-up</h4>
<div>
<div class="sidebox-container">
<h4 class="sidebox-header">heads-up</h4>
<p>This website works best on Firefox and other Gecko-based browsers! All pages <i>should</i> be responsive and work on mobile.</p>
<hr>
<a class="sidebox-header-link" href="/"><h4 class="sidebox-header">latest status</h4></a>
<p class="status-content">"{latestStatusContent}"</p>
<span class="status-timestamp">:: {latestStatusTimestamp}</span>
<!-- <hr>
<a class="sidebox-header-link" href="/meta/updates"><h4 class="sidebox-header">website updates <span class="small-supertext">(new!)</span></h4></a>
{#each updateEntriesTrimmed as entry}
<UpdateEntry {entry} />
{/each} -->
</div>
</div>
<div class="meta-container update-container">
<a class="update-header-link" href="/meta/updates"><h4 class="update-header">website updates <span class="small-supertext">(new!)</span></h4></a>
{#each updateEntriesTrimmed as entry}
<UpdateEntry {entry} />
{/each}
</div>
</div>
<hr>
<GalleryRow entries={galleryTopRow} />
<GalleryRow entries={galleryBottomRow} />
<hr>
<div class="split-container">
<div class="webring-container">
@@ -174,6 +178,11 @@
</Content>
<style>
.split-intro-container {
display: grid;
grid-template-columns: 3fr 1fr;
}
.split-container {
width: 100%;
display: flex;
@@ -219,36 +228,24 @@
margin-right: 12px;
}
.meta-vertical-container {
flex: 3;
display: flex;
flex-direction: column;
gap: 8px;
}
.meta-container {
.sidebox-container {
padding: 8px 24px;
backdrop-filter: blur(var(--blur-radius-background));
border-width: var(--border-dash-size);
border-style: var(--border-style);
border-color: var(--color-highlight-alt);
/* transition: border-radius var(--duration-animation) var(--anim-curve); */
/* border-radius: var(--border-radius); */
}
.info-container {
.sidebox-container hr {
border-color: var(--color-highlight-alt);
}
.info-container p, .info-container a {
font-size: 1.0rem;
line-height: 1.4rem;
}
.info-container > h4 {
color: var(--color-highlight-alt);
margin: 16px 0;
}
.update-container {
border-color: var(--color-highlight);
flex: 4;
.sidebox-container p, .sidebox-container a {
font-size: 0.9rem;
line-height: 1.3rem;
}
.status-content {
@@ -278,29 +275,25 @@
padding-bottom: 16px;
}
.update-header-link, .status-header-link {
.sidebox-header {
font-size: 1.0rem;
line-height: 1.0rem;
margin-top: 8px;
color: var(--color-highlight-alt);
}
.sidebox-header-link {
text-decoration: none;
}
.update-header-link:hover {
text-decoration-color: var(--color-highlight);
}
.status-header-link:hover {
.sidebox-header-link:hover {
text-decoration-color: var(--color-highlight-alt);
}
.update-header-link:hover, .status-header-link:hover {
.sidebox-header-link:hover {
text-decoration-line: underline;
text-decoration-style: dashed;
text-decoration-thickness: var(--border-dash-size);
}
.status-header-link .update-header {
color: var(--color-highlight-alt);
}
.update-header {
margin-top: 8px;
}
.gradient-title {
background: linear-gradient(
90deg,