Fix code snippet contrast in light mode using dual Shiki themes (#77)

* Initial plan

* Initial plan for fixing code snippet contrast in light mode

Agent-Logs-Url: https://github.com/dev-proxy-tools/dev-proxy-tools.github.io/sessions/1e57e512-e6d3-4cd5-b3f8-7476bcd87054

Co-authored-by: waldekmastykarz <11164679+waldekmastykarz@users.noreply.github.com>

* Fix code snippet contrast in light mode using dual Shiki themes

Configure Astro to use github-light and github-dark Shiki themes
with CSS toggling based on the .dark class. This ensures code blocks
have proper contrast in both light and dark modes.

Agent-Logs-Url: https://github.com/dev-proxy-tools/dev-proxy-tools.github.io/sessions/1e57e512-e6d3-4cd5-b3f8-7476bcd87054

Co-authored-by: waldekmastykarz <11164679+waldekmastykarz@users.noreply.github.com>

---------

Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com>
Co-authored-by: waldekmastykarz <11164679+waldekmastykarz@users.noreply.github.com>

Author: Copilot

astro.config.mjs

@@ -7,6 +7,14 @@ import tailwindcss from '@tailwindcss/vite';
 export default defineConfig({
   site: 'https://devproxy.net',
   base: '/',
+  markdown: {
+    shikiConfig: {
+      themes: {
+        light: 'github-light',
+        dark: 'github-dark',
+      },
+    },
+  },
   integrations: [
     astroConsent({
       siteName: 'This website',

src/styles/global.css

@@ -73,11 +73,20 @@ body {
   tr { border-bottom: 1px solid var(--border-primary); }
   td { padding: 0.5rem 0.75rem; }
 
-  pre { background: var(--code-bg); border: 1px solid var(--code-border); border-radius: 0.5rem; padding: 1rem; overflow-x: auto; margin: 1rem 0; }
+  pre { border: 1px solid var(--code-border); border-radius: 0.5rem; padding: 1rem; overflow-x: auto; margin: 1rem 0; }
   code { color: var(--code-text); }
-  pre code { color: var(--code-block-text); }
+  pre code { color: inherit; }
 
   blockquote { border-left: 4px solid #a855f7; padding-left: 1rem; color: var(--text-muted); }
 
   kbd { background: var(--bg-tertiary); padding: 0.125rem 0.5rem; border-radius: 0.25rem; font-size: 0.875rem; border: 1px solid var(--border-secondary); }
+}
+
+.dark .astro-code,
+.dark .astro-code span {
+  color: var(--shiki-dark) !important;
+  background-color: var(--shiki-dark-bg) !important;
+  font-style: var(--shiki-dark-font-style) !important;
+  font-weight: var(--shiki-dark-font-weight) !important;
+  text-decoration: var(--shiki-dark-text-decoration) !important;
 }