From 9c0ae887057234308749f7c16cfef8fe64478681 Mon Sep 17 00:00:00 2001 From: Daisuke Date: Tue, 3 Feb 2026 20:56:26 +0900 Subject: [PATCH 1/3] Remove flake.nix and flake.lock --- flake.lock | 61 ------------------------------------------------------ flake.nix | 23 -------------------- 2 files changed, 84 deletions(-) delete mode 100644 flake.lock delete mode 100644 flake.nix diff --git a/flake.lock b/flake.lock deleted file mode 100644 index 978e295..0000000 --- a/flake.lock +++ /dev/null @@ -1,61 +0,0 @@ -{ - "nodes": { - "flake-utils": { - "inputs": { - "systems": "systems" - }, - "locked": { - "lastModified": 1731533236, - "narHash": "sha256-l0KFg5HjrsfsO/JpG+r7fRrqm12kzFHyUHqHCVpMMbI=", - "owner": "numtide", - "repo": "flake-utils", - "rev": "11707dc2f618dd54ca8739b309ec4fc024de578b", - "type": "github" - }, - "original": { - "owner": "numtide", - "repo": "flake-utils", - "type": "github" - } - }, - "nixpkgs": { - "locked": { - "lastModified": 1769598131, - "narHash": "sha256-e7VO/kGLgRMbWtpBqdWl0uFg8Y2XWFMdz0uUJvlML8o=", - "owner": "NixOS", - "repo": "nixpkgs", - "rev": "fa83fd837f3098e3e678e6cf017b2b36102c7211", - "type": "github" - }, - "original": { - "owner": "NixOS", - "ref": "nixos-25.11", - "repo": "nixpkgs", - "type": "github" - } - }, - "root": { - "inputs": { - "flake-utils": "flake-utils", - "nixpkgs": "nixpkgs" - } - }, - "systems": { - "locked": { - "lastModified": 1681028828, - "narHash": "sha256-Vy1rq5AaRuLzOxct8nz4T6wlgyUR7zLU309k9mBC768=", - "owner": "nix-systems", - "repo": "default", - "rev": "da67096a3b9bf56a91d16901293e51ba5b49a27e", - "type": "github" - }, - "original": { - "owner": "nix-systems", - "repo": "default", - "type": "github" - } - } - }, - "root": "root", - "version": 7 -} diff --git a/flake.nix b/flake.nix deleted file mode 100644 index d1f9cbf..0000000 --- a/flake.nix +++ /dev/null @@ -1,23 +0,0 @@ -{ - description = "Naputo blog devshell"; - - inputs = { - # Use stable nixpkgs for a more predictable toolchain. - nixpkgs.url = "github:NixOS/nixpkgs/nixos-25.11"; - flake-utils.url = "github:numtide/flake-utils"; - }; - - outputs = { self, nixpkgs, flake-utils }: - flake-utils.lib.eachDefaultSystem (system: - let - pkgs = import nixpkgs { inherit system; }; - in - { - devShells.default = pkgs.mkShell { - packages = with pkgs; [ - forgejo-cli - nodejs - ]; - }; - }); -} From e357f2ed682e2adce6632349ae439be5741ee8e9 Mon Sep 17 00:00:00 2001 From: Daisuke Date: Wed, 11 Feb 2026 12:25:57 +0900 Subject: [PATCH 2/3] feat(container): add SSH server and rassumfrassum for LSP multiplexing - Install openssh-server and create SSH infrastructure in container - Install rassumfrassum (LSP multiplexer) via Python venv - Expose SSH port 2222 and mount user public key for TRAMP access - Update compose.yml to map port 2222 and mount SSH_PUBKEY_PATH - Document SSH setup and TRAMP /ssh: access method in README --- Containerfile | 13 +++++++++++-- README.md | 3 +++ compose.yml | 4 +++- 3 files changed, 17 insertions(+), 3 deletions(-) diff --git a/Containerfile b/Containerfile index 5c72c1d..6940a2c 100644 --- a/Containerfile +++ b/Containerfile @@ -3,6 +3,15 @@ FROM node:lts-bookworm-slim WORKDIR /app +# SSH server for TRAMP /ssh: access +RUN apt-get update && apt-get install -y --no-install-recommends openssh-server python3-venv python3-pip \ + && rm -rf /var/lib/apt/lists/* \ + && mkdir -p /var/run/sshd /root/.ssh \ + && chmod 700 /root/.ssh \ + && ssh-keygen -A \ + && python3 -m venv /opt/rass && /opt/rass/bin/pip install --no-cache-dir rassumfrassum \ + && ln -s /opt/rass/bin/rass /usr/local/bin/rass + # Install dependencies first (better layer caching) COPY package.json package-lock.json ./ RUN npm ci @@ -10,6 +19,6 @@ RUN npm ci # Copy the rest of the project COPY . . -EXPOSE 4321 +EXPOSE 4321 22 -CMD ["npm","run","dev","--","--host","0.0.0.0","--port","4321"] +CMD ["/bin/sh","-lc","/usr/sbin/sshd && npm run dev -- --host 0.0.0.0 --port 4321"] diff --git a/README.md b/README.md index 29052b3..58ac0c9 100644 --- a/README.md +++ b/README.md @@ -44,11 +44,14 @@ This repo can be developed inside a Podman container to keep your host clean and ### Using podman compose ```sh +export SSH_PUBKEY_PATH="$HOME/.ssh/id_ed25519.pub" podman compose up --build ``` On WSL2/rootless Podman, if you hit netavark/nftables errors, this repo defaults to `slirp4netns` via `network_mode` in `compose.yml`. +If you want SSH access (for Emacs TRAMP `/ssh:`), `SSH_PUBKEY_PATH` must point to your public key and port 2222 will be exposed for SSH. + Then open: http://localhost:4321 Run other commands in the running container: diff --git a/compose.yml b/compose.yml index eed04fc..096aa63 100644 --- a/compose.yml +++ b/compose.yml @@ -7,10 +7,12 @@ services: network_mode: "slirp4netns:allow_host_loopback=true" ports: - "4321:4321" + - "2222:22" volumes: - .:/app - node_modules:/app/node_modules - command: npm run dev -- --host 0.0.0.0 --port 4321 + - ${SSH_PUBKEY_PATH}:/root/.ssh/authorized_keys:ro + command: /bin/sh -lc "/usr/sbin/sshd && npm run dev -- --host 0.0.0.0 --port 4321" volumes: node_modules: From 62aa324e16e24ff31b3f40673045294e88a197bc Mon Sep 17 00:00:00 2001 From: Daisuke Date: Wed, 11 Feb 2026 13:15:03 +0900 Subject: [PATCH 3/3] feat: implement dark mode support - Introduce CSS variables for theming in `global.css` - Add `ThemeIcon` component for toggling light/dark modes - Integrate theme initialization script in `BaseLayout` to prevent FOUC - Update navigation, buttons, and tag styles for dark mode compatibility - Configure Shiki for dual-theme syntax highlighting in `astro.config.mjs` - Adjust link colors to accessible blue shades for both themes --- astro.config.mjs | 11 ++- src/components/BlogPost.astro | 10 ++- src/components/Header.astro | 8 +++ src/components/Navigation.astro | 3 +- src/components/ThemeIcon.astro | 36 ++++++++++ src/layouts/BaseLayout.astro | 16 +++++ src/layouts/MarkdownPostLayout.astro | 11 ++- src/pages/blog/[...page].astro | 13 ++++ src/pages/index.astro | 104 ++++++++++++++------------- src/pages/tags/index.astro | 11 ++- src/styles/global.css | 56 ++++++++++++--- 11 files changed, 218 insertions(+), 61 deletions(-) create mode 100644 src/components/ThemeIcon.astro diff --git a/astro.config.mjs b/astro.config.mjs index 87c4c0f..dde729c 100644 --- a/astro.config.mjs +++ b/astro.config.mjs @@ -6,5 +6,14 @@ import preact from "@astrojs/preact"; // https://astro.build/config export default defineConfig({ site: "https://blog.n-daisuke897.com/", - integrations: [preact()] + integrations: [preact()], + markdown: { + shikiConfig: { + themes: { + light: 'github-light', + dark: 'github-dark', + }, + wrap: true, + }, + }, }); \ No newline at end of file diff --git a/src/components/BlogPost.astro b/src/components/BlogPost.astro index e10aa0b..32cfb32 100644 --- a/src/components/BlogPost.astro +++ b/src/components/BlogPost.astro @@ -12,11 +12,19 @@ const { title, url, datetime } = Astro.props; font-size: 14px; color: #666; } + :global(.dark) .new-article-date { + color: #94a3b8; + } .new-article-title { font-size: 18px; font-weight: bold; - color: #333f; + color: var(--text-color); + text-decoration: none; } + .new-article-title:hover { + text-decoration: underline; + } + /* Removed specific dark mode color to inherit var(--text-color) */
{datetime}
diff --git a/src/components/Header.astro b/src/components/Header.astro index b058c25..bd43431 100644 --- a/src/components/Header.astro +++ b/src/components/Header.astro @@ -9,3 +9,11 @@ import Navigation from "./Navigation.astro"; + + diff --git a/src/components/Navigation.astro b/src/components/Navigation.astro index 67284b2..fe72b60 100644 --- a/src/components/Navigation.astro +++ b/src/components/Navigation.astro @@ -1,8 +1,9 @@ --- - +import ThemeIcon from "./ThemeIcon.astro"; ---
+ Home About Articles diff --git a/src/components/ThemeIcon.astro b/src/components/ThemeIcon.astro new file mode 100644 index 0000000..de9258b --- /dev/null +++ b/src/components/ThemeIcon.astro @@ -0,0 +1,36 @@ +--- +--- + + + + + \ No newline at end of file diff --git a/src/layouts/BaseLayout.astro b/src/layouts/BaseLayout.astro index 3e068d8..0837182 100644 --- a/src/layouts/BaseLayout.astro +++ b/src/layouts/BaseLayout.astro @@ -12,6 +12,22 @@ const { pageTitle } = Astro.props; {pageTitle + " | Naputo"} +
diff --git a/src/layouts/MarkdownPostLayout.astro b/src/layouts/MarkdownPostLayout.astro index b236a24..280e17b 100644 --- a/src/layouts/MarkdownPostLayout.astro +++ b/src/layouts/MarkdownPostLayout.astro @@ -30,7 +30,11 @@ const optionsForDate = { -

New Posts

-
- { - sortedPosts.slice(0, 5).map((post: any) => ( - - )) - } -
+

New Posts

+
+ { + sortedPosts.slice(0, 5).map((post: any) => ( + + )) + } +
-
- List of Article -
+
+ List of Article +
diff --git a/src/pages/tags/index.astro b/src/pages/tags/index.astro index 7d91fa3..61f315b 100644 --- a/src/pages/tags/index.astro +++ b/src/pages/tags/index.astro @@ -20,7 +20,7 @@ const pageTitle = "Tag List"; diff --git a/src/styles/global.css b/src/styles/global.css index 0ebece4..c94e447 100644 --- a/src/styles/global.css +++ b/src/styles/global.css @@ -1,5 +1,19 @@ +/* Dark Mode support */ +:root { + --bg-color: #f1f5f9; + --text-color: #333333; + --nav-hover: #e0e0e0; +} + +html.dark { + --bg-color: #0f172a; + --text-color: #f8fafc; + --nav-hover: #1e293b; +} + html { - background-color: #f1f5f9; + background-color: var(--bg-color); + color: var(--text-color); font-family: sans-serif; } @@ -21,6 +35,14 @@ h1 { } /* nav styles */ +a { + color: #3b82f6; /* Blue 500 - vivid but readable on light */ +} + +html.dark a { + color: #60a5fa; /* Blue 400 - lighter and softer for dark mode */ +} + .hamburger { padding-right: 20px; cursor: pointer; @@ -31,17 +53,22 @@ h1 { width: 32px; height: 4px; margin-bottom: 8px; - background-color: #333333; + background-color: var(--text-color); } .nav-links { width: 100%; - display: flex; + display: none; justify-content: center; align-items: center; margin: 0; } +.nav-links.expanded { + display: flex; + flex-direction: column; +} + .nav-links a { display: block; text-align: center; @@ -51,12 +78,12 @@ h1 { font-weight: bold; text-transform: uppercase; border-radius: 4px; - color: #333333; + color: var(--text-color); } .nav-links a:hover, .nav-links a:focus { - background-color: #e0e0e0; + background-color: var(--nav-hover); } .nav-links img { @@ -66,14 +93,16 @@ h1 { display: inline-block; } -.expanded { - display: unset; +html.dark .nav-links img { + filter: invert(1) hue-rotate(180deg); } +/* .expanded removed as it is handled by .nav-links.expanded */ + @media screen and (min-width: 636px) { .nav-links { margin-left: 5em; - display: block; + display: flex; position: static; width: auto; background: none; @@ -94,3 +123,14 @@ pre, code { font-family: "JetBrains Mono", "Fira Code", "Menlo", "Consolas", monospace; } + +pre { + padding: 1rem; + border-radius: 0.5rem; + overflow-x: auto; +} + +html.dark pre { + background-color: #1e293b !important; +} +