aboutsummaryrefslogtreecommitdiff
path: root/src
diff options
context:
space:
mode:
Diffstat (limited to 'src')
-rw-r--r--src/lib/component/About.svelte4
-rw-r--r--src/lib/component/Blog.svelte8
-rw-r--r--src/lib/component/CV.svelte2
-rw-r--r--src/lib/component/Music.svelte18
-rw-r--r--src/lib/component/MyMusic.svelte18
-rw-r--r--src/lib/component/Project.svelte6
-rw-r--r--src/lib/component/Remarks.svelte7
-rw-r--r--src/lib/component/Social.svelte12
-rw-r--r--src/lib/component/Support.svelte3
-rw-r--r--src/routes/+layout.svelte3
10 files changed, 50 insertions, 31 deletions
diff --git a/src/lib/component/About.svelte b/src/lib/component/About.svelte
index 94f1eba..d4c3cc9 100644
--- a/src/lib/component/About.svelte
+++ b/src/lib/component/About.svelte
@@ -21,8 +21,8 @@
"/images/netopwibby/15.jpg"
];
- let about = "";
- let selfie = "";
+ let about = $state("");
+ let selfie = $state("");
//// function
function randomPortrait() {
diff --git a/src/lib/component/Blog.svelte b/src/lib/component/Blog.svelte
index 95b7102..ee81c5b 100644
--- a/src/lib/component/Blog.svelte
+++ b/src/lib/component/Blog.svelte
@@ -1,6 +1,8 @@
<script lang="ts">
/*** STATE -------------------------------------------- ***/
const memos = [
+ "WM-099.txt",
+ "WM-098.txt",
"WM-097.txt",
"WM-096.txt",
"WM-095.txt",
@@ -100,8 +102,8 @@
"WM-001.txt"
];
- let selectedMemo: string;
- let selectedMemoContent: string;
+ let selectedMemo: string = $state("");
+ let selectedMemoContent: string = $state("");
/*** HELPER ------------------------------------------- ***/
function processMemo(filename: string): string {
@@ -241,7 +243,7 @@
<ul>
{#each memos as memo}
<li class:active={selectedMemo === memo}>
- <button on:click={() => showMemo(memo)}>{@html processMemo(memo)}</button>
+ <button onclick={() => showMemo(memo)}>{@html processMemo(memo)}</button>
{#if selectedMemo === memo}
<div class="content">
diff --git a/src/lib/component/CV.svelte b/src/lib/component/CV.svelte
index b24d2cf..50d31ab 100644
--- a/src/lib/component/CV.svelte
+++ b/src/lib/component/CV.svelte
@@ -3,7 +3,7 @@
import { onMount } from "svelte";
//// var
- let cv = "";
+ let cv = $state("");
//// function
async function showContent() {
diff --git a/src/lib/component/Music.svelte b/src/lib/component/Music.svelte
index 01b731a..d4cdff8 100644
--- a/src/lib/component/Music.svelte
+++ b/src/lib/component/Music.svelte
@@ -244,7 +244,7 @@
},
];
- let activeRelease: string;
+ let activeRelease: string = $state("");
</script>
<style lang="scss">
@@ -336,16 +336,24 @@
<li>
<button
class:active={activeRelease === release.id}
- on:click={() => activeRelease === release.id ? activeRelease = "" : activeRelease = release.id}>{release.title} by {release.by}</button>
+ onclick={() => activeRelease === release.id ? activeRelease = "" : activeRelease = release.id}>{release.title} by {release.by}</button>
{#if activeRelease === release.id}
<div class="player">
<img alt={release.title + " art"} src={"/images/bandcamp/" + release.id + ".jpg"}/>
- <!-- svelte-ignore a11y-missing-attribute -->
+ <!-- svelte-ignore a11y_missing_attribute -->
{#if release.type === "album"}
- <iframe style="height: 300px;" src="https://bandcamp.com/EmbeddedPlayer/album={release.id}/size=large/bgcol=ffffff/linkcol=333333/artwork=none/transparent=true/" seamless></iframe>
+ <iframe
+ seamless
+ src="https://bandcamp.com/EmbeddedPlayer/album={release.id}/size=large/bgcol=ffffff/linkcol=333333/artwork=none/transparent=true/"
+ style="height: 300px;"
+ title={release.title}></iframe>
{:else}
- <iframe style="height: 42px;" src="https://bandcamp.com/EmbeddedPlayer/track={release.id}/size=small/bgcol=ffffff/linkcol=333333/artwork=none/transparent=true/" seamless></iframe>
+ <iframe
+ seamless
+ src="https://bandcamp.com/EmbeddedPlayer/track={release.id}/size=small/bgcol=ffffff/linkcol=333333/artwork=none/transparent=true/"
+ style="height: 42px;"
+ title={release.title}></iframe>
{/if}
</div>
{/if}
diff --git a/src/lib/component/MyMusic.svelte b/src/lib/component/MyMusic.svelte
index aed9098..dd3758a 100644
--- a/src/lib/component/MyMusic.svelte
+++ b/src/lib/component/MyMusic.svelte
@@ -63,7 +63,7 @@
}
];
- let activeRelease = "3091487133";
+ let activeRelease = $state("3091487133");
</script>
<style lang="scss">
@@ -155,16 +155,24 @@
<li>
<button
class:active={activeRelease === release.id}
- on:click={() => activeRelease === release.id ? activeRelease = "" : activeRelease = release.id}>{release.title} by {release.by}</button>
+ onclick={() => activeRelease === release.id ? activeRelease = "" : activeRelease = release.id}>{release.title} by {release.by}</button>
{#if activeRelease === release.id}
<div class="player">
<img alt={release.title + " art"} src={"/images/bandcamp/" + release.id + ".jpg"}/>
- <!-- svelte-ignore a11y-missing-attribute -->
+ <!-- svelte-ignore a11y_missing_attribute -->
{#if release.type === "album"}
- <iframe style="height: 300px;" src="https://bandcamp.com/EmbeddedPlayer/album={release.id}/size=large/bgcol=ffffff/linkcol=333333/artwork=none/transparent=true/" seamless></iframe>
+ <iframe
+ seamless
+ src="https://bandcamp.com/EmbeddedPlayer/album={release.id}/size=large/bgcol=ffffff/linkcol=333333/artwork=none/transparent=true/"
+ style="height: 300px;"
+ title={release.title}></iframe>
{:else}
- <iframe style="height: 42px;" src="https://bandcamp.com/EmbeddedPlayer/track={release.id}/size=small/bgcol=ffffff/linkcol=333333/artwork=none/transparent=true/" seamless></iframe>
+ <iframe
+ seamless
+ src="https://bandcamp.com/EmbeddedPlayer/track={release.id}/size=small/bgcol=ffffff/linkcol=333333/artwork=none/transparent=true/"
+ style="height: 42px;"
+ title={release.title}></iframe>
{/if}
</div>
{/if}
diff --git a/src/lib/component/Project.svelte b/src/lib/component/Project.svelte
index c27b1d4..0f2e47d 100644
--- a/src/lib/component/Project.svelte
+++ b/src/lib/component/Project.svelte
@@ -105,7 +105,7 @@
}
];
- let activeProject = "011";
+ let activeProject = $state("011");
</script>
<style lang="scss">
@@ -220,7 +220,7 @@
<li>
<button
class:active={activeProject === project.id}
- on:click={() => activeProject === project.id ? activeProject = "" : activeProject = project.id}>{project.title} &middot; {project.tagline}</button>
+ onclick={() => activeProject === project.id ? activeProject = "" : activeProject = project.id}>{project.title} &middot; {project.tagline}</button>
{#if activeProject === project.id}
<div class="player">
@@ -229,7 +229,7 @@
{#each project.media as mediaItem}
{#if videoRegex.test(mediaItem)}
<figure>
- <!-- svelte-ignore a11y-media-has-caption -->
+ <!-- svelte-ignore a11y_media_has_caption -->
<video controls>
<source src={mediaItem}/>
</video>
diff --git a/src/lib/component/Remarks.svelte b/src/lib/component/Remarks.svelte
index 6f88210..7db972c 100644
--- a/src/lib/component/Remarks.svelte
+++ b/src/lib/component/Remarks.svelte
@@ -1,6 +1,7 @@
<script lang="ts">
/*** STATE -------------------------------------------- ***/
const remarks = [
+ "WR-026.txt",
"WR-025.txt",
"WR-024.txt",
"WR-023.txt",
@@ -28,8 +29,8 @@
"WR-001.txt"
];
- let selectedRemark: string;
- let selectedRemarkContent: string;
+ let selectedRemark: string = $state("");
+ let selectedRemarkContent: string = $state("");
/*** HELPER ------------------------------------------- ***/
function processNote(filename: string): string {
@@ -169,7 +170,7 @@
<ul>
{#each remarks as remark}
<li class:active={selectedRemark === remark}>
- <button on:click={() => showNote(remark)}>{@html processNote(remark)}</button>
+ <button onclick={() => showNote(remark)}>{@html processNote(remark)}</button>
{#if selectedRemark === remark}
<div class="content">
diff --git a/src/lib/component/Social.svelte b/src/lib/component/Social.svelte
index 1e469eb..ee15a1a 100644
--- a/src/lib/component/Social.svelte
+++ b/src/lib/component/Social.svelte
@@ -5,11 +5,11 @@
//// var
const videoRegex = /\.(mp4|mov|avi|wmv|flv|mkv|webm|m4v)$/i;
- let mastodonLoaded = false;
- let mastodonPostContent = "";
- let mastodonPostDate = "";
- let mastodonPostLink = "";
- let mastodonPostMedia: string[] = [];
+ let mastodonLoaded = $state(false);
+ let mastodonPostContent = $state("");
+ let mastodonPostDate = $state("");
+ let mastodonPostLink = $state("");
+ let mastodonPostMedia: string[] = $state([]);
//// function
async function mastodon() {
@@ -85,7 +85,7 @@
<div class="media">
{#each mastodonPostMedia as media}
{#if videoRegex.test(media)}
- <!-- svelte-ignore a11y-media-has-caption -->
+ <!-- svelte-ignore a11y_media_has_caption -->
<video controls>
<source src={media}/>
</video>
diff --git a/src/lib/component/Support.svelte b/src/lib/component/Support.svelte
index ceff0fd..a5bc48f 100644
--- a/src/lib/component/Support.svelte
+++ b/src/lib/component/Support.svelte
@@ -1,5 +1,4 @@
-<script lang="ts">
-</script>
+<script lang="ts"></script>
<style lang="scss">
h2 {
diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte
index be635e8..5b4df0c 100644
--- a/src/routes/+layout.svelte
+++ b/src/routes/+layout.svelte
@@ -8,6 +8,7 @@
//// var
const scrollControl = createScrollPreventer();
+ let { children } = $props();
//// function
function horizontalScroll(event: WheelEvent): void {
@@ -125,7 +126,7 @@
</style>
<div>
- <slot></slot>
+ {@render children()}
</div>
<aside>