Moving badges to theme, fixing bug with links not being clickable, adding disclaimer to apps for distribution icons.

2021-08-03 14:59:16 +02:00 · 2021-08-03 14:59:16 +02:00 · 29770627da
commit 29770627da
parent 1171b352c5
40 changed files with 3375 additions and 43 deletions
--- a/README.md
+++ b/README.md
@ -2,10 +2,25 @@
 Hugo theme for ad5001.eu


-## Licenses
+## Licenses acknowledgments.

- static/font/metropolis/* is licensed under the SIL Open Font License, a copy being available in said folder.
- static/font/omegicons/\* fonts, static/icons/\*.svg, static/icons/platform/\* , static/icons/social/\*  include custom icons as well as icons from [Iconmonstr](https://iconmonstr.com) under it's [permissive license](https://iconmonstr.com/license/)
- static/icons/flag/\* are flags from the [Wikimedia Commons](https://commons.wikimedia.org/wiki/Flag) under Public Domain.
- layouts/, assets/ aswell as static/js are under the [GNU AGPL v3](https://www.gnu.org/licenses/agpl-3.0.html), for which a copy is available in the LICENSE file.
- static/img/*, icon.svg are under the [Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International License](https://creativecommons.org/licenses/by-nc-sa/4.0/legalcode)
+- `static/font/metropolis/*` is licensed under the SIL Open Font License, a copy being available in said folder.
+- `static/font/omegicons/\*` fonts, `static/icons/\*.svg`, `static/icons/platform/\*` , `static/icons/social/\*`  include custom icons as well as icons from [Iconmonstr](https://iconmonstr.com) under it's [permissive license](https://iconmonstr.com/license/)
+- `static/icons/flag/\*` are flags from the [Wikimedia Commons](https://commons.wikimedia.org/wiki/Flag) under Public Domain.
+- `layouts/` and `assets/` are under the [GNU AGPL v3](https://www.gnu.org/licenses/agpl-3.0.html), for which a copy is available in the LICENSE file.
+- `static/img/badges/\*` icons are owned by their respective owners, and are only used to represent product to which they refer:
+    - `amo.svg`, `amo-text.svg`: Firefox icon used to refer to [addons.mozilla.org].    
+      The Firefox logo is a trademark of the Mozilla Foundation in the U.S. and other countries.   
+      This badge is the translated and updated form of [the old badge](https://blog.mozilla.org/addons/2015/11/10/promote-your-add-ons-with-the-get-the-add-on-button/) with the new AMO colors and branding.
+    - `snapcraft.svg`, `snapcraft-text.svg`: Snapcraft icon used to refer to [snapcraft.io].    
+      The Snapcraft logo is licensed under [CC BY-ND 2.0 UK](https://creativecommons.org/licenses/by-nd/2.0/uk/legalcode), a registered trademark of Canonical Limited, 2018.    
+      These icons are adapted versions of [the official snapcraft badges](https://github.com/snapcore/snap-store-badges).
+    - `flathub.svg`, `flathub-text.svg`: Flathub icon used to refer to [flathub.org]    
+      These icons are modified and translated versions of [the official flathub badges](https://flathub.org/badges), the official ones being under [CC0](http://creativecommons.org/publicdomain/zero/1.0/).
+- `static/icons/distribution/\*` icons are owned by their respective owners, and are only used to represent product to which they refer:
+    - `firefox.svg`: Firefox icon used to refer to [addons.mozilla.org].    
+      The Firefox logo is a trademark of the Mozilla Foundation in the U.S. and other countries.
+    - `snapcraft.svg`: Snapcraft icon used to refer to [snapcraft.io].    
+      The Snapcraft logo is licensed under [CC BY-ND 2.0 UK](https://creativecommons.org/licenses/by-nd/2.0/uk/legalcode), a registered trademark of Canonical Limited, 2018.
+    - `flathub.svg`: Flathub icon used to refer to [flathub.org]
+- `static/img/*`, `icon.svg` are under the [Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International License](https://creativecommons.org/licenses/by-nc-sa/4.0/legalcode)
--- a/assets/scss/apps.scss
+++ b/assets/scss/apps.scss
@ -72,26 +72,16 @@
        
    .app-os-sources {
        hr {
-            color: var(--primary-color);
+            border: 0;
+            height: 1px;
+            background: var(--primary-color);
+
            
            &:last-of-type {
                opacity: 0;
                height: 0.1em;
            }
        }
-        
-        a img {
-            width: Min(300px, calc(100% - 2em));
-            box-shadow: 0px 0px 0px 0px #000000;
-            transition: box-shadow 0.15s ease-in-out, filter 0.15s ease-in-out;
-            border-radius: 0.5em;
-            filter: brightness(100%);
-        
-            &:hover {
-                box-shadow: 0px 0px 8px 0px #000000;
-                filter: brightness(90%);
-            }
-        }
    }
 }

--- a/assets/scss/blocks.scss
+++ b/assets/scss/blocks.scss
@ -18,3 +18,4 @@

@import "components/blocks/preview";
@import "components/blocks/card";
+@import "components/blocks/badge";
--- a/assets/scss/common.scss
+++ b/assets/scss/common.scss
@ -40,6 +40,13 @@ body {
    max-width: 75em;
 }

+.fit-content {
+    width: -moz-fit-content;
+    height: -moz-fit-content;
+    width: fit-content;
+    height: fit-content;
+}
+
 hr {
    opacity: 0.5;
 }
--- a/assets/scss/components/blocks/badge.scss
+++ b/assets/scss/components/blocks/badge.scss
@ -0,0 +1,29 @@
+/**
+ * Omegamma - Hugo theme for ad5001.eu and related websites.
+ * Copyright (C) 2021  Ad5001
+ * 
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ * 
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ * 
+ * You should have received a copy of the GNU General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+ */
+.badge {
+    width: Min(300px, calc(100% - 2em));
+    box-shadow: 0px 0px 0px 0px #000000;
+    transition: box-shadow 0.15s ease-in-out, filter 0.15s ease-in-out;
+    border-radius: 0.5em;
+    filter: brightness(100%);
+
+    &:hover {
+        box-shadow: 0px 0px 8px 0px #000000;
+        filter: brightness(90%);
+    }
+}
--- a/assets/scss/components/common/button.scss
+++ b/assets/scss/components/common/button.scss
@ -21,11 +21,13 @@
    color: black;
    cursor: pointer;
    
+    width: -moz-fit-content;
+    height: -moz-fit-content;
    width: fit-content;
    height: fit-content;
    
+    
    &.primary, &.secondary {
-        padding: 0.5em;
        margin: 0.1em;
        text-transform: uppercase;
        font-size: larger;
@ -42,6 +44,13 @@
            box-shadow: 0px 0px 8px 0px #000000;
            filter: brightness(90%);
        }
+        
+        & a, &:not(div) {
+            text-decoration: none;
+            display: inline-block;
+            color: black;
+            padding: 0.5em;
+        }
    }
 }

--- a/assets/scss/components/common/icon.scss
+++ b/assets/scss/components/common/icon.scss
@ -61,6 +61,11 @@
  }
 }
 */
+
+.shadowed {
+    filter: drop-shadow(0 0 1px rgba(0, 0, 0, .6));
+}
+
 [class^="icon-"]:before, [class*=" icon-"]:before {
  font-family: "omegicons";
  font-style: normal;
@ -87,7 +92,7 @@
  -moz-osx-font-smoothing: grayscale;

  /* Uncomment for 3D effect */
-    text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3);
+  /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
 }

 .icon-windows:before { content: '\e800'; } /* '' */
--- a/assets/scss/components/common/text.scss
+++ b/assets/scss/components/common/text.scss
@ -33,6 +33,13 @@
    color: white;
 }

-p, .text-content {
+p, .text-content, ul {
    line-height: 1.5em;
 }
+
+code, .code {
+    font-family: monospace;
+    padding: 0.5em;
+    margin-bottom: 0.5em;
+    background: white;
+}
--- a/assets/scss/components/sections/skewed.scss
+++ b/assets/scss/components/sections/skewed.scss
@ -21,9 +21,8 @@ section.section-skewed {
    transform: skewY(var(--angle));
    background: #D2D2D2;
    background: linear-gradient(170deg, rgba(238,238,238,1) 0%, rgba(210,210,210,1) 49%, rgba(238,238,238,1) 100%);
-    padding-top: 3em;
+    padding-top: 0.5em;
    padding-bottom: 3em;
-    margin-bottom: 2em;
 }

 section.section-skewed > * {
--- a/assets/scss/header.scss
+++ b/assets/scss/header.scss
@ -66,6 +66,7 @@ nav {
            &.background a[role=button] {
                background-color: var(--nav-background);
                color: black;
+                display: inline;
            }
            
            a {
--- a/i18n/en.json
+++ b/i18n/en.json
@ -71,6 +71,12 @@
    "storeFirefoxAddons": {
        "other": "Get it from the Firefox Addons"
    },
+    "disclaimerSnapcraft": {
+        "other": "The Snapcraft logo is licensed under [CC BY-ND 2.0 UK](https://creativecommons.org/licenses/by-nd/2.0/uk/legalcode), a registered trademark of Canonical Limited, 2018."
+    },
+    "disclaimerFirefox": {
+        "other": "The Firefox logo is a trademark of the Mozilla Foundation in the U.S. and other countries."
+    },
    "websiteSource": {
        "other": "Website source code"
    },
--- a/i18n/fr.json
+++ b/i18n/fr.json
@ -71,6 +71,12 @@
    "storeFirefoxAddons": {
        "other": "Installer depuis Firefox Addons"
    },
+    "disclaimerSnapcraft": {
+        "other": "Le logo Snapcraft est sous licence [CC BY-ND 2.0 UK](https://creativecommons.org/licenses/by-nd/2.0/uk/legalcode), une marque déposée de Canonical Limited, 2018."
+    },
+    "disclaimerFirefox": {
+        "other": "Le logo Firefox est une marque déposée de la Fondation Mozilla aux États-Unis et dans d'autres pays."
+    },
    "websiteSource": {
        "other": "Code source du site"
    },
--- a/layouts/_default/app.html
+++ b/layouts/_default/app.html
@ -3,6 +3,9 @@
 {{ $appindex := .Params.SectionHeader.AppIndex }}
 {{ $data := index .Site.Data $lang }}
 {{ $appdata := index $data.apps $appindex }}
+{{ $disclaimers := newScratch }}
+{{ $disclaimers.Set "snapcraft" false }}
+{{ $disclaimers.Set "firefox" false }}

 <html lang="{{ $lang }}">
    {{- partial "head.html" . -}}
@ -116,24 +119,26 @@
                            <div>
                                <h3>{{ .Title }}</h3>
                                {{ if hasPrefix .Title "Flatpak" }}
-                                <a href="https://flathub.org/apps/details/{{ .Index }}" class="padding-container-1">
-                                    <img src="/img/badges/{{ $lang }}/flathub.svg" alt="{{ i18n "storeFlathub" }}"></img>
-                                </a>
-                                <br><br>{{ i18n "warnExternalWebsite" "flathub.org" }}
+                                    <a href="https://flathub.org/apps/details/{{ .Index }}">
+                                    {{ partial "badge.html" (dict "Icon" "flathub" "Lang" $lang "Alt" "storeFlathub" ) }}
+                                    </a>
+                                    <br><br>{{ i18n "warnExternalWebsite" "flathub.org" }}
                                {{ else if hasPrefix .Title "Snap" }}
-                                <a href="https://snapcraft.io/{{ .Index }}" class="padding-container-1">
-                                    <img src="/img/badges/{{ $lang }}/snapcraft.svg" alt="{{ i18n "storeSnapcraft" }}"></img>
-                                </a>
-                                <br><br>{{ i18n "warnExternalWebsite" "snapcraft.io" }}
+                                    {{ $disclaimers.Set "snapcraft" true }}
+                                    <a href="https://snapcraft.io/{{ .Index }}">
+                                    {{ partial "badge.html" (dict "Icon" "snapcraft" "Lang" $lang "Alt" "storeSnapcraft" ) }}
+                                    </a>
+                                    <br><br>{{ i18n "warnExternalWebsite" "snapcraft.io" }}
                                {{ else if hasPrefix .Title "Firefox" }}
-                                <a href="https://addons.mozilla.org/en-US/firefox/addon/{{ .Index }}/" class="padding-container-1">
-                                    <img src="/img/badges/{{ $lang }}/amo.svg" alt="{{ i18n "storeFirefoxAddons" }}"></img>
-                                </a>
-                                <br><br>{{ i18n "warnExternalWebsite" "addons.mozilla.org" }}
+                                    {{ $disclaimers.Set "firefox" true }}
+                                    <a href="https://addons.mozilla.org/en-US/firefox/addon/{{ .Index }}/">
+                                    {{ partial "badge.html" (dict "Icon" "amo" "Lang" $lang "Alt" "storeFirefoxAddons" ) }}
+                                    </a>
+                                    <br><br>{{ i18n "warnExternalWebsite" "addons.mozilla.org" }}
                                {{ else }}
                                {{ i18n "file" }} {{ replace .Name "<version>" $appdata.version }}<br>
                                <div class="primary center fit-content" role="button">
-                                    <a href="https://artifacts.accountfree.org/repository/apps.ad5001.eu-apps/{{ $appindex }}/v{{ $appdata.version }}/{{ replace .File "<version>" $appdata.version }}" role="button">
+                                    <a href="https://artifacts.accountfree.org/repository/apps.ad5001.eu-apps/{{ $appindex }}/v{{ $appdata.version }}/{{ replace .File "<version>" $appdata.version }}">
                                        <i class="icon-download icon-as-text" alt=""></i>{{ i18n "download" }}
                                    </a>
                                </div>
@ -146,6 +151,13 @@
                    {{ end }}
                </div>
                <p>{{ .Params.Download.Footnote | markdownify }} </p>
+                <!-- Disclaimers -->
+                {{ if ($disclaimers.Get "snapcraft") }}
+                <p>{{ i18n "disclaimerSnapcraft" | markdownify }}</p>
+                {{ end }}
+                {{ if ($disclaimers.Get "firefox") }}
+                <p>{{ i18n "disclaimerFirefox" | markdownify }}</p>
+                {{ end }}
            </section>
            {{ end }}
        </div>
--- a/layouts/_default/distribution-platforms.html
+++ b/layouts/_default/distribution-platforms.html
--- a/layouts/main-index.html
+++ b/layouts/main-index.html
@ -25,6 +25,7 @@
    </div>
 </section>
 <section class="section-skewed">
+    <br>
    <h1 class="text-center">Software commitments</h1>
    <div class="columns-container padding-container-3" >
        <div class="column col3 vertical-center padding-container">
--- a/layouts/partials/badge.html
+++ b/layouts/partials/badge.html
@ -0,0 +1,2 @@
+<img src="/img/badges/{{ .Lang }}/{{ .Icon }}.svg" alt="{{ i18n .Alt }}" class="badge center" loading=lazy/>
+
--- a/layouts/partials/head.html
+++ b/layouts/partials/head.html
@ -2,12 +2,13 @@
    <title>{{ .Site.Title }} - {{ .Title }}</title>
    <link rel="preload" as="font" crossOrigin="anonymous" href="/fonts/metropolis/Metropolis-Regular.otf">
    <link rel="preload" as="font" crossOrigin="anonymous" href="/fonts/metropolis/Metropolis-Light.otf">
+    <link rel="preload" as="font" crossOrigin="anonymous" href="/fonts/metropolis/Metropolis-Bold.otf">
    <link rel="preload" as="font" crossOrigin="anonymous" href="/fonts/omegicons/omegicons.woff2?54316140">
    <link rel="preload" as="font" crossOrigin="anonymous" href="/fonts/omegicons/omegicons.ttf?54316140">
-    {{ $mainstyle := resources.Get "/scss/main.scss" | toCSS  | minify | fingerprint }}
+    {{ $mainstyle := resources.Get "/scss/main.scss" | toCSS  | minify }}
    <link rel="preload" href="{{ $mainstyle.Permalink }}" as="style" onload="this.rel='stylesheet'">
    {{ if .Site.Params.includeAppsStyle }}
-    {{ $appsstyle := resources.Get "/scss/apps.scss" | toCSS | minify | fingerprint }}
+    {{ $appsstyle := resources.Get "/scss/apps.scss" | toCSS | minify }}
    <link rel="preload" href="{{ $appsstyle.Permalink }}" as="style" onload="this.rel='stylesheet'">
    {{ end }}
    <link rel="icon" href="/img/icon.png">
@ -19,6 +20,6 @@
    <link rel="alternate" hreflang="{{ .Language.Lang }}" href="{{ .Permalink }}" title="{{ .Language.LanguageName }}">
    {{ end }}
    {{ end }}
-    {{ $mainjs := resources.Get "/js/main.js" | minify | fingerprint }}
+    {{ $mainjs := resources.Get "/js/main.js" | minify }}
    <script src="{{ $mainjs.Permalink }}"></script>
 </head>
--- a/layouts/partials/header.html
+++ b/layouts/partials/header.html
@ -54,8 +54,7 @@
                        {{ range .Translations }}
                        <li class="background">
                            <a href="{{ .Permalink }}" role="button">
-                                <img src="/icons/flag/{{ .Language.Lang }}.svg" class="icon-as-text"/>
-                                {{ .Language.LanguageName }}
+                                <img src="/icons/flag/{{ .Language.Lang }}.svg" class="icon-as-text"/>{{ .Language.LanguageName }}
                            </a>
                        </li>
                        {{ end }}
--- a/layouts/shortcodes/badge.html
+++ b/layouts/shortcodes/badge.html
@ -0,0 +1 @@
+{{ partial "badge.html" (dict "Icon" (.Get 0) "Lang" (.Get 1) "Alt" (.Get 2) ) }}
--- a/layouts/shortcodes/badgeTable.html
+++ b/layouts/shortcodes/badgeTable.html
@ -0,0 +1,19 @@
+<div class="columns-container fill-width">
+ <div class="col2 column text-center">
+  <h3>{{ i18n "en" }}</h3>
+  {{ partial "badge.html" (dict "Icon" (.Get 0) "Lang" "en" "Alt" (.Get 1) ) }}
+  <br>
+  <div class="center fit-content">
+   <div class="code">&lt;img source="https://ad5001.eu/img/badges/en/{{ .Get 0 }}.svg" class="badge"/&gt;</div>
+  </div>
+ </div>
+ 
+ <div class="col2 column text-center">
+  <h3>{{ i18n "fr" }}</h3>
+  {{ partial "badge.html" (dict "Icon" (.Get 0) "Lang" "fr" "Alt" (.Get 1) ) }}
+  <br>
+  <div class="center fit-content">
+   <div class="code">&lt;img source="https://ad5001.eu/img/badges/fr/{{ .Get 0 }}.svg" class="badge"/&gt;</div>
+  </div>
+ </div>
+</div>
--- a/layouts/shortcodes/section1.html
+++ b/layouts/shortcodes/section1.html
@ -0,0 +1 @@
+{{ partial "section1.html" (dict "Image" (.Get 0) "Content" (.Inner | markdownify) ) }}
--- a/layouts/shortcodes/sectionSkewed.html
+++ b/layouts/shortcodes/sectionSkewed.html
@ -0,0 +1,4 @@
+
+<section class="section-skewed padding-container-3" style="background: {{ .Get 1 | safeCSS }}; background: linear-gradient(170deg, {{ .Get 1  | safeCSS }} 0%, {{ .Get 0 | safeCSS }} 49%, {{ .Get 1 | safeCSS }} 100%);">
+    {{ .Inner | markdownify }}
+</section>
--- a/static/css/badge.css
+++ b/static/css/badge.css
@ -0,0 +1,29 @@
+/**
+ * Omegamma - Hugo theme for ad5001.eu and related websites.
+ * Copyright (C) 2021  Ad5001
+ * 
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ * 
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ * 
+ * You should have received a copy of the GNU General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+ */
+.badge {
+    width: Min(300px, calc(100% - 2em));
+    box-shadow: 0px 0px 0px 0px #000000;
+    transition: box-shadow 0.15s ease-in-out, filter 0.15s ease-in-out;
+    border-radius: 0.5em;
+    filter: brightness(100%);
+}
+
+.badge::hover {
+    box-shadow: 0px 0px 8px 0px #000000;
+    filter: brightness(90%);
+}
--- a/static/icons/distribution/firefox.svg
+++ b/static/icons/distribution/firefox.svg
@ -0,0 +1,82 @@
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+<svg id="SVGRoot" width="24px" height="24px" version="1.1" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+ <defs>
+  <linearGradient id="a-3-6" x1="69.972" x2="8.7174" y1="12.2" y2="73.257" gradientTransform="scale(.98394 1.0163)" gradientUnits="userSpaceOnUse">
+   <stop stop-color="#fff44f" offset=".05"/>
+   <stop stop-color="#ff980e" offset=".37"/>
+   <stop stop-color="#ff3647" offset=".53"/>
+   <stop stop-color="#e31587" offset=".7"/>
+  </linearGradient>
+  <radialGradient id="b-5-2" cx="62.187" cy="9.8704" r="89.357" gradientTransform="scale(1.109 .90173)" gradientUnits="userSpaceOnUse">
+   <stop stop-color="#ffbd4f" offset=".13"/>
+   <stop stop-color="#ff980e" offset=".28"/>
+   <stop stop-color="#ff3750" offset=".47"/>
+   <stop stop-color="#eb0878" offset=".78"/>
+   <stop stop-color="#e50080" offset=".86"/>
+  </radialGradient>
+  <radialGradient id="c-7-4" cx="35.379" cy="46.8" r="89.357" gradientTransform="scale(1.109 .90173)" gradientUnits="userSpaceOnUse">
+   <stop stop-color="#960e18" offset=".3"/>
+   <stop stop-color="#b11927" stop-opacity=".74" offset=".35"/>
+   <stop stop-color="#db293d" stop-opacity=".34" offset=".43"/>
+   <stop stop-color="#f5334b" stop-opacity=".09" offset=".5"/>
+   <stop stop-color="#ff3750" stop-opacity="0" offset=".53"/>
+  </radialGradient>
+  <radialGradient id="d-6-3" cx="62.101" cy="-2.8991" r="33.903" gradientTransform="scale(.76744 1.303)" gradientUnits="userSpaceOnUse">
+   <stop stop-color="#fff44f" offset=".13"/>
+   <stop stop-color="#ff980e" offset=".53"/>
+  </radialGradient>
+  <radialGradient id="e-1-5" cx="31.922" cy="60.196" r="36.045" gradientTransform="scale(.95513 1.047)" gradientUnits="userSpaceOnUse">
+   <stop stop-color="#3a8ee6" offset=".35"/>
+   <stop stop-color="#9059ff" offset=".67"/>
+   <stop stop-color="#c139e6" offset="1"/>
+  </radialGradient>
+  <radialGradient id="f-2-7" cx="42.462" cy="32.402" r="21.267" gradientTransform="scale(.95513 1.047)" gradientUnits="userSpaceOnUse">
+   <stop stop-color="#9059ff" stop-opacity="0" offset=".21"/>
+   <stop stop-color="#6e008b" stop-opacity=".6" offset=".97"/>
+  </radialGradient>
+  <radialGradient id="g-3-3" cx="37.516" cy="5.935" r="27.421" gradientTransform="scale(.99815 1.0019)" gradientUnits="userSpaceOnUse">
+   <stop stop-color="#ffe226" offset=".1"/>
+   <stop stop-color="#ff7139" offset=".79"/>
+  </radialGradient>
+  <radialGradient id="h-9-8" cx="57.203" cy="-13.152" r="119.7" gradientTransform="scale(1.0914 .91627)" gradientUnits="userSpaceOnUse">
+   <stop stop-color="#fff44f" offset=".11"/>
+   <stop stop-color="#ff980e" offset=".46"/>
+   <stop stop-color="#ff3647" offset=".72"/>
+   <stop stop-color="#e31587" offset=".9"/>
+  </radialGradient>
+  <radialGradient id="i-7-3" cx="74.836" cy="-6.7048" r="125.79" gradientTransform="scale(.68814 1.4532)" gradientUnits="userSpaceOnUse">
+   <stop stop-color="#fff44f" offset="0"/>
+   <stop stop-color="#ff980e" offset=".3"/>
+   <stop stop-color="#ff3647" offset=".57"/>
+   <stop stop-color="#e31587" offset=".74"/>
+  </radialGradient>
+  <radialGradient id="j-9-0" cx="37.373" cy="16.031" r="74.328" gradientTransform="scale(1.0095 .9906)" gradientUnits="userSpaceOnUse">
+   <stop stop-color="#fff44f" offset=".14"/>
+   <stop stop-color="#ff980e" offset=".48"/>
+   <stop stop-color="#ff3647" offset=".66"/>
+   <stop stop-color="#e31587" offset=".9"/>
+  </radialGradient>
+  <radialGradient id="k-7-6" cx="54.134" cy="21.246" r="85.336" gradientTransform="scale(1.0567 .94632)" gradientUnits="userSpaceOnUse">
+   <stop stop-color="#fff44f" offset=".09"/>
+   <stop stop-color="#ff980e" offset=".63"/>
+  </radialGradient>
+  <linearGradient id="l-5-9" x1="64.267" x2="15.484" y1="11.02" y2="66.097" gradientTransform="scale(.98394 1.0163)" gradientUnits="userSpaceOnUse">
+   <stop stop-color="#fff44f" stop-opacity=".8" offset=".17"/>
+   <stop stop-color="#fff44f" stop-opacity="0" offset=".6"/>
+  </linearGradient>
+ </defs>
+ <g transform="matrix(.30012 0 0 .30012 -.0051611 -.0012262)">
+  <path d="m75.916 26.831c-1.684-4.052-5.1-8.427-7.775-9.81a40.266 40.266 0 0 1 3.925 11.764l7e-3 0.065c-4.382-10.925-11.813-15.33-17.882-24.922a47.099 47.099 0 0 1-0.913-1.484 12.24 12.24 0 0 1-0.427-0.8 7.053 7.053 0 0 1-0.578-1.535 0.1 0.1 0 0 0-0.088-0.1 0.138 0.138 0 0 0-0.073 0c-5e-3 0-0.013 9e-3 -0.019 0.011s-0.019 0.011-0.028 0.015l0.015-0.026c-9.735 5.7-13.038 16.252-13.342 21.53a19.387 19.387 0 0 0-10.666 4.111 11.587 11.587 0 0 0-1-0.758 17.968 17.968 0 0 1-0.109-9.473 28.705 28.705 0 0 0-9.329 7.21h-0.018c-1.536-1.947-1.428-8.367-1.34-9.708a6.928 6.928 0 0 0-1.294 0.687 28.225 28.225 0 0 0-3.788 3.245 33.845 33.845 0 0 0-3.623 4.347v6e-3 -7e-3a32.733 32.733 0 0 0-5.2 11.743l-0.052 0.256a61.89 61.89 0 0 0-0.381 2.42c0 0.029-6e-3 0.056-9e-3 0.085a36.937 36.937 0 0 0-0.629 5.343v0.2a38.759 38.759 0 0 0 76.954 6.554c0.065-0.5 0.118-0.995 0.176-1.5a39.857 39.857 0 0 0-2.514-19.469zm-44.67 30.338c0.181 0.087 0.351 0.181 0.537 0.264l0.027 0.017q-0.282-0.135-0.564-0.281zm8.878-23.376m31.952-4.934v-0.037l7e-3 0.041z" fill="url(#a-3-6)"/>
+  <path d="m75.916 26.831c-1.684-4.052-5.1-8.427-7.775-9.81a40.266 40.266 0 0 1 3.925 11.764v0.037l7e-3 0.041a35.1 35.1 0 0 1-1.206 26.158c-4.442 9.531-15.194 19.3-32.024 18.825-18.185-0.515-34.2-14.009-37.194-31.683-0.545-2.787 0-4.2 0.274-6.465a28.876 28.876 0 0 0-0.623 5.348v0.2a38.759 38.759 0 0 0 76.954 6.554c0.065-0.5 0.118-0.995 0.176-1.5a39.857 39.857 0 0 0-2.514-19.469z" fill="url(#b-5-2)"/>
+  <path d="m75.916 26.831c-1.684-4.052-5.1-8.427-7.775-9.81a40.266 40.266 0 0 1 3.925 11.764v0.037l7e-3 0.041a35.1 35.1 0 0 1-1.206 26.158c-4.442 9.531-15.194 19.3-32.024 18.825-18.185-0.515-34.2-14.009-37.194-31.683-0.545-2.787 0-4.2 0.274-6.465a28.876 28.876 0 0 0-0.623 5.348v0.2a38.759 38.759 0 0 0 76.954 6.554c0.065-0.5 0.118-0.995 0.176-1.5a39.857 39.857 0 0 0-2.514-19.469z" fill="url(#c-7-4)"/>
+  <path d="m57.082 31.387c0.084 0.059 0.162 0.118 0.241 0.177a21.1 21.1 0 0 0-3.6-4.695c-12.046-12.048-3.157-26.123-1.658-26.838l0.015-0.022c-9.735 5.7-13.038 16.252-13.342 21.53 0.452-0.031 0.9-0.069 1.362-0.069a19.56 19.56 0 0 1 16.982 9.917z" fill="url(#d-6-3)"/>
+  <path d="m40.125 33.793c-0.064 0.964-3.47 4.289-4.661 4.289-11.021 0-12.81 6.667-12.81 6.667 0.488 5.614 4.4 10.238 9.129 12.684a13.44 13.44 0 0 0 0.654 0.312q0.569 0.252 1.138 0.466a17.235 17.235 0 0 0 5.043 0.973c19.317 0.906 23.059-23.1 9.119-30.066a13.38 13.38 0 0 1 9.345 2.269 19.56 19.56 0 0 0-16.982-9.917c-0.46 0-0.91 0.038-1.362 0.069a19.387 19.387 0 0 0-10.666 4.111c0.591 0.5 1.258 1.168 2.663 2.553 2.63 2.591 9.375 5.275 9.39 5.59z" fill="url(#e-1-5)"/>
+  <path d="m40.125 33.793c-0.064 0.964-3.47 4.289-4.661 4.289-11.021 0-12.81 6.667-12.81 6.667 0.488 5.614 4.4 10.238 9.129 12.684a13.44 13.44 0 0 0 0.654 0.312q0.569 0.252 1.138 0.466a17.235 17.235 0 0 0 5.043 0.973c19.317 0.906 23.059-23.1 9.119-30.066a13.38 13.38 0 0 1 9.345 2.269 19.56 19.56 0 0 0-16.982-9.917c-0.46 0-0.91 0.038-1.362 0.069a19.387 19.387 0 0 0-10.666 4.111c0.591 0.5 1.258 1.168 2.663 2.553 2.63 2.591 9.375 5.275 9.39 5.59z" fill="url(#f-2-7)"/>
+  <path d="m26.265 24.361a24.874 24.874 0 0 1 0.8 0.531 17.968 17.968 0 0 1-0.109-9.473 28.705 28.705 0 0 0-9.329 7.21c0.189-5e-3 5.811-0.106 8.638 1.732z" fill="url(#g-3-3)"/>
+  <path d="m1.654 42.163c2.991 17.674 19.009 31.168 37.194 31.683 16.83 0.476 27.582-9.294 32.024-18.825a35.1 35.1 0 0 0 1.206-26.158v-0.037c0-0.029-6e-3 -0.046 0-0.037l7e-3 0.065c1.375 8.977-3.191 17.674-10.329 23.555l-0.022 0.05c-13.908 11.327-27.218 6.834-29.912 5q-0.282-0.135-0.564-0.281c-8.109-3.876-11.459-11.264-10.741-17.6a9.953 9.953 0 0 1-9.181-5.775 14.618 14.618 0 0 1 14.249-0.572 19.3 19.3 0 0 0 14.552 0.572c-0.015-0.315-6.76-3-9.39-5.59-1.405-1.385-2.072-2.052-2.663-2.553a11.587 11.587 0 0 0-1-0.758 54.245 54.245 0 0 0-0.8-0.531c-2.827-1.838-8.449-1.737-8.635-1.732h-0.018c-1.536-1.947-1.428-8.367-1.34-9.708a6.928 6.928 0 0 0-1.294 0.687 28.225 28.225 0 0 0-3.788 3.245 33.845 33.845 0 0 0-3.638 4.337v6e-3 -7e-3a32.733 32.733 0 0 0-5.2 11.743c-0.019 0.079-1.396 6.099-0.717 9.221z" fill="url(#h-9-8)"/>
+  <path d="m53.725 26.869a21.1 21.1 0 0 1 3.6 4.7 8.083 8.083 0 0 1 0.581 0.476c8.787 8.1 4.183 19.55 3.84 20.365 7.138-5.881 11.7-14.578 10.329-23.555-4.384-10.93-11.815-15.335-17.884-24.927a47.099 47.099 0 0 1-0.913-1.484 12.24 12.24 0 0 1-0.427-0.8 7.053 7.053 0 0 1-0.578-1.535 0.1 0.1 0 0 0-0.088-0.1 0.138 0.138 0 0 0-0.073 0c-5e-3 0-0.013 9e-3 -0.019 0.011s-0.019 0.011-0.028 0.015c-1.499 0.711-10.388 14.786 1.66 26.834z" fill="url(#i-7-3)"/>
+  <path d="m57.9 32.04a8.083 8.083 0 0 0-0.581-0.476c-0.079-0.059-0.157-0.118-0.241-0.177a13.38 13.38 0 0 0-9.345-2.269c13.94 6.97 10.2 30.972-9.119 30.066a17.235 17.235 0 0 1-5.043-0.973q-0.569-0.213-1.138-0.466a14.44 14.44 0 0 1-0.654-0.312l0.027 0.017c2.694 1.839 16 6.332 29.912-5l0.022-0.05c0.347-0.81 4.951-12.263-3.84-20.36z" fill="url(#j-9-0)"/>
+  <path d="m22.654 44.749s1.789-6.667 12.81-6.667c1.191 0 4.6-3.325 4.661-4.289a19.3 19.3 0 0 1-14.552-0.572 14.618 14.618 0 0 0-14.249 0.572 9.953 9.953 0 0 0 9.181 5.775c-0.718 6.337 2.632 13.725 10.741 17.6 0.181 0.087 0.351 0.181 0.537 0.264-4.733-2.445-8.641-7.069-9.129-12.683z" fill="url(#k-7-6)"/>
+  <path d="m75.916 26.831c-1.684-4.052-5.1-8.427-7.775-9.81a40.266 40.266 0 0 1 3.925 11.764l7e-3 0.065c-4.382-10.925-11.813-15.33-17.882-24.922a47.099 47.099 0 0 1-0.913-1.484 12.24 12.24 0 0 1-0.427-0.8 7.053 7.053 0 0 1-0.578-1.535 0.1 0.1 0 0 0-0.088-0.1 0.138 0.138 0 0 0-0.073 0c-5e-3 0-0.013 9e-3 -0.019 0.011s-0.019 0.011-0.028 0.015l0.015-0.026c-9.735 5.7-13.038 16.252-13.342 21.53 0.452-0.031 0.9-0.069 1.362-0.069a19.56 19.56 0 0 1 16.982 9.917 13.38 13.38 0 0 0-9.345-2.269c13.94 6.97 10.2 30.972-9.119 30.066a17.235 17.235 0 0 1-5.043-0.973q-0.569-0.213-1.138-0.466a14.44 14.44 0 0 1-0.654-0.312l0.027 0.017q-0.282-0.135-0.564-0.281c0.181 0.087 0.351 0.181 0.537 0.264-4.733-2.446-8.641-7.07-9.129-12.684 0 0 1.789-6.667 12.81-6.667 1.191 0 4.6-3.325 4.661-4.289-0.015-0.315-6.76-3-9.39-5.59-1.405-1.385-2.072-2.052-2.663-2.553a11.587 11.587 0 0 0-1-0.758 17.968 17.968 0 0 1-0.109-9.473 28.705 28.705 0 0 0-9.329 7.21h-0.018c-1.536-1.947-1.428-8.367-1.34-9.708a6.928 6.928 0 0 0-1.294 0.687 28.225 28.225 0 0 0-3.788 3.245 33.845 33.845 0 0 0-3.623 4.347v6e-3 -7e-3a32.733 32.733 0 0 0-5.2 11.743l-0.052 0.256c-0.073 0.341-0.4 2.073-0.447 2.445v0a45.094 45.094 0 0 0-0.572 5.403v0.2a38.759 38.759 0 0 0 76.954 6.554c0.065-0.5 0.118-0.995 0.176-1.5a39.857 39.857 0 0 0-2.514-19.469zm-3.845 1.991 7e-3 0.041z" fill="url(#l-5-9)"/>
+ </g>
+</svg>
--- a/static/icons/distribution/flathub.svg
+++ b/static/icons/distribution/flathub.svg
@ -0,0 +1,25 @@
+<svg width="24" height="24" version="1.0" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+ <g transform="matrix(.16492 0 0 .16492 -129.17 -133.18)" shape-rendering="auto" stroke-linecap="square">
+  <path d="m856.01 830.23-66.764 43.449v34.94l33.382 21.723 33.379-21.723v-5e-3l3e-3 3e-3 33.382 21.726 33.379-21.723v-34.94z" color="#000000" color-rendering="auto" fill="#204a87" image-rendering="auto" solid-color="#000000" stroke="#204a87" stroke-width="12" style="isolation:auto;mix-blend-mode:normal;paint-order:normal"/>
+  <g stroke-linejoin="round" stroke-width=".75574">
+   <g transform="matrix(.50222 0 0 .50637 429.63 432.9)">
+    <rect transform="matrix(.84019 .54229 -.84019 .54229 0 0)" x="1289.9" y="279.43" width="79.11" height="79.11" rx="0" ry="0" color="#000000" color-rendering="auto" image-rendering="auto" solid-color="#000000" stroke="#000" stroke-width="3.1667" style="isolation:auto;mix-blend-mode:normal;paint-order:normal"/>
+    <rect transform="matrix(.84019 .54229 -.84019 .54229 0 0)" x="1226.3" y="215.81" width="79.11" height="79.11" rx="0" ry="0" color="#000000" color-rendering="auto" fill="#fff" image-rendering="auto" solid-color="#000000" stroke="#204a87" stroke-width="3.1667" style="isolation:auto;mix-blend-mode:normal;paint-order:normal"/>
+    <path d="m915.47 824.93-5e-5 69-66.468 42.901 5e-5 -69z" color="#000000" color-rendering="auto" image-rendering="auto" solid-color="#000000" stroke="#000" stroke-width="3.023" style="isolation:auto;mix-blend-mode:normal;paint-order:normal"/>
+    <path d="m783 824.93 5e-5 69 66.468 42.901-5e-5 -69z" color="#000000" color-rendering="auto" fill="#fff" image-rendering="auto" solid-color="#000000" stroke="#000" stroke-width="3.023" style="isolation:auto;mix-blend-mode:normal;paint-order:normal"/>
+   </g>
+   <g transform="matrix(.50222 0 0 .50637 463.01 454.63)" stroke="#204a87">
+    <rect transform="matrix(.84019 .54229 -.84019 .54229 0 0)" x="1289.9" y="279.43" width="79.11" height="79.11" rx="0" ry="0" color="#000000" color-rendering="auto" fill="#204a87" image-rendering="auto" solid-color="#000000" stroke-width="3.1667" style="isolation:auto;mix-blend-mode:normal;paint-order:normal"/>
+    <rect transform="matrix(.84019 .54229 -.84019 .54229 0 0)" x="1226.3" y="215.81" width="79.11" height="79.11" rx="0" ry="0" color="#000000" color-rendering="auto" fill="#fff" image-rendering="auto" solid-color="#000000" stroke-width="3.1667" style="isolation:auto;mix-blend-mode:normal;paint-order:normal"/>
+    <path d="m915.47 824.93-5e-5 69-66.468 42.901 5e-5 -69z" color="#000000" color-rendering="auto" fill="#204a87" image-rendering="auto" solid-color="#000000" stroke-width="3.023" style="isolation:auto;mix-blend-mode:normal;paint-order:normal"/>
+    <path d="m783 824.93 5e-5 69 66.468 42.901-5e-5 -69z" color="#000000" color-rendering="auto" fill="#fff" image-rendering="auto" solid-color="#000000" stroke-width="3.023" style="isolation:auto;mix-blend-mode:normal;paint-order:normal"/>
+   </g>
+   <g transform="matrix(.50222 0 0 .50637 396.25 454.63)" stroke="#204a87">
+    <rect transform="matrix(.84019 .54229 -.84019 .54229 0 0)" x="1289.9" y="279.43" width="79.11" height="79.11" rx="0" ry="0" color="#000000" color-rendering="auto" image-rendering="auto" solid-color="#000000" stroke-width="3.1667" style="isolation:auto;mix-blend-mode:normal;paint-order:normal"/>
+    <rect transform="matrix(.84019 .54229 -.84019 .54229 0 0)" x="1226.3" y="215.81" width="79.11" height="79.11" rx="0" ry="0" color="#000000" color-rendering="auto" fill="#fff" image-rendering="auto" solid-color="#000000" stroke-width="3.1667" style="isolation:auto;mix-blend-mode:normal;paint-order:normal"/>
+    <path d="m915.47 824.93-5e-5 69-66.468 42.901 5e-5 -69z" color="#000000" color-rendering="auto" fill="#204a87" image-rendering="auto" solid-color="#000000" stroke-width="3.023" style="isolation:auto;mix-blend-mode:normal;paint-order:normal"/>
+    <path d="m783 824.93 5e-5 69 66.468 42.901-5e-5 -69z" color="#000000" color-rendering="auto" fill="#fff" image-rendering="auto" solid-color="#000000" stroke-width="3.023" style="isolation:auto;mix-blend-mode:normal;paint-order:normal"/>
+   </g>
+  </g>
+ </g>
+</svg>
--- a/static/icons/distribution/snapcraft.svg
+++ b/static/icons/distribution/snapcraft.svg
@ -0,0 +1,46 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   id="SVGRoot"
+   width="24px"
+   height="24px"
+   version="1.1"
+   viewBox="0 0 24 24"
+   sodipodi:docname="snapcraft.svg"
+   inkscape:version="1.1 (c68e22c387, 2021-05-23)"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <defs
+     id="defs9" />
+  <sodipodi:namedview
+     id="namedview7"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     showgrid="true"
+     inkscape:zoom="16.708333"
+     inkscape:cx="-4.0399002"
+     inkscape:cy="6.4937656"
+     inkscape:current-layer="SVGRoot">
+    <inkscape:grid
+       type="xygrid"
+       id="grid124" />
+  </sodipodi:namedview>
+  <path
+     id="body"
+     class="st1"
+     d="M 13.798165,13.417431 V 5.7110092 L 19.082569,8.059633 Z M 3.6697247,23.545871 10.201835,11.362385 13.06422,14.224771 Z M 0,0.50000004 13.357798,5.3440367 v 8.5137613 z"
+     style="stroke-width:0.733945;fill:#82bea0;fill-opacity:1" />
+  <path
+     id="head"
+     class="st2"
+     d="M 21.798165,5.3440367 H 14.091743 L 24,9.8211009 Z"
+     fill="#fa6441"
+     style="stroke-width:0.733945" />
+</svg>
--- a/static/img/badges/en/amo-text.svg
+++ b/static/img/badges/en/amo-text.svg
@ -0,0 +1,984 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   width="600"
+   height="200"
+   version="1.1"
+   id="svg120"
+   sodipodi:docname="amo-text.svg"
+   inkscape:version="1.1 (c68e22c387, 2021-05-23)"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <sodipodi:namedview
+     id="namedview122"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     showgrid="false"
+     width="600px"
+     inkscape:zoom="1.4731392"
+     inkscape:cx="246.07315"
+     inkscape:cy="140.17684"
+     inkscape:current-layer="layer1"
+     inkscape:lockguides="false"
+     showguides="false" />
+  <defs
+     id="defs92">
+    <radialGradient
+       id="b"
+       cx="62.186608"
+       cy="9.8704298"
+       r="89.357415"
+       gradientTransform="scale(1.1089819,0.90172794)"
+       fx="62.186608"
+       fy="9.8704298"
+       gradientUnits="userSpaceOnUse">
+      <stop
+         offset=".13"
+         stop-color="#ffbd4f"
+         id="stop2" />
+      <stop
+         offset=".28"
+         stop-color="#ff980e"
+         id="stop4" />
+      <stop
+         offset=".47"
+         stop-color="#ff3750"
+         id="stop6" />
+      <stop
+         offset=".78"
+         stop-color="#eb0878"
+         id="stop8" />
+      <stop
+         offset=".86"
+         stop-color="#e50080"
+         id="stop10" />
+    </radialGradient>
+    <radialGradient
+       id="c"
+       cx="35.379383"
+       cy="46.800175"
+       r="89.357415"
+       gradientTransform="scale(1.1089819,0.90172794)"
+       fx="35.379383"
+       fy="46.800175"
+       gradientUnits="userSpaceOnUse">
+      <stop
+         offset=".3"
+         stop-color="#960e18"
+         id="stop13" />
+      <stop
+         offset=".35"
+         stop-color="#b11927"
+         stop-opacity=".74"
+         id="stop15" />
+      <stop
+         offset=".43"
+         stop-color="#db293d"
+         stop-opacity=".34"
+         id="stop17" />
+      <stop
+         offset=".5"
+         stop-color="#f5334b"
+         stop-opacity=".09"
+         id="stop19" />
+      <stop
+         offset=".53"
+         stop-color="#ff3750"
+         stop-opacity="0"
+         id="stop21" />
+    </radialGradient>
+    <radialGradient
+       id="d"
+       cx="62.100616"
+       cy="-2.8990997"
+       r="33.903412"
+       gradientTransform="scale(0.76744488,1.3030252)"
+       fx="62.100616"
+       fy="-2.8990997"
+       gradientUnits="userSpaceOnUse">
+      <stop
+         offset=".13"
+         stop-color="#fff44f"
+         id="stop24" />
+      <stop
+         offset=".53"
+         stop-color="#ff980e"
+         id="stop26" />
+    </radialGradient>
+    <radialGradient
+       id="e"
+       cx="31.922279"
+       cy="60.196252"
+       r="36.045489"
+       gradientTransform="scale(0.95512645,1.0469818)"
+       fx="31.922279"
+       fy="60.196252"
+       gradientUnits="userSpaceOnUse">
+      <stop
+         offset=".35"
+         stop-color="#3a8ee6"
+         id="stop29" />
+      <stop
+         offset=".67"
+         stop-color="#9059ff"
+         id="stop31" />
+      <stop
+         offset="1"
+         stop-color="#c139e6"
+         id="stop33" />
+    </radialGradient>
+    <radialGradient
+       id="f"
+       cx="42.461979"
+       cy="32.401577"
+       r="21.266837"
+       gradientTransform="scale(0.95512645,1.0469818)"
+       fx="42.461979"
+       fy="32.401577"
+       gradientUnits="userSpaceOnUse">
+      <stop
+         offset=".21"
+         stop-color="#9059ff"
+         stop-opacity="0"
+         id="stop36" />
+      <stop
+         offset=".97"
+         stop-color="#6e008b"
+         stop-opacity=".6"
+         id="stop38" />
+    </radialGradient>
+    <radialGradient
+       id="g"
+       cx="37.516169"
+       cy="5.9350055"
+       r="27.420904"
+       gradientTransform="scale(0.99815093,1.0018525)"
+       fx="37.516169"
+       fy="5.9350055"
+       gradientUnits="userSpaceOnUse">
+      <stop
+         offset=".1"
+         stop-color="#ffe226"
+         id="stop41" />
+      <stop
+         offset=".79"
+         stop-color="#ff7139"
+         id="stop43" />
+    </radialGradient>
+    <radialGradient
+       id="h"
+       cx="57.20315"
+       cy="-13.152274"
+       r="119.69982"
+       gradientTransform="scale(1.091384,0.91626777)"
+       fx="57.20315"
+       fy="-13.152274"
+       gradientUnits="userSpaceOnUse">
+      <stop
+         offset=".11"
+         stop-color="#fff44f"
+         id="stop46" />
+      <stop
+         offset=".46"
+         stop-color="#ff980e"
+         id="stop48" />
+      <stop
+         offset=".72"
+         stop-color="#ff3647"
+         id="stop50" />
+      <stop
+         offset=".9"
+         stop-color="#e31587"
+         id="stop52" />
+    </radialGradient>
+    <radialGradient
+       id="i"
+       cx="74.835756"
+       cy="-6.704823"
+       r="125.78617"
+       gradientTransform="scale(0.68813893,1.4531949)"
+       fx="74.835756"
+       fy="-6.704823"
+       gradientUnits="userSpaceOnUse">
+      <stop
+         offset="0"
+         stop-color="#fff44f"
+         id="stop55" />
+      <stop
+         offset=".3"
+         stop-color="#ff980e"
+         id="stop57" />
+      <stop
+         offset=".57"
+         stop-color="#ff3647"
+         id="stop59" />
+      <stop
+         offset=".74"
+         stop-color="#e31587"
+         id="stop61" />
+    </radialGradient>
+    <radialGradient
+       id="j"
+       cx="37.372962"
+       cy="16.030757"
+       r="74.327898"
+       gradientTransform="scale(1.0094867,0.99060245)"
+       fx="37.372962"
+       fy="16.030757"
+       gradientUnits="userSpaceOnUse">
+      <stop
+         offset=".14"
+         stop-color="#fff44f"
+         id="stop64" />
+      <stop
+         offset=".48"
+         stop-color="#ff980e"
+         id="stop66" />
+      <stop
+         offset=".66"
+         stop-color="#ff3647"
+         id="stop68" />
+      <stop
+         offset=".9"
+         stop-color="#e31587"
+         id="stop70" />
+    </radialGradient>
+    <radialGradient
+       id="k"
+       cx="54.133552"
+       cy="21.245953"
+       r="85.335711"
+       gradientTransform="scale(1.0567198,0.94632469)"
+       fx="54.133552"
+       fy="21.245953"
+       gradientUnits="userSpaceOnUse">
+      <stop
+         offset=".09"
+         stop-color="#fff44f"
+         id="stop73" />
+      <stop
+         offset=".63"
+         stop-color="#ff980e"
+         id="stop75" />
+    </radialGradient>
+    <linearGradient
+       id="a"
+       x1="69.971664"
+       y1="12.1998"
+       x2="8.7173734"
+       y2="73.257384"
+       gradientTransform="scale(0.98393682,1.0163254)"
+       gradientUnits="userSpaceOnUse">
+      <stop
+         offset=".05"
+         stop-color="#fff44f"
+         id="stop78" />
+      <stop
+         offset=".37"
+         stop-color="#ff980e"
+         id="stop80" />
+      <stop
+         offset=".53"
+         stop-color="#ff3647"
+         id="stop82" />
+      <stop
+         offset=".7"
+         stop-color="#e31587"
+         id="stop84" />
+    </linearGradient>
+    <linearGradient
+       id="l"
+       x1="64.267187"
+       y1="11.019563"
+       x2="15.484065"
+       y2="66.097279"
+       gradientTransform="scale(0.98393682,1.0163254)"
+       gradientUnits="userSpaceOnUse">
+      <stop
+         offset=".17"
+         stop-color="#fff44f"
+         stop-opacity=".8"
+         id="stop87" />
+      <stop
+         offset=".6"
+         stop-color="#fff44f"
+         stop-opacity="0"
+         id="stop89" />
+    </linearGradient>
+    <linearGradient
+       id="a-3"
+       x1="69.971664"
+       y1="12.1998"
+       x2="8.7173738"
+       y2="73.257385"
+       gradientTransform="scale(0.98393682,1.0163254)"
+       gradientUnits="userSpaceOnUse">
+      <stop
+         offset=".05"
+         stop-color="#fff44f"
+         id="stop78-6" />
+      <stop
+         offset=".37"
+         stop-color="#ff980e"
+         id="stop80-7" />
+      <stop
+         offset=".53"
+         stop-color="#ff3647"
+         id="stop82-5" />
+      <stop
+         offset=".7"
+         stop-color="#e31587"
+         id="stop84-3" />
+    </linearGradient>
+    <radialGradient
+       id="b-5"
+       cx="62.186607"
+       cy="9.87043"
+       r="89.357414"
+       gradientTransform="scale(1.1089819,0.90172794)"
+       fx="62.186607"
+       fy="9.87043"
+       gradientUnits="userSpaceOnUse">
+      <stop
+         offset=".13"
+         stop-color="#ffbd4f"
+         id="stop2-6" />
+      <stop
+         offset=".28"
+         stop-color="#ff980e"
+         id="stop4-2" />
+      <stop
+         offset=".47"
+         stop-color="#ff3750"
+         id="stop6-9" />
+      <stop
+         offset=".78"
+         stop-color="#eb0878"
+         id="stop8-1" />
+      <stop
+         offset=".86"
+         stop-color="#e50080"
+         id="stop10-2" />
+    </radialGradient>
+    <radialGradient
+       id="c-7"
+       cx="35.379383"
+       cy="46.800175"
+       r="89.357414"
+       gradientTransform="scale(1.1089819,0.90172794)"
+       fx="35.379383"
+       fy="46.800175"
+       gradientUnits="userSpaceOnUse">
+      <stop
+         offset=".3"
+         stop-color="#960e18"
+         id="stop13-0" />
+      <stop
+         offset=".35"
+         stop-color="#b11927"
+         stop-opacity=".74"
+         id="stop15-9" />
+      <stop
+         offset=".43"
+         stop-color="#db293d"
+         stop-opacity=".34"
+         id="stop17-3" />
+      <stop
+         offset=".5"
+         stop-color="#f5334b"
+         stop-opacity=".09"
+         id="stop19-6" />
+      <stop
+         offset=".53"
+         stop-color="#ff3750"
+         stop-opacity="0"
+         id="stop21-0" />
+    </radialGradient>
+    <radialGradient
+       id="d-6"
+       cx="62.100616"
+       cy="-2.8990996"
+       r="33.903412"
+       gradientTransform="scale(0.76744488,1.3030252)"
+       fx="62.100616"
+       fy="-2.8990996"
+       gradientUnits="userSpaceOnUse">
+      <stop
+         offset=".13"
+         stop-color="#fff44f"
+         id="stop24-2" />
+      <stop
+         offset=".53"
+         stop-color="#ff980e"
+         id="stop26-6" />
+    </radialGradient>
+    <radialGradient
+       id="e-1"
+       cx="31.922279"
+       cy="60.196251"
+       r="36.04549"
+       gradientTransform="scale(0.95512645,1.0469818)"
+       fx="31.922279"
+       fy="60.196251"
+       gradientUnits="userSpaceOnUse">
+      <stop
+         offset=".35"
+         stop-color="#3a8ee6"
+         id="stop29-8" />
+      <stop
+         offset=".67"
+         stop-color="#9059ff"
+         id="stop31-7" />
+      <stop
+         offset="1"
+         stop-color="#c139e6"
+         id="stop33-9" />
+    </radialGradient>
+    <radialGradient
+       id="f-2"
+       cx="42.461979"
+       cy="32.401577"
+       r="21.266836"
+       gradientTransform="scale(0.95512645,1.0469818)"
+       fx="42.461979"
+       fy="32.401577"
+       gradientUnits="userSpaceOnUse">
+      <stop
+         offset=".21"
+         stop-color="#9059ff"
+         stop-opacity="0"
+         id="stop36-0" />
+      <stop
+         offset=".97"
+         stop-color="#6e008b"
+         stop-opacity=".6"
+         id="stop38-2" />
+    </radialGradient>
+    <radialGradient
+       id="g-3"
+       cx="37.516171"
+       cy="5.9350057"
+       r="27.420904"
+       gradientTransform="scale(0.99815093,1.0018525)"
+       fx="37.516171"
+       fy="5.9350057"
+       gradientUnits="userSpaceOnUse">
+      <stop
+         offset=".1"
+         stop-color="#ffe226"
+         id="stop41-7" />
+      <stop
+         offset=".79"
+         stop-color="#ff7139"
+         id="stop43-5" />
+    </radialGradient>
+    <radialGradient
+       id="h-9"
+       cx="57.203152"
+       cy="-13.152274"
+       r="119.69982"
+       gradientTransform="scale(1.091384,0.91626777)"
+       fx="57.203152"
+       fy="-13.152274"
+       gradientUnits="userSpaceOnUse">
+      <stop
+         offset=".11"
+         stop-color="#fff44f"
+         id="stop46-2" />
+      <stop
+         offset=".46"
+         stop-color="#ff980e"
+         id="stop48-2" />
+      <stop
+         offset=".72"
+         stop-color="#ff3647"
+         id="stop50-8" />
+      <stop
+         offset=".9"
+         stop-color="#e31587"
+         id="stop52-9" />
+    </radialGradient>
+    <radialGradient
+       id="i-7"
+       cx="74.835754"
+       cy="-6.704823"
+       r="125.78617"
+       gradientTransform="scale(0.68813893,1.4531949)"
+       fx="74.835754"
+       fy="-6.704823"
+       gradientUnits="userSpaceOnUse">
+      <stop
+         offset="0"
+         stop-color="#fff44f"
+         id="stop55-3" />
+      <stop
+         offset=".3"
+         stop-color="#ff980e"
+         id="stop57-6" />
+      <stop
+         offset=".57"
+         stop-color="#ff3647"
+         id="stop59-1" />
+      <stop
+         offset=".74"
+         stop-color="#e31587"
+         id="stop61-2" />
+    </radialGradient>
+    <radialGradient
+       id="j-9"
+       cx="37.372963"
+       cy="16.030758"
+       r="74.327896"
+       gradientTransform="scale(1.0094867,0.99060245)"
+       fx="37.372963"
+       fy="16.030758"
+       gradientUnits="userSpaceOnUse">
+      <stop
+         offset=".14"
+         stop-color="#fff44f"
+         id="stop64-3" />
+      <stop
+         offset=".48"
+         stop-color="#ff980e"
+         id="stop66-1" />
+      <stop
+         offset=".66"
+         stop-color="#ff3647"
+         id="stop68-9" />
+      <stop
+         offset=".9"
+         stop-color="#e31587"
+         id="stop70-4" />
+    </radialGradient>
+    <radialGradient
+       id="k-7"
+       cx="54.133553"
+       cy="21.245953"
+       r="85.335709"
+       gradientTransform="scale(1.0567198,0.94632469)"
+       fx="54.133553"
+       fy="21.245953"
+       gradientUnits="userSpaceOnUse">
+      <stop
+         offset=".09"
+         stop-color="#fff44f"
+         id="stop73-8" />
+      <stop
+         offset=".63"
+         stop-color="#ff980e"
+         id="stop75-4" />
+    </radialGradient>
+    <linearGradient
+       id="l-5"
+       x1="64.267189"
+       y1="11.019563"
+       x2="15.484065"
+       y2="66.097282"
+       gradientTransform="scale(0.98393682,1.0163254)"
+       gradientUnits="userSpaceOnUse">
+      <stop
+         offset=".17"
+         stop-color="#fff44f"
+         stop-opacity=".8"
+         id="stop87-0" />
+      <stop
+         offset=".6"
+         stop-color="#fff44f"
+         stop-opacity="0"
+         id="stop89-3" />
+    </linearGradient>
+    <linearGradient
+       id="a-3-6"
+       x1="69.971664"
+       y1="12.1998"
+       x2="8.7173738"
+       y2="73.257385"
+       gradientTransform="scale(0.98393682,1.0163254)"
+       gradientUnits="userSpaceOnUse">
+      <stop
+         offset=".05"
+         stop-color="#fff44f"
+         id="stop78-6-1" />
+      <stop
+         offset=".37"
+         stop-color="#ff980e"
+         id="stop80-7-0" />
+      <stop
+         offset=".53"
+         stop-color="#ff3647"
+         id="stop82-5-6" />
+      <stop
+         offset=".7"
+         stop-color="#e31587"
+         id="stop84-3-3" />
+    </linearGradient>
+    <radialGradient
+       id="b-5-2"
+       cx="62.186607"
+       cy="9.87043"
+       r="89.357414"
+       gradientTransform="scale(1.1089819,0.90172794)"
+       fx="62.186607"
+       fy="9.87043"
+       gradientUnits="userSpaceOnUse">
+      <stop
+         offset=".13"
+         stop-color="#ffbd4f"
+         id="stop2-6-0" />
+      <stop
+         offset=".28"
+         stop-color="#ff980e"
+         id="stop4-2-6" />
+      <stop
+         offset=".47"
+         stop-color="#ff3750"
+         id="stop6-9-1" />
+      <stop
+         offset=".78"
+         stop-color="#eb0878"
+         id="stop8-1-5" />
+      <stop
+         offset=".86"
+         stop-color="#e50080"
+         id="stop10-2-5" />
+    </radialGradient>
+    <radialGradient
+       id="c-7-4"
+       cx="35.379383"
+       cy="46.800175"
+       r="89.357414"
+       gradientTransform="scale(1.1089819,0.90172794)"
+       fx="35.379383"
+       fy="46.800175"
+       gradientUnits="userSpaceOnUse">
+      <stop
+         offset=".3"
+         stop-color="#960e18"
+         id="stop13-0-7" />
+      <stop
+         offset=".35"
+         stop-color="#b11927"
+         stop-opacity=".74"
+         id="stop15-9-6" />
+      <stop
+         offset=".43"
+         stop-color="#db293d"
+         stop-opacity=".34"
+         id="stop17-3-5" />
+      <stop
+         offset=".5"
+         stop-color="#f5334b"
+         stop-opacity=".09"
+         id="stop19-6-6" />
+      <stop
+         offset=".53"
+         stop-color="#ff3750"
+         stop-opacity="0"
+         id="stop21-0-9" />
+    </radialGradient>
+    <radialGradient
+       id="d-6-3"
+       cx="62.100616"
+       cy="-2.8990996"
+       r="33.903412"
+       gradientTransform="scale(0.76744488,1.3030252)"
+       fx="62.100616"
+       fy="-2.8990996"
+       gradientUnits="userSpaceOnUse">
+      <stop
+         offset=".13"
+         stop-color="#fff44f"
+         id="stop24-2-7" />
+      <stop
+         offset=".53"
+         stop-color="#ff980e"
+         id="stop26-6-4" />
+    </radialGradient>
+    <radialGradient
+       id="e-1-5"
+       cx="31.922279"
+       cy="60.196251"
+       r="36.04549"
+       gradientTransform="scale(0.95512645,1.0469818)"
+       fx="31.922279"
+       fy="60.196251"
+       gradientUnits="userSpaceOnUse">
+      <stop
+         offset=".35"
+         stop-color="#3a8ee6"
+         id="stop29-8-2" />
+      <stop
+         offset=".67"
+         stop-color="#9059ff"
+         id="stop31-7-5" />
+      <stop
+         offset="1"
+         stop-color="#c139e6"
+         id="stop33-9-4" />
+    </radialGradient>
+    <radialGradient
+       id="f-2-7"
+       cx="42.461979"
+       cy="32.401577"
+       r="21.266836"
+       gradientTransform="scale(0.95512645,1.0469818)"
+       fx="42.461979"
+       fy="32.401577"
+       gradientUnits="userSpaceOnUse">
+      <stop
+         offset=".21"
+         stop-color="#9059ff"
+         stop-opacity="0"
+         id="stop36-0-4" />
+      <stop
+         offset=".97"
+         stop-color="#6e008b"
+         stop-opacity=".6"
+         id="stop38-2-4" />
+    </radialGradient>
+    <radialGradient
+       id="g-3-3"
+       cx="37.516171"
+       cy="5.9350057"
+       r="27.420904"
+       gradientTransform="scale(0.99815093,1.0018525)"
+       fx="37.516171"
+       fy="5.9350057"
+       gradientUnits="userSpaceOnUse">
+      <stop
+         offset=".1"
+         stop-color="#ffe226"
+         id="stop41-7-0" />
+      <stop
+         offset=".79"
+         stop-color="#ff7139"
+         id="stop43-5-7" />
+    </radialGradient>
+    <radialGradient
+       id="h-9-8"
+       cx="57.203152"
+       cy="-13.152274"
+       r="119.69982"
+       gradientTransform="scale(1.091384,0.91626777)"
+       fx="57.203152"
+       fy="-13.152274"
+       gradientUnits="userSpaceOnUse">
+      <stop
+         offset=".11"
+         stop-color="#fff44f"
+         id="stop46-2-6" />
+      <stop
+         offset=".46"
+         stop-color="#ff980e"
+         id="stop48-2-8" />
+      <stop
+         offset=".72"
+         stop-color="#ff3647"
+         id="stop50-8-8" />
+      <stop
+         offset=".9"
+         stop-color="#e31587"
+         id="stop52-9-4" />
+    </radialGradient>
+    <radialGradient
+       id="i-7-3"
+       cx="74.835754"
+       cy="-6.704823"
+       r="125.78617"
+       gradientTransform="scale(0.68813893,1.4531949)"
+       fx="74.835754"
+       fy="-6.704823"
+       gradientUnits="userSpaceOnUse">
+      <stop
+         offset="0"
+         stop-color="#fff44f"
+         id="stop55-3-1" />
+      <stop
+         offset=".3"
+         stop-color="#ff980e"
+         id="stop57-6-4" />
+      <stop
+         offset=".57"
+         stop-color="#ff3647"
+         id="stop59-1-9" />
+      <stop
+         offset=".74"
+         stop-color="#e31587"
+         id="stop61-2-2" />
+    </radialGradient>
+    <radialGradient
+       id="j-9-0"
+       cx="37.372963"
+       cy="16.030758"
+       r="74.327896"
+       gradientTransform="scale(1.0094867,0.99060245)"
+       fx="37.372963"
+       fy="16.030758"
+       gradientUnits="userSpaceOnUse">
+      <stop
+         offset=".14"
+         stop-color="#fff44f"
+         id="stop64-3-6" />
+      <stop
+         offset=".48"
+         stop-color="#ff980e"
+         id="stop66-1-8" />
+      <stop
+         offset=".66"
+         stop-color="#ff3647"
+         id="stop68-9-9" />
+      <stop
+         offset=".9"
+         stop-color="#e31587"
+         id="stop70-4-2" />
+    </radialGradient>
+    <radialGradient
+       id="k-7-6"
+       cx="54.133553"
+       cy="21.245953"
+       r="85.335709"
+       gradientTransform="scale(1.0567198,0.94632469)"
+       fx="54.133553"
+       fy="21.245953"
+       gradientUnits="userSpaceOnUse">
+      <stop
+         offset=".09"
+         stop-color="#fff44f"
+         id="stop73-8-6" />
+      <stop
+         offset=".63"
+         stop-color="#ff980e"
+         id="stop75-4-4" />
+    </radialGradient>
+    <linearGradient
+       id="l-5-9"
+       x1="64.267189"
+       y1="11.019563"
+       x2="15.484065"
+       y2="66.097282"
+       gradientTransform="scale(0.98393682,1.0163254)"
+       gradientUnits="userSpaceOnUse">
+      <stop
+         offset=".17"
+         stop-color="#fff44f"
+         stop-opacity=".8"
+         id="stop87-0-5" />
+      <stop
+         offset=".6"
+         stop-color="#fff44f"
+         stop-opacity="0"
+         id="stop89-3-0" />
+    </linearGradient>
+  </defs>
+  <g
+     inkscape:groupmode="layer"
+     id="layer1"
+     inkscape:label="background">
+    <rect
+       style="fill:#20123a;fill-opacity:1;stroke-width:0;stroke-linejoin:round"
+       id="rect62650"
+       width="600"
+       height="200"
+       x="0"
+       y="0"
+       ry="0" />
				`@ -0,0 +1,2 @@`
				`<img src="/img/badges/{{ .Lang }}/{{ .Icon }}.svg" alt="{{ i18n .Alt }}" class="badge center" loading=lazy/>`
				`@ -0,0 +1 @@`
				`{{ partial "badge.html" (dict "Icon" (.Get 0) "Lang" (.Get 1) "Alt" (.Get 2) ) }}`
				`@ -0,0 +1 @@`
				`{{ partial "section1.html" (dict "Image" (.Get 0) "Content" (.Inner \| markdownify) ) }}`