Migrated blog to mkdocs

docs/site/static/asciinema-player/custom-theme.css

@@ -0,0 +1,45 @@
+.asciinema-player-theme-alabaster-auto {
+        --term-color-foreground: #000000; /* Black for foreground text */
+        --term-color-background: #f7f7f7; /* Very light gray for background */
+
+        --term-color-0: #000000; /* Black */
+        --term-color-1: #aa3731; /* Red */
+        --term-color-2: #448c37; /* Green */
+        --term-color-3: #cb9000; /* Yellow */
+        --term-color-4: #325cc0; /* Blue */
+        --term-color-5: #7a3e9d; /* Magenta */
+        --term-color-6: #0083b2; /* Cyan */
+        --term-color-7: #bbbbbb; /* White */
+        --term-color-8: #777777; /* Bright black (gray) */
+        --term-color-9: #f05050; /* Bright red */
+        --term-color-10: #60cb00; /* Bright green */
+        --term-color-11: #ffbc5d; /* Bright yellow */
+        --term-color-12: #007acc; /* Bright blue */
+        --term-color-13: #e64ce6; /* Bright magenta */
+        --term-color-14: #00aacb; /* Bright cyan */
+        --term-color-15: #ffffff; /* Bright white */
+    }
+
+  @media (prefers-color-scheme: dark) {
+    .asciinema-player-theme-solarized-auto {
+      --term-color-foreground: #839496;
+      --term-color-background: #002b36;
+
+      --term-color-0: #073642;
+      --term-color-1: #dc322f;
+      --term-color-2: #859900;
+      --term-color-3: #b58900;
+      --term-color-4: #268bd2;
+      --term-color-5: #d33682;
+      --term-color-6: #2aa198;
+      --term-color-7: #eee8d5;
+      --term-color-8: #002b36;
+      --term-color-9: #cb4b16;
+      --term-color-10: #586e75;
+      --term-color-11: #657b83;
+      --term-color-12: #839496;
+      --term-color-13: #6c71c4;
+      --term-color-14: #93a1a1;
+      --term-color-15: #fdf6e3;
+    }
+  }

docs/site/static/main.js

@@ -0,0 +1,116 @@
+
+
+// Set darkmode
+document.getElementById('mode').addEventListener('click', () => {
+    let isDarkTheme = document.body.classList.contains('dark');
+    setColorTheme(!isDarkTheme ? "dark" : "light");
+  });
+  
+  
+  let preferDarkTheme = prefersDarkMode();
+  let theme = localStorage.getItem('theme');
+  if (theme !== null) {
+    setColorTheme(theme);
+  } else {
+    setColorTheme(preferDarkTheme ? "dark" : "light");
+  }
+  
+  // Get the media query list object for the prefers-color-scheme media feature
+  const colorSchemeQueryList = window.matchMedia("(prefers-color-scheme: dark)");
+  // Add an event listener for the change event
+  colorSchemeQueryList.addEventListener("change", handleColorSchemeChange);
+  
+  
+  function setColorTheme(theme) {
+    if (theme === "dark") {
+      document.body.classList.add('dark');
+      switchClanLogo("white");
+      localStorage.setItem('theme', 'dark');
+    } else {
+      document.body.classList.remove('dark');
+      switchClanLogo("dark");
+      localStorage.setItem('theme', 'light');
+    }
+  }
+  
+  // A function that returns true if the user prefers dark mode, false otherwise
+  function prefersDarkMode() {
+    // Check if the browser supports the prefers-color-scheme media query
+    if (window.matchMedia) {
+      // Get the current value of the media query
+      let colorScheme = window.matchMedia("(prefers-color-scheme: dark)");
+      // Return true if the media query matches, false otherwise
+      return colorScheme.matches;
+    } else {
+      // If the browser does not support the media query, return false by default
+      return false;
+    }
+  }
+  
+  function switchClanLogo(theme) {
+    let favs = document.getElementsByClassName("favicon");
+    for (item of favs) {
+      if (theme === "white")
+      {
+        item.href = item.href.replace("dark-favicon", "white-favicon")
+      } else {
+        item.href = item.href.replace("white-favicon", "dark-favicon")
+      }
+    }
+    let clogos = document.getElementsByClassName("clogo");
+    for (item of clogos) {
+      if (theme === "white")
+      {
+        item.src = item.src.replace("dark", "white")
+      } else {
+        item.src = item.src.replace("white", "dark")
+      }
+    }
+  }
+  
+  
+  
+  // A function that executes some logic based on the color scheme preference
+  function handleColorSchemeChange(e) {
+    if (e.matches) {
+      // The user prefers dark mode
+      setColorTheme("dark");
+    } else {
+      // The user prefers light mode
+      setColorTheme("light");
+    }
+  }
+  
+  // Function to resize all video elements to match their parent article's width
+  function resizeVideosToMatchArticleWidth() {
+    // Function to adjust video sizes
+    function adjustVideoSizes() {
+      // Find all video elements
+      const videos = document.querySelectorAll('video');
+  
+      videos.forEach(video => {
+        // Find the closest parent article element
+        const article = video.closest('article');
+        if (!article) return; // Skip if no parent article found
+  
+        // Calculate new video height to maintain aspect ratio
+        const aspectRatio = video.videoHeight / video.videoWidth;
+        const newWidth = article.clientWidth; // Width of the parent article
+        const newHeight = newWidth * aspectRatio;
+  
+        // Set new width and height on the video
+        video.style.width = `${newWidth}px`;
+        video.style.height = `${newHeight}px`;
+      });
+    }
+  
+    // Adjust video sizes on load
+    document.addEventListener('DOMContentLoaded', adjustVideoSizes);
+  
+    // Adjust video sizes on window resize
+    window.onresize = adjustVideoSizes;
+  }
+  
+  // Call the function to initialize the resizing
+  resizeVideosToMatchArticleWidth();
+