Migrated blog to mkdocs

docs/main.py

@@ -0,0 +1,30 @@
+from typing import Any
+
+
+def define_env(env: Any) -> None:
+    static_dir = "../static/"
+    video_dir = "https://clan.lol/" + "videos/"
+    asciinema_dir = static_dir + "asciinema-player/"
+
+    @env.macro
+    def video(name: str) -> str:
+        return f"""<video loop muted autoplay id="{name}">
+                <source src={video_dir + name} type="video/webm">
+                Your browser does not support the video tag.
+            </video>"""
+
+    @env.macro
+    def asciinema(name: str) -> str:
+        return f"""<div id="{name}"><link rel="stylesheet" type="text/css" href="{asciinema_dir}/asciinema-player.css" />
+            <link rel="stylesheet" type="text/css" href="{asciinema_dir}/custom-theme.css" />
+            <script src="{asciinema_dir}/asciinema-player.min.js"></script>
+            <script>
+                AsciinemaPlayer.create('{video_dir + name}',
+                document.getElementById("{name}"), {{
+                    loop: true,
+                    autoPlay: true,
+                    controls: false,
+                    speed: 1.5,
+                    theme: "alabaster-auto"
+                }});
+            </script></div>"""

docs/mkdocs.yml

@@ -1,4 +1,4 @@
-site_name: cLAN documentation
+site_name: cLAN Documentation
 site_url: https://docs.clan.lol
 repo_url: https://git.clan.lol/clan/clan-core/
 repo_name: clan-core
@@ -37,6 +37,8 @@ exclude_docs: |
   /drafts/
 
 nav:
+  - Blog:
+    - blog/index.md
   - Getting started:
       - index.md
       - Installer: getting-started/installer.md
@@ -46,20 +48,7 @@ nav:
       - Mesh VPN: getting-started/mesh-vpn.md
       - Backup & Restore: getting-started/backups.md
       - Flake-parts: getting-started/flake-parts.md
-  - Templates: templates/index.md
-  - Reference:
-      - CLI:
-          - reference/cli/index.md
-          - reference/cli/backups.md
-          - reference/cli/config.md
-          - reference/cli/facts.md
-          - reference/cli/flakes.md
-          - reference/cli/flash.md
-          - reference/cli/history.md
-          - reference/cli/machines.md
-          - reference/cli/secrets.md
-          - reference/cli/ssh.md
-          - reference/cli/vms.md
+  - Modules:
       - Clan Modules:
           - reference/clanModules/borgbackup.md
           - reference/clanModules/deltachat.md
@@ -77,6 +66,18 @@ nav:
           - reference/clanModules/user-password.md
           - reference/clanModules/xfce.md
           - reference/clanModules/zt-tcp-relay.md
+      - CLI:
+          - reference/cli/index.md
+          - reference/cli/backups.md
+          - reference/cli/config.md
+          - reference/cli/facts.md
+          - reference/cli/flakes.md
+          - reference/cli/flash.md
+          - reference/cli/history.md
+          - reference/cli/machines.md
+          - reference/cli/secrets.md
+          - reference/cli/ssh.md
+          - reference/cli/vms.md
       - Clan Core:
           - reference/clan-core/index.md
           - reference/clan-core/backups.md
@@ -84,7 +85,6 @@ nav:
           - reference/clan-core/sops.md
           - reference/clan-core/state.md
   - Contributing: contributing/contributing.md
-  - FAQ: faq/index.md
 
 docs_dir: site
 site_dir: out
@@ -120,5 +120,18 @@ theme:
         icon: material/weather-sunny
         name: Switch to light mode
 
+  extra_javascript:
+    - static/main.js
+
 plugins:
   - search
+  - blog
+  - macros
+  - rss:
+      match_path: blog/posts/.*
+
+      date_from_meta:
+        as_creation: date
+      categories:
+        - categories
+        - tags

docs/nix/default.nix

@@ -20,6 +20,8 @@ pkgs.stdenv.mkDerivation {
     ++ (with pkgs.python3Packages; [
       mkdocs
       mkdocs-material
+      mkdocs-rss-plugin
+      mkdocs-macros
     ]);
   configurePhase = ''
     mkdir -p ./site/reference/cli

docs/site/blog/.authors.yml

@@ -0,0 +1,22 @@
+authors:
+  Lassulus:
+    name: "Lassulus"
+    description: "Test description"
+    avatar: ""
+    url: "https://example.com/lassulus"
+  Mic92:
+    name: "Mic92"
+    description: "Test description"
+    avatar: ""
+    url: "https://example.com/mic92"
+  W:
+    name: "W"
+    description: "Test description"
+    avatar: ""
+    url: "https://example.com/w"
+  Qubasa:
+    name: "Qubasa"
+    description: "Test description"
+    avatar: ""
+    bio: "Author bio for Qubasa."
+    url: "https://example.com/qubasa"

docs/site/blog/index.md

@@ -0,0 +1,2 @@
+# Blog
+

docs/site/blog/posts/2024-03-19-hello-world.md

@@ -0,0 +1,74 @@
+---
+title: "Introducing Clan: Full-Stack Computing Redefined"
+description: "Introducing Clan, a new model for a decentralized network, designed to provide families, smaller groups, and small businesses a platform that’s private, secure, and user-friendly."
+date: 2024-03-19T09:19:42+00:00
+updated: 2024-03-19T09:19:42+00:00
+draft: false
+authors:
+  - W
+  - Qubasa
+---
+
+
+In a digital age where users are guided increasingly toward submission and dependence, Clan reclaims computing and networking from the ground up.
+
+Clan enables users to build any system from a git repository, automate secret handling, and join devices in a secure darknet. This control extends beyond applications to communication protocols and the operating system itself, putting you fully in charge of your own digital environment.
+
+## Why We're Building Clan
+
+Our mission is simple: to restore fun, freedom, and functionality to computing as an open source project. We believe in building tools that empower users, foster innovation, and challenge the limitations imposed by outdated paradigms. Clan, in its essence, is an open source endeavor; it's our contribution to a future where technology serves humanity, not the other way around.
+
+## How Clan Changes the Game
+Clan embodies a new philosophy in system, application, and network design. It enables seamless, secure communication across devices, simplifies software distribution and updates, and offers both public and private network configurations. Here are some of the ways it accomplishes this:
+
+- **Nix as a Foundation:** Imagine a safety net for your computer's operating system, one that lets you make changes or updates without the fear of causing a crash or losing data. Nix simplifies the complexities of system design, ensuring that updates are safe and systems are more reliable.
+
+- **Simplified System Deployment:** Building and managing a computer system, from the operating system to the software you use, often feels like putting together a complex puzzle. With Clan, the puzzle pieces are replaced by a set of building blocks. Leveraging the power of Nix and Clan's innovative toolkit, anyone from tech-savvy administrators to everyday users can create and maintain what we call "full-stack systems" (everything your computer needs to run smoothly).
+
+- **A Leap in Connectivity:** Imagine if you could create private, secure pathways between your devices, bypassing the noisy and often insecure internet. Clan makes this possible through something called "overlay networks." These networks are like private tunnels, allowing your devices to talk to each other securely and directly. With Clan's built-in overlay networks and automatically configured services, connecting your devices becomes seamless, secure, and hassle-free.
+
+- **Security Through Separation:** Clan employs sandboxing and virtual machines, a technology that runs code in isolated environments - so even if you explore new Clans, your system remains protected from potential threats.
+
+- **Reliable:** With Clan, your data and services are preserved for the long haul. We focus on self-hosted backups and integration with the [Fediverse](https://de.wikipedia.org/wiki/Fediverse), a network of interconnected, independent online communities, so your digital life remains uninterrupted and under your control.
+
+
+## A Glimpse at Clan's Features
+
+- **Social Scaling:** Choose between creating a private sanctuary for your closest contacts, a dynamic space for a self-contained community, or embracing the open web with public Clans anyone can join.
+
+{{ video(name="show_join.webm")}}
+
+- **Seamless VM Integration:** Applications running in virtual machines can appear and behave as if they're part of your main operating system — a blend of power and simplicity.
+
+{{ video(name="show_run.webm")}}
+
+- **Robust Backup Management:** Keep your data safe _forever_ - never worry about cloud services disappearing in 10 years.
+
+{{ asciinema(name="backups.cast") }}
+
+- **Intuitive Secret Management:** Clan simplifies digital security by automating the creation and management of encryption keys and passwords for your services.
+
+{{ asciinema(name="secrets.cast") }}
+
+- **Remote Install:** Set up and manage Clan systems anywhere in the world with just a QR scan or SSH access, making remote installations as easy as snapping a photo or sharing a link.
+
+{{ asciinema(name="nixos-install.cast") }}
+
+
+## Who Stands to Benefit?
+
+Clan is for anyone and everyone who believes in the power of open source technology to connect, empower, and protect. From system administrators to less tech-savvy individuals, small business owners to privacy-conscious users, Clan offers something for everyone — a way to reclaim control and redefine how we interact with technology.
+
+## Join the Revolution
+
+Ready to control your digital world? Clan is more than a tool—it's a movement. Secure your data, manage your systems easily, or connect with others how you like. Start with Clan for a better digital future.
+
+Connect with us on our [Matrix channel at clan.lol](https://matrix.to/#/#clan:lassul.us) or through our IRC bridges (coming soon).
+
+Want to see the code? Check it out [on our Gitea](https://git.clan.lol/clan/clan-core) or [on GitHub](https://github.com/clan-lol/clan-core).
+
+Or follow our RSS feed by clicking in the top right corner!
+
+Join us and be part of changing technology for the better, together.
+
+

docs/site/blog/posts/2024-04-16-new-docs.md

@@ -0,0 +1,14 @@
+---
+title: "New documentation site and weekly new meetup"
+date: 2024-04-16T14:36:16+02:00
+draft: false
+authors: 
+  - Lassulus
+  - Mic92
+---
+
+Last week, we added a new documentation hub for clan at [docs.clan.lol](https://docs.clan.lol).
+We are still working on improving the installation procedures, so stay tuned.
+We now have weekly office hours where people are invited to hangout and ask questions.
+They are every Wednesday 15:30 UTC (17:30 CEST) in our [jitsi](https://jitsi.lassul.us/clan.lol).
+Otherwise drop by in our [matrix channel](https://matrix.to/#/#clan:lassul.us).

docs/site/faq/index.md

@@ -1,15 +0,0 @@
-# FAQ
-
-??? Question "Why is targetHost necessary?"
-
-    When using `clan machines install [machine ][targetHost]`
-
-    Why is targetHost necessary if you already configured target host in the configuration?
-
-??? Question "How to check if the correct installation medium?"
-
-    How to warn and check if it is the only installation medium?
-
-??? Question "How are submodules handled in/with clan?"
-
-    How are submodules handled in/with clan?

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();
+  

docs/site/templates/index.md

@@ -1,24 +0,0 @@
-# Templates
-
-We provide some starting templates you can easily use one of those via `nix flakes`.
-
-They showcase best practices and guide you through setting up and using Clan's modules
-
-I.e. To use the `new-clan` template run the following command:
-
-```bash
-nix flake init -t git+https://git.clan.lol/clan/clan-core#new-clan
-```
-
-## Available Templates
-
-We offer the following templates:
-
-To initialize a clan with one of those run:
-```bash
-nix flake init -t git+https://git.clan.lol/clan/clan-core#[TEMPLATE_NAME]
-```
-
-Substitute `[TEMPLATE_NAME]` with the name of the template.
-
-- **new-clan**:  Perfect for beginners, this template shows you how to link two machines in a basic setup.

pkgs/clan-cli/clan_cli/flash.py

@@ -130,7 +130,7 @@ def flash_machine(
         )
 
         cmd = nix_shell(
-            ["/home/lhebendanz/Projects/disko"],
+            ["nixpkgs#disko"],
             disko_install,
         )
         run(cmd, log=Log.BOTH, error_msg=f"Failed to flash {machine}")