From 2f5f4dbea47fc616bc7543345389ff060c7c9120 Mon Sep 17 00:00:00 2001 From: Dan Date: Sat, 13 Dec 2025 15:17:46 +0000 Subject: [PATCH] Mostly audio stuff --- archetypes/default.md | 2 +- assets/js/commands/navigation.js | 17 +- assets/js/pages/audio.js | 58 +++ assets/js/terminal.js | 8 +- assets/sass/_mixins.scss | 31 ++ assets/sass/_normalize.scss | 404 ++++++++++-------- assets/sass/pages/audio.scss | 224 +++++++++- assets/sass/style.scss | 14 +- content/audio/currently.md | 15 + content/audio/{_index.md => index.md} | 4 +- content/audio/intro.md | 16 + content/gear/cvj-vivian/index.md | 8 + content/gear/fiio-ft-1/index.md | 1 + content/gear/hiby-r4-eva/index.md | 3 +- .../index.md | 1 + content/media/neon-odin-allfather/index.md | 12 +- .../ninajirachi-i-love-my-computer/index.md | 12 + content/updates/2025-12-08-homepage.md | 8 + content/updates/2025-12-09-about.md | 8 + content/updates/2025-12-13-album-reviews.md | 8 + content/updates/2025-12-13-music.md | 8 + layouts/audio/list.html | 75 ---- layouts/audio/single.html | 190 ++++---- layouts/index.html | 24 +- layouts/now/single.html | 301 +------------ layouts/partials/elements/lavalamp.html | 2 +- layouts/partials/site-footer.html | 4 - new.sh | 63 ++- 28 files changed, 811 insertions(+), 710 deletions(-) create mode 100644 content/audio/currently.md rename content/audio/{_index.md => index.md} (56%) create mode 100644 content/audio/intro.md create mode 100644 content/gear/cvj-vivian/index.md create mode 100644 content/updates/2025-12-08-homepage.md create mode 100644 content/updates/2025-12-09-about.md create mode 100644 content/updates/2025-12-13-album-reviews.md create mode 100644 content/updates/2025-12-13-music.md delete mode 100644 layouts/audio/list.html diff --git a/archetypes/default.md b/archetypes/default.md index a78dcc2..7eb01c5 100644 --- a/archetypes/default.md +++ b/archetypes/default.md @@ -1,6 +1,6 @@ --- title: "{{ replace .TranslationBaseName "-" " " | title }}" -date: {{ .Date.Format "2006-01-02" }} +date: {{ .Date }} tags: [] description: "" --- diff --git a/assets/js/commands/navigation.js b/assets/js/commands/navigation.js index b8031d4..a622521 100644 --- a/assets/js/commands/navigation.js +++ b/assets/js/commands/navigation.js @@ -45,17 +45,16 @@ if (window.terminal) { // PAGE NAVIGATION - window.terminal.registerCommand( - "latest", - "View the latest post, regardles of section", - () => { - let latestPostLink = document.getElementById("latest-post-link"); - window.location.href = latestPostLink.textContent; - }, - ); - // About command window.terminal.registerCommand("about", "About this site", () => { window.location.href = "/about/"; }); + + window.terminal.registerCommand( + "music", + "My music interests and audio gear", + () => { + window.location.href = "/audio/"; + }, + ); } diff --git a/assets/js/pages/audio.js b/assets/js/pages/audio.js index ee804b5..9bf40cd 100644 --- a/assets/js/pages/audio.js +++ b/assets/js/pages/audio.js @@ -19,3 +19,61 @@ if (document.getElementById("starfield")) { starfield.appendChild(star); } } + +(function () { + const container = document.querySelector(".record-shelf-container"); + + // Exit if the record shelf doesn't exist on this page + if (!container) { + return; + } + + const recordSlots = container.querySelectorAll(".record-slot"); + const albumContents = container.querySelectorAll(".album-content"); + + // Exit if we don't have the necessary elements + if (!recordSlots.length || !albumContents.length) { + return; + } + + // Set first album as active by default + const firstSlot = recordSlots[0]; + if (firstSlot) { + const firstSleeve = firstSlot.querySelector(".record-sleeve"); + if (firstSleeve) { + firstSleeve.classList.add("active"); + } + } + + recordSlots.forEach((slot) => { + slot.addEventListener("click", function (e) { + e.preventDefault(); + const index = this.getAttribute("data-album-index"); + + // Hide all content + albumContents.forEach((content) => (content.style.display = "none")); + + // Show selected content + const selectedContent = container.querySelector( + `[data-content-index="${index}"]`, + ); + if (selectedContent) { + selectedContent.style.display = "block"; + } + + // Remove active class from all sleeves + recordSlots.forEach((s) => { + const sleeve = s.querySelector(".record-sleeve"); + if (sleeve) { + sleeve.classList.remove("active"); + } + }); + + // Add active class to clicked sleeve + const clickedSleeve = this.querySelector(".record-sleeve"); + if (clickedSleeve) { + clickedSleeve.classList.add("active"); + } + }); + }); +})(); diff --git a/assets/js/terminal.js b/assets/js/terminal.js index 8fc0b2f..b865e20 100644 --- a/assets/js/terminal.js +++ b/assets/js/terminal.js @@ -61,9 +61,9 @@ class TerminalShell { latestPostDate.innerText + ")", ); - this.printHTML( - " - Type \"latest\" to view it.", - ); + // this.printHTML( + // " - Type \"latest\" to view it.", + // ); this.printHTML(" "); this.printHTML( @@ -71,7 +71,7 @@ class TerminalShell { ); this.printHTML( - 'This site is under construction. There\'s nothing of interest here yet.', + 'This site is under construction. There\'s not much of interest here yet.', ); this.inputContainer.classList.remove("hidden"); diff --git a/assets/sass/_mixins.scss b/assets/sass/_mixins.scss index 6427f27..0816b72 100644 --- a/assets/sass/_mixins.scss +++ b/assets/sass/_mixins.scss @@ -62,3 +62,34 @@ $breakpoints: ( } } } + +@mixin scrollbar-custom( + $color: greenyellow, + $width: 8px, + $track-bg: transparent +) { + scrollbar-color: $color $track-bg; + scrollbar-width: thin; + + &::-webkit-scrollbar { + width: $width; + } + + &::-webkit-scrollbar-track { + background: $track-bg; + } + + &::-webkit-scrollbar-thumb { + background-color: $color; + border-radius: calc($width / 2); + } + + &::-webkit-scrollbar-thumb:hover { + background-color: darken($color, 10%); + } +} + +// Usage +.scrollable-child { + @include scrollbar-custom(greenyellow, 10px); +} diff --git a/assets/sass/_normalize.scss b/assets/sass/_normalize.scss index ba0a4cf..df92523 100644 --- a/assets/sass/_normalize.scss +++ b/assets/sass/_normalize.scss @@ -7,249 +7,283 @@ * Use a better box model (opinionated). */ - html { - box-sizing: border-box; - } - - * { +html { + box-sizing: border-box; +} + +* { + box-sizing: inherit; + &::before, + &::after { box-sizing: inherit; - &::before, &::after { - box-sizing: inherit; - } } - - /** +} + +/** * Use a more readable tab size (opinionated). */ - - :root { - -moz-tab-size: 4; - tab-size: 4; - } - - /** + +:root { + -moz-tab-size: 4; + tab-size: 4; +} + +/** * 1. Correct the line height in all browsers. * 2. Prevent adjustments of font size after orientation changes in iOS. */ - - html { - line-height: 1.15; - /* 1 */ - -webkit-text-size-adjust: 100%; - /* 2 */ - } - - /* Sections + +html { + line-height: 1.15; + /* 1 */ + -webkit-text-size-adjust: 100%; + /* 2 */ +} + +/* Sections ========================================================================== */ - - /** + +/** * Remove the margin in all browsers. */ - - body { - margin: 0; - font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'; - } - - /** + +body { + margin: 0; + font-family: + -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, + sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; +} + +/** * Improve consistency of default fonts in all browsers. (https://github.com/sindresorhus/modern-normalize/issues/3) */ - - /* Grouping content + +/* Grouping content ========================================================================== */ - - /** + +/** * Add the correct height in Firefox. */ - - hr { - height: 0; - } - - /* Text-level semantics + +hr { + height: 0; +} + +/* Text-level semantics ========================================================================== */ - - /** + +/** * Add the correct text decoration in Chrome, Edge, and Safari. */ - - abbr[title] { - text-decoration: underline dotted; - } - - /** + +abbr[title] { + text-decoration: underline dotted; +} + +/** * Add the correct font weight in Chrome, Edge, and Safari. */ - - b, strong { - font-weight: bolder; - } - - /** + +b, +strong { + font-weight: bolder; +} + +/** * 1. Improve consistency of default fonts in all browsers. (https://github.com/sindresorhus/modern-normalize/issues/3) * 2. Correct the odd `em` font sizing in all browsers. */ - - code, kbd, samp, pre { - font-family: SFMono-Regular, Consolas, 'Liberation Mono', Menlo, Courier, monospace; - /* 1 */ - font-size: 1em; - /* 2 */ - } - - /** + +code, +kbd, +samp, +pre { + font-family: + SFMono-Regular, Consolas, "Liberation Mono", Menlo, Courier, monospace; + /* 1 */ + font-size: 1em; + /* 2 */ +} + +/** * Add the correct font size in all browsers. */ - - small { - font-size: 80%; - } - - /** + +small { + font-size: 80%; +} + +/** * Prevent `sub` and `sup` elements from affecting the line height in all browsers. */ - - sub, sup { - font-size: 75%; - line-height: 0; - position: relative; - vertical-align: baseline; - } - - sub { - bottom: -0.25em; - } - - sup { - top: -0.5em; - } - - /* Forms + +sub, +sup { + font-size: 75%; + line-height: 0; + position: relative; + vertical-align: baseline; +} + +sub { + bottom: -0.25em; +} + +sup { + top: -0.5em; +} + +/* Forms ========================================================================== */ - - /** + +/** * 1. Change the font styles in all browsers. * 2. Remove the margin in Firefox and Safari. */ - - button, input, optgroup, select, textarea { - font-family: inherit; - /* 1 */ - font-size: 100%; - /* 1 */ - line-height: 1.15; - /* 1 */ - margin: 0; - /* 2 */ - } - - /** + +button, +input, +optgroup, +select, +textarea { + font-family: inherit; + /* 1 */ + font-size: 100%; + /* 1 */ + line-height: 1.15; + /* 1 */ + margin: 0; + /* 2 */ +} + +/** * Remove the inheritance of text transform in Edge and Firefox. * 1. Remove the inheritance of text transform in Firefox. */ - - button, select { - /* 1 */ - text-transform: none; - } - - /** + +button, +select { + /* 1 */ + text-transform: none; +} + +/** * Correct the inability to style clickable types in iOS and Safari. */ - - button, [type='button'], [type='reset'], [type='submit'] { - -webkit-appearance: button; - } - - /** + +button, +[type="button"], +[type="reset"], +[type="submit"] { + -webkit-appearance: button; +} + +/** * Remove the inner border and padding in Firefox. */ - - button::-moz-focus-inner, [type='button']::-moz-focus-inner, [type='reset']::-moz-focus-inner, [type='submit']::-moz-focus-inner { - border-style: none; - padding: 0; - } - - /** + +button::-moz-focus-inner, +[type="button"]::-moz-focus-inner, +[type="reset"]::-moz-focus-inner, +[type="submit"]::-moz-focus-inner { + border-style: none; + padding: 0; +} + +/** * Restore the focus styles unset by the previous rule. */ - - button:-moz-focusring, [type='button']:-moz-focusring, [type='reset']:-moz-focusring, [type='submit']:-moz-focusring { - outline: 1px dotted ButtonText; - } - - /** + +button:-moz-focusring, +[type="button"]:-moz-focusring, +[type="reset"]:-moz-focusring, +[type="submit"]:-moz-focusring { + outline: 1px dotted ButtonText; +} + +/** * Correct the padding in Firefox. */ - - fieldset { - padding: 0.35em 0.75em 0.625em; - } - - /** + +fieldset { + padding: 0.35em 0.75em 0.625em; +} + +/** * Remove the padding so developers are not caught out when they zero out `fieldset` elements in all browsers. */ - - legend { - padding: 0; - } - - /** + +legend { + padding: 0; +} + +/** * Add the correct vertical alignment in Chrome and Firefox. */ - - progress { - vertical-align: baseline; - } - - /** + +progress { + vertical-align: baseline; +} + +/** * Correct the cursor style of increment and decrement buttons in Safari. */ - - [type='number'] { - &::-webkit-inner-spin-button, &::-webkit-outer-spin-button { - height: auto; - } + +[type="number"] { + &::-webkit-inner-spin-button, + &::-webkit-outer-spin-button { + height: auto; } - - /** +} + +/** * 1. Correct the odd appearance in Chrome and Safari. * 2. Correct the outline style in Safari. */ - - [type='search'] { - -webkit-appearance: textfield; - /* 1 */ - outline-offset: -2px; - /* 2 */ - &::-webkit-search-decoration { - -webkit-appearance: none; - } + +[type="search"] { + -webkit-appearance: textfield; + /* 1 */ + outline-offset: -2px; + /* 2 */ + &::-webkit-search-decoration { + -webkit-appearance: none; } - - /** +} + +/** * Remove the inner padding in Chrome and Safari on macOS. */ - - /** + +/** * 1. Correct the inability to style clickable types in iOS and Safari. * 2. Change font properties to `inherit` in Safari. */ - - ::-webkit-file-upload-button { - -webkit-appearance: button; - /* 1 */ - font: inherit; - /* 2 */ - } - - /* Interactive + +::-webkit-file-upload-button { + -webkit-appearance: button; + /* 1 */ + font: inherit; + /* 2 */ +} + +/* Interactive ========================================================================== */ - - /* + +/* * Add the correct display in Chrome and Safari. */ - - summary { - display: list-item; - } \ No newline at end of file + +summary { + display: list-item; +} + +p { + line-height: 1.5em; + letter-spacing: 0.01em; + word-spacing: normal; + + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; + text-rendering: optimizeLegibility; +} diff --git a/assets/sass/pages/audio.scss b/assets/sass/pages/audio.scss index 4d52009..49728fa 100644 --- a/assets/sass/pages/audio.scss +++ b/assets/sass/pages/audio.scss @@ -6,6 +6,10 @@ color: #fff; text-align: center; + a { + color: #fff; + } + > .page-content { position: absolute; left: 50%; @@ -20,7 +24,77 @@ padding-top: 400px; } - .neon-sign { + .audio-intro { + width: 100%; + margin: auto; + text-align: left; + margin-bottom: 30px; + + display: grid; + grid-template-columns: 1fr auto 1fr; + gap: 2rem; + + > div > .neon-sign { + position: relative; + top: auto; + left: auto; + right: auto; + bottom: auto; + transform: none; + margin-bottom: 40px; + + > .neon-text { + font-size: 3rem; + animation-delay: 2.5s; + line-height: 1rem; + + > span { + display: block; + position: absolute; + top: 50px; + left: 50%; + transform: rotate(110deg); + letter-spacing: -20%; + animation-delay: 2.3s; + } + } + } + + > *:nth-child(3n + 2) { + align-self: center; + font-size: 3rem; + } + + @include media-down(xl) { + width: 100%; + grid-template-columns: 1fr; + + > *:nth-child(3n + 2) { + display: none; + } + } + + ul { + margin-bottom: 2rem; + + li { + margin-left: 2rem; + } + } + + .intro-ipod { + float: left; + @include media-down(lg) { + display: none; + } + } + + p { + margin-bottom: 1rem; + } + } + + > .neon-sign { position: absolute; top: 0; left: 50%; @@ -39,11 +113,11 @@ .record-shelf-container { .shelf { display: flex; - gap: 5rem; + gap: 5%; position: relative; overflow: visible; - padding-left: 2em; - padding-right: 2em; + padding-left: 5%; + padding-right: 5%; } .shelf::before { @@ -65,10 +139,9 @@ .record-slot { position: relative; - width: 200px; - min-width: 140px; - height: 200px; - perspective: 1000px; + width: 20%; + min-width: 100px; + aspect-ratio: 1/1; } .record-sleeve { @@ -76,11 +149,18 @@ height: 100%; position: relative; transition: transform 0.3s ease; + + &.active { + .sleeve-front { + border: 3px solid white; + } + } } .sleeve-front { width: 100%; height: 100%; + aspect-ratio: 1/1; position: absolute; border-radius: 2px; box-shadow: @@ -181,6 +261,134 @@ transform: translateX(-10%); } } + + .audio-shelf-text { + width: 60%; + margin: auto; + margin-top: 50px; + margin-bottom: 50px; + text-align: left; + border: 1px solid white; + + padding: 30px; + border-radius: 10px; + backdrop-filter: blur(10px); + background-color: rgba(255, 255, 255, 0.1); + + @include media-down(lg) { + width: 100%; + padding: 10px; + } + + p { + margin-bottom: 1rem; + } + } + + .audio-gear { + margin: 2rem 0; + + > .neon-sign { + position: relative; + top: auto; + left: auto; + right: auto; + bottom: auto; + transform: none; + margin-bottom: 90px; + + > .neon-text { + font-size: 5rem; + animation-delay: 2.5s; + line-height: 1rem; + + > span { + display: block; + position: absolute; + top: 50px; + left: 50%; + transform: rotate(80deg); + letter-spacing: -20%; + animation-delay: 2.3s; + } + } + } + + .gear-grid { + display: grid; + grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); + gap: 1.5rem; + margin-top: 1.5rem; + + @media (max-width: 768px) { + grid-template-columns: 1fr; + } + + .gear-item { + backdrop-filter: blur(10px); + background-color: rgba(255, 255, 255, 0.1); + border: 1px solid white; + border-radius: 4px; + padding: 1.5rem; + transition: all 0.3s ease; + display: flex; + flex-direction: column; + gap: 1rem; + + &:hover { + transform: translateY(-2px); + } + + .gear-icon { + font-size: 2rem; + text-align: center; + } + + .gear-content { + display: flex; + flex-direction: column; + gap: 0.5rem; + flex: 1; + } + } + } + + .gear-title { + font-size: 1.2rem; + margin: 0; + color: var(--neon-cyan); + font-family: var(--mono-font, monospace); + } + + .gear-category { + font-size: 0.85rem; + color: var(--neon-magenta); + text-transform: uppercase; + letter-spacing: 0.05em; + opacity: 0.8; + } + + .gear-summary { + font-size: 0.9rem; + line-height: 1.5; + opacity: 0.85; + margin: 0.5rem 0; + flex: 1; + } + + .gear-link { + color: var(--neon-cyan); + text-decoration: none; + font-size: 0.9rem; + margin-top: auto; + transition: color 0.3s ease; + + &:hover { + color: var(--neon-magenta); + text-decoration: underline; + } + } + } } .starfield-full { diff --git a/assets/sass/style.scss b/assets/sass/style.scss index 9083129..eae3b3d 100644 --- a/assets/sass/style.scss +++ b/assets/sass/style.scss @@ -1,3 +1,4 @@ +@import "normalize"; @import "mixins"; @import "partials/global-styles"; @@ -17,7 +18,7 @@ @import "pages/about"; @import "pages/audio"; -@import url("https://fonts.googleapis.com/css2?family=Caveat:wght@400;700&display=swap"); +@import url("https://fonts.googleapis.com/css2?family=Caveat:wght@400..700&family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&family=Neonderthaw&display=swap"); @font-face { font-family: "DSEG7-Classic"; @@ -48,7 +49,7 @@ body { width: 100%; height: 100vh; - font-family: "Courier New", monospace; + font-family: "Lato", sans-serif; background: #1a1a1a; position: relative; } @@ -291,6 +292,12 @@ body { background: black; color: greenyellow; font-family: monospace; + + > .scroll { + overflow: scroll; + max-height: 100%; + @include scrollbar-custom(#0f0, 3px); + } } .crt a { @@ -1616,9 +1623,6 @@ body { border-radius: 50%; } -/* Import a nice cursive font */ -@import url("https://fonts.googleapis.com/css2?family=Neonderthaw&display=swap"); - .navigation { position: absolute; bottom: 10%; diff --git a/content/audio/currently.md b/content/audio/currently.md new file mode 100644 index 0000000..d39b687 --- /dev/null +++ b/content/audio/currently.md @@ -0,0 +1,15 @@ +--- +headless: true +--- + +**Albums** + +- Ninajirachi - I Love My Computer (2025) +- Dire Straits - Brothers In Arms (1985) +- Bespin Moons - A Binding Force (2020) + +**Hardware** + +- Hiby R4 x EVA +- Fosi Audio GR70 Tube Amp +- CVJ Vivan IEM diff --git a/content/audio/_index.md b/content/audio/index.md similarity index 56% rename from content/audio/_index.md rename to content/audio/index.md index 9d6440e..840367e 100644 --- a/content/audio/_index.md +++ b/content/audio/index.md @@ -1,8 +1,6 @@ --- title: Music & Audio author: Dan -date: 2025-12-10 +date: 2025-12-13 comments: false --- - -This page is coming soon. diff --git a/content/audio/intro.md b/content/audio/intro.md new file mode 100644 index 0000000..9147988 --- /dev/null +++ b/content/audio/intro.md @@ -0,0 +1,16 @@ +--- +headless: true +--- + +I love music. I'm working on trying to listen to things a bit more +attentively, so my plan is to write some thoughts about the various +albums I own, be it on cassette, vinyl, CD or digitally. + +As I work through my collection they'll appear on the shelf, click on +them to see my thoughts. + +Further down you can find a selection of the audio hardware I have, +eventually I want to get around to writing about these too! + +If you have anything you think I'd like, or anything you have made - +please email it to me! dan@ritual.sh diff --git a/content/gear/cvj-vivian/index.md b/content/gear/cvj-vivian/index.md new file mode 100644 index 0000000..ec69973 --- /dev/null +++ b/content/gear/cvj-vivian/index.md @@ -0,0 +1,8 @@ +--- +title: "CVJ Vivian" +date: 2025-12-11 +tags: ["audio", "headphones"] +category: ["iem"] +description: "" +icon: 🎧 +--- diff --git a/content/gear/fiio-ft-1/index.md b/content/gear/fiio-ft-1/index.md index e2c868c..bf76124 100644 --- a/content/gear/fiio-ft-1/index.md +++ b/content/gear/fiio-ft-1/index.md @@ -2,6 +2,7 @@ title: "Fiio FT-1" date: 2025-12-08 tags: ["audio", "headphones"] +category: ["headphones"] description: "" icon: 🎧 --- diff --git a/content/gear/hiby-r4-eva/index.md b/content/gear/hiby-r4-eva/index.md index d9b5520..00e72d1 100644 --- a/content/gear/hiby-r4-eva/index.md +++ b/content/gear/hiby-r4-eva/index.md @@ -1,7 +1,8 @@ --- -title: "Hiby R4 EVA" +title: "Hiby R4 x EVA" date: 2025-12-10 tags: ["audio", "dap"] +category: ["dap"] description: "" icon: 🎵 --- diff --git a/content/gear/ipod-video-5th-generation-upgraded/index.md b/content/gear/ipod-video-5th-generation-upgraded/index.md index e42fc4e..d5df04e 100644 --- a/content/gear/ipod-video-5th-generation-upgraded/index.md +++ b/content/gear/ipod-video-5th-generation-upgraded/index.md @@ -2,6 +2,7 @@ title: "iPod Video 5th Generation - Upgraded" date: 2025-12-11 tags: ["audio", "dap"] +category: ["dap"] description: "" icon: 🎵 --- diff --git a/content/media/neon-odin-allfather/index.md b/content/media/neon-odin-allfather/index.md index 41bc8d8..f69f5e0 100644 --- a/content/media/neon-odin-allfather/index.md +++ b/content/media/neon-odin-allfather/index.md @@ -1,7 +1,17 @@ --- title: "Neon Odin - Allfather" -date: 2025-12-12 +date: 2025-01-12 tags: ["album"] description: "" cover: "cover.jpg" --- + +Neon Odin's _Allfather_ feels like mythology filtered through analog circuits and a CRT glow (much like myself). The album merges darksynth with handcrafted Nordic folk instruments - talharpa and nyckelharpa built by the artist himself - creating something that shouldn't work but absolutely does. + +Tracks like "Wield The Hammer" and "March Of The JÇ«tnar" pulse with vintage synthesizers while maintaining an almost ritualistic weight. There's a devotion here to both the Æsir and 80s electronics, and the combination taps into something primal about storytelling through sound. + +This is retrowave that refuses to be purely nostalgic, grounding its neon-soaked atmosphere in actual craftsmanship and ancient narratives that really resonate. + +Favourite Track: Wield The Hammer + +Rating: 7/10 diff --git a/content/media/ninajirachi-i-love-my-computer/index.md b/content/media/ninajirachi-i-love-my-computer/index.md index 2840928..98ae273 100644 --- a/content/media/ninajirachi-i-love-my-computer/index.md +++ b/content/media/ninajirachi-i-love-my-computer/index.md @@ -5,3 +5,15 @@ tags: ["album"] description: "" cover: "cover.jpg" --- + +Ninajirachi's _I Love My Computer_ captures something truthful about growing up shaped by screens and bandwidth. The album explores that strange intimacy we developed with our machines - the late nights, the secret discoveries, the way technology became less of a tool and more of a companion. + +Tracks like "Fuck My Computer" and "iPod Touch" aren't just bangers; they're confessions about a relationship that transcends generations. Whether you learned HTML on Geocities or taught yourself production in GarageBand, there's recognition here. + +The production has a restless energy, shifting between euphoric and introspective, mirroring how the internet itself feels—chaotic, isolating, and strangely beautiful all at once. It's a debut album that understands what it meant to have your world widened by a glowing rectangle - and I relate deeply to its content despite being at least one generation older than Ninajirachi. + +Not my usual genre of listen, but it has been a regular spin since it came into my world. + +Favourite Track: iPod Touch + +Rating: 8/10 diff --git a/content/updates/2025-12-08-homepage.md b/content/updates/2025-12-08-homepage.md new file mode 100644 index 0000000..6be34c4 --- /dev/null +++ b/content/updates/2025-12-08-homepage.md @@ -0,0 +1,8 @@ +--- +title: "2025 12 08 Homepage" +date: 2025-12-08T14:02:19Z +tags: [] +description: "" +--- + +First version of the homepage created with the interactive terminal. diff --git a/content/updates/2025-12-09-about.md b/content/updates/2025-12-09-about.md new file mode 100644 index 0000000..599471f --- /dev/null +++ b/content/updates/2025-12-09-about.md @@ -0,0 +1,8 @@ +--- +title: "2025 12 09 About" +date: 2025-12-09T14:07:59Z +tags: [] +description: "" +--- + +Added initial version of the about page with some approximation of a manifesto. diff --git a/content/updates/2025-12-13-album-reviews.md b/content/updates/2025-12-13-album-reviews.md new file mode 100644 index 0000000..8074411 --- /dev/null +++ b/content/updates/2025-12-13-album-reviews.md @@ -0,0 +1,8 @@ +--- +title: "2025 12 13 Album Reviews" +date: 2025-12-13T15:16:18Z +tags: [] +description: "" +--- + +Added some of my thoughts about Allfather by Neon Odin and I Love My Computer by Ninajirachi diff --git a/content/updates/2025-12-13-music.md b/content/updates/2025-12-13-music.md new file mode 100644 index 0000000..17c4ee1 --- /dev/null +++ b/content/updates/2025-12-13-music.md @@ -0,0 +1,8 @@ +--- +title: "2025 12 13 Music" +date: 2025-12-13T14:09:08Z +tags: [] +description: "" +--- + +Created the music and audio gear section! diff --git a/layouts/audio/list.html b/layouts/audio/list.html deleted file mode 100644 index d449a5f..0000000 --- a/layouts/audio/list.html +++ /dev/null @@ -1,75 +0,0 @@ -{{ define "header" }}{{ partial "page-header.html" . }}{{ end }} {{ define -"main" }} -
-
-
-
-
-
-
-
-
- -
-
-
music & audio gear
-
- -
-
- - {{ $posts := where site.RegularPages "Type" "media" }} - {{ $posts = where $posts "Params.tags" "intersect" (slice "album") }} - - {{ range first 5 $posts }} - -
- - {{ with .Resources.GetMatch "cover.*" }} - {{ $image := .Resize "500x webp q85" }} -
- {{ end }} - -
- {{ .Title }} -
-
-
-
- - {{ end }} - - - {{ if gt (len $posts) 5 }} - - View all {{ len $posts }} posts → - - {{ end }} -
-
- - - {{ partial "elements/ipod.html" . }} - {{ $posts := where site.RegularPages "Type" "gear" }} - {{ $posts = where $posts "Params.tags" "intersect" (slice "audio") }} - - {{ range first 5 $posts }} -

{{ .Title }}

- {{ with .Params.icon }} -

{{ . }}

- {{ end }} - Read more - {{ end }} - - - {{ if gt (len $posts) 5 }} - - View all {{ len $posts }} posts → - - {{ end }} -
-
-{{ end }} diff --git a/layouts/audio/single.html b/layouts/audio/single.html index daea5a6..bb36db0 100644 --- a/layouts/audio/single.html +++ b/layouts/audio/single.html @@ -1,5 +1,8 @@ {{ define "header" }}{{ partial "page-header.html" . }}{{ end }} {{ define -"main" }} +"main" }} {{ $intro := .Resources.GetMatch "intro.md" }} {{ $intro := +.Resources.GetMatch "intro.md" }} {{ $currently := .Resources.GetMatch +"currently.md" }} +
@@ -11,96 +14,101 @@
-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

-

Music & Audio Gear

+
+
music & audio gear
+
+ +
+
+
{{ partial "elements/ipod.html" . }}
+ + {{ with $intro }} {{ .Content }} {{ end }} +
+
♫
+
+
+
current rotation ->
+
+ {{ with $currently }} {{ .Content }} {{end}} +
+
+ +
+
+ + {{ $posts := where site.RegularPages "Type" "media" }} + {{ $posts = where $posts "Params.tags" "intersect" (slice "album") }} + {{ range $index, $post := first 5 $posts }} + +
+ + {{ with .Resources.GetMatch "cover.*" }} + {{ $image := .Resize "500x webp q85" }} +
+ {{ end }} + +
+ {{ .Title }} +
+
+
+
+ + {{ end }} + + {{ if gt (len $posts) 5 }} + + View all {{ len $posts }} posts → + + {{ end }} +
+ +
+ {{ range $index, $post := first 5 $posts }} +
+ {{ .Content }} +
+ {{ end }} +
+
+ +
+
+
gear ->
+
+
+ {{ $posts := where site.RegularPages "Type" "gear" }} {{ $posts = where + $posts "Params.tags" "intersect" (slice "audio") }} {{ range first 5 + $posts }} +
+ {{ with .Params.icon }} +
{{ . }}
+ {{ end }} +
+

{{ .Title }}

+ {{ with .Params.category }} + {{ . }} + {{ end }} {{ with .Summary }} +

{{ . }}

+ {{ end }} {{/* + View details → + */}} +
+
+ {{ end }} +
+
{{ end }} diff --git a/layouts/index.html b/layouts/index.html index 48df6ed..94d0483 100644 --- a/layouts/index.html +++ b/layouts/index.html @@ -121,13 +121,18 @@
- > updates -lah
- {{ range first 10 (sort .Site.Pages "Lastmod" "desc") }} [] - {{ .Title }}
- {{ end }} +
+ > updates -lah
+ {{ range first 10 (where .Site.RegularPages "Type" + "updates").ByLastmod.Reverse }} []
+ {{ .Plain }}
+ ---
+ {{ end }} - _ + _ +
@@ -279,12 +284,11 @@ -{{ $pages := where .Site.RegularPages "Kind" "page" }} {{ range first 1 (sort -$pages "Lastmod" "desc") }} - +{{ range first 1 (where .Site.RegularPages "Type" "updates").ByLastmod.Reverse +}}
{{ .Permalink }}
-
{{ .Title }}
+
{{ .Plain }}
{{ .Lastmod.Format "Jan 2, 2006" }}
{{ end }} {{ end }} diff --git a/layouts/now/single.html b/layouts/now/single.html index 229ae72..fa84737 100644 --- a/layouts/now/single.html +++ b/layouts/now/single.html @@ -25,308 +25,13 @@ width: 100%; max-width: 800px; padding: 20px; - background: linear-gradient(135deg, #2a2a2a 0%, #1a1a1a 100%); - box-shadow: inset 0 0 100px rgba(0, 0, 0, 0.8); position: relative; - } - - .window-frame { - position: relative; - width: 100%; - aspect-ratio: 16/9; - background: #3a3a3a; - border: 20px solid #2a2520; - box-shadow: - inset 0 0 20px rgba(0, 0, 0, 0.8), - 0 10px 40px rgba(0, 0, 0, 0.9); - overflow: hidden; - } - - .window-frame::before { - content: ""; - position: absolute; - inset: -20px; - border: 5px solid #1a1510; - pointer-events: none; - z-index: 10; - } - - /* Cityscape view */ - .cityscape { - width: 100%; - height: 100%; - position: relative; - background: linear-gradient( - 180deg, - #1a2332 0%, - #2a3a52 30%, - #4a5a72 60%, - #6a7a92 100% - ); - overflow: hidden; - } - - /* Sky with slight gradient */ - .sky { - position: absolute; - top: 0; - left: 0; - right: 0; - height: 40%; - background: linear-gradient( - 180deg, - #0a0f1a 0%, - #1a2a3a 50%, - #2a3a52 100% - ); - } - - /* Buildings container */ - .buildings { - position: absolute; - bottom: 0; - left: 0; - right: 0; - height: 60%; - display: flex; - align-items: flex-end; - justify-content: space-around; - gap: 20px; - padding: 0 40px; - } - - .building { - position: relative; - background: linear-gradient(180deg, #1a1a2e 0%, #0a0a1e 100%); - box-shadow: - inset -2px 0 10px rgba(0, 0, 0, 0.5), - 0 0 20px rgba(255, 200, 100, 0.1); - animation: buildingGlow 4s ease-in-out infinite; - } - - .building:nth-child(1) { - width: 80px; - height: 280px; - animation-delay: 0s; - } - - .building:nth-child(2) { - width: 60px; - height: 200px; - animation-delay: 0.5s; - } - - .building:nth-child(3) { - width: 90px; - height: 320px; - animation-delay: 1s; - } - - .building:nth-child(4) { - width: 70px; - height: 240px; - animation-delay: 1.5s; - } - - .building:nth-child(5) { - width: 85px; - height: 300px; - animation-delay: 2s; - } - - /* Building windows */ - .building-windows { - display: grid; - grid-template-columns: repeat(3, 1fr); - gap: 8px; - padding: 15px 10px; - height: 100%; - } - - .window-light { - background: #ffd700; - opacity: 0; - box-shadow: 0 0 10px #ffd700; - animation: windowFlicker 3s ease-in-out infinite; - } - - .window-light:nth-child(odd) { - animation-delay: 0.5s; - } - - .window-light:nth-child(3n) { - animation-delay: 1s; - } - - .window-light:nth-child(4n) { - animation-delay: 1.5s; - } - - @keyframes windowFlicker { - 0%, - 100% { - opacity: 0.3; - } - 50% { - opacity: 0.9; - } - } - - @keyframes buildingGlow { - 0%, - 100% { - box-shadow: - inset -2px 0 10px rgba(0, 0, 0, 0.5), - 0 0 20px rgba(255, 200, 100, 0.1); - } - 50% { - box-shadow: - inset -2px 0 10px rgba(0, 0, 0, 0.5), - 0 0 30px rgba(255, 200, 100, 0.2); - } - } - - /* Dirt and grime on window */ - .window-grime { - position: absolute; - inset: 0; - background: - radial-gradient( - circle at 20% 30%, - rgba(50, 40, 30, 0.2) 0%, - transparent 40% - ), - radial-gradient( - circle at 80% 60%, - rgba(40, 35, 25, 0.15) 0%, - transparent 50% - ), - radial-gradient( - circle at 50% 80%, - rgba(45, 38, 28, 0.18) 0%, - transparent 45% - ); - pointer-events: none; - z-index: 6; - } - - /* Glass reflection */ - .glass-reflection { - position: absolute; - inset: 0; - background: linear-gradient( - 135deg, - rgba(255, 255, 255, 0.1) 0%, - transparent 30%, - transparent 70%, - rgba(255, 255, 255, 0.05) 100% - ); - pointer-events: none; - z-index: 7; - } - - /* Ambient light from city */ - .ambient-light { - position: absolute; - bottom: -50px; - left: 50%; - transform: translateX(-50%); - width: 200%; - height: 200px; - background: radial-gradient( - ellipse at center, - rgba(255, 200, 100, 0.2) 0%, - transparent 70% - ); - filter: blur(40px); - animation: ambientPulse 3s ease-in-out infinite; - } - - @keyframes ambientPulse { - 0%, - 100% { - opacity: 0.5; - } - 50% { - opacity: 0.8; - } + color: #fff; + text-align: center; } -
-
- -
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- - -
-
-
-
+
Coming soon...
diff --git a/layouts/partials/elements/lavalamp.html b/layouts/partials/elements/lavalamp.html index ed5aa7c..b9e03d6 100644 --- a/layouts/partials/elements/lavalamp.html +++ b/layouts/partials/elements/lavalamp.html @@ -2,7 +2,7 @@ - + Follow on Neocities -  •  - - © {{ now.Format "2006" }} {{ .Site.Title }} -
{{ partial "social-follow.html" . }}
diff --git a/new.sh b/new.sh index 31a86d5..3e40402 100755 --- a/new.sh +++ b/new.sh @@ -1,15 +1,40 @@ #!/bin/bash - # Script to create new Hugo content w/ filename sanitization -# Usage: ./new.sh - +# Usage: ./new.sh [-d] [-s] <type> <title> +# -d: Add date prefix (YYYY-MM-DD) +# -s: Single page format (.md instead of /) set -e +# Initialize flags +ADD_DATE=false +SINGLE_PAGE=false + +# Parse flags +while getopts "ds" opt; do + case $opt in + d) + ADD_DATE=true + ;; + s) + SINGLE_PAGE=true + ;; + \?) + echo "Invalid option: -$OPTARG" >&2 + exit 1 + ;; + esac +done + +# Shift past the options +shift $((OPTIND-1)) + # Check if required arguments are provided if [ $# -lt 2 ]; then - echo "Usage: $0 <type> <title>" - echo "Example: $0 blog 'My Awesome Post'" - exit 1 + echo "Usage: $0 [-d] [-s] <type> <title>" + echo " -d: Add date prefix (YYYY-MM-DD)" + echo " -s: Single page format (.md instead of /)" + echo "Example: $0 -d -s blog 'My Awesome Post'" + exit 1 fi TYPE="$1" @@ -17,15 +42,25 @@ shift TITLE="$*" SAFE_TITLE=$(echo "$TITLE" | \ - tr '[:upper:]' '[:lower:]' | \ - sed 's/ /-/g' | \ - sed 's/\//-/g' | \ - sed 's/[^a-z0-9_-]//g' | \ - sed 's/-\+/-/g' | \ - sed 's/^-//;s/-$//') + tr '[:upper:]' '[:lower:]' | \ + sed 's/ /-/g' | \ + sed 's/\//-/g' | \ + sed 's/[^a-z0-9_-]//g' | \ + sed 's/-\+/-/g' | \ + sed 's/^-//;s/-$//') -# Construct the filename with date -FILENAME="${SAFE_TITLE}/" +# Add date prefix if flag is set +if [ "$ADD_DATE" = true ]; then + DATE_PREFIX=$(date +%Y-%m-%d) + SAFE_TITLE="${DATE_PREFIX}-${SAFE_TITLE}" +fi + +# Construct the filename based on format +if [ "$SINGLE_PAGE" = true ]; then + FILENAME="${SAFE_TITLE}.md" +else + FILENAME="${SAFE_TITLE}/" +fi # Construct the full path CONTENT_PATH="${TYPE}/${FILENAME}"