diff --git a/config.toml b/config.toml index a592948..6d78236 100644 --- a/config.toml +++ b/config.toml @@ -127,6 +127,6 @@ url = "/privacy-policy/" weight = 10 [[extra.footer.nav]] -name = "Overview" -url = "/docs/overview" +name = "The Vision" +url = "/docs/thevision" weight = 20 diff --git a/content/_index.md b/content/_index.md index cb8c988..1dcfac4 100644 --- a/content/_index.md +++ b/content/_index.md @@ -3,8 +3,8 @@ title = "Build your own" # The homepage contents [extra] -lead = 'cLAN logo
cLAN envisions 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. ' -url = "/docs/getting-started/introduction/" +lead = '
cLAN envisions 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. ' +url = "/docs/thevision/" url_button = "Learn more" repo_version = "cLAN v0.0.0-alpha" repo_license = "Open-source MIT License." @@ -14,7 +14,7 @@ repo_url = "https://git.clan.lol/clan/" [[extra.menu.main]] name = "Docs" section = "docs" -url = "/docs/overview" +url = "/docs/thevision" weight = 10 [[extra.menu.main]] @@ -23,6 +23,8 @@ section = "blog" url = "/blog/" weight = 20 + + [[extra.list]] title = "Easy to use" content = 'cLAN provides a user-friendly interface that allows you to establish your own private network, complete with services.' diff --git a/content/blog/hello-world.md b/content/blog/hello-world.md index 6ba0c8f..7cd2735 100644 --- a/content/blog/hello-world.md +++ b/content/blog/hello-world.md @@ -1,8 +1,8 @@ +++ -title = "Hello World" +title = "The Beginning" 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 = 2021-05-01T09:19:42+00:00 -updated = 2021-05-01T09:19:42+00:00 +date = 2023-05-01T09:19:42+00:00 +updated = 2023-05-01T09:19:42+00:00 draft = false template = "blog/page.html" @@ -10,6 +10,6 @@ template = "blog/page.html" authors = ["Mic92"] [extra] -lead = "A blog post introducing the project." +lead = "Introducing cLAN," +++ -Some more text +a new model for a decentralized network, designed to provide families, smaller groups, and small businesses a platform that's self hosted while pertaining the commodities of a cloud infrastructure. diff --git a/content/docs/overview/index.md b/content/docs/overview/index.md index 3de2cab..5e02e20 100644 --- a/content/docs/overview/index.md +++ b/content/docs/overview/index.md @@ -1,5 +1,5 @@ +++ -title = "Overview" +title = "Technial Overview" description = "Overview of cLAN's architecture, components and security" date = 2021-05-01T18:10:00+00:00 updated = 2021-07-13T18:10:00+00:00 @@ -15,11 +15,10 @@ top = false +++ -# cLAN +### cLAN cLAN envisions 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. The system transcends the conventional reliance on centralized services, allowing for direct, end-to-end encrypted communication among users. Rooted in open-source software, cLAN ensures no vendor lock-in, and introduces robust features including remote management, backup functionality, user-friendly app store, and fleet management for small businesses. -## Architecture Overview ### Decentralized Network Model @@ -151,8 +150,8 @@ This modules would be build by the VM controller into a system with the followin inputs.myNetworkFlake.nixosModules.default ./local-overrides.nix ]; - } - } + }; + }; } ``` @@ -192,9 +191,9 @@ configs.json } ``` -A crude example of how this interface would look like -VM Manager New Network - + ### VM Manager @@ -259,7 +258,6 @@ Our safeguards will include virtual machine isolation to mitigate the damage an To address this, we only offer a limited set of options in our high-level modules, which either restrict or issue warnings for configurations deemed to be unsafe. For instance, services are exposed exclusively to the internal network and not to the wider internet, thereby offering an extra layer of security. -TODO: Threats that are out-of-scope ### Trusted compute base diff --git a/content/docs/thevision/index.md b/content/docs/thevision/index.md new file mode 100644 index 0000000..004a959 --- /dev/null +++ b/content/docs/thevision/index.md @@ -0,0 +1,42 @@ ++++ +title = "The Vision" +description = "The General Vision of this Project" +date = 2021-05-01T19:30:00+00:00 +updated = 2021-05-01T19:30:00+00:00 +draft = false +weight = 30 +sort_by = "weight" +paginator.next = "docs/overview/index.md" +template = "docs/page.html" ++++ + + +In this context, our vision defines how we envision the behavior of the final product and how users will interact with it. cLAN aims to offer a compelling alternative to the ever-increasing centralization of the internet. + +### Decentralized Networking + +Instead of relying on a centralized cloud accessible via the clearnet, our objective is to establish an encrypted network of interconnected computers, essentially creating a decentralized darknet, which we affectionately call a cLAN. + +### Seamless Onboarding + +Our vision includes providing users with a seamless experience when they join one or multiple cLANs through invitation links. Clicking the link will trigger a popup that seeks confirmation to connect to the network. + +### Effortless VM Integration + +During the joining process, the user's computer (referred to as the client hereafter) will download a file containing information about a virtual machine (VM). The client will then automatically set up the VM, and once complete, this VM will become part of the cLAN. + +Users can also choose to seamlessly integrate the cLAN configuration into their base system, effectively allowing the cLAN admin(s) to remotely manage their system. + +### Dashboard for Services + +Once connected, users will have access to a dashboard displaying all the services offered within this specific cLAN. Within this dashboard, users can effortlessly add applications or decide to host services for fellow cLAN members, such as a Nextcloud instance or backup endpoints. + +### Decentralization and Redundancy + +The core idea is to ensure service decentralization without a single point of failure. If one service fails, another machine within the cLAN network can spin up a replacement service. VMs are designed to be lightweight, minimizing resource consumption. + +### Administrative Control + +Within a cLAN, administrators define the configuration file and have control over who becomes part of the network. + +Go to [Technical Overview](@/docs/overview/index.md) to see more indepth details of our work. \ No newline at end of file diff --git a/static/dark-favicon/128x128.png b/static/dark-favicon/128x128.png new file mode 100644 index 0000000..94364cd Binary files /dev/null and b/static/dark-favicon/128x128.png differ diff --git a/static/dark-favicon/16x16.png b/static/dark-favicon/16x16.png new file mode 100644 index 0000000..590ea8c Binary files /dev/null and b/static/dark-favicon/16x16.png differ diff --git a/static/dark-favicon/32x32.png b/static/dark-favicon/32x32.png new file mode 100644 index 0000000..c209266 Binary files /dev/null and b/static/dark-favicon/32x32.png differ diff --git a/static/dark-favicon/64x64.png b/static/dark-favicon/64x64.png new file mode 100644 index 0000000..375e78e Binary files /dev/null and b/static/dark-favicon/64x64.png differ diff --git a/static/logo/clan-dark.png b/static/logo/clan-dark.png new file mode 100644 index 0000000..370d0f7 Binary files /dev/null and b/static/logo/clan-dark.png differ diff --git a/static/logo/clan-white.png b/static/logo/clan-white.png new file mode 100644 index 0000000..b5bcb14 Binary files /dev/null and b/static/logo/clan-white.png differ diff --git a/static/logo.png b/static/logo/old-logo.png similarity index 100% rename from static/logo.png rename to static/logo/old-logo.png diff --git a/static/white-favicon/128x128.png b/static/white-favicon/128x128.png new file mode 100644 index 0000000..45361f1 Binary files /dev/null and b/static/white-favicon/128x128.png differ diff --git a/static/white-favicon/16x16.png b/static/white-favicon/16x16.png new file mode 100644 index 0000000..bf687ce Binary files /dev/null and b/static/white-favicon/16x16.png differ diff --git a/static/white-favicon/32x32.png b/static/white-favicon/32x32.png new file mode 100644 index 0000000..2852ed6 Binary files /dev/null and b/static/white-favicon/32x32.png differ diff --git a/static/white-favicon/64x64.png b/static/white-favicon/64x64.png new file mode 100644 index 0000000..39298fb Binary files /dev/null and b/static/white-favicon/64x64.png differ diff --git a/templates/macros/head.html b/templates/macros/head.html new file mode 100644 index 0000000..c2ddb7f --- /dev/null +++ b/templates/macros/head.html @@ -0,0 +1,264 @@ +{% macro resource() %} + + +{% endmacro %} + + +{% macro stylesheet() %} + +{% endmacro %} + + +{% macro favicons() %} + + + + + {% if not config.extra.is_netlify %} + + {% endif %} +{% endmacro %} + + +{# type: website or article, generally setting article for blog articles #} +{# page_images: using for the blog single template page #} +{# page_section: the blog single template page have to pass the parameter #} +{# is_404: using for the 404.html template #} +{% macro seo( + title="", + title_addition="", + description="", + type="website", + is_home=false, + is_404=false, + is_page=false, + page_images="", + page_section="", + created_time="2021-05-01T08:08:00+08:00", + updated_time="2021-05-01T08:08:08+08:00" + ) +%} + +{% if is_404 %} + +{% else %} + + + +{% endif %} +{% if current_url %} + {% set page_url = current_url %} +{% else %} + {% set page_url = get_url(path="404.html") %} +{% endif %} +{% if current_path %} + {% set page_path = current_path %} +{% else %} + {% set page_path = "/404.html" %} +{% endif %} +{{ title ~ title_addition }} + + + +{% if config.extra.open.enable %} + + {% if page.extra.images %} + {% for image in page.extra.images %} + + {% endfor %} + {% elif section.extra.images %} + {% for image in section.extra.images %} + + {% endfor %} + {% elif config.extra.open.image %} + + {% endif %} + + + + + + + + + + + {% if page.extra.images %} + {% for image in page.extra.images %} + + {% endfor %} + {% elif section.extra.images %} + {% for image in section.extra.images %} + + {% endfor %} + {% elif config.extra.open.image %} + + {% endif %} + + + + + {% if config.extra.open.audio %} + + {% endif %} + + {% if config.extra.open.locale %} + + {% endif %} + + {% if config.extra.open.videos %} + {% for video in config.extra.open.videos %} + + {% endfor %} + {% endif %} + + + +{% endif %} + +{% if is_home and config.extra.schema %} + {% if config.extra.schema.type == "Organization" %} + + {% endif %} + {% if config.extra.schema.type == "Person" %} + + {% endif %} + {% if config.extra.schema.site_links_search_box %} + + {% endif %} +{% endif %} + +{% if is_page and config.extra.schema.section %} + {% if config.extra.schema.section == page_section %} + + {% endif %} +{% endif %} + +{% set url_prefix = get_url(path="/") | split(pat="://") | first %} +{% set url_main = get_url(path="/") | split(pat="://") | last %} +{% set url_item = url_prefix ~ "://" ~ url_main ~ "/" %} + + +{% if config.extra.ganalytics %} + + +{% endif %} +{% endmacro %} diff --git a/themes/adidoks/static/js/main.js b/themes/adidoks/static/js/main.js index 2fbc228..60091db 100644 --- a/themes/adidoks/static/js/main.js +++ b/themes/adidoks/static/js/main.js @@ -1,14 +1,80 @@ // Set darkmode document.getElementById('mode').addEventListener('click', () => { - - document.body.classList.toggle('dark'); - localStorage.setItem('theme', document.body.classList.contains('dark') ? 'dark' : 'light'); - + let isDarkTheme = document.body.classList.contains('dark'); + setColorTheme(!isDarkTheme ? "dark" : "light"); }); - -// enforce local storage setting but also fallback to user-agent preferences -if (localStorage.getItem('theme') === 'dark' || (!localStorage.getItem('theme') && window.matchMedia("(prefers-color-scheme: dark)").matches)) { - - document.body.classList.add('dark'); - + + +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"); + } }