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

View File

@@ -31,6 +31,7 @@
<h6>Meta</h6>
<a href="/meta/about">About</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="/meta/privacy">Privacy & Cookies</a>
</div>

View File

@@ -5,13 +5,13 @@
import { posts as devlogPosts } from "./projects/projectn5/devlog/posts";
import { posts as blogPosts } from "./blog/posts";
import { entries as changelogEntries } from "./changelog/changelog";
import ChangelogEntry from "$lib/components/changelog-entry.svelte";
import { entries as updateEntries } from "./meta/updates/updates";
import UpdateEntry from "$lib/components/update-entry.svelte";
let latestDevlogDate = devlogPosts[0].post.date;
let latestBlogDate = blogPosts[0].post.date;
let changelogEntriesTrimmed = changelogEntries.slice(0, 3);
let updateEntriesTrimmed = updateEntries.slice(0, 3);
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>
</div>
<div class="changelog-container">
<a class="changelog-header-link" href="/changelog"><h6 class="changelog-header">website changelog <span class="small-supertext">(new!)</span></h6></a>
{#each changelogEntriesTrimmed as entry}
<ChangelogEntry {entry} />
<div class="update-container">
<a class="update-header-link" href="/meta/updates"><h6 class="update-header">website updates <span class="small-supertext">(new!)</span></h6></a>
{#each updateEntriesTrimmed as entry}
<UpdateEntry {entry} />
{/each}
</div>
@@ -116,20 +116,20 @@
margin-right: 12px;
}
.changelog-container {
.update-container {
padding: 8px 24px;
border: var(--border-dash-size) var(--color-highlight) dashed;
backdrop-filter: blur(var(--blur-radius-background));
}
.changelog-header-link {
.update-header-link {
text-decoration: none;
}
.changelog-header-link:hover {
.update-header-link:hover {
text-decoration: underline dashed var(--border-dash-size) var(--color-highlight);
}
.changelog-header {
.update-header {
margin-top: 8px;
}

View File

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