cannorin/cannorin.net
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add /music and /dev (3)

Browse Source
This commit is contained in:
cannorin
2025-02-08 16:59:17 +09:00
parent 9f0c0cdbff
commit 27a05e56d4
6 changed files with 71 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
apps/web/src/app.css
View File

@@ -47,6 +47,6 @@
@apply border-border;
}
body {
@apply bg-background text-foreground min-h-screen flex flex-col justify-normal;
@apply bg-background text-foreground min-h-screen;
}
}

14
apps/web/src/routes/dev/+page.svelte
View File

@@ -14,7 +14,7 @@ import Card from "./card.svelte";
<section class="flex flex-col items-center md:flex-row md:items-start gap-4 lg:gap-8">
<h2 class="sr-only">自己紹介</h2>
<Card more="back" />
<Card class="md:!sticky md:top-16" more="back" />
<section class="p-5 prose prose-sm prose-light">
<p>
@@ -73,6 +73,18 @@ import Card from "./card.svelte";
</li>
</ul>
<h3 id="contact">連絡先</h3>
<ul>
<li>チューターやバグ修正など、カジュアルな案件は <a href="https://github.com/sponsors/cannorin" target="_blank">GitHub Sponsors</a> をご利用ください。</li>
<li>
ウェブサイト構築など、大規模な案件についてのご連絡は <a href="https://keybase.io/cannorin" target="_blank">Keybase</a>,
<a href="https://discord.com/users/497190979216867329" target="_blank">Discord</a>,
または contact(atmark)cannorin.net までお願いします。
</li>
<li>なお、現在特に転職の予定はありません。</li>
</ul>
<a href="/" class="back mt-8 text-foreground no-underline font-normal">
Back
</a>

5
apps/web/src/routes/dev/card.svelte
View File

@@ -1,5 +1,6 @@
<script lang="ts">
import Card, { type CardProps } from "$components/card.svelte";
import { cn } from "$lib/utils";
import IconTapl from "$assets/images/static/icon/tapl.webp?w=1080;800;600;400;300&enhanced";
@@ -7,10 +8,10 @@ import SiGithub from "@icons-pack/svelte-simple-icons/icons/SiGithub";
import SiQiita from "@icons-pack/svelte-simple-icons/icons/SiQiita";
import SiZenn from "@icons-pack/svelte-simple-icons/icons/SiZenn";
let { more }: Pick<CardProps, "more"> = $props();
let { more, ...rest }: Pick<CardProps, "more" | "class"> = $props();
</script>
<Card image={IconTapl} more={more} class="[view-transition-name:card-dev]">
<Card image={IconTapl} more={more} class={cn("[view-transition-name:card-dev]", rest["class"])}>
{#snippet title()}
Developer
{/snippet}

5
apps/web/src/routes/math/card.svelte
View File

@@ -1,15 +1,16 @@
<script lang="ts">
import Card, { type CardProps } from "$components/card.svelte";
import { cn } from "$lib/utils";
import IconLogic from "$assets/images/static/icon/logic-chang.webp?w=1080;800;600;400;300&enhanced";
import SiOrcid from "@icons-pack/svelte-simple-icons/icons/SiOrcid";
import SiResearchgate from "@icons-pack/svelte-simple-icons/icons/SiResearchgate";
let { more }: Pick<CardProps, "more"> = $props();
let { more, ...rest }: Pick<CardProps, "more" | "class"> = $props();
</script>
<Card image={IconLogic} more={more} class="[view-transition-name:card-math]">
<Card image={IconLogic} more={more} class={cn("[view-transition-name:card-math]", rest["class"])}>
{#snippet title()}
Graduate Student
{/snippet}

54
apps/web/src/routes/music/+page.svelte
View File

@@ -14,20 +14,53 @@ import Card from "./card.svelte";
<section class="flex flex-col items-center md:flex-row md:items-start gap-4 lg:gap-8">
<h2 class="sr-only">自己紹介</h2>
<Card more="back" />
<Card class="md:!sticky md:top-16" more="back" />
<section class="p-5 prose prose-sm prose-light">
<p>ブレイクビーツと高速四つ打ちがメインです。以下のような雰囲気の DJ が得意です。</p>
<p>ブレイクビーツと高速四つ打ちを中心に、統一感と説得力のあるマルチジャンルプレイをする DJ です。</p>
<p>以下のような雰囲気の DJ が得意です。</p>
<ul>
<li><em>Atmospheric:</em> DnB, Jungle, Trance, IDM, ...</li>
<li><em>Aggressive:</em> Crossbreed, Breakcore, Speedcore, ...</li>
<li><em>Industrial:</em> Frenchcore, Schranz, Doomcore, ...</li>
<li><em>Peak-time Hardcore:</em> Hardstyle, J-Core, Uptempo, ...</li>
<li>
<strong class="text-primary">Atmospheric</strong>
<ul>
<li>Drum & Bass, Jungle, Trance, Techno, IDM, ...</li>
<li>ワイヤードな世界観で緻密にミックスします。</li>
</ul>
</li>
<li>
<strong class="text-primary">Aggressive</strong>
<ul>
<li>Crossbreed, Neurofunk, Breakcore, Speedcore, ...</li>
<li>鬱屈とした心から湧き上がる冷たい衝動をぶつけます。</li>
</ul>
</li>
<li>
<strong class="text-primary">Peak-time Hardcore</strong>
<ul>
<li>Frenchcore, Rawstyle, J-Core, Uptempo Hardcore, ...</li>
<li>私のハードコアは "予習" 無しで楽しめます。</li>
</ul>
</li>
</ul>
<p>作る曲もだいたいこのへんのジャンルです。</p>
<h3 id="gears">使用機材・ソフトウェア</h3>
<p>普段の DJ の際は、以下の機材を持ち込んでいます。あまりサイズは取りませんが、ブースに置くスペースがあるとうれしいです。なお、CDJ + USB のオーソドックスなプレイもできます。</p>
<ul>
<li><a href="https://www.allen-heath.com/hardware/xone-series/xonek2/" target="_blank">Allen & Heath Xone:K2</a> (4ch MIDI コントローラ)</li>
<li><a href="https://evo.audio/products/audio-interfaces/evo-4/overview/" target="_blank"> Audient EVO 4</a> (AIF, フォンから RCA に変換)</li>
<li><a href="https://mixxx.org/" target="_blank">Mixxx</a> (DJ ソフトウェア)</li>
<li><a href="https://www.audio-technica.co.jp/product/ATH-M50x" target="_blank">audio-technica ATH-M50x</a></li>
<li>オヤイデ d+ classB RCA ケーブル</li>
<li>ノートPC</li>
</ul>
<p>作曲には Ableton Live を使用しています。</p>
<h3 id="affiliation">主宰・所属</h3>
<ul>
@@ -68,6 +101,15 @@ import Card from "./card.svelte";
</li>
</ul>
<h3 id="contact">連絡先</h3>
<p>
ブッキングや音楽制作などのご連絡は
<a href="https://discord.com/users/497190979216867329" target="_blank">Discord</a>,
<a href="https://x.com/cannorin3" target="_blank">Twitter (X)</a>,
または contact(atmark)cannorin.net までお願いします。
</p>
<a href="/" class="back mt-8 text-foreground no-underline font-normal">
Back
</a>

5
apps/web/src/routes/music/card.svelte
View File

@@ -1,5 +1,6 @@
<script lang="ts">
import Card, { type CardProps } from "$components/card.svelte";
import { cn } from "$lib/utils";
import IconJakeko from "$assets/images/static/icon/jakeko.webp?w=1080;800;600;400;300&enhanced";
@@ -7,10 +8,10 @@ import SiBandcamp from "@icons-pack/svelte-simple-icons/icons/SiBandcamp";
import SiMixcloud from "@icons-pack/svelte-simple-icons/icons/SiMixcloud";
import SiSoundcloud from "@icons-pack/svelte-simple-icons/icons/SiSoundcloud";
let { more }: Pick<CardProps, "more"> = $props();
let { more, ...rest }: Pick<CardProps, "more" | "class"> = $props();
</script>
<Card image={IconJakeko} more={more} class="[view-transition-name:card-music]">
<Card image={IconJakeko} more={more} class={cn("[view-transition-name:card-music]", rest["class"])}>
{#snippet title()}
DJ / Composer
{/snippet}