diff --git a/.github/linters/.eslintrc.yml b/.github/linters/.eslintrc.yml index 9e8edc2..525caf9 100644 --- a/.github/linters/.eslintrc.yml +++ b/.github/linters/.eslintrc.yml @@ -1,2 +1,6 @@ --- -ignorePatterns: ["layouts/page/single.json"] +ignorePatterns: ["layouts/page/single.json", "package.json", "package-lock.json", "assets/js/bootstrap.js"] +parserOptions: + ecmaVersion: latest +env: + es6: true diff --git a/.github/workflows/deploy-dev.yml b/.github/workflows/deploy-dev.yml index 67ba6ef..f546880 100644 --- a/.github/workflows/deploy-dev.yml +++ b/.github/workflows/deploy-dev.yml @@ -18,11 +18,21 @@ jobs: fetch-depth: 0 - name: Setup Hugo - uses: peaceiris/actions-hugo@v2 + uses: peaceiris/actions-hugo@v3 with: hugo-version: '0.121.2' extended: true + - name: Setup Node + uses: actions/setup-node@v4 + with: + node-version: '20' + cache: 'npm' + cache-dependency-path: '**/package-lock.json' + + - name: Prepare npm + run: npm ci + - name: Build env: HUGO_ENV: production diff --git a/.github/workflows/deploy-prod.yml b/.github/workflows/deploy-prod.yml index 36ab608..7d7496d 100644 --- a/.github/workflows/deploy-prod.yml +++ b/.github/workflows/deploy-prod.yml @@ -25,6 +25,16 @@ jobs: hugo-version: '0.121.2' extended: true + - name: Setup Node + uses: actions/setup-node@v4 + with: + node-version: '20' + cache: 'npm' + cache-dependency-path: '**/package-lock.json' + + - name: Prepare npm + run: npm ci + - name: Build env: HUGO_ENV: production diff --git a/.github/workflows/linter.yml b/.github/workflows/linter.yml index 4cd698f..d51b605 100644 --- a/.github/workflows/linter.yml +++ b/.github/workflows/linter.yml @@ -60,6 +60,7 @@ jobs: # Disable some other linters VALIDATE_HTML: false VALIDATE_NATURAL_LANGUAGE: false + VALIDATE_CSS: false # Change to 'main' if your main branch differs DEFAULT_BRANCH: main GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }} diff --git a/.gitignore b/.gitignore index 1457056..8f20061 100644 --- a/.gitignore +++ b/.gitignore @@ -4,3 +4,6 @@ public/ resources/_gen/ www/ www-dev/ +assets/jsconfig.json +node_modules +hugo_stats.json \ No newline at end of file diff --git a/.gitmodules b/.gitmodules index 5154615..ae5a441 100644 --- a/.gitmodules +++ b/.gitmodules @@ -1,3 +1,3 @@ -[submodule "themes/ananke"] - path = themes/ananke - url = https://github.com/theNewDynamic/gohugo-theme-ananke.git +[submodule "themes/lotusdocs"] + path = themes/lotusdocs + url = https://github.com/colinwilson/lotusdocs diff --git a/README.md b/README.md index fac0273..070626e 100644 --- a/README.md +++ b/README.md @@ -8,7 +8,9 @@ The website is built using the static website generator Hugo. - Clone this repository - Load submodule with `git submodule init` and `git submodule update` -- Install [Hugo](https://gohugo.io/installation/) +- Install [Hugo](https://gohugo.io/installation/) (>=0.120.0) +- Install [Node](https://nodejs.org/en/download/package-manager/current) (>=20) +- Load js dependencies with `npm install` ## Run for development diff --git a/apache/dev.website.conf b/apache/dev.website.conf index 9ddbf74..a10db01 100644 --- a/apache/dev.website.conf +++ b/apache/dev.website.conf @@ -19,8 +19,8 @@ DocumentRoot /var/www/berlin.freifunk.net/www-dev - Header set Content-Security-Policy "script-src dev.berlin.freifunk.net" - Header set Strict-Transport-Security "max-age=63072000; includeSubDomains" + Header set Content-Security-Policy "script-src 'self' 'unsafe-hashes' 'sha256-NPQiAFHfOX//546/pLtrKoVL9QjRuPsCI+6doZczyyI=' 'sha256-Q0IcZn6UWrfGL+BOcG44ffINe7v5Wq/gTHBbunlNOJQ='" + Header set Strict-Transport-Security "max-age=63072000; includeSubDomains" Options FollowSymLinks diff --git a/apache/website.conf b/apache/website.conf index e6856ea..2573333 100644 --- a/apache/website.conf +++ b/apache/website.conf @@ -27,9 +27,9 @@ - ServerName www.berlin.freifunk.net + ServerName www.berlin.freifunk.net ServerAdmin "info@berlin.freifunk.net" - SSLEngine on + SSLEngine on SSLCertificateFile /etc/letsencrypt/live/www.berlin.freifunk.net/cert.pem SSLCertificateChainFile /etc/letsencrypt/live/www.berlin.freifunk.net/chain.pem SSLCertificateKeyFile /etc/letsencrypt/live/www.berlin.freifunk.net/privkey.pem @@ -57,7 +57,7 @@ - ServerName www.berlin.freifunk.net + ServerName www.berlin.freifunk.net ServerAdmin "info@berlin.freifunk.net" RewriteEngine On @@ -75,7 +75,7 @@ ServerName berlin.freifunk.net ServerAdmin "info@berlin.freifunk.net" - SSLEngine on + SSLEngine on SSLCertificateFile /etc/letsencrypt/live/berlin.freifunk.net/cert.pem SSLCertificateChainFile /etc/letsencrypt/live/berlin.freifunk.net/chain.pem SSLCertificateKeyFile /etc/letsencrypt/live/berlin.freifunk.net/privkey.pem @@ -102,8 +102,8 @@ Header always merge Vary "Accept-Language" - Header set Content-Security-Policy "script-src berlin.freifunk.net" - Header set Strict-Transport-Security "max-age=63072000; includeSubDomains" + Header set Content-Security-Policy "script-src berlin.freifunk.net" + Header set Strict-Transport-Security "max-age=63072000; includeSubDomains" Options FollowSymLinks @@ -113,4 +113,4 @@ ErrorLog "/var/log/apache2/berlin.freifunk.net-error.log" CustomLog "/var/log/apache2/berlin.freifunk.net-access.log" combined - + \ No newline at end of file diff --git a/assets/images/header.webp b/assets/images/header.webp new file mode 100644 index 0000000..5650f40 Binary files /dev/null and b/assets/images/header.webp differ diff --git a/assets/images/logo.svg b/assets/images/logo.svg new file mode 100644 index 0000000..b47aef4 --- /dev/null +++ b/assets/images/logo.svg @@ -0,0 +1,30 @@ + + + + + + + + + diff --git a/assets/js/bootstrap.js b/assets/js/bootstrap.js new file mode 100644 index 0000000..d724506 --- /dev/null +++ b/assets/js/bootstrap.js @@ -0,0 +1,15 @@ +// +// Overwriting the theme file to activate component +// + +// Import the Bootstrap components we want to use. +// See https://github.com/twbs/bootstrap/blob/main/js/index.umd.js +// eslint-disable-next-line import/no-absolute-path +import Tab from '/js/bootstrap/src/tab' +// eslint-disable-next-line import/no-absolute-path +import Dropdown from '/js/bootstrap/src/dropdown' + +export default { + Tab, + Dropdown +} diff --git a/assets/scss/_variables.scss b/assets/scss/_variables.scss new file mode 100644 index 0000000..13e6eaf --- /dev/null +++ b/assets/scss/_variables.scss @@ -0,0 +1,1004 @@ +// Overwriting the theme stylesheet to allow custom colors + +// Variables + +// +// custom-variables +// + +$fw-medium: 600; + +//Custom Fonts +// $font-family-secondary: 'Nunito', sans-serif; + +$text-default: #3C4257; +$muted: #6b7686; +$btn-color: #ffffff; +$body-color: $text-default; + +//Body Background +$shadow-sm: 0 .125rem .25rem rgba($dark,.15); +$shadow: 0 0 3px rgba($dark,.15); +$shadow-md: 0 5px 13px rgba($dark, .2); +$shadow-lg: 0 10px 25px rgba($dark, 0.15); + +// Overlay +$overlay: rgba($dark, 0.7); +$bg-overlay-white: rgba($white, 0.5); +$bg-gradient-primary: linear-gradient(to left, darken($purple, 10%) 0%, darken($primary, 10%) 100%); +$linear-gradient: linear-gradient(to bottom, rgba($black, 0) 0%, rgba($black, 0.0) 50%, rgba($black, 0.3) 80%, rgba($black, 1) 100%); +$linear-gradient-2: linear-gradient(to bottom, rgba($black, 0) 0%, rgba($black, 0.3) 50%, rgba($black, 0.7) 75%, rgba($black, 1) 100%); +$linear-gradient-3: linear-gradient(to right, rgba($black, 1) 0%, rgba($black, 1) 25%, rgba($black, 1) 50%, rgba($black, 0.5) 75%, rgba($black, 0) 100%); +$gradient-overlay: linear-gradient(to bottom, rgba($black, 0) 0%, rgba($black, 0.5) 25%, rgba($black, 0.75) 50%, rgba($black, 1) 100%); +$gradient-overlay-2: linear-gradient(to bottom, rgba($black,0.5) 0%, rgba($black,0.6) 25%, rgba($black,0.7) 50%, rgba($black,0.8) 100%); +$primary-gradient-overlay: linear-gradient(to bottom, rgba($primary, 0) 0%, rgba($primary, 0.25) 25%, rgba($primary, 0.50) 50%, rgba($primary, 0.75) 75%, rgba($primary, 1) 100%); +$gradient-white-overlay: linear-gradient(to bottom, rgba($white, 0) 0%, rgba($white, 0) 25%, rgba($white, 0) 50%, rgba($white, 0.5) 100%); +$card-overlay: linear-gradient(to bottom, transparent 0%, transparent 25%, transparent 35%, rgba($black, 0.9) 100%); + +//Topnav +$nav-sticky-bg: $white; +$submenu-bg: $white; +$megamenu-head-text: $body-color; +$topnav-bg: $white; +$navbar-white-bg: $white; +$topnav-white-color: $white; +$topnav-dark-color: $dark; + +//Back to top +$back-to-top-color: $white; + +//Footer +$footer: #202942; +$footer-text: #adb5bd; +$footer-head-color: $white; +$foot-social-color: #adb5bd; +$social-icon-color: #adb5bd; +$social-border-color: #adb5bd; +$foot-social-color-white: $white; + +//CTA +$play-btn-border: $white; +$play-btn-icon: $white; + +//Nav-pills +$nav-pills-bg: $dark; +$nav-pills-color: $white; + +//Forms +$form-placeholder: $dark; +$subscribe-form-bg: $white; +$datepicker-bg: $white; +$datepicker-text: $dark; + +//Features +$feature-text-white: $white; + +//text +$text-color-white: $body-bg; +$bg-white-color: $white; + +$heading-font-sizes: ( + "h1": 42px, + "h2": 36px, + "h3": 30px, + "h4": 24px, + "h5": 20px, + "h6": 16px, +); + +$display-font-sizes: ( + "display-1": 80px, + "display-2": 72px, + "display-3": 64px, + "display-4": 56px, + "display-5": 48px, + "display-6": 40px, +); + +// Variables +// +// Variables should follow the `$component-state-property-size` formula for +// consistent naming. Ex: $nav-link-disabled-color and $modal-content-box-shadow-xs. + +// Color system + +// scss-docs-start gray-color-variables +$white: #ffffff; +$gray-100: #f8f9fa; +$gray-200: #e9ecef; +$gray-300: #dee2e6; +$gray-400: #ced4da; +$gray-500: #adb5bd; +$gray-600: #6c757d; +$gray-700: #495057; +$gray-800: #343a40; +$gray-900: #212529; +$black: #000000; +// scss-docs-end gray-color-variables + +// fusv-disable +// scss-docs-start gray-colors-map +$grays: ( + "100": $gray-100, + "200": $gray-200, + "300": $gray-300, + "400": $gray-400, + "500": $gray-500, + "600": $gray-600, + "700": $gray-700, + "800": $gray-800, + "900": $gray-900 +); +// scss-docs-end gray-colors-map +// fusv-enable + +// scss-docs-start color-variables +$blue: #0066ff; /*#4d80ff*/ +$indigo: #6610f2; +$purple: #7952B3; +$pink: #d63384; +$red: #e43f52; +$orange: #fd7e14; +$yellow: #f17425; +$green: #2eca8b; +$teal: #20c997; +$cyan: #17a2b8; +// scss-docs-end color-variables + +// scss-docs-start colors-map +$colors: ( + "blue": $blue, + "indigo": $indigo, + "purple": $purple, + "pink": $pink, + "red": $red, + "orange": $orange, + "yellow": $yellow, + "green": $green, + "teal": $teal, + "cyan": $cyan, + "white": $white, + "gray": $gray-600, + "gray-dark": $gray-800, +); +// scss-docs-end colors-map + +// scss-docs-start theme-colors-map +$theme-colors: ( + "primary": $primary, + "secondary": $secondary, + "success": $success, + "info": $info, + "warning": $warning, + "danger": $danger, + "light": $light, + "dark": $dark, + "footer": $footer, + "muted": $muted +); +// scss-docs-end theme-colors-map + +// scss-docs-start theme-colors-rgb +$theme-colors-rgb: map-loop($theme-colors, to-rgb, "$value"); +// scss-docs-end theme-colors-rgb + +// The contrast ratio to reach against white, to determine if color changes from "light" to "dark". Acceptable values for WCAG 2.0 are 3, 4.5 and 7. +// See https://www.w3.org/TR/WCAG20/#visual-audio-contrast-contrast +$min-contrast-ratio: 1.8; + +// Customize the light and dark text colors for use in our color contrast function. +$color-contrast-dark: $black; +$color-contrast-light: $white; + +// fusv-disable +$blue-100: tint-color($blue, 80%); +$blue-200: tint-color($blue, 60%); +$blue-300: tint-color($blue, 40%); +$blue-400: tint-color($blue, 20%); +$blue-500: $blue; +$blue-600: shade-color($blue, 20%); +$blue-700: shade-color($blue, 40%); +$blue-800: shade-color($blue, 60%); +$blue-900: shade-color($blue, 80%); + +$indigo-100: tint-color($indigo, 80%); +$indigo-200: tint-color($indigo, 60%); +$indigo-300: tint-color($indigo, 40%); +$indigo-400: tint-color($indigo, 20%); +$indigo-500: $indigo; +$indigo-600: shade-color($indigo, 20%); +$indigo-700: shade-color($indigo, 40%); +$indigo-800: shade-color($indigo, 60%); +$indigo-900: shade-color($indigo, 80%); + +$purple-100: tint-color($purple, 80%); +$purple-200: tint-color($purple, 60%); +$purple-300: tint-color($purple, 40%); +$purple-400: tint-color($purple, 20%); +$purple-500: $purple; +$purple-600: shade-color($purple, 20%); +$purple-700: shade-color($purple, 40%); +$purple-800: shade-color($purple, 60%); +$purple-900: shade-color($purple, 80%); + +$pink-100: tint-color($pink, 80%); +$pink-200: tint-color($pink, 60%); +$pink-300: tint-color($pink, 40%); +$pink-400: tint-color($pink, 20%); +$pink-500: $pink; +$pink-600: shade-color($pink, 20%); +$pink-700: shade-color($pink, 40%); +$pink-800: shade-color($pink, 60%); +$pink-900: shade-color($pink, 80%); + +$red-100: tint-color($red, 80%); +$red-200: tint-color($red, 60%); +$red-300: tint-color($red, 40%); +$red-400: tint-color($red, 20%); +$red-500: $red; +$red-600: shade-color($red, 20%); +$red-700: shade-color($red, 40%); +$red-800: shade-color($red, 60%); +$red-900: shade-color($red, 80%); + +$orange-100: tint-color($orange, 80%); +$orange-200: tint-color($orange, 60%); +$orange-300: tint-color($orange, 40%); +$orange-400: tint-color($orange, 20%); +$orange-500: $orange; +$orange-600: shade-color($orange, 20%); +$orange-700: shade-color($orange, 40%); +$orange-800: shade-color($orange, 60%); +$orange-900: shade-color($orange, 80%); + +$yellow-100: tint-color($yellow, 80%); +$yellow-200: tint-color($yellow, 60%); +$yellow-300: tint-color($yellow, 40%); +$yellow-400: tint-color($yellow, 20%); +$yellow-500: $yellow; +$yellow-600: shade-color($yellow, 20%); +$yellow-700: shade-color($yellow, 40%); +$yellow-800: shade-color($yellow, 60%); +$yellow-900: shade-color($yellow, 80%); + +$green-100: tint-color($green, 80%); +$green-200: tint-color($green, 60%); +$green-300: tint-color($green, 40%); +$green-400: tint-color($green, 20%); +$green-500: $green; +$green-600: shade-color($green, 20%); +$green-700: shade-color($green, 40%); +$green-800: shade-color($green, 60%); +$green-900: shade-color($green, 80%); + +$teal-100: tint-color($teal, 80%); +$teal-200: tint-color($teal, 60%); +$teal-300: tint-color($teal, 40%); +$teal-400: tint-color($teal, 20%); +$teal-500: $teal; +$teal-600: shade-color($teal, 20%); +$teal-700: shade-color($teal, 40%); +$teal-800: shade-color($teal, 60%); +$teal-900: shade-color($teal, 80%); + +$cyan-100: tint-color($cyan, 80%); +$cyan-200: tint-color($cyan, 60%); +$cyan-300: tint-color($cyan, 40%); +$cyan-400: tint-color($cyan, 20%); +$cyan-500: $cyan; +$cyan-600: shade-color($cyan, 20%); +$cyan-700: shade-color($cyan, 40%); +$cyan-800: shade-color($cyan, 60%); +$cyan-900: shade-color($cyan, 80%); + +$blues: ( + "blue-100": $blue-100, + "blue-200": $blue-200, + "blue-300": $blue-300, + "blue-400": $blue-400, + "blue-500": $blue-500, + "blue-600": $blue-600, + "blue-700": $blue-700, + "blue-800": $blue-800, + "blue-900": $blue-900 +); + +$indigos: ( + "indigo-100": $indigo-100, + "indigo-200": $indigo-200, + "indigo-300": $indigo-300, + "indigo-400": $indigo-400, + "indigo-500": $indigo-500, + "indigo-600": $indigo-600, + "indigo-700": $indigo-700, + "indigo-800": $indigo-800, + "indigo-900": $indigo-900 +); + +$purples: ( + "purple-100": $purple-200, + "purple-200": $purple-100, + "purple-300": $purple-300, + "purple-400": $purple-400, + "purple-500": $purple-500, + "purple-600": $purple-600, + "purple-700": $purple-700, + "purple-800": $purple-800, + "purple-900": $purple-900 +); + +$pinks: ( + "pink-100": $pink-100, + "pink-200": $pink-200, + "pink-300": $pink-300, + "pink-400": $pink-400, + "pink-500": $pink-500, + "pink-600": $pink-600, + "pink-700": $pink-700, + "pink-800": $pink-800, + "pink-900": $pink-900 +); + +$reds: ( + "red-100": $red-100, + "red-200": $red-200, + "red-300": $red-300, + "red-400": $red-400, + "red-500": $red-500, + "red-600": $red-600, + "red-700": $red-700, + "red-800": $red-800, + "red-900": $red-900 +); + +$oranges: ( + "orange-100": $orange-100, + "orange-200": $orange-200, + "orange-300": $orange-300, + "orange-400": $orange-400, + "orange-500": $orange-500, + "orange-600": $orange-600, + "orange-700": $orange-700, + "orange-800": $orange-800, + "orange-900": $orange-900 +); + +$yellows: ( + "yellow-100": $yellow-100, + "yellow-200": $yellow-200, + "yellow-300": $yellow-300, + "yellow-400": $yellow-400, + "yellow-500": $yellow-500, + "yellow-600": $yellow-600, + "yellow-700": $yellow-700, + "yellow-800": $yellow-800, + "yellow-900": $yellow-900 +); + +$greens: ( + "green-100": $green-100, + "green-200": $green-200, + "green-300": $green-300, + "green-400": $green-400, + "green-500": $green-500, + "green-600": $green-600, + "green-700": $green-700, + "green-800": $green-800, + "green-900": $green-900 +); + +$teals: ( + "teal-100": $teal-100, + "teal-200": $teal-200, + "teal-300": $teal-300, + "teal-400": $teal-400, + "teal-500": $teal-500, + "teal-600": $teal-600, + "teal-700": $teal-700, + "teal-800": $teal-800, + "teal-900": $teal-900 +); + +$cyans: ( + "cyan-100": $cyan-100, + "cyan-200": $cyan-200, + "cyan-300": $cyan-300, + "cyan-400": $cyan-400, + "cyan-500": $cyan-500, + "cyan-600": $cyan-600, + "cyan-700": $cyan-700, + "cyan-800": $cyan-800, + "cyan-900": $cyan-900 +); +// fusv-enable + +// Characters which are escaped by the escape-svg function +$escaped-characters: ( + ("<", "%3c"), + (">", "%3e"), + ("#", "%23"), + ("(", "%28"), + (")", "%29"), +); + +// Options +// +// Quickly modify global styling by enabling or disabling optional features. + +$enable-caret: true; +$enable-rounded: true; +$enable-shadows: false; +$enable-gradients: false; +$enable-transitions: true; +$enable-reduced-motion: true; +$enable-smooth-scroll: true; +$enable-grid-classes: true; +$enable-cssgrid: false; +$enable-button-pointers: true; +$enable-rfs: true; +$enable-validation-icons: true; +$enable-negative-margins: false; +$enable-deprecation-messages: true; +$enable-important-utilities: true; + +// Prefix for :root CSS variables + +$variable-prefix: bs-; + +// Gradient +// +// The gradient which is added to components if `$enable-gradients` is `true` +// This gradient is also added to elements with `.bg-gradient` +// scss-docs-start variable-gradient +$gradient: linear-gradient(180deg, rgba($white, .15), rgba($white, 0)); +// scss-docs-end variable-gradient + +// Spacing +// +// Control the default styling of most Bootstrap elements by modifying these +// variables. Mostly focused on spacing. +// You can add more entries to the $spacers map, should you need more variation. + +// scss-docs-start spacer-variables-maps +$spacer: 1rem; +$spacers: ( + 0: 0, + 1: $spacer * .25, + 2: $spacer * .5, + 3: $spacer, + 4: $spacer * 1.5, + 5: $spacer * 3, +); + +$negative-spacers: if($enable-negative-margins, negativify-map($spacers), null); +// scss-docs-end spacer-variables-maps + +// Position +// +// Define the edge positioning anchors of the position utilities. + +// scss-docs-start position-map +$position-values: ( + 0: 0, + 50: 50%, + 100: 100% +); +// scss-docs-end position-map + +// Body +// +// Settings for the `` element. + +$body-bg: $white; +$body-text-align: null; + +// Utilities maps +// +// Extends the default `$theme-colors` maps to help create our utilities. + +// Come v6, we'll de-dupe these variables. Until then, for backward compatibility, we keep them to reassign. +// scss-docs-start utilities-colors +$utilities-colors: $theme-colors-rgb; +// scss-docs-end utilities-colors + +// scss-docs-start utilities-text-colors +$utilities-text: map-merge( + $utilities-colors, + ( + "black": to-rgb($black), + "white": to-rgb($white), + "body": to-rgb($body-color) + ) +); +$utilities-text-colors: map-loop($utilities-text, rgba-css-var, "$key", "text"); +// scss-docs-end utilities-text-colors + +// scss-docs-start utilities-bg-colors +$utilities-bg: map-merge( + $utilities-colors, + ( + "black": to-rgb($black), + "white": to-rgb($white), + "body": to-rgb($body-bg) + ) +); +$utilities-bg-colors: map-loop($utilities-bg, rgba-css-var, "$key", "bg"); +// scss-docs-end utilities-bg-colors + +// Links +// +// Style anchor elements. + +$link-color: $primary; +$link-decoration: underline; +$link-shade-percentage: 20%; +$link-hover-color: shift-color($link-color, $link-shade-percentage); +$link-hover-decoration: null; + +$stretched-link-pseudo-element: after; +$stretched-link-z-index: 1; + +// Paragraphs +// +// Style p element. + +$paragraph-margin-bottom: 1rem; + + +// Grid breakpoints +// +// Define the minimum dimensions at which your layout will change, +// adapting to different screen sizes, for use in media queries. + +// scss-docs-start grid-breakpoints +$grid-breakpoints: ( + xs: 0, + sm: 576px, + md: 768px, + lg: 992px, + xl: 1200px, + xxl: 1400px +); +// scss-docs-end grid-breakpoints + +@include _assert-ascending($grid-breakpoints, "$grid-breakpoints"); +@include _assert-starts-at-zero($grid-breakpoints, "$grid-breakpoints"); + + +// Grid containers +// +// Define the maximum width of `.container` for different screen sizes. + +// scss-docs-start container-max-widths +$container-max-widths: ( + sm: 540px, + md: 720px, + lg: 960px, + xl: 1140px, + xxl: 1320px +); +// scss-docs-end container-max-widths + +@include _assert-ascending($container-max-widths, "$container-max-widths"); + + +// Grid columns +// +// Set the number of columns and specify the width of the gutters. + +$grid-columns: 12; +$grid-gutter-width: 1.5rem; +$grid-row-columns: 6; + +$gutters: $spacers; + +// Container padding + +$container-padding-x: $grid-gutter-width; + + +// Components +// +// Define common padding and border radius sizes and more. + +// scss-docs-start border-variables +$border-width: 1px; +$border-widths: ( + 1: 1px, + 2: 2px, + 3: 3px, + 4: 4px, + 5: 5px +); + +$border-color: $gray-200; +// scss-docs-end border-variables + +// scss-docs-start border-radius-variables +$border-radius: .25rem; +$border-radius-sm: .2rem; +$border-radius-lg: .3rem; +$border-radius-xl: 1rem; +$border-radius-2xl: 2rem; +$border-radius-pill: 50rem; +// scss-docs-end border-radius-variables + +// scss-docs-start box-shadow-variables +$box-shadow: 0 .5rem 1rem rgba($black, .15); +$box-shadow-sm: 0 .125rem .25rem rgba($black, .075); +$box-shadow-lg: 0 1rem 3rem rgba($black, .175); +$box-shadow-inset: inset 0 1px 2px rgba($black, .075); +// scss-docs-end box-shadow-variables + +$component-active-color: $white; +$component-active-bg: $primary; + +// scss-docs-start caret-variables +$caret-width: .3em; +$caret-vertical-align: $caret-width * .85; +$caret-spacing: $caret-width * .85; +// scss-docs-end caret-variables + +$transition-base: all .2s ease-in-out; +$transition-fade: opacity .15s linear; +// scss-docs-start collapse-transition +$transition-collapse: height .35s ease; +$transition-collapse-width: width .35s ease; +// scss-docs-end collapse-transition + +// stylelint-disable function-disallowed-list +// scss-docs-start aspect-ratios +$aspect-ratios: ( + "1x1": 100%, + "4x3": calc(3 / 4 * 100%), + "16x9": calc(9 / 16 * 100%), + "21x9": calc(9 / 21 * 100%) +); +// scss-docs-end aspect-ratios +// stylelint-enable function-disallowed-list + +// Typography +// +// Font, line-height, and color for body text, headings, and more. + +// scss-docs-start font-variables +// stylelint-disable value-keyword-case + +// $font-family-sans-serif: 'Nunito', sans-serif; +// $font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; +// stylelint-enable value-keyword-case +$font-family-base: var(--#{$variable-prefix}font-sans-serif); +$font-family-code: var(--#{$variable-prefix}font-monospace); + +// $font-size-root affects the value of `rem`, which is used for as well font sizes, paddings, and margins +// $font-size-base affects the font size of the body text +$font-size-root: null; +$font-size-base: 1rem; // Assumes the browser default, typically `16px` +$font-size-sm: $font-size-base * .875; +$font-size-lg: $font-size-base * 1.25; + +$font-weight-lighter: lighter; +$font-weight-light: 300; +$font-weight-normal: 400; +$font-weight-bold: 700; +$font-weight-bolder: bolder; + +$font-weight-base: $font-weight-normal; + +$line-height-base: 1.5; +$line-height-sm: 1.25; +$line-height-lg: 2; + +$h1-font-size: 42px; +$h2-font-size: 36px; +$h3-font-size: 30px; +$h4-font-size: 24px; +$h5-font-size: 20px; +$h6-font-size: 16px; +// scss-docs-end font-variables + +// scss-docs-start font-sizes +$font-sizes: ( + 1: $h1-font-size, + 2: $h2-font-size, + 3: $h3-font-size, + 4: $h4-font-size, + 5: $h5-font-size, + 6: $h6-font-size +); +// scss-docs-end font-sizes + +// scss-docs-start headings-variables +$headings-margin-bottom: $spacer * .5; +$headings-font-family: null; +$headings-font-style: null; +$headings-font-weight: 500; +$headings-line-height: 1.2; +$headings-color: null; +// scss-docs-end headings-variables + +// scss-docs-start display-headings +$display-font-sizes: ( + 1: 80px, + 2: 72px, + 3: 64px, + 4: 56px, + 5: 48px, + 6: 40px +); + +$display-font-weight: 300; +$display-line-height: $headings-line-height; +// scss-docs-end display-headings + +// scss-docs-start type-variables +$lead-font-size: $font-size-base * 1.25; +$lead-font-weight: 300; + +$small-font-size: .875em; + +$sub-sup-font-size: .75em; + +$text-muted: $muted; + +$initialism-font-size: $small-font-size; + +$blockquote-margin-y: $spacer; +$blockquote-font-size: $font-size-base * 1.25; +$blockquote-footer-color: $gray-600; +$blockquote-footer-font-size: $small-font-size; + +$hr-margin-y: $spacer; +$hr-color: inherit; +$hr-height: $border-width; +$hr-opacity: .25; + +$legend-margin-bottom: .5rem; +$legend-font-size: 1.5rem; +$legend-font-weight: null; + +$mark-padding: .2em; + +$dt-font-weight: $font-weight-bold; + +$nested-kbd-font-weight: $font-weight-bold; + +$list-inline-padding: .5rem; + +$mark-bg: #fcf8e3; +// scss-docs-end type-variables + + +// Buttons + Forms +// +// Shared variables that are reassigned to `$input-` and `$btn-` specific variables. + +// scss-docs-start input-btn-variables +$input-btn-padding-y: .375rem; +$input-btn-padding-x: .75rem; +$input-btn-font-family: null; +$input-btn-font-size: $font-size-base; +$input-btn-line-height: $line-height-base; + +$input-btn-focus-width: .25rem; +$input-btn-focus-color-opacity: .25; +$input-btn-focus-color: rgba($component-active-bg, $input-btn-focus-color-opacity); +$input-btn-focus-blur: 0; +$input-btn-focus-box-shadow: 0 0 $input-btn-focus-blur $input-btn-focus-width $input-btn-focus-color; + +$input-btn-padding-y-sm: .25rem; +$input-btn-padding-x-sm: .5rem; +$input-btn-font-size-sm: $font-size-sm; + +$input-btn-padding-y-lg: .5rem; +$input-btn-padding-x-lg: 1rem; +$input-btn-font-size-lg: $font-size-lg; + +$input-btn-border-width: $border-width; +// scss-docs-end input-btn-variables + + +// Buttons +// +// For each of Bootstrap's buttons, define text, background, and border color. + +// scss-docs-start btn-variables +$btn-padding-y: $input-btn-padding-y; +$btn-padding-x: $input-btn-padding-x; +$btn-font-family: $input-btn-font-family; +$btn-font-size: $input-btn-font-size; +$btn-line-height: $input-btn-line-height; +$btn-white-space: null; // Set to `nowrap` to prevent text wrapping + +$btn-padding-y-sm: $input-btn-padding-y-sm; +$btn-padding-x-sm: $input-btn-padding-x-sm; +$btn-font-size-sm: $input-btn-font-size-sm; + +$btn-padding-y-lg: $input-btn-padding-y-lg; +$btn-padding-x-lg: $input-btn-padding-x-lg; +$btn-font-size-lg: $input-btn-font-size-lg; + +$btn-border-width: $input-btn-border-width; + +$btn-font-weight: $font-weight-normal; +$btn-box-shadow: inset 0 1px 0 rgba($white, .15), 0 1px 1px rgba($black, .075); +$btn-focus-width: $input-btn-focus-width; +$btn-focus-box-shadow: $input-btn-focus-box-shadow; +$btn-disabled-opacity: .65; +$btn-active-box-shadow: inset 0 3px 5px rgba($black, .125); + +$btn-link-color: $link-color; +$btn-link-hover-color: $link-hover-color; +$btn-link-disabled-color: $gray-600; + +// Allows for customizing button radius independently from global border radius +$btn-border-radius: $border-radius; +$btn-border-radius-sm: $border-radius-sm; +$btn-border-radius-lg: $border-radius-lg; + +$btn-transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out; + +$btn-hover-bg-shade-amount: 15%; +$btn-hover-bg-tint-amount: 15%; +$btn-hover-border-shade-amount: 20%; +$btn-hover-border-tint-amount: 10%; +$btn-active-bg-shade-amount: 20%; +$btn-active-bg-tint-amount: 20%; +$btn-active-border-shade-amount: 25%; +$btn-active-border-tint-amount: 10%; +// scss-docs-end btn-variables + + +// Z-index master list +// +// Warning: Avoid customizing these values. They're used for a bird's eye view +// of components dependent on the z-axis and are designed to all work together. + +// scss-docs-start zindex-stack +$zindex-dropdown: 1000; +$zindex-sticky: 1020; +$zindex-fixed: 1030; +$zindex-offcanvas-backdrop: 1040; +$zindex-offcanvas: 1045; +$zindex-modal-backdrop: 1050; +$zindex-modal: 1055; +$zindex-popover: 1070; +$zindex-tooltip: 1080; +// scss-docs-end zindex-stack + + +// Navs + +// scss-docs-start nav-variables +$nav-link-padding-y: .5rem; +$nav-link-padding-x: 1rem; +$nav-link-font-size: null; +$nav-link-font-weight: null; +$nav-link-color: $link-color; +$nav-link-hover-color: $link-hover-color; +$nav-link-transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out; +$nav-link-disabled-color: $gray-600; + +$nav-tabs-border-color: $gray-300; +$nav-tabs-border-width: $border-width; +$nav-tabs-border-radius: $border-radius; +$nav-tabs-link-hover-border-color: $gray-200 $gray-200 $nav-tabs-border-color; +$nav-tabs-link-active-color: $gray-700; +$nav-tabs-link-active-bg: $body-bg; +$nav-tabs-link-active-border-color: $gray-300 $gray-300 $nav-tabs-link-active-bg; + +$nav-pills-border-radius: $border-radius; +$nav-pills-link-active-color: $component-active-color; +$nav-pills-link-active-bg: $component-active-bg; +// scss-docs-end nav-variables + + +// Navbar + +// scss-docs-start navbar-variables +$navbar-padding-y: $spacer * .5; +$navbar-padding-x: null; + +$navbar-nav-link-padding-x: .5rem; + +$navbar-brand-font-size: $font-size-lg; +// Compute the navbar-brand padding-y so the navbar-brand will have the same height as navbar-text and nav-link +$nav-link-height: $font-size-base * $line-height-base + $nav-link-padding-y * 2; +$navbar-brand-height: $navbar-brand-font-size * $line-height-base; +$navbar-brand-padding-y: ($nav-link-height - $navbar-brand-height) * .5; +$navbar-brand-margin-end: 1rem; + +$navbar-toggler-padding-y: .25rem; +$navbar-toggler-padding-x: .75rem; +$navbar-toggler-font-size: $font-size-lg; +$navbar-toggler-border-radius: $btn-border-radius; +$navbar-toggler-focus-width: $btn-focus-width; +$navbar-toggler-transition: box-shadow .15s ease-in-out; +// scss-docs-end navbar-variables + +// scss-docs-start navbar-theme-variables +$navbar-dark-color: rgba($white, .55); +$navbar-dark-hover-color: rgba($white, .75); +$navbar-dark-active-color: $white; +$navbar-dark-disabled-color: rgba($white, .25); +$navbar-dark-toggler-icon-bg: url("data:image/svg+xml,"); +$navbar-dark-toggler-border-color: rgba($white, .1); + +$navbar-light-color: rgba($black, .55); +$navbar-light-hover-color: rgba($black, .7); +$navbar-light-active-color: rgba($black, .9); +$navbar-light-disabled-color: rgba($black, .3); +$navbar-light-toggler-icon-bg: url("data:image/svg+xml,"); +$navbar-light-toggler-border-color: rgba($black, .1); + +$navbar-light-brand-color: $navbar-light-active-color; +$navbar-light-brand-hover-color: $navbar-light-active-color; +$navbar-dark-brand-color: $navbar-dark-active-color; +$navbar-dark-brand-hover-color: $navbar-dark-active-color; +// scss-docs-end navbar-theme-variables + + +// Cards + +// scss-docs-start card-variables +$card-spacer-y: $spacer; +$card-spacer-x: $spacer; +$card-title-spacer-y: $spacer * .5; +$card-border-width: $border-width; +$card-border-color: rgba($black, .125); +$card-border-radius: $border-radius; +$card-box-shadow: null; +$card-inner-border-radius: subtract($card-border-radius, $card-border-width); +$card-cap-padding-y: $card-spacer-y * .5; +$card-cap-padding-x: $card-spacer-x; +$card-cap-bg: rgba($black, .03); +$card-cap-color: null; +$card-height: null; +$card-color: null; +$card-bg: $white; +$card-img-overlay-padding: $spacer; +$card-group-margin: $grid-gutter-width * .5; +// scss-docs-end card-variables + + +// Badges + +// scss-docs-start badge-variables +$badge-font-size: .75em; +$badge-font-weight: $font-weight-bold; +$badge-color: $white; +$badge-padding-y: .35em; +$badge-padding-x: .65em; +$badge-border-radius: $border-radius; +// scss-docs-end badge-variables + + +// Close + +// scss-docs-start close-variables +$btn-close-width: 1em; +$btn-close-height: $btn-close-width; +$btn-close-padding-x: .25em; +$btn-close-padding-y: $btn-close-padding-x; +$btn-close-color: $black; +$btn-close-bg: url("data:image/svg+xml,"); +$btn-close-focus-shadow: $input-btn-focus-box-shadow; +$btn-close-opacity: .5; +$btn-close-hover-opacity: .75; +$btn-close-focus-opacity: 1; +$btn-close-disabled-opacity: .25; +$btn-close-white-filter: invert(1) grayscale(100%) brightness(200%); +// scss-docs-end close-variables + +// Code + +$code-font-size: $small-font-size; +$code-color: $pink; + +$kbd-padding-y: .2rem; +$kbd-padding-x: .4rem; +$kbd-font-size: $code-font-size; +$kbd-color: $white; +$kbd-bg: $gray-900; + +$pre-color: null; diff --git a/assets/scss/custom/structure/_general.scss b/assets/scss/custom/structure/_general.scss new file mode 100644 index 0000000..bb0b4c9 --- /dev/null +++ b/assets/scss/custom/structure/_general.scss @@ -0,0 +1,40 @@ +// Overwriting the theme stylesheet to reenable link decoration + +body { + font-family: $font-family-secondary; + overflow-x: hidden !important; + font-size: $font-size-base; + color: $body-color; + background-color: $body-bg; +} +@media (max-width: 1199px) { + html { + scroll-padding-top: 80px; + } +} +h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { + font-family: $font-family-base; + line-height: 1.4; + font-weight: 600; +} +::selection { + background: rgba($primary, 0.9); + color: $white; +} +a { + transition: all 0.5s ease; +} +p { + line-height: 1.6; +} + +.four-oh-four { + min-height: calc(100vh - 180px); + @media (max-width: 767px) { + min-height: calc(100vh - 241px); + } +} + +#navigation a { + text-decoration: none !important; +} \ No newline at end of file diff --git a/assets/scss/style.scss b/assets/scss/style.scss new file mode 100644 index 0000000..6a4228a --- /dev/null +++ b/assets/scss/style.scss @@ -0,0 +1,64 @@ +// Overwriting the theme stylesheet to allow custom colors + +/* Template Name: LotusLabs Docs + Author: Colin Wilson + E-mail: colin.wilson@proton.me + Created: October 2022 + Version: 1.0.0 + File Description: Main CSS file of the Landing Page template +*/ + +//Custom Font Variables +$font-family-secondary: {{ .Site.Params.secondary_font | default "-apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Helvetica Neue', 'Ubuntu'" }}; +$font-family-sans-serif: {{ .Site.Params.sans_serif_font | default "-apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Helvetica Neue', 'Ubuntu'" }}; +$font-family-monospace: {{ .Site.Params.mono_font | default "SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace" }}; + +//Fonts +// @import "custom/fonts/fonts"; + +// scss-docs-start theme-color-variables +$primary: {{ .Site.Params.primary | default "#0066ff" }}; +$secondary: {{ .Site.Params.secondary | default "#6c757d" }}; +$success: {{ .Site.Params.success | default "#2eca8b" }}; +$info: {{ .Site.Params.info | default "#17a2b8" }}; +$warning: {{ .Site.Params.warning | default "#f17425" }}; +$danger: {{ .Site.Params.danger | default "#e43f52" }}; +$light: {{ .Site.Params.light | default "#f8f9fa" }}; +$dark: {{ .Site.Params.dark | default "#3c4858" }}; +// scss-docs-end theme-color-variables + +//Core files +@import "bootstrap/functions"; +@import "bootstrap/variables"; +@import "variables"; +@import "bootstrap/mixins"; +@import "bootstrap/bootstrap"; + +// Plugins +@import "custom/plugins/icons/google-material"; + +// Structure +@import "custom/structure/general"; +@import "custom/structure/topbar"; +// @import "custom/structure/content"; +// @import "custom/structure/sidebar-layouts"; +// @import "custom/structure/doc-nav"; +// @import "custom/structure/toc-layouts"; +@import "custom/structure/footer"; + +// // Components +@import "custom/components/buttons"; +@import "custom/components/badge"; +@import "custom/components/backgrounds"; +// @import "custom/components/alerts"; +// @import "custom/components/card"; + +// // Pages +// @import "custom/pages/blog"; + +@import "custom/pages/features"; +@import "custom/pages/helper"; +@import "custom/pages/hero"; +{{ if ($.Scratch.Get "image_compare_enabled") }}@import "custom/pages/image-compare-viewer";{{ end }} + +// @import "custom/pages/simplebar"; diff --git a/config.toml b/config.toml deleted file mode 100644 index 6158747..0000000 --- a/config.toml +++ /dev/null @@ -1,65 +0,0 @@ -title = 'Freifunk Berlin' -languageCode = 'de' - -baseURL = "https://berlin.freifunk.net" -theme = "ananke" - -defaultContentLanguage = "de" -defaultContentLanguageInSubdir = true - -SectionPagesMenu = "main" -enableRobotsTXT = true - -timeout = "100s" - -disableKinds = ['taxonomy', 'term'] - -[languages] - [languages.de] - weight = 1 - languageName = "Deutsch" - languageCode = "de" - title = "Freifunk Berlin" - [languages.en] - weight = 2 - languageName = "English" - languageCode = "en" - title = "Freifunk Berlin" - -[sitemap] - filename = "sitemap.xml" - -[params] - text_color = "" - author = "" - favicon = "favicon.ico" - site_logo = "logo.svg" - description = "" - # choose a background color from any on this page: https://tachyons.io/docs/themes/skins/ and preface it with "bg-" - # background_color_class = "bg-white" - # recent_posts_number = 3 - -[[params.ananke_socials]] -name = "twitter" -url = "https://twitter.com/freifunk_berlin" - -[[params.ananke_socials]] -name = "github" -url = "https://github.com/freifunk-berlin" - -[menu] -[[menu.main]] - name = 'freifunk.net' - url = 'https://freifunk.net' - weight = 8 - [menu.main.params] - rel = 'external' -[[menu.main]] - name = 'FAQ' - url = 'https://wiki.freifunk.net/Berlin:FAQ' - weight = 6 - [menu.main.params] - rel = 'external' - -[markup.goldmark.renderer] -unsafe = true diff --git a/content/_index.de.md b/content/_index.de.md index c311f89..308017c 100644 --- a/content/_index.de.md +++ b/content/_index.de.md @@ -1,9 +1,3 @@ ---- -title: "Freifunk Berlin" -description: "Freifunk Berlin ist eine lokale Initiative mit dem Ziel, ein freies WLAN-Netzwerk über Berlin aufzuspannen und freien Netzzugang anzubieten." -featured_image: '/header.jpg' ---- - ## Was ist Freifunk? Die Vision von Freifunk ist die Verbreitung freier Netzwerke, die Demokratisierung der Kommunikationsmedien und die Förderung lokaler Sozialstrukturen. Durch die Vernetzung ganzer Stadtteile wollen wir der digitalen Spaltung entgegenwirken und freie unabhängige Netzwerkstrukturen aufbauen. Konkret hat sich Freifunk zum Ziel gesetzt, offene WLAN-Netze einzurichten und diese miteinander zu verbinden. Dies ermöglicht einen freien Datenverkehr "durch die Luft" in der ganzen Stadt innerhalb des Freifunk-Netzes. Freifunk ist somit eine offene nicht-kommerzielle hierarchielose Initiative für freie Funknetzwerke. @@ -14,7 +8,7 @@ Die Vision von Freifunk ist die Verbreitung freier Netzwerke, die Demokratisieru Die Grundlage von Freifunk bildet ein sogenanntes Mesh-Netzwerk. Alle WLAN-Router im Freifunk-Netz kommunizieren untereinander und bilden ein eigenes Funknetzwerk in der Stadt. Ein Routing-Protokoll ermöglicht, dass jeder Mensch im Freifunk-Netz andere Teilnehmer_innen erreichen und Daten austauschen kann. Manche Knoten sind desweiteren auch direkt mit dem Internet verbunden. So haben alle Menschen im Freifunk-Netz auch direkten Zugriff auf das globale Netz. -{{< img src="adhoc_netz_wikipedia.png" alt="mesh cloud with one node that has internet connection" >}} +{{< img src="images/adhoc_netz_wikipedia.webp" alt="mesh cloud with one node that has internet connection" width="350" height="168" loading="lazy" >}} ## Wie kann ich mitmachen? diff --git a/content/_index.en.md b/content/_index.en.md index a1142d9..58729a8 100644 --- a/content/_index.en.md +++ b/content/_index.en.md @@ -1,9 +1,3 @@ ---- -title: "Freifunk Berlin" -description: "Freifunk Berlin is a local initiative with the aim of setting up a free WiFi network across Berlin and offering free network access." -featured_image: '/header.jpg' ---- - ## What is Freifunk? Freifunk stands for distributing free networks, democratizing media of communication and promoting local social structures. By interconnecting whole neighborhoods, we want to bridge the digital gap and establish a free and independent network infrastructure. More precisely, the aim of Freifunk is installing open wifi networks and interconnecting them. This facilitates free data "air traffic" in the whole city within the Freifunk network. In short, Freifunk is an open, non-commercial, non-hierarchical initiative for free networks. @@ -14,7 +8,7 @@ Freifunk stands for distributing free networks, democratizing media of communica Freifunk's foundation is a so called mesh network. All routers within the Freifunk network can communicate with one another and form their own wifi network. A routing protocol allows for everybody within the Freifunk network to communicate and exchange data with other participants. Some of the nodes within the network are further connected with the Internet. That way, everyone within Freifunk has also a direct access to the global network. -{{< img src="adhoc_netz_wikipedia.png" alt="mesh cloud with one node that has internet connection" >}} +{{< img src="images/adhoc_netz_wikipedia.webp" alt="mesh cloud with one node that has internet connection" width="350" height="168" loading="lazy" >}} ## How can I contribute? diff --git a/content/contact.de.md b/content/contact.de.md index fc41c79..84b1c1e 100644 --- a/content/contact.de.md +++ b/content/contact.de.md @@ -1,10 +1,5 @@ --- title: "Kontakt" -description: "" -omit_header_text: true -menu: - main: - weight: 7 --- ## Treffen diff --git a/content/contact.en.md b/content/contact.en.md index fa6f853..ab12085 100644 --- a/content/contact.en.md +++ b/content/contact.en.md @@ -1,10 +1,5 @@ --- title: "Contact" -description: "" -omit_header_text: true -menu: - main: - weight: 7 --- ## Meetings diff --git a/content/donate.de.md b/content/donate.de.md index 89981a1..cc26c1f 100644 --- a/content/donate.de.md +++ b/content/donate.de.md @@ -1,10 +1,5 @@ --- title: "Spenden" -description: "" -omit_header_text: true -menu: - main: - weight: 3 --- ## Freifunk in Berlin durch Spenden unterstützen diff --git a/content/donate.en.md b/content/donate.en.md index d527c18..ea2d18d 100644 --- a/content/donate.en.md +++ b/content/donate.en.md @@ -1,10 +1,5 @@ --- title: "Donate" -description: "" -omit_header_text: true -menu: - main: - weight: 3 --- ## Support Freifunk in Berlin through donations diff --git a/content/downloads.de.md b/content/downloads.de.md index 5ae5766..a0acfcd 100644 --- a/content/downloads.de.md +++ b/content/downloads.de.md @@ -1,10 +1,5 @@ --- title: "Downloads" -description: "" -omit_header_text: true -menu: - main: - weight: 5 --- ## Freifunk Berlin Downloads diff --git a/content/downloads.en.md b/content/downloads.en.md index ace5ede..9f5311a 100644 --- a/content/downloads.en.md +++ b/content/downloads.en.md @@ -1,10 +1,5 @@ --- title: "Downloads" -description: "" -omit_header_text: true -menu: - main: - weight: 5 --- ## Freifunk Berlin Downloads diff --git a/content/impressum.de.md b/content/imprint.de.md similarity index 97% rename from content/impressum.de.md rename to content/imprint.de.md index ddff66b..407020e 100644 --- a/content/impressum.de.md +++ b/content/imprint.de.md @@ -1,17 +1,7 @@ --- title: "Impressum" -description: "" -featured_image: '' -omit_header_text: true -description: '' -type: page -menu: footer - --- - -### Impressum - **Kontakt Freifunk Berlin** info{at}berlin.freifunk.net diff --git a/content/map.de.md b/content/map.de.md index 8bdaacb..7d0d1b3 100644 --- a/content/map.de.md +++ b/content/map.de.md @@ -1,15 +1,11 @@ --- title: "Netzkarte" description: "Karte der freien WLAN Zugangspunkte von Freifunk Berlin mit genauer Lage. Die WLAN Zugangspunkte sind kostenlos nutzbar, unzensiert und öffentlich zugänglich." -omit_header_text: true -menu: - main: - weight: 2 --- Die [Freifunk Berlin Karte](https://hopglass.berlin.freifunk.net/) zeigt freie WLAN Zugangspunkte mit ihrer genauen Lage. Die WLAN Zugangspunkte sind kostenlos nutzbar, unzensiert und öffentlich zugänglich. -{{< img src="hopglass.png" alt="Es ist eine Karte von Berlin zu sehen. Auf der Karte sind viele kleine Punkte. Die meisten sind blau, einige sind rot. Zwischen manchen der Punkte sind grüne Linien gezogen." link="https://hopglass.berlin.freifunk.net/" width="100%" >}} +{{< img src="images/hopglass.webp" alt="Es ist eine Karte von Berlin zu sehen. Auf der Karte sind viele kleine Punkte. Die meisten sind blau, einige sind rot. Zwischen manchen der Punkte sind grüne Linien gezogen." link="https://hopglass.berlin.freifunk.net/" width="1127" height="850" loading="lazy" >}} ## Statistiken diff --git a/content/map.en.md b/content/map.en.md index 7124296..bbd6431 100644 --- a/content/map.en.md +++ b/content/map.en.md @@ -1,15 +1,11 @@ --- title: "Network map" description: "Map of the free WiFi access points from Freifunk Berlin with exact locations. The WiFi access points are free to use, uncensored and publicly accessible." -omit_header_text: true -menu: - main: - weight: 2 --- The [Freifunk Berlin map](https://hopglass.berlin.freifunk.net/) shows free WiFi access points with their exact location. The WiFi access points are free to use, uncensored and publicly accessible. -{{< img src="hopglass.png" alt="You can see a map of Berlin. There are lots of little dots on the map. Most of them are blue, some are red. There are green lines between some of the dots." link="https://hopglass.berlin.freifunk.net/" width="100%" >}} +{{< img src="images/hopglass.webp" alt="You can see a map of Berlin. There are lots of little dots on the map. Most of them are blue, some are red. There are green lines between some of the dots." link="https://hopglass.berlin.freifunk.net/" width="1127" height="850" loading="lazy" >}} ## Statistics diff --git a/content/participate.de.md b/content/participate.de.md index 2369b1f..3b678d5 100644 --- a/content/participate.de.md +++ b/content/participate.de.md @@ -1,10 +1,5 @@ --- title: "Mitmachen" -description: "" -omit_header_text: true -menu: - main: - weight: 2 --- ## Jede\_r kann mitmachen! @@ -24,7 +19,7 @@ Sprich mit deinem Freundeskreis, Geschäftspartner\_innen und allen Menschen die _Wohnung, Geschäft, Café, Restaurant, Bar ..._ -{{< img src="participate_small.png" alt="Person am Laptop mit einem Router auf der Fensterbank" >}} +{{< img src="images/participate_small.webp" alt="Person am Laptop mit einem Router auf der Fensterbank" width="400" height="258" loading="lazy" >}} Du möchtest @@ -42,7 +37,7 @@ So kannst du mitmachen _Balkon, hohes Gebäude, öffentlicher Platz, Park, weitläufiges Gelände ..._ -{{< img src="participate_medium.png" alt="Glückliche Personen mit Wlan Empfang am Handy und Laptops" >}} +{{< img src="images/participate_medium.webp" alt="Glückliche Personen mit Wlan Empfang am Handy und Laptops" width="400" height="258" loading="lazy" >}} Du möchtest @@ -59,7 +54,7 @@ So kannst du mitmachen _Dach, Dachgeschoss, hohes Gebäude, öffentliches Gebäude, Rathaus, Kirchturm ..._ -{{< img src="participate_big.png" alt="Dächer von Häusern die mit roten Punkten und Linien miteinander verbunden sind um das Mesh-Netz zu symbolisieren" >}} +{{< img src="images/participate_big.webp" alt="Dächer von Häusern die mit roten Punkten und Linien miteinander verbunden sind um das Mesh-Netz zu symbolisieren" width="400" height="258" loading="lazy" >}} Du möchtest diff --git a/content/participate.en.md b/content/participate.en.md index 4fd2b4c..85a602b 100644 --- a/content/participate.en.md +++ b/content/participate.en.md @@ -1,10 +1,5 @@ --- title: "Participate" -description: "" -omit_header_text: true -menu: - main: - weight: 2 --- ## Everybody can participate! @@ -24,7 +19,7 @@ Talk to your friends, business partners and everyone who surrounds you and sprea _Apartment, shop, cafe, restaurant, bar..._ -{{< img src="participate_small.png" alt="Person at the laptop with a router on the windowsill" >}} +{{< img src="images/participate_small.webp" alt="Person at the laptop with a router on the windowsill" width="400" height="258" loading="lazy" >}} You want to @@ -42,7 +37,7 @@ Here's how you can join in _Balcony, tall building, public square, park, extensive grounds..._ -{{< img src="participate_medium.png" alt="Happy people with WiFi reception on cell phones and laptops" >}} +{{< img src="images/participate_medium.webp" alt="Happy people with WiFi reception on cell phones and laptops" width="400" height="258" loading="lazy" >}} You want to @@ -59,7 +54,7 @@ Here's how you can join in _Roof, attic, tall building, public building, town hall, church tower..._ -{{< img src="participate_big.png" alt="Roofs of houses connected with red dots and lines to symbolize the mesh network" >}} +{{< img src="images/participate_big.webp" alt="Roofs of houses connected with red dots and lines to symbolize the mesh network" width="400" height="258" loading="lazy" >}} You want to diff --git a/content/wiki.de.md b/content/wiki.de.md index 9915e0e..212fff7 100644 --- a/content/wiki.de.md +++ b/content/wiki.de.md @@ -1,10 +1,6 @@ --- title: "Wiki" description: "Das Freifunk-Wiki" -omit_header_text: true -menu: - main: - weight: 4 --- Das [Freifunk-Wiki](https://wiki.freifunk.net/) ist eine zentrale diff --git a/content/wiki.en.md b/content/wiki.en.md index ac89727..c0668c8 100644 --- a/content/wiki.en.md +++ b/content/wiki.en.md @@ -1,10 +1,6 @@ --- title: "Wiki" description: "The Freifunk-Wiki" -omit_header_text: true -menu: - main: - weight: 4 --- The [Freifunk-Wiki](https://wiki.freifunk.net/) is a central source of information for Freifunkers, in which everyone is warmly invited to participate. Freifunk Berlin is also there. diff --git a/go.mod b/go.mod new file mode 100644 index 0000000..e2ae1aa --- /dev/null +++ b/go.mod @@ -0,0 +1,5 @@ +module github.com/freifunk-berlin/berlin.freifunk.net + +go 1.21.8 + +require github.com/gohugoio/hugo-mod-bootstrap-scss/v5 v5.20300.20200 // indirect diff --git a/go.sum b/go.sum new file mode 100644 index 0000000..5036623 --- /dev/null +++ b/go.sum @@ -0,0 +1,4 @@ +github.com/gohugoio/hugo-mod-bootstrap-scss/v5 v5.20300.20200 h1:SmpwwN3DNzJWbV+IT8gaFu07ENUFpCvKou5BHYUKuVs= +github.com/gohugoio/hugo-mod-bootstrap-scss/v5 v5.20300.20200/go.mod h1:kx8MBj9T7SFR8ZClWvKZPmmUxBaltkoXvnWlZZcSnYA= +github.com/gohugoio/hugo-mod-jslibs-dist/popperjs/v2 v2.21100.20000/go.mod h1:mFberT6ZtcchrsDtfvJM7aAH2bDKLdOnruUHl0hlapI= +github.com/twbs/bootstrap v5.3.2+incompatible/go.mod h1:fZTSrkpSf0/HkL0IIJzvVspTt1r9zuf7XlZau8kpcY0= diff --git a/hugo.toml b/hugo.toml new file mode 100644 index 0000000..93b475f --- /dev/null +++ b/hugo.toml @@ -0,0 +1,128 @@ +title = 'Freifunk Berlin' +languageCode = 'de' + +baseURL = "https://berlin.freifunk.net" + +defaultContentLanguage = "de" +defaultContentLanguageInSubdir = true + +enableRobotsTXT = true + +timeout = "120s" + +disableKinds = ['taxonomy', 'term'] + +[module] + replacements = "github.com/colinwilson/lotusdocs -> lotusdocs" + [[module.imports]] + path = "github.com/colinwilson/lotusdocs" + disable = false + [[module.imports]] + path = "github.com/gohugoio/hugo-mod-bootstrap-scss/v5" + disable = false + +[languages] + [languages.de] + weight = 1 + languageName = "Deutsch" + languageCode = "de" + title = "Freifunk Berlin" + [languages.de.menus] + [[languages.de.menus.primary]] + name = 'Mitmachen' + url = "participate/" + weight = 10 + [[languages.de.menus.primary]] + name = 'Netzkarte' + url = 'map/' + weight = 20 + [[languages.de.menus.primary]] + name = 'Spenden' + url = 'donate/' + weight = 30 + [[languages.de.menus.primary]] + name = 'Wiki' + url = 'wiki/' + weight = 40 + [[languages.de.menus.primary]] + name = 'Downloads' + url = 'downloads/' + weight = 50 + [[languages.de.menus.primary]] + name = 'FAQ' + url = 'https://wiki.freifunk.net/Berlin:FAQ' + weight = 60 + [[languages.de.menus.primary]] + name = 'Kontakt' + url = 'contact/' + weight = 70 + [[languages.de.menus.primary]] + name = 'freifunk.net' + url = 'https://freifunk.net/' + weight = 80 + [languages.de.params] + description = "Freifunk Berlin ist eine lokale Initiative mit dem Ziel, ein freies WLAN-Netzwerk über Berlin aufzuspannen und freien Netzzugang anzubieten." + [[languages.de.params.footer]] + name = "Impressum" + url = "imprint/" + [languages.en] + weight = 2 + languageName = "English" + languageCode = "en" + title = "Freifunk Berlin" + [languages.en.menus] + [[languages.en.menus.primary]] + name = 'Participate' + url = "participate/" + weight = 10 + [[languages.en.menus.primary]] + name = 'Map' + url = 'map/' + weight = 20 + [[languages.en.menus.primary]] + name = 'Donate' + url = 'donate/' + weight = 30 + [[languages.en.menus.primary]] + name = 'Wiki' + url = 'wiki/' + weight = 40 + [[languages.en.menus.primary]] + name = 'Downloads' + url = 'downloads/' + weight = 50 + [[languages.en.menus.primary]] + name = 'FAQ' + url = 'https://wiki.freifunk.net/Berlin:FAQ' + weight = 60 + [[languages.en.menus.primary]] + name = 'Contact' + url = 'contact/' + weight = 70 + [[languages.en.menus.primary]] + name = 'freifunk.net' + url = 'https://freifunk.net/' + weight = 80 + [languages.en.params] + description = "Freifunk Berlin is a local initiative with the aim of setting up a free WiFi network across Berlin and offering free network access." + [[languages.en.params.footer]] + name = "Imprint" + url = "imprint/" + +[sitemap] + filename = "sitemap.xml" + +[markup.goldmark.renderer] + unsafe = true + +[params] + sans_serif_font = "Arial" + secondary_font = "Arial" + mono_font = "Courier New" + primary = "#dc0067" + [params.social] + github = "freifunk-berlin/" + twitter = "freifunk_berlin/" + +[build] + writeStats = true diff --git a/layouts/_default/baseof.html b/layouts/_default/baseof.html new file mode 100644 index 0000000..1349ca6 --- /dev/null +++ b/layouts/_default/baseof.html @@ -0,0 +1,66 @@ +{{/* Overwriting the theme template to fix mobile nav-bar. */}} + +{{ $.Scratch.Delete "social_list" }} + +{{ $social_params := slice "github" "twitter" "instagram" "rss" }} +{{ range $social_params }} + {{ if isset site.Params.social . }} + {{ $.Scratch.Add "social_list" (slice .) }} + {{ end }} +{{ end }} + + +{{ $ic := newScratch }} +{{ range $value := .Site.Data.landing }} + {{ $template := string (replaceRE `( |-{1,})` "_" $value.template) }} + {{ if eq $template "image_compare" }} + {{ if $value.enable }} + {{ $ic.Add "enabled" (slice $value.enable) }} + {{ range $value.items }} + {{ $ic.Add "config" (slice (.config | jsonify | safeJS)) }} + {{ end }} + {{ end }} + {{- end }} +{{ end }} + +{{ $.Scratch.Set "image_compare_enabled" (in ($ic.Get "enabled") true) }} + + + {{- partial "head.html" . -}} + +
+ {{- partial "header.html" . -}} +
+
+ {{- block "main" . }}{{- end }} +
+ {{- partial "footer.html" . -}} + + + {{ $app := resources.Get "/js/app.js" }} + {{- if not .Site.IsServer }} + {{- $js := (slice $app) | resources.Concat "/js/bundle.js" | minify | fingerprint "sha384" }} + + {{- else }} + {{- $js := (slice $app) | resources.Concat "/js/bundle.js" }} + + {{- end }} + + + {{ if ($.Scratch.Get "image_compare_enabled") }} + + {{ end }} + + + diff --git a/layouts/index.html b/layouts/index.html new file mode 100644 index 0000000..8106a4b --- /dev/null +++ b/layouts/index.html @@ -0,0 +1,21 @@ +{{ define "main" }} +
+
+
+
+
+

{{- .Site.Title }}

+

{{- .Site.Params.Description}}

+
+
+
+
+
+ +
+
+
{{ .Content }}
+
+
+ +{{ end }} diff --git a/layouts/page/single.html b/layouts/page/single.html new file mode 100644 index 0000000..1dbcce9 --- /dev/null +++ b/layouts/page/single.html @@ -0,0 +1,8 @@ +{{ define "main" }} +
+
+

{{ .Title }}

+

{{ .Content | markdownify }}

+
+
+{{ end }} diff --git a/layouts/partials/footer.html b/layouts/partials/footer.html new file mode 100644 index 0000000..60b07dc --- /dev/null +++ b/layouts/partials/footer.html @@ -0,0 +1,21 @@ +{{/* Overwriting the theme partial to add translatable text and working links. */}} + + + diff --git a/layouts/partials/head.html b/layouts/partials/head.html new file mode 100644 index 0000000..e9b82fd --- /dev/null +++ b/layouts/partials/head.html @@ -0,0 +1,46 @@ +{{/* Overwriting the theme partial to set custom meta tags, reduce css and remove unused components. */}} + + + {{ block "title" . }}{{ with .Params.Title }}{{ . }} | {{ end }}{{ .Site.Title }}{{ end }} + {{- if not hugo.IsProduction }} + + {{- end }} + + + + {{ block "head/favicon" . }}{{ partialCached "head/favicon.html" . }}{{ end }} + + {{- $options := dict "enableSourceMap" true }} + {{- if hugo.IsProduction}} + {{- $options := dict "enableSourceMap" false "outputStyle" "compressed" }} + {{- end }} + {{- $style := resources.Get "/scss/style.scss" }} + {{- $style = $style | resources.ExecuteAsTemplate "/scss/style.scss" . | resources.ToCSS $options | resources.PostCSS }} + {{- if hugo.IsProduction }} + {{- $style = $style | minify | fingerprint "sha384" | resources.PostProcess }} + {{- end -}} + + + {{ $js := resources.Get "js/bootstrap.js" }} + {{ $params := dict }} + {{ $sourceMap := cond hugo.IsProduction "" "inline" }} + {{ $opts := dict "sourceMap" $sourceMap "minify" hugo.IsProduction "target" "es2018" "params" $params }} + {{ $js = $js | js.Build $opts }} + {{ if hugo.IsProduction }} + {{ $js = $js | fingerprint "sha384" }} + {{ end }} + + + + {{ if .IsHome }} + {{ with resources.Get "images/header.webp" }} + + + {{ end }} + {{ end }} + + diff --git a/layouts/partials/header.html b/layouts/partials/header.html new file mode 100644 index 0000000..20741f1 --- /dev/null +++ b/layouts/partials/header.html @@ -0,0 +1,73 @@ +{{/* Overwriting the theme partial to add language switcher. */}} + +
+
+ + + + +
+ + + + + {{ with $.Scratch.Get "social_list" }} + + {{ end }} + + + + {{ if .Site.IsMultiLingual }} +
+ +
    + {{ partial "docs/i18nlist" . }} +
+
+ {{ end }} + + +
+
+ + + +
+
+ +
+
+
+ diff --git a/layouts/partials/site-footer.html b/layouts/partials/site-footer.html deleted file mode 100755 index ad30d54..0000000 --- a/layouts/partials/site-footer.html +++ /dev/null @@ -1,22 +0,0 @@ - diff --git a/layouts/shortcodes/activities-github.html b/layouts/shortcodes/activities-github.html index 7a9fa4d..9182f9c 100644 --- a/layouts/shortcodes/activities-github.html +++ b/layouts/shortcodes/activities-github.html @@ -12,8 +12,8 @@ The most active are currently: {{ end }} - diff --git a/layouts/shortcodes/activities-mailinglist.html b/layouts/shortcodes/activities-mailinglist.html index 46f88b2..932f567 100644 --- a/layouts/shortcodes/activities-mailinglist.html +++ b/layouts/shortcodes/activities-mailinglist.html @@ -6,7 +6,7 @@ The following topics are currently being discussed on the mailing list: {{ end }} -