diff --git a/assets/js/lavalamp.js b/assets/js/lavalamp.js index 15bf862..8cc58c2 100644 --- a/assets/js/lavalamp.js +++ b/assets/js/lavalamp.js @@ -92,8 +92,10 @@ } function init() { - updateBlobCount(); - updateLampBackground(); + if (document.getElementById("lavaLamp")) { + updateBlobCount(); + updateLampBackground(); + } } init(); diff --git a/assets/js/pages/audio.js b/assets/js/pages/audio.js new file mode 100644 index 0000000..7ef5ab9 --- /dev/null +++ b/assets/js/pages/audio.js @@ -0,0 +1,25 @@ +if (document.getElementById("starfield")) { + let starfield = document.getElementById("starfield"); + let numStars = 200; + + // Create static twinkling stars + for (let i = 0; i < numStars; i++) { + const star = document.createElement("div"); + star.className = "star"; + + // Random size + const sizeClass = + Math.random() < 0.7 ? "small" : Math.random() < 0.9 ? "medium" : "large"; + star.classList.add(sizeClass); + + // Random position + star.style.left = Math.random() * 100 + "%"; + star.style.top = Math.random() * 100 + "%"; + + // Random animation duration (2-6 seconds) and delay + star.style.animationDuration = 2 + Math.random() * 4 + "s"; + star.style.animationDelay = Math.random() * 5 + "s"; + + starfield.appendChild(star); + } +} diff --git a/assets/sass/pages/about.scss b/assets/sass/pages/about.scss index 2c55edf..322d49a 100644 --- a/assets/sass/pages/about.scss +++ b/assets/sass/pages/about.scss @@ -17,11 +17,30 @@ > .about-header { text-align: center; } + + > .manifesto-container { + position: relative; + > .manifesto-floppy { + position: absolute; + right: -50px; + top: -20px; + width: 150px; + transform: rotate(5deg); + } + } } } @media (max-width: 800px) { .about-page > .about-content { width: 100%; + + > .manifesto-container { + > .manifesto-floppy { + width: 75px; + top: -10px; + right: -20px; + } + } } } diff --git a/assets/sass/pages/audio.scss b/assets/sass/pages/audio.scss new file mode 100644 index 0000000..d06c34e --- /dev/null +++ b/assets/sass/pages/audio.scss @@ -0,0 +1,42 @@ +.audio-page { + position: relative; + width: 100%; + height: 100vh; + background: radial-gradient(ellipse at bottom, #1b2735 0%, #090a0f 100%); + overflow: hidden; +} + +.star { + position: absolute; + width: 2px; + height: 2px; + background: white; + border-radius: 50%; + animation: twinkle linear infinite; +} + +.star.small { + width: 1px; + height: 1px; +} + +.star.medium { + width: 2px; + height: 2px; +} + +.star.large { + width: 3px; + height: 3px; + box-shadow: 0 0 4px rgba(255, 255, 255, 0.5); +} + +@keyframes twinkle { + 0%, + 100% { + opacity: 0.3; + } + 50% { + opacity: 1; + } +} diff --git a/assets/sass/partials/_floppy.scss b/assets/sass/partials/_floppy.scss new file mode 100644 index 0000000..540fea8 --- /dev/null +++ b/assets/sass/partials/_floppy.scss @@ -0,0 +1,104 @@ +.floppy-disk { + width: 100%; + aspect-ratio: 1 / 1; + border-radius: 2%; + position: relative; + box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1); + container-type: inline-size; + pointer-events: none; + clip-path: polygon( + 0 0, + /* Top left */ 95% 0, + /* Top edge before diagonal */ 100% 5%, + /* Top right diagonal corner */ 100% 100%, + /* Bottom right */ 0 100% /* Bottom left */ + ); +} + +.metal-shutter { + position: absolute; + top: 0px; + right: 0; + transform: translateX(-40%); + width: 50%; + height: 30%; + background: linear-gradient(180deg, #c0c0c0 0%, #808080 50%, #606060 100%); + border-radius: 5%; + border-top-left-radius: 0px; + box-shadow: + 0 1cqw 2cqw rgba(0, 0, 0, 0.4), + inset 0 0.25cqw 0.5cqw rgba(255, 255, 255, 0.3); + z-index: 5; + + &::before { + content: " "; + height: 100%; + top: 0px; + right: 0px; + left: -35%; + position: absolute; + border-bottom-left-radius: 5%; + box-shadow: + inset 0.5cqw 0 0.5cqw rgba(0, 0, 0, 0.5), + inset 0 -0.25cqw 0.5cqw rgba(255, 255, 255, 0.4); + z-index: 4; + } +} + +.shutter-opening { + position: absolute; + top: 15%; + right: 10%; + transform: translateX(-50%); + width: 20%; + height: 70%; + background: #000; + border-radius: 5%; + box-shadow: inset 0 0.5cqw 1cqw rgba(0, 0, 0, 0.8); +} + +.label { + position: absolute; + bottom: 5%; + left: 50%; + transform: translateX(-50%); + width: 80%; + height: 55%; + background: linear-gradient(180deg, #f5f5f5 0%, #e8e8e8 100%); + border-radius: 2%; + overflow: hidden; + box-shadow: + 0 2px 4px rgba(0, 0, 0, 0.3), + inset 0 1px 0 rgba(255, 255, 255, 0.8); + font-family: "Caveat", cursive; + color: black; + font-size: clamp(0.7rem, 5cqw, 2rem); + font-weight: bold; +} + +/* Yellow header on label */ +.label-header { + width: 100%; + height: 20%; + background: linear-gradient(180deg, #f4d03f 0%, #e1b700 100%); + box-shadow: 0 2px 3px rgba(0, 0, 0, 0.1); + padding: 2%; + text-align: center; +} + +.label-lines { + padding: 5%; + display: flex; + flex-direction: column; + height: 80%; + box-sizing: border-box; + font-size: clamp(0.6rem, 4cqw, 1.5rem); +} + +.label-line { + flex: 1; + width: 100%; + height: 1.5px; + border-bottom: 2px solid black; + opacity: 0.7; +} diff --git a/assets/sass/style.scss b/assets/sass/style.scss index 4fb5ff3..2b541ff 100644 --- a/assets/sass/style.scss +++ b/assets/sass/style.scss @@ -6,10 +6,12 @@ @import "partials/terminal"; @import "partials/now-playing"; @import "partials/lavalamp"; +@import "partials/floppy"; @import "partials/content-screens"; @import "pages/about"; +@import "pages/audio"; @import url("https://fonts.googleapis.com/css2?family=Caveat:wght@400;700&display=swap"); diff --git a/content/audio/index.md b/content/audio.md similarity index 69% rename from content/audio/index.md rename to content/audio.md index d4d8b88..1652fb0 100644 --- a/content/audio/index.md +++ b/content/audio.md @@ -1,9 +1,8 @@ --- title: Music & Audio author: Dan -type: audio date: 2025-12-08T11:46:01+00:00 comments: false --- -This page is coming soon... +This page is coming soon. 11 diff --git a/layouts/about/single.html b/layouts/about/single.html index bd0b829..05202be 100644 --- a/layouts/about/single.html +++ b/layouts/about/single.html @@ -18,7 +18,7 @@ -
+
> cat manifesto @@ -48,25 +48,25 @@ what it could become. There was so much hope.

- Unfortunately what it became was an algorithmic slopshop. I fucking - hate it. + Unfortunately what it has become is an algorithmic slopshop. I + fucking hate it.

During my formative years I chatted to people from all over the - world, I found them through mutual interests, friends of friends, - and just spending time exploring. IRC, forums, and MSN messenger - were our tools; building connections was our mission. + world, I found them through mutual interests, friends of friends of + friends, and just spending time exploring. IRC, forums, and MSN + messenger were our tools; building connections was our mission.

The internet was so inspiring to me I studied it at college and - university and it eventually become a prosperous career. I still + university and it eventually became a prosperous career. I still work with the internet daily.

- Unfortunately, socially the internet become a cesspit. Particularly - in recent years. It's the cyberpunk dystopia of corporations telling - us what to think, billionaires telling us what to feel, and - politicians disregarding everyone. + Unfortunately, socially the internet has become a cesspit. + Particularly in recent years. It's the cyberpunk dystopia of + corporations telling us what to think, billionaires telling us what + to feel, and politicians disregarding everyone.

This website is meant to be a giant fuck you to web 2.0, social @@ -84,6 +84,11 @@ _

+
+ {{ partial "elements/floppy.html" (dict "title" "They're spying on you" + "lines" (slice "" "" "run truth.exe" "" "") "bgColor" "#1a4d8f" + "bgColorDark" "#0d2747") }} +
diff --git a/layouts/audio/single.html b/layouts/audio/single.html new file mode 100644 index 0000000..ceeae2b --- /dev/null +++ b/layouts/audio/single.html @@ -0,0 +1,6 @@ +{{ define "header" }}{{ partial "page-header.html" . }}{{ end }} {{ define +"main" }} +
+
123 123
+
+{{ end }} diff --git a/layouts/partials/elements/floppy.html b/layouts/partials/elements/floppy.html new file mode 100644 index 0000000..040664c --- /dev/null +++ b/layouts/partials/elements/floppy.html @@ -0,0 +1,23 @@ +{{ $title := .title | default "" }} {{ $lines := .lines | default (slice "" "" +"" "" "") }} {{ $bgColor := .bgColor | default "#1a1a1a" }} {{ $bgColorDark := +.bgColorDark | default "#000000" }} + +
+
+
+
+
+
{{ $title }}
+
+ {{ range $lines }} +
{{ . }}
+ {{ end }} +
+
+
diff --git a/layouts/partials/site-scripts.html b/layouts/partials/site-scripts.html index 0c38d5c..5f3690d 100644 --- a/layouts/partials/site-scripts.html +++ b/layouts/partials/site-scripts.html @@ -1,18 +1,20 @@ -{{ $script := .Site.Data.webpack_assets.app }} -{{ with $script.js }} - -{{ end }} - -{{/* Terminal Scripts Partial */}} -{{/* This compiles all terminal JS files into a single minified bundle */}} -{{ $terminal := resources.Get "js/terminal.js" }} -{{ $lavalamp := resources.Get "js/lavalamp.js" }} + +{{ $terminalShell := resources.Get "js/terminal.js" }} {{ $init := resources.Get "js/init.js" }} -{{ $coreCommands := resources.Get "js/commands/core.js" }} -{{ $utilityCommands := resources.Get "js/commands/utility.js" }} -{{ $navigationCommands := resources.Get "js/commands/navigation.js" }} -{{ $customCommands := resources.Get "js/commands/custom.js" }} - -{{ $terminalBundle := slice $terminal $lavalamp $init $coreCommands $utilityCommands $navigationCommands $customCommands | resources.Concat "js/terminal-bundle.js" | resources.Minify | resources.Fingerprint }} - - \ No newline at end of file +{{ $commandFiles := resources.Match "js/commands/*.js" }} +{{ $subfolderFiles := resources.Match "js/*/*.js" }} +{{ $remaining := resources.Match "js/*.js" }} +{{ $filtered := slice }} +{{ range $remaining }} + {{ $path := .RelPermalink }} + {{ if and (not (strings.Contains $path "/terminal.js")) (not (strings.Contains $path "/init.js")) }} + {{ $filtered = $filtered | append . }} + {{ end }} +{{ end }} +{{ $allFiles := slice $terminalShell | append $filtered | append $init | append $commandFiles | append $subfolderFiles }} +{{ $terminalBundle := $allFiles | resources.Concat "js/terminal-bundle.js" | resources.Minify | resources.Fingerprint }} + +