renamed changelog to updates and moved link

This commit is contained in:
2026-02-16 18:19:46 +01:00
parent f5c8aba740
commit 669a5f95d0
5 changed files with 34 additions and 33 deletions

View File

@@ -1,5 +1,5 @@
<script lang="ts"> <script lang="ts">
export interface ChangelogEntry { export interface UpdateEntry {
date: string; date: string;
time: string; time: string;
@@ -10,48 +10,48 @@
let { let {
entry, entry,
}: { }: {
entry: ChangelogEntry; entry: UpdateEntry;
} = $props(); } = $props();
</script> </script>
<div class="changelog-entry"> <div class="update-entry">
<div class="changelog-entry-timestamp-container"> <div class="update-entry-timestamp-container">
<span>{entry.date}</span> <span>{entry.date}</span>
<span class="changelog-entry-timestamp-comma">,&nbsp;</span> <span class="update-entry-timestamp-comma">,&nbsp;</span>
<span>{entry.time}</span> <span>{entry.time}</span>
</div> </div>
<span class="changelog-entry-timestamp-divider">::</span> <span class="update-entry-timestamp-divider">::</span>
<p> <p>
{entry.content} {entry.content}
{#if entry.link} {#if entry.link}
<a class="changelog-entry-link" href="{entry.link}">»</a> <a class="update-entry-link" href="{entry.link}">»</a>
{/if} {/if}
</p> </p>
</div> </div>
<style> <style>
.changelog-entry * { .update-entry * {
margin: 0; margin: 0;
} }
.changelog-entry { .update-entry {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
gap: 8px; gap: 8px;
margin: 4px 0; margin: 4px 0;
} }
.changelog-entry p { .update-entry p {
font-size: 1.0rem; font-size: 1.0rem;
line-height: 1.3rem; line-height: 1.3rem;
} }
.changelog-entry-timestamp-container { .update-entry-timestamp-container {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
} }
.changelog-entry-timestamp-container *, .changelog-entry-timestamp-divider { .update-entry-timestamp-container *, .update-entry-timestamp-divider {
font-family: var(--font-mono); font-family: var(--font-mono);
font-size: 0.8rem; font-size: 0.8rem;
line-height: 1.3rem; line-height: 1.3rem;
@@ -60,7 +60,7 @@
min-width: fit-content; min-width: fit-content;
} }
.changelog-entry-link { .update-entry-link {
font-family: var(--font-mono); font-family: var(--font-mono);
font-size: 1.2rem; font-size: 1.2rem;
color: var(--color-highlight); color: var(--color-highlight);
@@ -68,19 +68,19 @@
line-height: 1.3rem; line-height: 1.3rem;
} }
.changelog-entry-link:hover { .update-entry-link:hover {
font-weight: 700; font-weight: 700;
} }
@media screen and (max-width: 550px) { @media screen and (max-width: 550px) {
/* Align timestamp texts vertically */ /* Align timestamp texts vertically */
.changelog-entry-timestamp-container { .update-entry-timestamp-container {
flex-direction: column; flex-direction: column;
align-items: end; align-items: end;
} }
/* Hide separating comma */ /* Hide separating comma */
.changelog-entry-timestamp-comma { .update-entry-timestamp-comma {
display: none; display: none;
} }
} }

View File

@@ -31,6 +31,7 @@
<h6>Meta</h6> <h6>Meta</h6>
<a href="/meta/about">About</a> <a href="/meta/about">About</a>
<a href="/meta/feeds">Feeds</a> <a href="/meta/feeds">Feeds</a>
<a href="/meta/updates">Updates</a>
<a href="https://code.denizk0461.dev/denizk0461/pages">Page Source</a> <a href="https://code.denizk0461.dev/denizk0461/pages">Page Source</a>
<a href="/meta/privacy">Privacy & Cookies</a> <a href="/meta/privacy">Privacy & Cookies</a>
</div> </div>

View File

@@ -5,13 +5,13 @@
import { posts as devlogPosts } from "./projects/projectn5/devlog/posts"; import { posts as devlogPosts } from "./projects/projectn5/devlog/posts";
import { posts as blogPosts } from "./blog/posts"; import { posts as blogPosts } from "./blog/posts";
import { entries as changelogEntries } from "./changelog/changelog"; import { entries as updateEntries } from "./meta/updates/updates";
import ChangelogEntry from "$lib/components/changelog-entry.svelte"; import UpdateEntry from "$lib/components/update-entry.svelte";
let latestDevlogDate = devlogPosts[0].post.date; let latestDevlogDate = devlogPosts[0].post.date;
let latestBlogDate = blogPosts[0].post.date; let latestBlogDate = blogPosts[0].post.date;
let changelogEntriesTrimmed = changelogEntries.slice(0, 3); let updateEntriesTrimmed = updateEntries.slice(0, 3);
const galleryTopRow: GalleryRowEntry[] = [ const galleryTopRow: GalleryRowEntry[] = [
{ {
@@ -72,10 +72,10 @@
<p>This place is a constant work-in-progress while I try to keep URLs intact, a lot of stuff is being modified and moved around! I'm also adding new things and seeing which things I enjoy maintaining. If anything's outright <a href="/blog/2026/0131">broken</a>, please do let me know.</p> <p>This place is a constant work-in-progress while I try to keep URLs intact, a lot of stuff is being modified and moved around! I'm also adding new things and seeing which things I enjoy maintaining. If anything's outright <a href="/blog/2026/0131">broken</a>, please do let me know.</p>
</div> </div>
<div class="changelog-container"> <div class="update-container">
<a class="changelog-header-link" href="/changelog"><h6 class="changelog-header">website changelog <span class="small-supertext">(new!)</span></h6></a> <a class="update-header-link" href="/meta/updates"><h6 class="update-header">website updates <span class="small-supertext">(new!)</span></h6></a>
{#each changelogEntriesTrimmed as entry} {#each updateEntriesTrimmed as entry}
<ChangelogEntry {entry} /> <UpdateEntry {entry} />
{/each} {/each}
</div> </div>
@@ -116,20 +116,20 @@
margin-right: 12px; margin-right: 12px;
} }
.changelog-container { .update-container {
padding: 8px 24px; padding: 8px 24px;
border: var(--border-dash-size) var(--color-highlight) dashed; border: var(--border-dash-size) var(--color-highlight) dashed;
backdrop-filter: blur(var(--blur-radius-background)); backdrop-filter: blur(var(--blur-radius-background));
} }
.changelog-header-link { .update-header-link {
text-decoration: none; text-decoration: none;
} }
.changelog-header-link:hover { .update-header-link:hover {
text-decoration: underline dashed var(--border-dash-size) var(--color-highlight); text-decoration: underline dashed var(--border-dash-size) var(--color-highlight);
} }
.changelog-header { .update-header {
margin-top: 8px; margin-top: 8px;
} }

View File

@@ -1,17 +1,17 @@
<script lang="ts"> <script lang="ts">
import Banner2 from "$lib/banner2.svelte"; import Banner2 from "$lib/banner2.svelte";
import Content from "$lib/viewport/content.svelte"; import Content from "$lib/viewport/content.svelte";
import { entries } from "./changelog"; import { entries } from "./updates";
import ChangelogEntry from "$lib/components/changelog-entry.svelte"; import ChangelogEntry from "$lib/components/update-entry.svelte";
</script> </script>
<svelte:head> <svelte:head>
<title>Changelog | denizk0461</title> <title>Website Updates | denizk0461</title>
</svelte:head> </svelte:head>
<Content> <Content>
<Banner2 <Banner2
title="Website Changelog" /> title="Website Updates" />
<div> <div>
{#each entries as entry} {#each entries as entry}

View File

@@ -1,6 +1,6 @@
import { type ChangelogEntry } from "$lib/components/changelog-entry.svelte"; import { type UpdateEntry } from "$lib/components/update-entry.svelte";
export const entries: ChangelogEntry[] = [ export const entries: UpdateEntry[] = [
{ {
date: "2026-02-06", date: "2026-02-06",
time: "18:47", time: "18:47",