Ticket-Click-Party (#70)

Reviewed-on: #70

.forgejo/workflows/cleanup.yaml

@@ -1,7 +1,7 @@
 on:
   pull_request:
-  pull_request_target:
-    - closed
+    types:
+      - closed
 
 jobs:
   cleanup-staging:
@@ -11,9 +11,13 @@ jobs:
     steps:
       - name: Pipeline info PR
         run: |
-          echo "PR#${{ github.event.pull_request.number }} ${{ github.event.action }}"
+          echo "Run triggered by ${{ github.event_name }} (${{ github.event.action }}) on ref ${{ github.ref_name }}"
 
-      - name: Deploy - Remove PR from staging
-        if: github.event.action == 'closed'
+      - name: Staging Deployment - Prepare keys
         run: |
-          ssh -i deploykey.priv -o 'UserKnownHostsFile ./known_hosts' ccchh-website-deploy@public-web-static-intern.hamburg.ccc.de -t "rm -r /var/www/next.hamburg.ccc.de/pr${{ github.event.pull_request.number }}/"
+          echo "${{ secrets.SSH_DEPLOY_KEY }}" > deploykey.priv
+          chmod 400 deploykey.priv
+          echo "${{ secrets.SSH_KNOWN_HOSTS_FILE }}" > ./known_hosts
+      - name: Staging Deployment - Remove PR from staging
+        run: |
+          ssh -i deploykey.priv -o 'UserKnownHostsFile ./known_hosts' ccchh-website-deploy@public-web-static-intern.hamburg.ccc.de -t "rm -r /var/www/staging.hamburg.ccc.de/pr${{ github.event.pull_request.number }}/"

.forgejo/workflows/deploy.yaml

@@ -2,7 +2,6 @@ on:
   push:
     branches:
       - main
-      - feature/forgejo
   pull_request:
   schedule:
     - cron: "0,20,40 * * * *"
@@ -18,7 +17,7 @@ jobs:
     steps:
       - name: Pipeline info
         run: |
-          echo "Run triggered by ${{ gitea.event_name }} on ref ${{ github.ref_name }}"
+          echo "Run triggered by ${{ github.event_name }} (${{ github.event.action }}) on ref ${{ github.ref_name }}"
 
       - name: Install packages
         run: |
@@ -27,8 +26,12 @@ jobs:
           apk add nodejs-current
           # For website build.
           apk add tzdata coreutils curl jq git
+          # For uploading.
+          apk add rsync openssh
 
       - uses: actions/checkout@v4
+        with:
+          fetch-depth: 0 # pull full history for page lastmod by git commit date
 
       - name: Patch baseURL (staging only)
         if: github.ref_name != 'main'
@@ -41,44 +44,35 @@ jobs:
           ./fetch-calendar.sh
           hugo
 
-      # TODO: Turn retention time down for scheduled runs
-      - uses: actions/upload-artifact@v3
-        with:
-          name: website-build
-          path: public/
-
-  deploy:
-    needs: [build]
-    runs-on: docker
-    container:
-      image: alpine
-    if: github.event_name == 'push'
-    steps:
-      - name: Install packages
-        run: |
-          apk update
-          # For CI actions.
-          apk add nodejs-current
-          # For uploading.
-          apk add rsync openssh
-
       - name: Deploy - Prepare keys
-        if: github.event_name == 'pull_request'
+        if: github.event_name == 'push' || github.event_name == 'pull_request' || github.event_name == 'schedule'
         run: |
           echo "${{ secrets.SSH_DEPLOY_KEY }}" > deploykey.priv
           chmod 400 deploykey.priv
           echo "${{ secrets.SSH_KNOWN_HOSTS_FILE }}" > ./known_hosts
 
-      - uses: actions/download-artifact@v3
-        with:
-          name: website-build
-
       - name: Deploy - Upload PR to staging
         if: github.event_name == 'pull_request'
         run: |
           echo "Deploying to staging.hamburg.ccc.de/pr${{ github.event.pull_request.number }}"
           rsync -v -r --delete -e "ssh -i deploykey.priv -o 'UserKnownHostsFile ./known_hosts'" public/ ccchh-website-deploy@public-web-static-intern.hamburg.ccc.de:/var/www/staging.hamburg.ccc.de/pr${{ github.event.pull_request.number }}/
+      - name: Deploy - Add comment to PR with staging URL
+        if: github.event_name == 'pull_request' && github.event.action == 'opened'
+        run: |
+          curl \
+            -X POST \
+            ${{ github.event.pull_request.base.repo.url }}/issues/${{ github.event.pull_request.number }}/comments \
+            -H "Content-Type: application/json" \
+            -H "Authorization: token $GITHUB_TOKEN" \
+            --data '{ "body": "You can view your changes at https://staging.hamburg.ccc.de/pr${{ github.event.pull_request.number }}/" }'
+
       - name: Deploy - Upload to prod
-        if: github.ref_name == 'main'
+        if: (github.event_name == 'push' || github.event_name == 'schedule') && github.ref_name == 'main'
         run: |
           rsync -v -r --delete -e "ssh -i deploykey.priv -o 'UserKnownHostsFile ./known_hosts'" public/ ccchh-website-deploy@public-web-static-intern.hamburg.ccc.de:/var/www/hamburg.ccc.de/
+
+      - uses: actions/upload-artifact@v3
+        if: github.event_name == 'pull_request'
+        with:
+          name: website-build
+          path: public/

LICENSE

@@ -1,6 +1,6 @@
 BSD 3-Clause License
 
-Copyright (c) 2023, Chaos Computer Club Hansestadt Hamburg e.V.
+Copyright (c) 2023, CCC Hansestadt Hamburg e.V.
 
 Redistribution and use in source and binary forms, with or without
 modification, are permitted provided that the following conditions are met:

README.md

@@ -11,8 +11,8 @@ All other information like details on groups, projects and recurring events shou
 - start page (onepager)
   * who we are
   * announcements aka current blog entry (if in the future)
-  * visit us -> open chaos + link to wiki for all recurring events
   * event calendar
+  * visit us -> open chaos + link to wiki for all recurring events
   * groups, e.g. CTF team, CMS, freifunk, etc.
   * directions (map)
 - blog, split into:
@@ -24,7 +24,7 @@ All other information like details on groups, projects and recurring events shou
 
 ### Build and Deploy
 
-To populate the calendar data, please run `fetch-calendar.sh` before running hugo.
+To populate the calendar data, please run `./fetch-calendar.sh` before running hugo.
 
 Running the hugo command without and parameters will re-generate the site in the `public` directory.
 To deploy the website, just copy the whole folder to a directory which is servered by the webserver of your preference.
@@ -47,26 +47,47 @@ hugo server -D
 #### Add an Event Announcement
 
 There are two basic types of posts: Events and articles.
-Events will be shown on the home page from their publishing date until they have happened.
+Events will be shown on the home page from their publishing date until they have happened and shall be used for things which happen at a certain date.
+This is not limited to events organized by the CCCHH, but can also be a hint to other events which we think are related to our activities.
 
 To create a new event blog post, run a command like this:
 ```shell
-hugo new content --kind event blog/your-event-title.md
+hugo new content --kind event blog/yyyy/yyyy-mm-dd-your-event-title/index.md
 ```
 
 #### Add a Blog Entry
 
 As mentioned before, you can also create blog posts for things which aren't events.
-They will only be shown in the "blog" section and posted to the RSS feeds.
+They will only be shown in the "blog" section and posted to the RSS feeds and shall be used for things which are relevant for a longer time.
+
+As we have much more event announcements than articles, finding articles in all blog posts can be quite a challenge.
+But using these two categories enables filtering, so that the history of articles is in one list.
 
 To create a new general blog post, run a command like this:
 ```shell
-hugo new content --kind article blog/your-article-title.md
+hugo new content --kind article blog/yyyy/yyyy-mm-dd-your-article-title/index.md
 ```
 
+#### Additional Notes on Events and Articles
+
 By default the first 70 words are shown as a summary on list pages.
 Please use `<!--more-->` to manually separate the summary from other post content.
 
+Please prefix your folder name with a date to make browsing the content in the source code easier.
+The date in the URL will be taken from the `date` field in the front matter.
+
+Blog posts from before 2024-01-22 were imported from the previous website and have additional front matter data which is not usually needed (e.g. the lastmod value).
+When using the commands above, the template shall have evenything you need.
+
+#### Populate the Event Calendar
+
+The event calendar table is filled from the Nextcloud iCal feed.
+To add a link on the title text, just add some link to the event's description field.
+The first link (something starting with `https://` or `http://`) from anywhere in the text will be taken.
+
+(iCal has a link attribute, but that is not supported by the Nextcloud web UI. So we use the description instead.)
+
+
 ### Icons
 
 You can use solid and brand icons from https://fontawesome.com/icons version 6 in your posts like this:

assets/snippets/contact.md

@@ -2,5 +2,5 @@
 - {{< fa envelope >}} E-Mail an den CCC Hamburg: <mail@hamburg.ccc.de>
 - {{< fa envelope >}} Verwaltung des CCC Hamburg: <buero@hamburg.ccc.de>
 - {{< fa brands mastodon >}} Fediverse: [@ccchh@chaos.social](https://chaos.social/@ccchh)
-- {{< fa comments >}} Matrix Space: [#ccchh-space:hamburg.ccc.de](https://matrix.to/#/#ccchh-space:hamburg.ccc.de)
-- {{< fa comments >}} Internet Relay Chat: [hackint.eu](https://webirc.hackint.org/#irc://irc.hackint.org/#ccchh?nick=) [#ccchh](ircs://hackint.eu/ccchh)
+- {{< fa comments >}} Matrix CCCHH Chat: [#ccchh:hamburg.ccc.de](https://matrix.to/#/#ccchh:hamburg.ccc.de)
+- {{< fa comments >}} Matrix Space: [#ccchh-space:hamburg.ccc.de](https://matrix.to/#/#ccchh-space:hamburg.ccc.de)

content/38c3-voucher/index.md

@@ -0,0 +1,39 @@
+---
+title: "38c3 Voucher"
+---
+
+# Update 2.11.2024: Abarbeitung der Voucher-Liste
+Wir haben die Wunsch-Liste geschlossen, weil wir wahrscheinlich nicht mehr genügend Codes bekommen, um noch alle auf der Liste versorgen zu können. Wir geben uns aber Mühe, allen einen Code zu schicken, die schon auf der Liste stehen!
+
+
+# Ticket-Klick-Party
+
+Wenn ihr im **offenen Verkauf** Tickets klicken möchtet, kommt zu einem unserer Klick-Party-Termine in den Club!
+
+An den drei Verkaufsterminen treffen wir uns im Club im Zeiseweg und klicken gemeinsam im Shop. Das erhöht die  Chancen, im richtigen Moment geklickt zu haben und somit ein Ticket kaufen zu können.
+
+* Bitte tragt euch hier ein, damit wir eine Idee haben, wie viele Personen jeweils kommen möchten: [Umfrage Ticket-Klick-Party](https://cloud.hamburg.ccc.de/apps/forms/s/49f3Mj6TRJ8EzLYp3RjK9HeS)
+* Seid rechtzeitig da! Für den Ticketverkauf muss man im genau richtigen Moment klicken, es lohnt sich, darauf vorbereitet zu sein. Seid deshalb mindestens eine halbe Stunde vor dem Beginn des Verkaufs [bei uns im Club](https://hamburg.ccc.de/#kontakt).
+* Bringt ein Laptop oder Tablet mit, mit dem ihr in den Shop gehen könnt. Ein Telefon geht grundsätzlich auch, ist aber erfahrungsgemäß etwas fummeliger.
+* Habt eine Email-Adresse parat, an die die Bestellbestätigung inkl. Zahlungsdaten geschickt werden kann, oder eure Kreditkarte, damit ihr sofort bezahlen könnt.
+
+# Voucher für den Ticket-Kauf für den 38c3
+
+Du fühlst dich als Teil der Chaos-Community in Hamburg und möchtest gerne am [38c3](https://events.ccc.de/congress/2024/infos/) teilnehmen? Dann kannst du folgendermaßen einen Voucher-Code bekommen, mit dem du schon in der geschlossenen Vorverkaufsphase ein Ticket kaufen kannst.
+
+**Wichtig:** Diese sogenannten Replizierenden Voucher können nur durch Kooperation aller Beteiligten eingelöst werden. Bitte lese dir die Anleitung aufmerksam durch und befolge die Anweisungen so gut wie möglich! Wenn du Fragen oder Schwierigkeiten hast, schreibe dem CCCHH an 38c3-voucher@hamburg.ccc.de.
+
+## Anleitung Voucher anfordern und benutzen
+1. ~~Trage deine Email in dieses Formular ein.~~ Wir haben so viele Wünsche bekommen, das es unwahrscheinlich ist, das wir alle erfüllen können. Wir haben deshalb die Liste geschlossen
+2. Kreuze das Feld SEPA-Echtzeitüberweisung/Kreditkarte bitte nur dann an, wenn du über einen dieser beiden Wege deine Bestellung noch am selben Tag bezahlen kannst.
+3. Sobald ein Voucher-Code zur Verfügung steht, schicken wir dir den Code zu.
+4. Benutze den Code so schnell wie möglich, um unter https://tickets.events.ccc.de dein Ticket zu bestellen.
+5. Bitte gebe als Email-Adresse für den Voucher **38c3-voucher@hamburg.ccc.de** an. Das Ticket selbst lasse dir bitte für deine eigene Adresse ausstellen.
+   ![Screenshot mit korrekt ausgefülltem Feld](38c3-pass-on-voucher-marked-de.png)
+6. Bezahle dein Ticket so schnell wie möglich. Ein weiterer Voucher-Code wird erst erzeugt, wenn deine Zahlung eingegangen und verarbeitet ist.
+7. Viel Spass auf dem 38c3!
+
+Solltest du von uns einen Code erhalten haben, diesen aber nicht mehr benötigen, da du z.B. bereits auf anderem Wege einen Voucher erhalten hast, dann schreibe uns so schnell wie möglich an 38c3-voucher@hamburg.ccc.de, damit wir den Voucher weitergeben können.
+
+Bitte beachte: es gibt eine begrenze Anzahl an Tickets, die über das Voucher-Verfahren vergeben werden, und die Voucher-Phase endet am 11.11., es gibt also keine Garantie, dass du auf diesem Weg ein Ticket erhälst. Das gesamte Ticket-Verfahren wird [hier](https://events.ccc.de/2024/10/17/38c3-presale-modus-operandi/) erklärt.
+

content/blog/2023/2023-03-01-tag-des-offenen-hackspace-25-3/index.md

@@ -1,13 +1,13 @@
 ---
 categories: event
-date: '2022-03-25T13:37:00+01:00'
+date: '2023-03-25T13:37:00+01:00'
 draft: false
 header:
   caption: Sorry this blog entry was migrated, there is no Alt-Text
   image: chaosknoten.gif
-lastmod: '2023-02-28T10:00:00+01:00'
+lastmod: '2023-03-01T10:00:00+01:00'
 location: Zeiseweg 9
-publishDate: '2023-02-28T10:00:00+01:00'
+publishDate: '2023-03-01T10:00:00+01:00'
 slug: tag-des-offenen-hackspace-25-3-index
 title: Tag des offenen Hackspace 25.3.
 ---

content/blog/2023/2023-12-09-freitalk-verschluesselte-kommunikation/index.md

@@ -29,4 +29,4 @@ Wir empfehlen euch das Mitbringen einer Methode, um euch Notizen zu machen, sowi
 
 Ihr findet uns in den Räumen des CCCHH in der [Viktoria-Kaserne, Zeiseweg 9](https://www.hamburg.ccc.de/#wegbeschreibung). Die Veranstaltung ist kostenlos und wird etwa 2 Stunden dauern. Wer im Anschluss noch länger bleiben möchte, um weiterführende Fragen zu stellen oder mit uns zu quatschen, ist dazu herzlich eingeladen.
 
-Allgemeine Informationen über unsere FreiTalk-Gruppe und wie ihr auf dem Laufenden bleiben könnt, findet ihr [in unserem Wiki](https://wiki.ccchh.net/club:freitalk:start). Dort findet ihr später auch die Folien und weiteres Material.
+Allgemeine Informationen über unsere FreiTalk-Gruppe und wie ihr auf dem Laufenden bleiben könnt, findet ihr [in unserem Wiki](https://wiki.hamburg.ccc.de/club:freitalk:start). Dort findet ihr später auch die Folien und weiteres Material.

content/blog/2024/2024-01-24-freitalk-linux-werkstatt/freitalk-linux-werkstatt.md

@@ -0,0 +1,28 @@
+---
+categories: event
+title: 'Freitalk - Linux Werkstatt'
+date: '2024-02-02T18:30:00+01:00' # date of the event
+publishDate: '2024-01-24T23:28:09+01:00' # when to publish
+draft: false
+location: Z9
+authors:
+  - skye
+# tags:
+# header:
+#   caption: A caption für the picture will be used as Alt-Text
+#   image: Path to the image
+---
+
+Linux ist toll, um sich von den kommerziellen Interessen anderer Betriebssysteme zu befreien, um alter Hardware ein zweites Leben zu schenken, oder um mehr Spaß mit Computern zu haben. Leider gibt es nur sehr wenige Angebote, um Hilfe mit Linux-Problemen zu erhalten, und es kann schwierig sein, Menschen zu finden, die sich damit auskennen.
+   
+Deshalb werden wir am 2. Februar zwischen 18:30 und 21 Uhr in den Räumen des CCCHH eine offene Linux-Werkstatt anbieten, wo wir euch mit Linux helfen können. Wir können euch zum Beispiel dabei unterstützen, passende Linux-Software für eure Anwendungen zu finden, ein kaputtes Linux wieder zu reparieren, oder ein Linux eurer Wahl auf eurem PC oder Laptop zu installieren (bitte sorgt vorher eigenständig dafür, alle eure wertvollen Daten auf einem anderen Gerät zu speichern).
+
+Gerne stehen wir auch für allgemeine und spezifischere Fragen zur Verfügung. Auch erfahrenere Linux-Fans sind eingeladen, um sich mit uns auszutauschen oder den Anfänger\*innen zu helfen.
+
+Es ist eine offene Veranstaltung ohne Vortragsteil. Ihr könnt zwischen 18:30 und 21 Uhr jederzeit vorbeikommen. Bitte bringt euer Gerät mit sowie ggf. einen externen Datenträger, um Daten sichern zu können. Wenn ihr einen „großen“ PC vorbeibringen möchtet, braucht ihr Bildschirm, Tastatur etc. nicht extra mitzuschleppen, davon haben wir genug.
+
+Die Veranstaltung findet mit FFP2-Maskenpflicht statt, es stehen Masken im Club zur Verfügung.
+
+We are also happy to help you in English.
+
+Weitere Infos über unsere FreiTalk-Veranstaltungen sowie eine Anleitung, wie ihr über E-Mail darüber auf dem Laufenden gehalten werden könnt, gibt es in [unserem Wiki-Artikel über FreiTalk.](https://wiki.hamburg.ccc.de/club:freitalk:start)

content/blog/2024/2024-01-27-hamburg-steht-zusammen/hamburg-steht-zusammen.md

@@ -0,0 +1,21 @@
+---
+categories: event
+title: 'Hamburg steht Zusammen'
+date: '2024-01-28T14:00:00+01:00'
+publishDate: '2024-01-27T15:27:09+01:00'
+draft: false
+location: Ludwig-Erhard-Straße
+weight: 0 
+authors:
+  - w1ntermute
+# tags:
+# header:
+#   caption: A caption für the picture will be used as Alt-Text
+#   image: Path to the image
+---
+
+Auch wir, der CCC Hamburg, rufen zusammen mit anderen Gruppen auf, sich bei der morgigen Demo am 28.01. zu beteiligen.
+Gerade wir vom Chaos Computer Club wissen, wie wichtig es ist, unsere Demokratie und Diversität zu verteidigen.
+Deshalb werden wir und auch andere Gruppen morgen um 14:00 einen Marsch an der Ludwig-Erhard-Straße starten.
+Wir hoffen, dass viele Wesen dem Aufruf folgen werden. Mehr Informationen findet ihr dazu auf der [Seite des Demokratieteams](https://www.demokrateam.org/demos/hamburg-steht-zusammen/).
+ Dieses Mal wird es eine bewegende Demonstration. Zieht also bequeme Schuhe an.

content/blog/2024/2024-02-07-ctf-lactf/index.md

@@ -0,0 +1,23 @@
+---
+categories: event
+title: 'Cyclopropenylidene spielt LA CTF'
+date: '2024-02-17T14:00:00+01:00'
+publishDate: '2024-02-07T22:00:00+01:00'
+draft: false
+location: Zeiseweg 9, Hauptraum
+weight: 0 
+authors:
+  - ellcs 
+# tags:
+# header:
+#   caption: A caption für the picture will be used as Alt-Text
+#   image: Path to the image
+---
+
+Seit der Pandemie wurde in den Clubräumen an keinem echten CTF teilgenommen. Dies möchten wir ändern!
+
+Teilnehmen werden wir am [LA CTF](https://lac.tf/). Wir spielen am Samstag, dem 17.02.2024, ab 14:00, im Clubraum und am Sonntag, dem 18.02.2024 bis 20:00. Im Hauptraum des Z9.
+
+Wir treffen uns dabei, um zusammen zu rätseln, zu hacken und zu tschunken. [Meldet euch gerne bei uns](https://wiki.hamburg.ccc.de/club:ctf:start#kontakt).
+
+Wir freuen uns auf alle Personen, die früher bereits bei Cyclopropenylidene mitgespielt haben, als kleines Wiedersehen :) Wir freuen uns auf euch!

content/blog/2024/2024-02-17-tag-des-offenen-hackspace/tag-des-offenen-hackspace.md

@@ -0,0 +1,33 @@
+---
+categories: event
+title: 'Tag Des Offenen Hackspace'
+date: '2024-03-02T16:00:00+01:00' # date of the event
+publishDate: '2024-02-17T19:07:43+01:00' # when to publish
+draft: false
+location: Z9
+authors:
+  - skye
+# tags:
+# header:
+#   caption: A caption für the picture will be used as Alt-Text
+#   image: Path to the image
+---
+
+Am Samstag, den 2. März wird der CCCHH einen Tag der offenen Tür veranstalten. Wir begrüßen alle Interessierten, alle Neulinge und alle alten Hasen, die diese in Empfang nehmen möchten. Es gibt kurze Präsentationen, einen offenen Gesprächsteil und ein Stricktreffen. <!--more-->
+
+Was für Projekte und Gruppen gibt es im CCCHH? Muss ich IT-Profi sein, um bei euch mitzumachen, oder finde ich auch als fachfremde Person einen Platz? Macht ihr eigentlich nur Computer oder engagiert ihr euch auch sozial und politisch? Wie sieht es mit Inklusion und Barrierefreiheit aus? Wie organisieren sich FLINTA\*-Personen im CCC-Umfeld? Wie kann ich in den Club einsteigen und wie finde ich ein Projekt, bei dem ich mich einbringen kann? Wen kann ich ansprechen, wenn ich über ein bestimmtes Thema etwas lernen möchte? Warum habt ihr eigentlich alle Katzenohren auf?
+
+Diese und weitere Fragen beantworten wir euch in [unseren Vereinsräumen](https://hamburg.ccc.de/#kontakt) in der Viktoria-Kaserne.
+
+## Ablauf und Programm
+- 15:30: Ab hier rechnen wir mit eurem Erscheinen, aber wir werden natürlich während der gesamten Zeitdauer der Veranstaltung unsere Tür für Besuchende öffnen. Ihr dürft auch später kommen.
+- 16:00 bis 17:00: Wir stellen unseren Club sowie verschiedene Gruppen und Projekte vor, um euch zu inspirieren und zum Mitmachen einzuladen. Wir sprechen über [regelmäßige Termine](https://wiki.hamburg.ccc.de/club:terminserien:start) und feste Gruppen in unserem Hackspace, über [Geekfem](https://geekfem.net/) und die [Haecksen](https://www.haecksen.org/), über [CTF](https://wiki.hamburg.ccc.de/club:ctf:start), über die [Cryptoparty](https://cryptoparty-hamburg.de/) sowie über andere Projekte, die im Chaos-Umfeld passieren.
+- 17:00 bis 18:00: In einer lockeren Runde beantworten wir eure Fragen zu den vorgestellten Projekten oder zum Club allgemein.
+- Ab 18:00: Gemütliches Stricktreffen für alle, die an der flauschigen Seite des Chaos interessiert oder schon daran beteiligt sind, denn Chaos ist viel mehr als nur Computerkram. Wenn alle, die sowieso schon stricken, ein bisschen zusätzliches Material mitbringen, können wir es auch denen beibringen, die es neu lernen möchten.
+- Im weiteren Verlauf des Abends Übergang zu Socializing.
+
+Hinweis 1, Maskenpflicht: Rücksichtnahme und Inklusion sind feste Bestandteile der Chaos-Kultur. Um gesundheitlich vorbelastete Personen zu schützen, gilt in unseren Clubräumen eine sogenannte On-Demand-Maskenpflicht: Sobald eine Person dies wünscht, müssen alle Anwesenden eine FFP2-Maske aufsetzen. Da an der Organisation und Durchführung dieser Veranstaltung mehrere Personen beteiligt sind, die auf diesen Schutz angewiesen sind, ist davon auszugehen, dass eine Maskenpflicht gelten wird. Selbstverständlich stehen in den Clubräumen Masken zur Verfügung für alle, die keine eigene dabei haben.
+
+Hinweis 2, Einlass: Da unsere Klingel vor einiger Zeit entwendet wurde (Beweggründe dafür sind unklar), ist es derzeit so, dass Gäste im Club anrufen müssen (siehe [Kontakt](https://hamburg.ccc.de/#kontakt)), um am Eingang abgeholt zu werden. Ein Schild mit der Club-Telefonnummer hängt an der Stelle, wo sich einstmals unsere Klingel befand, aber für den Fall, dass ihr den richtigen Eingang nicht findet oder sofern ihr anderweitig Hilfe braucht (Rollstuhl, Sehbehinderung, falschen Eingang genommen etc.) empfehlen wir euch, die Nummer schon im Vorfeld zu notieren. Alternativ ist es möglich, in unserem [Matrix-Channel](https://matrix.to/#/#ccchh:hamburg.ccc.de) zu schreiben.
+
+Hinweis 3, all creatures welcome: The presentation part will be in German but we do speak English, and are more than happy to introduce you to our hackspace individually.

content/blog/2024/2024-04-20-ctf/index.md

@@ -0,0 +1,23 @@
+---
+categories: event
+title: 'CTF am 20.04.2024'
+date: '2024-04-20T12:00:00+02:00' # date of the event
+publishDate: '2024-04-16T21:18:41+02:00' # when to publish
+draft: false
+location: Zeiseweg 9, Hautpraum
+weight: 0
+authors:
+  - w1ntermute
+tags: ctf
+#header:
+#   caption: A caption für the picture will be used as Alt-Tex
+#   image: Path to the image
+---
+
+Es ist wieder so weit, wir wollen gemeinsam hacken.  Kommt gerne vorbei und wir werden zusammen die challenges angehen.
+
+Teilnehmen werden wir am [Potsdam Cyber Games](https://potsdam-cyber-games.de/). Wir spielen am Samstag, dem 20.04.2024, ab 12:00, im Clubraum und am Sonntag, dem 21.04.2024 bis 20:00. Im Hauptraum des Z9.
+
+Wir treffen uns dabei, um zusammen zu rätseln, zu hacken und zu tschunken. [Meldet euch gerne bei uns](https://wiki.hamburg.ccc.de/club:ctf:start#kontakt).
+
+Wer es nicht schafft, vor Ort zu sein, kann auch gerne zu Hause spielen und beim nächsten CTF-MIttwoch Fragen oder Lösungen mit uns durchgehen. 

content/blog/2024/2024-06-08-no-openchaos/index.md

@@ -0,0 +1,16 @@
+---
+categories: event
+title: 'Openchaos am 14.06.2024 fällt aus'
+date: '2024-06-14T20:00:00+02:00' # date of the event
+publishDate: '2024-06-08T18:00:00+02:00' # when to publish
+draft: false
+location: Zeiseweg 9, Hautpraum
+weight: 0
+tags: openchaos
+#header:
+#   caption: A caption für the picture will be used as Alt-Tex
+#   image: Path to the image
+---
+
+Aus organisatorischen Gründen fällt das Openchaos am Freitag den 14. Juni 2024 leider aus.  
+Die nächsten Termine sind am Dienstag den 25. Juni, und Freitag den 12. Juli (mit Maskenpflicht).

content/blog/2024/2024-07-10-openchaos-spaeter/index.md

@@ -0,0 +1,13 @@
+---
+categories: event
+title: 'Openchaos am 12.07. erst um 21 Uhr'
+date: '2024-07-12T21:00:00+02:00' # date of the event
+publishDate: '2024-07-10T18:00:00+02:00' # when to publish
+draft: false
+location: Zeiseweg 9, Hautpraum
+weight: 0
+tags: openchaos
+---
+
+Aus organisatorischen Gründen kann das Openchaos am Freitag den 12. Juli 2024 erst um 21 Uhr beginnen.  
+Wir bitten darum, nicht vor 21 Uhr zu erscheinen.

content/home/1-kalender/index.md

@@ -7,4 +7,4 @@ headless: true
 
 {{< calendar-table >}}
 
-Im Wiki findest du eine [Übersicht über regelmäßige Termine](https://wiki.ccchh.net/club:terminserien:start) oder du abonnierst den Kalender als [iCal-Feed](webcal://cloud.hamburg.ccc.de/remote.php/dav/public-calendars/QJAdExziSnNJEz5g/?export).
+Im Wiki findest du eine [Übersicht über regelmäßige Termine](https://wiki.hamburg.ccc.de/club:terminserien:start) oder du abonnierst den Kalender als [iCal-Feed](webcal://cloud.hamburg.ccc.de/remote.php/dav/public-calendars/QJAdExziSnNJEz5g/?export).

content/home/2-visit/index.md

@@ -5,7 +5,7 @@ draft: false
 headless: true
 ---
 
-Wenn du uns kennenlernen möchtest, komm doch einfach mal zum [Open Chaos](https://wiki.ccchh.net/club:terminserien:openchaos) vorbei.
+Wenn du uns kennenlernen möchtest, komm doch einfach mal zum [Open Chaos](https://wiki.hamburg.ccc.de/club:terminserien:openchaos) vorbei.
 Gelegentlich bieten wir außerdem Vorträge zu spezifischen Themen an, die hier im [Blog]({{< ref "/blog" >}}) und im Kalender veröffentlichen.
 
 {{< img-resize "2-visit/Z9-hauptraum-202301-leinwand.jpeg" "300x" "float-right" >}}

content/home/3-gruppen/1-freifunk.md

@@ -4,7 +4,7 @@ draft: false
 headless: true
 type: card
 image: ffhhlogo_neu.png
-link: https://wiki.ccchh.net/club:freifunk:start
+link: https://wiki.hamburg.ccc.de/club:freifunk:start
 ---
 
 Die Vision von Freifunk ist die Verbreitung freier Netzwerke, die Demokratisierung der Kommunikationsmedien und die Förderung lokaler Sozialstrukturen.

content/home/3-gruppen/2-geekfem.md

@@ -4,7 +4,7 @@ draft: false
 headless: true
 type: card
 image: haecksen-logo-gruenblau.png
-link: https://wiki.ccchh.net/club:geekfem:start
+link: https://wiki.hamburg.ccc.de/club:geekfem:start
 ---
 
 Geekfem ist ein Raum für technik-interessierte Frauen* und veranstaltet regelmäßig Termine zu verschiedenen Themen oder einfach nur zum schnacken.

content/home/3-gruppen/3-ctf.md

@@ -4,7 +4,7 @@ draft: false
 headless: true
 type: card
 image: c3h2-logo.png
-link: https://wiki.ccchh.net/club:ctf:start
+link: https://wiki.hamburg.ccc.de/club:ctf:start
 ---
 
 Die CTF-Gruppe "Cyclopropenylidene" beschäftigt sich spielerisch mit IT-Security.

content/home/3-gruppen/4-cms.md

@@ -4,7 +4,7 @@ draft: false
 headless: true
 type: card
 image: cms-logo-blau.png
-link: https://wiki.ccchh.net/club:cms:start
+link: https://wiki.hamburg.ccc.de/club:cms:start
 ---
 
 CMS ist ein regionales Bildungsprojekt des CCCHH an Schulen in Hamburg und dem Umland. 

content/home/3-gruppen/5-crypto.md

@@ -4,7 +4,7 @@ draft: false
 headless: true
 type: card
 image: cryptoparty-300x100.png
-link: https://wiki.ccchh.net/club:cryptogruppe:start
+link: https://wiki.hamburg.ccc.de/club:cryptogruppe:start
 ---
 
 Die Cryptogruppe befasst sich mit digitaler Selbstverteidigung und veranstaltet u.a. Cryptoparties in Hamburg.

content/home/3-gruppen/6-ueberwachung.md

@@ -4,7 +4,7 @@ draft: false
 headless: true
 type: card
 # image: TODO
-link: https://wiki.ccchh.net/club:ueberwachungsstammtisch:start
+link: https://wiki.hamburg.ccc.de/club:ueberwachungsstammtisch:start
 ---
 
 Menschen aus Hamburg und der Welt sprechen über Überwachung und was wir dagegen tun können. 

content/home/4-kontakt/1-unterstuetzen.md

@@ -5,4 +5,4 @@ headless: true
 type: card
 ---
 
-Falls du den Chaos Computer Club Hansestadt Hamburg e.V. unterstützen willst, lohnt es sich eine [Fördermitgliedschaft](https://wiki.ccchh.net/verein:offizielles:foemi-formular) abzuschließen.
+Falls du den CCC Hansestadt Hamburg e.V. unterstützen willst, lohnt es sich eine [Fördermitgliedschaft](https://wiki.hamburg.ccc.de/verein:offizielles:foemi-formular) abzuschließen.

content/home/4-kontakt/2-geschichte.md

@@ -6,4 +6,4 @@ type: card
 ---
 
 Der Chaos Computer Club e.V. wurde im Jahr 1984 in Hamburg gegründet. Seitdem ist der Verein gewachsen und ragt nun über Bundesdeutsches Gebiet bis nach Österreich und in die Schweiz hinaus.
-Mehr dazu findest du im [Wiki](https://wiki.ccchh.net/club:geschichte).
+Mehr dazu findest du im [Wiki](https://wiki.hamburg.ccc.de/club:geschichte).

content/home/4-kontakt/index.md

@@ -10,21 +10,18 @@ Unsere Räume befinden sich im Gebäude der [FUX eG](https://fux-eg.org):
 **Zeiseweg 9**  
 22765 Hamburg-Altona.
 
-Da die Zwischentüren im Haus verschlossen sind, muss euch immer eine Person am Eingang anholen.
+Da die Zwischentüren im Haus verschlossen sind, muss euch immer eine Person am Eingang abholen.
 Am östlichen Eingang (siehe Markierung auf der Karte) ist dafür eine Klingel.
-(Die Klingel ist aktuell verschwunden, bitte ruft einfach [+49 221 59619 1008](tel:+49221596191008) an.)
+(Die Klingel ist aktuell verschwunden, bitte ruft einfach [+49 40 23830150](tel:+494023830150) an.)
 
 Parkplätze sind in der Umgebung rar und es muss ein Parkschein gelöst werden, wir sind aber gut per ÖPNV erreichbar.
 Die S-Bahn-Station **Holstenstraße** ist ca. 700 m entfernt, die Bushaltestellen **Max-Brauer-Allee (Mitte)** oder Gerichtstraße ca. 400 m.
 {{< clearfix >}}
 
 #### Wichtige Informationen für Mobilitätseingeschränkte
-Unsere Räume befinden sich im ersten Stock und sind prinzipiell über den zentralen Aufzug erreichbar.
-Der Aufzug ist vom Hof erreichbar, kann aber von Außen nur mit einem Schlüssel geöffnet werden.
-Die Hebevorrichtung am Haupteingang braucht leider auch eine Schlüsselkarte, die wir aber haben.
+Unsere Räume befinden sich im ersten Stock und sind über den zentralen Aufzug erreichbar. Der Aufzug kann entweder aus dem Hof oder über das Erdgeschoss erreicht werden. Um ins Erdgeschoss zu kommen, kann die Hebevorrichtung im Kubus benutzt werden. Für die Hoftür des Fahrstuhls ist ein Schlüssel notwendig, für die Hebevorrichtung eine Schlüsselkarte.
 
-So oder so ist es also hilfreich, wenn ihr euch telefonisch meldet ([+49 221 59619 1008](tel:+49221596191008)), damit euch jemand abholen kann.
-Am Besten meldet ihr euch auch vorher, da der Aufzug gelegentlich defekt ist.
+Um sicherzugehen, das die Technik einwandfrei funktioniert, bevor ihr euch auf den Weg macht, meldet euch im Matrix oder telefonisch unter [+49 40 23830150](tel:+494023830150), dann können wir sichergehen, das euch jemand abholt.
 
 
 #### Weitere Kontaktdaten

content/imprint/index.md

@@ -9,7 +9,7 @@ weight: 10
 
 Verantwortlich für diese Seiten gemäß §10 MDStV ist der CCC Hansestadt Hamburg e.V. mit Sitz in Hamburg.
 
-Der CCC Hansestadt Hamburg e.V. wurde im Vereinsregister vom Registergericht des Amtsgericht Hamburg unter der VR-Nr. 20300 eingetragen.
+Der CCC Hansestadt Hamburg e.V. wurde im Vereinsregister vom Registergericht des Amtsgericht Hamburg unter der VR-Nr. 20300 eingetragen.
 
 ## Kontakt
 

content/privacy-notice/index.md

@@ -18,7 +18,7 @@ In jedem Fall haben von unserer Seite nur berechtigte Personen Zugang zu euren p
 ### Verantwortliche
 Der Verantwortliche im Sinne der Datenschutzgrundverordnung (DSGVO) und anderer nationaler Datenschutzgesetze der Mitgliedsstaaten sowie sonstiger datenschutzrechtlicher Bestimmungen ist der CCC Hansestadt Hamburg e.V. mit Sitz in Hamburg.
 
-Der CCC Hansestadt Hamburg e.V.wurde im Vereinsregister vom Registergericht des Amtsgericht Hamburg unter der VR-Nr. 20300 eingetragen.
+Der CCC Hansestadt Hamburg e.V. wurde im Vereinsregister vom Registergericht des Amtsgericht Hamburg unter der VR-Nr. 20300 eingetragen.
 
 ### Kontaktdaten der Datenschutzstelle des CCC Hansestadt Hamburg e.V.
 

fetch-calendar.sh

@@ -7,10 +7,10 @@ OUTFILE=data/calendar.json
 # See here for uname -s outputs: https://en.wikipedia.org/wiki/Uname#Examples
 OS_TYPE=$(uname -s)
 if [ "$OS_TYPE" = "Linux" ]; then
-    START_TIME=$(date --date="-1 day" +%s) # yesterday
+    START_TIME=$(date --date="-6 hours" +%s) # now - 6 hours
     END_TIME=$(date --date="+1 month" +%s) # now + 1 month
 elif [ "$OS_TYPE" = "Darwin" ] || [ "$OS_TYPE" = "FreeBSD" ]; then
-    START_TIME=$(date -v-1d +%s) # yesterday
+    START_TIME=$(date -v-6H +%s) # now - 6 hours
     END_TIME=$(date -v+1m +%s) # now + 1 month
 else
     echo "ERROR: Unsupported OS type"

hugo.toml

@@ -48,19 +48,19 @@ enableGitInfo = true
 [[menu.footer]]
   name = "Satzung"
   weight = 90
-  url = "https://wiki.ccchh.net/verein:offizielles:satzung"
+  url = "https://wiki.hamburg.ccc.de/verein:offizielles:satzung"
   [menu.footer.params]
     rel = "external"
 [[menu.footer]]
   name = "Hausordnung"
   weight = 92
-  url = "https://wiki.ccchh.net/verein:offizielles:hausordnung"
+  url = "https://wiki.hamburg.ccc.de/verein:offizielles:hausordnung"
   [menu.footer.params]
     rel = "external"
 [[menu.footer]]
   name = "Mitglied werden"
   weight = 94
-  url = "https://wiki.ccchh.net/verein:offizielles:foemi-formular"
+  url = "https://wiki.hamburg.ccc.de/verein:offizielles:foemi-formular"
   [menu.footer.params]
     rel = "external"
 

renovate.json

@@ -0,0 +1,6 @@
+{
+  "$schema": "https://docs.renovatebot.com/renovate-schema.json",
+  "extends": [
+    "config:recommended"
+  ]
+}

themes/ccchh/archetypes/article.md

@@ -2,7 +2,7 @@
 categories: article
 title: '{{ replace .File.ContentBaseName `-` ` ` | title }}'
 date: '{{ .Date }}'
-draft: true
+draft: false
 authors:
   - your name
 # tags:

themes/ccchh/archetypes/default.md

@@ -1,5 +1,5 @@
 ---
 title: "{{ replace .Name "-" " " | title }}"
 date: {{ .Date }}
-draft: true
+draft: false
 ---

themes/ccchh/archetypes/event.md

@@ -3,7 +3,7 @@ categories: event
 title: '{{ replace .File.ContentBaseName `-` ` ` | title }}'
 date: '{{ .Date }}' # date of the event
 publishDate: '{{ .Date }}' # when to publish
-draft: true
+draft: false
 location: Z9
 authors:
   - your name

themes/ccchh/assets/js/hamburgerAdditional.js

@@ -0,0 +1,33 @@
+"use strict";
+
+function setScrolling(enable = true) {
+  const body = document.body;
+  if (enable) {
+    body.style.overflow = "unset";
+  }
+  else {
+    body.style.overflow = "hidden";
+  }
+};
+
+document.addEventListener("DOMContentLoaded", () => {
+  const hamburgerMenuCheckbox = document.querySelector(".menu-button");
+
+  // When the hamburger menu is open, disable scrolling.
+  hamburgerMenuCheckbox.addEventListener("change", () => {
+    if (hamburgerMenuCheckbox.checked) {
+      setScrolling(false);
+    }
+    else {
+      setScrolling(true);
+    }
+  });
+
+  window.addEventListener("resize", () => {
+    if (window.innerWidth > 768 && hamburgerMenuCheckbox.checked) {
+      // Uncheck the checkbox to disable scrolling and to get to the original state.
+      hamburgerMenuCheckbox.checked = false;
+      hamburgerMenuCheckbox.dispatchEvent(new Event("change"));
+    }
+  });
+});

themes/ccchh/assets/js/roomstate.js

@@ -76,5 +76,5 @@ function update() {
 
 window.onload = function () {
   update()
-  window.setTimeout(update, interval_ms)
+  window.setInterval(update, interval_ms)
 }

themes/ccchh/assets/pico-1.5.11/LICENSE.md

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2019-2023 Pico
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

themes/ccchh/assets/pico-1.5.11/scss/_functions.scss

@@ -0,0 +1,4 @@
+// Output color in RGB format
+@function to-rgb($color) {
+  @return unquote("rgb(#{red($color)}, #{green($color)}, #{blue($color)})");
+}

themes/ccchh/assets/pico-1.5.11/scss/_variables.scss

@@ -0,0 +1,69 @@
+// Config
+// ––––––––––––––––––––
+
+// Set the root element for $enable-semantic-container and $enable-responsive-spacings
+$semantic-root-element: "body" !default;
+
+// Enable <header>, <main>, <footer> inside $semantic-root-element as containers
+$enable-semantic-container: false !default;
+
+// Enable .container and .container-fluid
+$enable-class-container: true !default;
+
+// Enable a centered viewport for <header>, <main>, <footer> inside $enable-semantic-container 
+// Fluid layout if disabled
+$enable-viewport: true !default;
+
+// Enable responsive spacings for <header>, <main>, <footer>, <section>, <article>
+// Fixed spacings if disabled
+$enable-responsive-spacings: true !default;
+
+// Enable responsive typography
+// Fixed root element size if disabled
+$enable-responsive-typography: true !default;
+
+// Enable .classes
+// .classless version if disabled
+$enable-classes: true !default;
+
+// Enable .grid class
+$enable-grid: true !default;
+
+// Enable transitions
+$enable-transitions: true !default;
+
+// Enable overriding with !important
+$enable-important: true !default;
+
+// Responsive
+// ––––––––––––––––––––
+
+// xs: Extra small (portrait phones)
+// sm: Small(landscape phones)
+// md: Medium(tablets)
+// lg: Large(desktops)
+// xl: Extra large (large desktops)
+
+// NOTE:
+// To provide an easy and fine styling on each breakpoint
+// we didn't use @each, @mixin or @include.
+// That means you need to edit each CSS selector file to add a breakpoint
+
+// Breakpoints
+// 'null' disable the breakpoint
+$breakpoints: (
+  xs: 0,
+  sm: 576px,
+  md: 768px,
+  lg: 992px,
+  xl: 1200px,
+) !default;
+
+// Viewports
+$viewports: (
+  // 'null' disable the viewport on a breakpoint
+  sm: 510px,
+  md: 700px,
+  lg: 920px,
+  xl: 1130px
+) !default;

themes/ccchh/assets/pico-1.5.11/scss/components/_accordion.scss

@@ -0,0 +1,116 @@
+/**
+ * Accordion (<details>)
+ */
+
+details {
+  display: block;
+  margin-bottom: var(--spacing);
+  padding-bottom: var(--spacing);
+  border-bottom: var(--border-width) solid var(--accordion-border-color);
+
+  summary {
+    line-height: 1rem;
+    list-style-type: none;
+    cursor: pointer;
+
+    &:not([role]) {
+      color: var(--accordion-close-summary-color);
+    }
+
+    @if $enable-transitions {
+      transition: color var(--transition);
+    }
+
+    // Reset marker
+    &::-webkit-details-marker {
+      display: none;
+    }
+
+    &::marker {
+      display: none;
+    }
+
+    &::-moz-list-bullet {
+      list-style-type: none;
+    }
+
+    // Marker
+    &::after {
+      display: block;
+      width: 1rem;
+      height: 1rem;
+      margin-inline-start: calc(var(--spacing, 1rem) * 0.5);
+      float: right;
+      transform: rotate(-90deg);
+      background-image: var(--icon-chevron);
+      background-position: right center;
+      background-size: 1rem auto;
+      background-repeat: no-repeat;
+      content: "";
+
+      @if $enable-transitions {
+        transition: transform var(--transition);
+      }
+    }
+
+    &:focus {
+      outline: none;
+
+      &:not([role="button"]) {
+        color: var(--accordion-active-summary-color);
+      }
+    }
+
+    // Type button
+    &[role="button"] {
+      width: 100%;
+      text-align: left;
+
+      // Marker
+      &::after {
+        height: calc(1rem * var(--line-height, 1.5));
+        background-image: var(--icon-chevron-button);
+      }
+
+      @if $enable-classes {
+        // .contrast
+        &:not(.outline).contrast {
+          // Marker
+          &::after {
+            background-image: var(--icon-chevron-button-inverse);
+          }
+        }
+      }
+    }
+  }
+
+  // Open
+  &[open] {
+    > summary {
+      margin-bottom: calc(var(--spacing));
+
+      &:not([role]) {
+        &:not(:focus) {
+          color: var(--accordion-open-summary-color);
+        }
+      }
+
+      &::after {
+        transform: rotate(0);
+      }
+    }
+  }
+}
+
+[dir="rtl"] {
+  details {
+    summary {
+      text-align: right;
+
+      &::after {
+        float: left;
+        background-position: left center;
+      }
+    }
+  }
+}

themes/ccchh/assets/pico-1.5.11/scss/components/_card.scss

@@ -0,0 +1,36 @@
+/**
+ * Card (<article>)
+ */
+
+article {
+  margin: var(--block-spacing-vertical) 0;
+  padding: var(--block-spacing-vertical) var(--block-spacing-horizontal);
+  border-radius: var(--border-radius);
+  background: var(--card-background-color);
+  box-shadow: var(--card-box-shadow);
+
+  > header,
+  > footer {
+    margin-right: calc(var(--block-spacing-horizontal) * -1);
+    margin-left: calc(var(--block-spacing-horizontal) * -1);
+    padding: calc(var(--block-spacing-vertical) * 0.66)
+      var(--block-spacing-horizontal);
+    background-color: var(--card-sectionning-background-color);
+  }
+
+  > header {
+    margin-top: calc(var(--block-spacing-vertical) * -1);
+    margin-bottom: var(--block-spacing-vertical);
+    border-bottom: var(--border-width) solid var(--card-border-color);
+    border-top-right-radius: var(--border-radius);
+    border-top-left-radius: var(--border-radius);
+  }
+
+  > footer {
+    margin-top: var(--block-spacing-vertical);
+    margin-bottom: calc(var(--block-spacing-vertical) * -1);
+    border-top: var(--border-width) solid var(--card-border-color);
+    border-bottom-right-radius: var(--border-radius);
+    border-bottom-left-radius: var(--border-radius);
+  }
+}

themes/ccchh/assets/pico-1.5.11/scss/components/_dropdown.scss

@@ -0,0 +1,214 @@
+/**
+ * Dropdown ([role="list"])
+ */
+
+// Menu
+details[role="list"],
+li[role="list"] {
+  position: relative;
+}
+
+details[role="list"] summary + ul,
+li[role="list"] > ul {
+  display: flex;
+  z-index: 99;
+  position: absolute;
+  top: auto;
+  right: 0;
+  left: 0;
+  flex-direction: column;
+  margin: 0;
+  padding: 0;
+  border: var(--border-width) solid var(--dropdown-border-color);
+  border-radius: var(--border-radius);
+  border-top-right-radius: 0;
+  border-top-left-radius: 0;
+  background-color: var(--dropdown-background-color);
+  box-shadow: var(--card-box-shadow);
+  color: var(--dropdown-color);
+  white-space: nowrap;
+
+  li {
+    width: 100%;
+    margin-bottom: 0;
+    padding: calc(var(--form-element-spacing-vertical) * 0.5)
+      var(--form-element-spacing-horizontal);
+    list-style: none;
+
+    &:first-of-type {
+      margin-top: calc(var(--form-element-spacing-vertical) * 0.5);
+    }
+
+    &:last-of-type {
+      margin-bottom: calc(var(--form-element-spacing-vertical) * 0.5);
+    }
+
+    a {
+      display: block;
+      margin: calc(var(--form-element-spacing-vertical) * -0.5)
+        calc(var(--form-element-spacing-horizontal) * -1);
+      padding: calc(var(--form-element-spacing-vertical) * 0.5)
+        var(--form-element-spacing-horizontal);
+      overflow: hidden;
+      color: var(--dropdown-color);
+      text-decoration: none;
+      text-overflow: ellipsis;
+
+      &:hover {
+        background-color: var(--dropdown-hover-background-color);
+      }
+    }
+  }
+}
+
+// Marker
+details[role="list"] summary,
+li[role="list"] > a {
+  &::after {
+    display: block;
+    width: 1rem;
+    height: calc(1rem * var(--line-height, 1.5));
+    margin-inline-start: 0.5rem;
+    float: right;
+    transform: rotate(0deg);
+    background-image: var(--icon-chevron);
+    background-position: right center;
+    background-size: 1rem auto;
+    background-repeat: no-repeat;
+    content: "";
+  }
+}
+
+// Global dropdown only
+details[role="list"] {
+  padding: 0;
+  border-bottom: none;
+
+  // Style <summary> as <select>
+  summary {
+    margin-bottom: 0;
+
+    &:not([role]) {
+      height: calc(
+        1rem * var(--line-height) + var(--form-element-spacing-vertical) * 2 +
+          var(--border-width) * 2
+      );
+      padding: var(--form-element-spacing-vertical)
+        var(--form-element-spacing-horizontal);
+      border: var(--border-width) solid var(--form-element-border-color);
+      border-radius: var(--border-radius);
+      background-color: var(--form-element-background-color);
+      color: var(--form-element-placeholder-color);
+      line-height: inherit;
+      cursor: pointer;
+
+      @if $enable-transitions {
+        transition: background-color var(--transition),
+          border-color var(--transition), color var(--transition),
+          box-shadow var(--transition);
+      }
+
+      &:active,
+      &:focus {
+        border-color: var(--form-element-active-border-color);
+        background-color: var(--form-element-active-background-color);
+      }
+
+      &:focus {
+        box-shadow: 0 0 0 var(--outline-width) var(--form-element-focus-color);
+      }
+    }
+  }
+
+  // Close for details[role="list"]
+  &[open] summary {
+    border-bottom-right-radius: 0;
+    border-bottom-left-radius: 0;
+
+    &::before {
+      display: block;
+      z-index: 1;
+      position: fixed;
+      top: 0;
+      right: 0;
+      bottom: 0;
+      left: 0;
+      background: none;
+      content: "";
+      cursor: default;
+    }
+  }
+}
+
+// All Dropdowns inside <nav>
+nav details[role="list"] summary,
+nav li[role="list"] a {
+  display: flex;
+  direction: ltr;
+}
+
+nav details[role="list"] summary + ul,
+nav li[role="list"] > ul {
+  min-width: fit-content;
+  border-radius: var(--border-radius);
+
+  li a {
+    border-radius: 0;
+  }
+}
+
+// Dropdowns inside <nav> as nested <details>
+nav details[role="list"] {
+  summary,
+  summary:not([role]) {
+    height: auto;
+    padding: var(--nav-link-spacing-vertical) var(--nav-link-spacing-horizontal);
+  }
+
+  &[open] summary {
+    border-radius: var(--border-radius);
+  }
+
+  summary + ul {
+    margin-top: var(--outline-width);
+    margin-inline-start: 0;
+  }
+
+  summary[role="link"] {
+    margin-bottom: calc(var(--nav-link-spacing-vertical) * -1);
+    line-height: var(--line-height);
+
+    + ul {
+      margin-top: calc(var(--nav-link-spacing-vertical) + var(--outline-width));
+      margin-inline-start: calc(var(--nav-link-spacing-horizontal) * -1);
+    }
+  }
+}
+
+// Dropdowns inside a <nav> without using <details>
+li[role="list"] {
+  // Open on hover (for mobile)
+  // or on active/focus (for keyboard navigation)
+  &:hover > ul,
+  a:active ~ ul,
+  a:focus ~ ul {
+    display: flex;
+  }
+
+  > ul {
+    display: none;
+    margin-top: calc(var(--nav-link-spacing-vertical) + var(--outline-width));
+    margin-inline-start: calc(
+      var(--nav-element-spacing-horizontal) - var(--nav-link-spacing-horizontal)
+    );
+  }
+
+  > a::after {
+    background-image: var(--icon-chevron);
+  }
+}
+
+label > details[role="list"] {
+  margin-top: calc(var(--spacing) * .25);
+  margin-bottom: var(--spacing);
+}

themes/ccchh/assets/pico-1.5.11/scss/components/_modal.scss

@@ -0,0 +1,168 @@
+/**
+ * Modal (<dialog>)
+ */
+
+:root {
+  --scrollbar-width: 0px;
+}
+
+dialog {
+  display: flex;
+  z-index: 999;
+  position: fixed;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  align-items: center;
+  justify-content: center;
+  width: inherit;
+  min-width: 100%;
+  height: inherit;
+  min-height: 100%;
+  padding: var(--spacing);
+  border: 0;
+  backdrop-filter: var(--modal-overlay-backdrop-filter);
+  background-color: var(--modal-overlay-background-color);
+  color: var(--color);
+
+  // Content
+  article {
+    $close-selector: if($enable-classes, ".close", "a[rel='prev']");
+    max-height: calc(100vh - var(--spacing) * 2);
+    overflow: auto;
+
+    @if map-get($breakpoints, "sm") {
+      @media (min-width: map-get($breakpoints, "sm")) {
+        max-width: map-get($viewports, "sm");
+      }
+    }
+
+    @if map-get($breakpoints, "md") {
+      @media (min-width: map-get($breakpoints, "md")) {
+        max-width: map-get($viewports, "md");
+      }
+    }
+
+    > header,
+    > footer {
+      padding: calc(var(--block-spacing-vertical) * 0.5)
+        var(--block-spacing-horizontal);
+    }
+
+    > header {
+      #{$close-selector} {
+        margin: 0;
+        margin-left: var(--spacing);
+        float: right;
+      }
+    }
+
+    > footer {
+      text-align: right;
+
+      [role="button"] {
+        margin-bottom: 0;
+
+        &:not(:first-of-type) {
+          margin-left: calc(var(--spacing) * 0.5);
+        }
+      }
+    }
+
+    p {
+      &:last-of-type {
+        margin: 0;
+      }
+    }
+
+    // Close icon
+    #{$close-selector} {
+      display: block;
+      width: 1rem;
+      height: 1rem;
+      margin-top: calc(var(--block-spacing-vertical) * -0.5);
+      margin-bottom: var(--typography-spacing-vertical);
+      margin-left: auto;
+      background-image: var(--icon-close);
+      background-position: center;
+      background-size: auto 1rem;
+      background-repeat: no-repeat;
+      opacity: 0.5;
+
+      @if $enable-transitions {
+        transition: opacity var(--transition);
+      }
+
+      &:is([aria-current], :hover, :active, :focus) {
+        opacity: 1;
+      }
+    }
+  }
+
+  // Closed state
+  &:not([open]),
+  &[open="false"] {
+    display: none;
+  }
+}
+
+// Utilities
+@if $enable-classes {
+  .modal-is-open {
+    padding-right: var(--scrollbar-width, 0px);
+    overflow: hidden;
+    pointer-events: none;
+    touch-action: none;
+
+    dialog {
+      pointer-events: auto;
+    }
+  }
+}
+
+// Animations
+@if ($enable-classes and $enable-transitions) {
+  $animation-duration: 0.2s;
+
+  :where(.modal-is-opening, .modal-is-closing) {
+    dialog,
+    dialog > article {
+      animation-duration: $animation-duration;
+      animation-timing-function: ease-in-out;
+      animation-fill-mode: both;
+    }
+
+    dialog {
+      animation-duration: ($animation-duration * 4);
+      animation-name: modal-overlay ;
+
+      > article {
+        animation-delay: $animation-duration;
+        animation-name: modal;
+      }
+    }
+  }
+
+  .modal-is-closing {
+    dialog,
+    dialog > article {
+      animation-delay: 0s;
+      animation-direction: reverse;
+    }
+  }
+
+  @keyframes modal-overlay {
+    from {
+      backdrop-filter: none;
+      background-color: transparent;
+    }
+  }
+
+  @keyframes modal {
+    from {
+      transform: translateY(-100%);
+      opacity: 0;
+    }
+  }
+}

themes/ccchh/assets/pico-1.5.11/scss/components/_nav.scss

@@ -0,0 +1,141 @@
+/**
+ * Nav
+ */
+
+// Reboot based on :
+// - sanitize.css v13.0.0 | CC0 1.0 Universal | github.com/csstools/sanitize.css
+
+// Prevent VoiceOver from ignoring list semantics in Safari (opinionated)
+:where(nav li)::before {
+  float: left;
+  content: "\200B";
+}
+
+// Pico
+// ––––––––––––––––––––
+
+// Horizontal Nav
+nav,
+nav ul {
+  display: flex;
+}
+
+nav {
+  justify-content: space-between;
+
+  ol,
+  ul {
+    align-items: center;
+    margin-bottom: 0;
+    padding: 0;
+    list-style: none;
+
+    &:first-of-type {
+      margin-left: calc(var(--nav-element-spacing-horizontal) * -1);
+    }
+    &:last-of-type {
+      margin-right: calc(var(--nav-element-spacing-horizontal) * -1);
+    }
+  }
+
+  li {
+    display: inline-block;
+    margin: 0;
+    padding: var(--nav-element-spacing-vertical)
+      var(--nav-element-spacing-horizontal);
+
+    // Minimal support for buttons and forms elements
+    > * {
+      --spacing: 0;
+    }
+  }
+
+  :where(a, [role="link"]) {
+    display: inline-block;
+    margin: calc(var(--nav-link-spacing-vertical) * -1)
+      calc(var(--nav-link-spacing-horizontal) * -1);
+    padding: var(--nav-link-spacing-vertical) var(--nav-link-spacing-horizontal);
+    border-radius: var(--border-radius);
+    text-decoration: none;
+
+    &:is([aria-current], :hover, :active, :focus) {
+      text-decoration: none;
+    }
+  }
+
+  // Breadcrumb
+  &[aria-label="breadcrumb"] {
+    align-items: center;
+    justify-content: start;
+
+    & ul li {
+      &:not(:first-child) {
+        margin-inline-start: var(--nav-link-spacing-horizontal);
+      }
+
+      &:not(:last-child) {
+        ::after {
+          position: absolute;
+          width: calc(var(--nav-link-spacing-horizontal) * 2);
+          margin-inline-start: calc(var(--nav-link-spacing-horizontal) / 2);
+          content: "/";
+          color: var(--muted-color);
+          text-align: center;
+        }
+      }
+    }
+
+    & a[aria-current] {
+      background-color: transparent;
+      color: inherit;
+      text-decoration: none;
+      pointer-events: none;
+    }
+  }
+
+  // Minimal support for role="button"
+  [role="button"] {
+    margin-right: inherit;
+    margin-left: inherit;
+    padding: var(--nav-link-spacing-vertical) var(--nav-link-spacing-horizontal);
+  }
+}
+
+// Vertical Nav
+aside {
+  nav,
+  ol,
+  ul,
+  li {
+    display: block;
+  }
+
+  li {
+    padding: calc(var(--nav-element-spacing-vertical) * 0.5)
+      var(--nav-element-spacing-horizontal);
+
+    a {
+      display: block;
+    }
+
+    // Minimal support for links as buttons
+    [role="button"] {
+      margin: inherit;
+    }
+  }
+}
+
+// Breadcrumb RTL
+[dir="rtl"] {
+  nav {
+    &[aria-label="breadcrumb"] {
+      & ul li {
+        &:not(:last-child) {
+          ::after {
+            content: "\\";
+          }
+        }
+      }
+    }
+  }
+}

themes/ccchh/assets/pico-1.5.11/scss/components/_progress.scss

@@ -0,0 +1,89 @@
+/**
+ * Progress
+ */
+
+// Reboot based on :
+// - normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css
+// - sanitize.css v13.0.0 | CC0 1.0 Universal | github.com/csstools/sanitize.css
+// ––––––––––––––––––––
+
+// 1. Add the correct display in Edge 18- and IE
+// 2. Add the correct vertical alignment in Chrome, Edge, and Firefox
+progress {
+  display: inline-block; // 1
+  vertical-align: baseline; // 2
+}
+
+// Pico
+// ––––––––––––––––––––
+
+progress {
+  // Reset the default appearance
+  -webkit-appearance: none;
+  -moz-appearance: none;
+
+  // Styles
+  display: inline-block;
+  appearance: none;
+  width: 100%;
+  height: 0.5rem;
+  margin-bottom: calc(var(--spacing) * 0.5);
+  overflow: hidden;
+
+  // Remove Firefox and Opera border
+  border: 0;
+  border-radius: var(--border-radius);
+  background-color: var(--progress-background-color);
+
+  // IE10 uses `color` to set the bar background-color
+  color: var(--progress-color);
+
+  &::-webkit-progress-bar {
+    border-radius: var(--border-radius);
+    background: none;
+  }
+  &[value]::-webkit-progress-value {
+    background-color: var(--progress-color);
+  }
+  &::-moz-progress-bar {
+    background-color: var(--progress-color);
+  }
+
+  // Indeterminate state
+  @media (prefers-reduced-motion: no-preference) {
+    &:indeterminate {
+      background: var(--progress-background-color)
+        linear-gradient(
+          to right,
+          var(--progress-color) 30%,
+          var(--progress-background-color) 30%
+        )
+        top left / 150% 150% no-repeat;
+      animation: progress-indeterminate  1s linear infinite;
+
+      &[value]::-webkit-progress-value {
+        background-color: transparent;
+      }
+      &::-moz-progress-bar {
+        background-color: transparent;
+      }
+    }
+  }
+}
+
+[dir="rtl"] {
+  @media (prefers-reduced-motion: no-preference) {
+    progress:indeterminate {
+      animation-direction: reverse;
+    }
+  }
+}
+
+@keyframes progress-indeterminate {
+  0% {
+    background-position: 200% 0;
+  }
+  100% {
+    background-position: -200% 0;
+  }
+}

themes/ccchh/assets/pico-1.5.11/scss/content/_button.scss

@@ -0,0 +1,183 @@
+/**
+ * Button
+ */
+
+// Reboot based on :
+// - normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css
+// - sanitize.css v13.0.0 | CC0 1.0 Universal | github.com/csstools/sanitize.css
+// ––––––––––––––––––––
+
+// 1. Change the font styles in all browsers
+// 2. Remove the margin on controls in Safari
+// 3. Show the overflow in Edge
+button {
+  margin: 0; // 2
+  overflow: visible; // 3
+  font-family: inherit; // 1
+  text-transform: none; // 1
+}
+
+// Correct the inability to style buttons in iOS and Safari
+button,
+[type="button"],
+[type="reset"],
+[type="submit"] {
+  -webkit-appearance: button;
+}
+
+// Pico
+// ––––––––––––––––––––
+
+button {
+  display: block;
+  width: 100%;
+  margin-bottom: var(--spacing);
+}
+
+[role="button"] {
+  display: inline-block;
+  text-decoration: none;
+}
+
+button,
+input[type="submit"],
+input[type="button"],
+input[type="reset"],
+[role="button"] {
+  --background-color: var(--primary);
+  --border-color: var(--primary);
+  --color: var(--primary-inverse);
+  --box-shadow: var(--button-box-shadow, 0 0 0 rgba(0, 0, 0, 0));
+  padding: var(--form-element-spacing-vertical)
+    var(--form-element-spacing-horizontal);
+  border: var(--border-width) solid var(--border-color);
+  border-radius: var(--border-radius);
+  outline: none;
+  background-color: var(--background-color);
+  box-shadow: var(--box-shadow);
+  color: var(--color);
+  font-weight: var(--font-weight);
+  font-size: 1rem;
+  line-height: var(--line-height);
+  text-align: center;
+  cursor: pointer;
+
+  @if $enable-transitions {
+    transition: background-color var(--transition),
+      border-color var(--transition), color var(--transition),
+      box-shadow var(--transition);
+  }
+
+  &:is([aria-current], :hover, :active, :focus) {
+    --background-color: var(--primary-hover);
+    --border-color: var(--primary-hover);
+    --box-shadow: var(--button-hover-box-shadow, 0 0 0 rgba(0, 0, 0, 0));
+    --color: var(--primary-inverse);
+  }
+
+  &:focus {
+    --box-shadow: var(--button-hover-box-shadow, 0 0 0 rgba(0, 0, 0, 0)),
+      0 0 0 var(--outline-width) var(--primary-focus);
+  }
+}
+
+// .secondary, .contrast & .outline
+@if $enable-classes {
+
+  // Secondary
+  :is(button, input[type="submit"], input[type="button"], [role="button"]).secondary,
+  input[type="reset"] {
+    --background-color: var(--secondary);
+    --border-color: var(--secondary);
+    --color: var(--secondary-inverse);
+    cursor: pointer;
+
+    &:is([aria-current], :hover, :active, :focus) {
+      --background-color: var(--secondary-hover);
+      --border-color: var(--secondary-hover);
+      --color: var(--secondary-inverse);
+    }
+
+    &:focus {
+      --box-shadow: var(--button-hover-box-shadow, 0 0 0 rgba(0, 0, 0, 0)),
+        0 0 0 var(--outline-width) var(--secondary-focus);
+    }
+  }
+
+  // Contrast
+  :is(button, input[type="submit"], input[type="button"], [role="button"]).contrast {
+    --background-color: var(--contrast);
+    --border-color: var(--contrast);
+    --color: var(--contrast-inverse);
+
+    &:is([aria-current], :hover, :active, :focus) {
+      --background-color: var(--contrast-hover);
+      --border-color: var(--contrast-hover);
+      --color: var(--contrast-inverse);
+    }
+
+    &:focus {
+      --box-shadow: var(--button-hover-box-shadow, 0 0 0 rgba(0, 0, 0, 0)),
+        0 0 0 var(--outline-width) var(--contrast-focus);
+    }
+  }
+
+  // Outline (primary)
+  :is(button, input[type="submit"], input[type="button"], [role="button"]).outline,
+  input[type="reset"].outline {
+    --background-color: transparent;
+    --color: var(--primary);
+
+    &:is([aria-current], :hover, :active, :focus) {
+      --background-color: transparent;
+      --color: var(--primary-hover);
+    }
+  }
+
+  // Outline (secondary)
+  :is(button, input[type="submit"], input[type="button"], [role="button"]).outline.secondary,
+  input[type="reset"].outline {
+    --color: var(--secondary);
+
+    &:is([aria-current], :hover, :active, :focus) {
+      --color: var(--secondary-hover);
+    }
+  }
+
+  // Outline (contrast)
+  :is(button, input[type="submit"], input[type="button"], [role="button"]).outline.contrast {
+    --color: var(--contrast);
+
+    &:is([aria-current], :hover, :active, :focus) {
+      --color: var(--contrast-hover);
+    }
+  }
+} 
+@else {
+  // Secondary button without .class
+  input[type="reset"] {
+    --background-color: var(--secondary);
+    --border-color: var(--secondary);
+    --color: var(--secondary-inverse);
+    cursor: pointer;
+
+    &:is([aria-current], :hover, :active, :focus) {
+      --background-color: var(--secondary-hover);
+      --border-color: var(--secondary-hover);
+    }
+
+    &:focus {
+      --box-shadow: var(--button-hover-box-shadow, 0 0 0 rgba(0, 0, 0, 0)),
+        0 0 0 var(--outline-width) var(--secondary-focus);
+    }
+  }
+}
+
+// Button [disabled]
+// Links without href are disabled by default
+:where(button, [type="submit"], [type="button"], [type="reset"], [role="button"])[disabled],
+:where(fieldset[disabled]) :is(button, [type="submit"], [type="button"], [type="reset"], [role="button"]),
+a[role="button"]:not([href]) {
+  opacity: 0.5;
+  pointer-events: none;
+}

themes/ccchh/assets/pico-1.5.11/scss/content/_code.scss

@@ -0,0 +1,91 @@
+/**
+ * Code
+ */
+
+// Reboot based on :
+// - normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css
+// - sanitize.css v13.0.0 | CC0 1.0 Universal | github.com/csstools/sanitize.css
+// ––––––––––––––––––––
+
+// 1. Correct the inheritance and scaling of font size in all browsers
+// 2. Correct the odd `em` font sizing in all browsers
+pre,
+code,
+kbd,
+samp {
+  font-size: 0.875em; // 2
+  font-family: var(--font-family); // 1
+}
+
+// Prevent overflow of the container in all browsers (opinionated)
+pre {
+  -ms-overflow-style: scrollbar;
+  overflow: auto;
+}
+
+// Pico
+// ––––––––––––––––––––
+
+pre,
+code,
+kbd {
+  border-radius: var(--border-radius);
+  background: var(--code-background-color);
+  color: var(--code-color);
+  font-weight: var(--font-weight);
+  line-height: initial;
+}
+
+code,
+kbd {
+  display: inline-block;
+  padding: 0.375rem 0.5rem;
+}
+
+pre {
+  display: block;
+  margin-bottom: var(--spacing);
+  overflow-x: auto;
+
+  > code {
+    display: block;
+    padding: var(--spacing);
+    background: none;
+    font-size: 14px;
+    line-height: var(--line-height);
+  }
+}
+
+// Code Syntax
+code {
+  // Tags
+  b {
+    color: var(--code-tag-color);
+    font-weight: var(--font-weight);
+  }
+
+  // Properties
+  i {
+    color: var(--code-property-color);
+    font-style: normal;
+  }
+
+  // Values
+  u {
+    color: var(--code-value-color);
+    text-decoration: none;
+  }
+
+  // Comments
+  em {
+    color: var(--code-comment-color);
+    font-style: normal;
+  }
+}
+
+// kbd
+kbd {
+  background-color: var(--code-kbd-background-color);
+  color: var(--code-kbd-color);
+  vertical-align: baseline;
+}

themes/ccchh/assets/pico-1.5.11/scss/content/_embedded.scss

@@ -0,0 +1,48 @@
+/**
+ * Embedded content
+ */
+
+// Reboot based on :
+// - normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css
+// - sanitize.css v13.0.0 | CC0 1.0 Universal | github.com/csstools/sanitize.css
+// ––––––––––––––––––––
+
+// Change the alignment on media elements in all browsers (opinionated)
+:where(audio, canvas, iframe, img, svg, video) {
+  vertical-align: middle;
+}
+
+// Add the correct display in IE 9-
+audio,
+video {
+  display: inline-block;
+}
+
+// Add the correct display in iOS 4-7
+audio:not([controls]) {
+  display: none;
+  height: 0;
+}
+
+// Remove the border on iframes in all browsers (opinionated)
+:where(iframe) {
+  border-style: none;
+}
+
+// 1. Remove the border on images inside links in IE 10.
+// 2. Responsive by default
+img {
+  max-width: 100%; // 2
+  height: auto; // 2
+  border-style: none; // 1
+}
+
+// Change the fill color to match the text color in all browsers (opinionated)
+:where(svg:not([fill])) {
+  fill: currentColor;
+}
+
+// Hide the overflow in IE
+svg:not(:root) {
+  overflow: hidden;
+}

themes/ccchh/assets/pico-1.5.11/scss/content/_form-alt-input-types.scss

@@ -0,0 +1,286 @@
+/**
+ * Form elements
+ * Alternatives input types (Not Checkboxes & Radios)
+ */
+
+// Color
+[type="color"] {
+  // Wrapper
+  @mixin color-wrapper {
+    padding: 0;
+  }
+
+  &::-webkit-color-swatch-wrapper {
+    @include color-wrapper;
+  }
+
+  &::-moz-focus-inner {
+    @include color-wrapper;
+  }
+
+  // Swatch
+  @mixin color-swatch {
+    border: 0;
+    border-radius: calc(var(--border-radius) * 0.5);
+  }
+
+  &::-webkit-color-swatch {
+    @include color-swatch;
+  }
+
+  &::-moz-color-swatch {
+    @include color-swatch;
+  }
+}
+
+// Date & Time
+// :not() are needed to add Specificity and avoid !important on padding
+input:not([type="checkbox"], [type="radio"], [type="range"], [type="file"]) {
+  &:is([type="date"], [type="datetime-local"], [type="month"], [type="time"], [type="week"]) {
+    --icon-position: 0.75rem;
+    --icon-width: 1rem;
+    padding-right: calc(var(--icon-width) + var(--icon-position));
+    background-image: var(--icon-date);
+    background-position: center right var(--icon-position);
+    background-size: var(--icon-width) auto;
+    background-repeat: no-repeat;
+  }
+
+  // Time
+  &[type="time"] {
+    background-image: var(--icon-time);
+  }
+}
+
+// Calendar picker
+[type="date"],
+[type="datetime-local"],
+[type="month"],
+[type="time"],
+[type="week"] {
+  &::-webkit-calendar-picker-indicator {
+    width: var(--icon-width);
+    margin-right: calc(var(--icon-width) * -1);
+    margin-left: var(--icon-position);
+    opacity: 0;
+  }
+}
+
+[dir="rtl"]
+  :is([type="date"], [type="datetime-local"], [type="month"], [type="time"], [type="week"]) {
+  text-align: right;
+}
+
+// Calendar icons are hidden in Firefox
+@if $enable-important {
+  @-moz-document url-prefix() {
+    [type="date"],
+    [type="datetime-local"],
+    [type="month"],
+    [type="time"],
+    [type="week"] {
+      padding-right: var(--form-element-spacing-horizontal) !important;
+      background-image: none !important;
+    }
+  }
+}
+
+// File
+[type="file"] {
+  --color: var(--muted-color);
+  padding: calc(var(--form-element-spacing-vertical) * 0.5) 0;
+  border: 0;
+  border-radius: 0;
+  background: none;
+
+  @mixin file-selector-button {
+    --background-color: var(--secondary);
+    --border-color: var(--secondary);
+    --color: var(--secondary-inverse);
+    margin-right: calc(var(--spacing) / 2);
+    margin-left: 0;
+    margin-inline-start: 0;
+    margin-inline-end: calc(var(--spacing) / 2);
+    padding: calc(var(--form-element-spacing-vertical) * 0.5)
+      calc(var(--form-element-spacing-horizontal) * 0.5);
+    border: var(--border-width) solid var(--border-color);
+    border-radius: var(--border-radius);
+    outline: none;
+    background-color: var(--background-color);
+    box-shadow: var(--box-shadow);
+    color: var(--color);
+    font-weight: var(--font-weight);
+    font-size: 1rem;
+    line-height: var(--line-height);
+    text-align: center;
+    cursor: pointer;
+
+    @if $enable-transitions {
+      transition: background-color var(--transition),
+        border-color var(--transition), color var(--transition),
+        box-shadow var(--transition);
+    }
+
+    &:is(:hover, :active, :focus) {
+      --background-color: var(--secondary-hover);
+      --border-color: var(--secondary-hover);
+    }
+  }
+
+  &::file-selector-button {
+    @include file-selector-button;
+  }
+
+  &::-webkit-file-upload-button {
+    @include file-selector-button;
+  }
+
+  &::-ms-browse {
+    @include file-selector-button;
+  }
+}
+
+// Range
+[type="range"] {
+  // Config
+  $height-track: 0.25rem;
+  $height-thumb: 1.25rem;
+  $border-thumb: 2px;
+
+  // Styles
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  appearance: none;
+  width: 100%;
+  height: $height-thumb;
+  background: none;
+
+  // Slider Track
+  @mixin slider-track {
+    width: 100%;
+    height: $height-track;
+    border-radius: var(--border-radius);
+    background-color: var(--range-border-color);
+
+    @if $enable-transitions {
+      transition: background-color var(--transition),
+        box-shadow var(--transition);
+    }
+  }
+
+  &::-webkit-slider-runnable-track {
+    @include slider-track;
+  }
+
+  &::-moz-range-track {
+    @include slider-track;
+  }
+
+  &::-ms-track {
+    @include slider-track;
+  }
+
+  // Slider Thumb
+  @mixin slider-thumb {
+    -webkit-appearance: none;
+    width: $height-thumb;
+    height: $height-thumb;
+    margin-top: #{(-($height-thumb * 0.5) + ($height-track * 0.5))};
+    border: $border-thumb solid var(--range-thumb-border-color);
+    border-radius: 50%;
+    background-color: var(--range-thumb-color);
+    cursor: pointer;
+
+    @if $enable-transitions {
+      transition: background-color var(--transition),
+        transform var(--transition);
+    }
+  }
+  &::-webkit-slider-thumb {
+    @include slider-thumb;
+  }
+
+  &::-moz-range-thumb {
+    @include slider-thumb;
+  }
+
+  &::-ms-thumb {
+    @include slider-thumb;
+  }
+
+  &:hover,
+  &:focus {
+    --range-border-color: var(--range-active-border-color);
+    --range-thumb-color: var(--range-thumb-hover-color);
+  }
+
+  &:active {
+    --range-thumb-color: var(--range-thumb-active-color);
+
+    // Slider Thumb
+    &::-webkit-slider-thumb {
+      transform: scale(1.25);
+    }
+
+    &::-moz-range-thumb {
+      transform: scale(1.25);
+    }
+
+    &::-ms-thumb {
+      transform: scale(1.25);
+    }
+  }
+}
+
+// Search
+// :not() are needed to add Specificity and avoid !important on padding
+input:not([type="checkbox"], [type="radio"], [type="range"], [type="file"]) {
+  &[type="search"] {
+    padding-inline-start: calc(var(--form-element-spacing-horizontal) + 1.75rem);
+    border-radius: 5rem;
+    background-image: var(--icon-search);
+    background-position: center left 1.125rem;
+    background-size: 1rem auto;
+    background-repeat: no-repeat;
+    
+    &[aria-invalid] {
+      @if $enable-important {
+        padding-inline-start: calc(var(--form-element-spacing-horizontal) + 1.75rem) !important;
+      } 
+      @else {
+        padding-inline-start: calc(var(--form-element-spacing-horizontal) + 1.75rem);
+      }
+      background-position: center left 1.125rem, center right 0.75rem;
+    }
+
+    &[aria-invalid="false"] {
+      background-image: var(--icon-search), var(--icon-valid);
+    }
+
+    &[aria-invalid="true"] {
+      background-image: var(--icon-search), var(--icon-invalid);
+    }
+  }
+}
+
+// Cancel button
+[type="search"] {
+  &::-webkit-search-cancel-button {
+    -webkit-appearance: none;
+    display: none;
+  }
+}
+
+[dir="rtl"] {
+  :where(input) {
+    &:not([type="checkbox"], [type="radio"], [type="range"], [type="file"]) {
+      &[type="search"] {
+        background-position: center right 1.125rem;
+        
+        &[aria-invalid] {
+          background-position: center right 1.125rem, center left 0.75rem;
+        }
+      }
+    }
+  }
+}

themes/ccchh/assets/pico-1.5.11/scss/content/_form-checkbox-radio.scss

@@ -0,0 +1,138 @@
+/**
+ * Form elements
+ * Checkboxes & Radios
+ */
+
+[type="checkbox"],
+[type="radio"] {
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  appearance: none;
+  width: 1.25em;
+  height: 1.25em;
+  margin-top: -0.125em;
+  margin-right: 0.375em;
+  margin-left: 0;
+  margin-inline-start: 0;
+  margin-inline-end: 0.375em;
+  border-width: var(--border-width);
+  font-size: inherit;
+  vertical-align: middle;
+  cursor: pointer;
+
+  &::-ms-check {
+    display: none; // unstyle IE checkboxes
+  }
+
+  &:checked,
+  &:checked:active,
+  &:checked:focus {
+    --background-color: var(--primary);
+    --border-color: var(--primary);
+    background-image: var(--icon-checkbox);
+    background-position: center;
+    background-size: 0.75em auto;
+    background-repeat: no-repeat;
+  }
+
+  & ~ label {
+    display: inline-block;
+    margin-right: 0.375em;
+    margin-bottom: 0;
+    cursor: pointer;
+  }
+}
+
+// Checkboxes
+[type="checkbox"] {
+  &:indeterminate {
+    --background-color: var(--primary);
+    --border-color: var(--primary);
+    background-image: var(--icon-minus);
+    background-position: center;
+    background-size: 0.75em auto;
+    background-repeat: no-repeat;
+  }
+}
+
+// Radios
+[type="radio"] {
+  border-radius: 50%;
+
+  &:checked,
+  &:checked:active,
+  &:checked:focus {
+    --background-color: var(--primary-inverse);
+    border-width: 0.35em;
+    background-image: none;
+  }
+}
+
+// Switchs
+[type="checkbox"][role="switch"] {
+  --background-color: var(--switch-background-color);
+  --border-color: var(--switch-background-color);
+  --color: var(--switch-color);
+
+  // Config
+  $switch-height: 1.25em;
+  $switch-width: 2.25em;
+  $switch-transition: 0.1s ease-in-out;
+
+  // Styles
+  width: $switch-width;
+  height: $switch-height;
+  border: var(--border-width) solid var(--border-color);
+  border-radius: $switch-height;
+  background-color: var(--background-color);
+  line-height: $switch-height;
+
+  &:focus {
+    --background-color: var(--switch-background-color);
+    --border-color: var(--switch-background-color);
+  }
+
+  &:checked {
+    --background-color: var(--switch-checked-background-color);
+    --border-color: var(--switch-checked-background-color);
+  }
+
+  &:before {
+    display: block;
+    width: calc(#{$switch-height} - (var(--border-width) * 2));
+    height: 100%;
+    border-radius: 50%;
+    background-color: var(--color);
+    content: "";
+
+    @if $enable-transitions {
+      transition: margin $switch-transition;
+    }
+  }
+
+  &:checked {
+    background-image: none;
+
+    &::before {
+      margin-left: calc(#{$switch-width * 0.5} - var(--border-width));
+      margin-inline-start: calc(#{$switch-width * 0.5} - var(--border-width));
+    }
+  }
+}
+
+// Aria-invalid
+[type="checkbox"],
+[type="checkbox"]:checked,
+[type="radio"],
+[type="radio"]:checked,
+[type="checkbox"][role="switch"],
+[type="checkbox"][role="switch"]:checked {
+  
+  &[aria-invalid="false"] {
+    --border-color: var(--form-element-valid-border-color);
+  }
+
+  &[aria-invalid="true"] {
+    --border-color: var(--form-element-invalid-border-color);
+  }
+}

themes/ccchh/assets/pico-1.5.11/scss/content/_form.scss

@@ -0,0 +1,352 @@
+/**
+ * Form elements
+ */
+
+// Reboot based on :
+// - normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css
+// - sanitize.css v13.0.0 | CC0 1.0 Universal | github.com/csstools/sanitize.css
+// ––––––––––––––––––––
+
+// 1. Change the font styles in all browsers
+// 2. Remove the margin in Firefox and Safari
+input,
+optgroup,
+select,
+textarea {
+  margin: 0; // 2
+  font-size: 1rem; // 1
+  line-height: var(--line-height); // 1
+  font-family: inherit; // 1
+  letter-spacing: inherit; // 2
+}
+
+// Show the overflow in IE.
+input {
+  overflow: visible;
+}
+
+// Remove the inheritance of text transform in Edge, Firefox, and IE
+select {
+  text-transform: none;
+}
+
+// 1. Correct the text wrapping in Edge and IE
+// 2. Correct the color inheritance from `fieldset` elements in IE
+// 3. Remove the padding so developers are not caught out when they zero out
+// `fieldset` elements in all browsers
+legend {
+  max-width: 100%; // 1
+  padding: 0; // 3
+  color: inherit; // 2
+  white-space: normal; // 1
+}
+
+// 1. Remove the default vertical scrollbar in IE
+textarea {
+  overflow: auto; // 1
+}
+
+// Remove the padding in IE 10
+[type="checkbox"],
+[type="radio"] {
+  padding: 0;
+}
+
+// Correct the cursor style of increment and decrement buttons in Safari
+::-webkit-inner-spin-button,
+::-webkit-outer-spin-button {
+  height: auto;
+}
+
+// 1. Correct the odd appearance in Chrome and Safari
+// 2. Correct the outline style in Safari
+[type="search"] {
+  -webkit-appearance: textfield; // 1
+  outline-offset: -2px; // 2
+}
+
+// Remove the inner padding in Chrome and Safari on macOS
+[type="search"]::-webkit-search-decoration {
+  -webkit-appearance: none;
+}
+
+// 1. Correct the inability to style clickable types in iOS and Safari
+// 2. Change font properties to `inherit` in Safari
+::-webkit-file-upload-button {
+  -webkit-appearance: button; // 1
+  font: inherit; // 2
+}
+
+// Remove the inner border and padding of focus outlines in Firefox
+::-moz-focus-inner {
+  padding: 0;
+  border-style: none;
+}
+
+//  Remove the focus outline in Firefox
+:-moz-focusring {
+  outline: none;
+}
+
+// Remove the additional :invalid styles in Firefox
+:-moz-ui-invalid {
+  box-shadow: none;
+}
+
+// Change the inconsistent appearance in IE (opinionated)
+::-ms-expand {
+  display: none;
+}
+
+// Remove the border and padding in all browsers (opinionated)
+[type="file"],
+[type="range"] {
+  padding: 0;
+  border-width: 0;
+}
+
+// Pico
+// ––––––––––––––––––––
+
+// Force height for alternatives input types
+input:not([type="checkbox"], [type="radio"], [type="range"]) {
+  height: calc(
+    (1rem * var(--line-height)) + (var(--form-element-spacing-vertical) * 2) +
+      (var(--border-width) * 2)
+  );
+}
+
+// Fieldset
+fieldset {
+  margin: 0;
+  margin-bottom: var(--spacing);
+  padding: 0;
+  border: 0;
+}
+
+// Label & legend
+label,
+fieldset legend {
+  display: block;
+  margin-bottom: calc(var(--spacing) * 0.25);
+  font-weight: var(--form-label-font-weight, var(--font-weight));
+}
+
+// Blocks, 100%
+input:not([type="checkbox"], [type="radio"]),
+select,
+textarea {
+  width: 100%;
+}
+
+// Reset appearance (Not Checkboxes, Radios, Range and File)
+input:not([type="checkbox"], [type="radio"], [type="range"], [type="file"]),
+select,
+textarea {
+  appearance: none;
+  padding: var(--form-element-spacing-vertical)
+    var(--form-element-spacing-horizontal);
+}
+
+// Commons styles
+input,
+select,
+textarea {
+  --background-color: var(--form-element-background-color);
+  --border-color: var(--form-element-border-color);
+  --color: var(--form-element-color);
+  --box-shadow: none;
+  border: var(--border-width) solid var(--border-color);
+  border-radius: var(--border-radius);
+  outline: none;
+  background-color: var(--background-color);
+  box-shadow: var(--box-shadow);
+  color: var(--color);
+  font-weight: var(--font-weight);
+
+  @if $enable-transitions {
+    transition: background-color var(--transition),
+      border-color var(--transition), color var(--transition),
+      box-shadow var(--transition);
+  }
+}
+
+// Active & Focus
+input:not([type="submit"], [type="button"], [type="reset"], [type="checkbox"], [type="radio"], [readonly]),
+:where(select, textarea) {
+  &:is(:active, :focus) {
+    --background-color: var(--form-element-active-background-color);
+  }
+}
+
+// Active & Focus
+input:not([type="submit"], [type="button"], [type="reset"], [role="switch"], [readonly]),
+:where(select, textarea) {
+  &:is(:active, :focus) {
+    --border-color: var(--form-element-active-border-color);
+  }
+}
+
+// Focus
+input:not([type="submit"], [type="button"], [type="reset"], [type="range"], [type="file"], [readonly]),
+select,
+textarea {
+  &:focus {
+    --box-shadow: 0 0 0 var(--outline-width) var(--form-element-focus-color);
+  }
+}
+
+// Disabled
+input:not([type="submit"], [type="button"], [type="reset"])[disabled],
+select[disabled],
+textarea[disabled],
+:where(fieldset[disabled]) :is(input:not([type="submit"], [type="button"], [type="reset"]), select, textarea) {
+  --background-color: var(--form-element-disabled-background-color);
+  --border-color: var(--form-element-disabled-border-color);
+  opacity: var(--form-element-disabled-opacity);
+  pointer-events: none;
+}
+
+// Aria-invalid
+:where(input, select, textarea) {
+  &:not([type="checkbox"], [type="radio"], [type="date"], [type="datetime-local"], [type="month"], [type="time"], [type="week"]) {
+    &[aria-invalid] {
+      @if $enable-important {
+        padding-right: calc(
+          var(--form-element-spacing-horizontal) + 1.5rem
+        ) !important;
+        padding-left: var(--form-element-spacing-horizontal);
+        padding-inline-start: var(--form-element-spacing-horizontal) !important;
+        padding-inline-end: calc(
+          var(--form-element-spacing-horizontal) + 1.5rem
+        ) !important;
+      }
+      @else {
+        padding-right: calc(var(--form-element-spacing-horizontal) + 1.5rem);
+        padding-left: var(--form-element-spacing-horizontal);
+        padding-inline-start: var(--form-element-spacing-horizontal);
+        padding-inline-end: calc(var(--form-element-spacing-horizontal) + 1.5rem);
+      }
+      background-position: center right 0.75rem;
+      background-size: 1rem auto;
+      background-repeat: no-repeat;
+    }
+
+    &[aria-invalid="false"] {
+      background-image: var(--icon-valid);
+    }
+
+    &[aria-invalid="true"] {
+      background-image: var(--icon-invalid);
+    }
+  }
+
+  &[aria-invalid="false"] {
+    --border-color: var(--form-element-valid-border-color);
+
+    &:is(:active, :focus) {
+      @if $enable-important {
+        --border-color: var(--form-element-valid-active-border-color) !important;
+        --box-shadow: 0 0 0 var(--outline-width) var(--form-element-valid-focus-color) !important;
+      }
+      @else {
+        --border-color: var(--form-element-valid-active-border-color);
+        --box-shadow: 0 0 0 var(--outline-width) var(--form-element-valid-focus-color);
+      }
+    }
+  }
+
+  &[aria-invalid="true"] {
+    --border-color: var(--form-element-invalid-border-color);
+
+    &:is(:active, :focus) {
+      @if $enable-important {
+        --border-color: var(--form-element-invalid-active-border-color) !important;
+        --box-shadow: 0 0 0 var(--outline-width) var(--form-element-invalid-focus-color) !important;
+      }
+      @else {
+        --border-color: var(--form-element-invalid-active-border-color);
+        --box-shadow: 0 0 0 var(--outline-width) var(--form-element-invalid-focus-color);
+      }
+    }
+  }
+}
+
+[dir="rtl"] {
+  :where(input, select, textarea) {
+    &:not([type="checkbox"], [type="radio"]) {
+      &:is([aria-invalid], [aria-invalid="true"], [aria-invalid="false"] ){
+        background-position: center left 0.75rem;
+      }
+    }
+  }
+}
+
+// Placeholder
+input::placeholder,
+input::-webkit-input-placeholder,
+textarea::placeholder,
+textarea::-webkit-input-placeholder,
+select:invalid {
+  color: var(--form-element-placeholder-color);
+  opacity: 1;
+}
+
+// Margin bottom (Not Checkboxes and Radios)
+input:not([type="checkbox"], [type="radio"]),
+select,
+textarea {
+  margin-bottom: var(--spacing);
+}
+
+// Select
+select {
+  // Unstyle the caret on `<select>`s in IE10+.
+  &::-ms-expand {
+    border: 0;
+    background-color: transparent;
+  }
+
+  &:not([multiple], [size]) {
+    padding-right: calc(var(--form-element-spacing-horizontal) + 1.5rem);
+    padding-left: var(--form-element-spacing-horizontal);
+    padding-inline-start: var(--form-element-spacing-horizontal);
+    padding-inline-end: calc(var(--form-element-spacing-horizontal) + 1.5rem);
+    background-image: var(--icon-chevron);
+    background-position: center right 0.75rem;
+    background-size: 1rem auto;
+    background-repeat: no-repeat;
+  }
+}
+
+[dir="rtl"] {
+  select {
+    &:not([multiple], [size]) {
+      background-position: center left 0.75rem;
+    }
+  }
+}
+
+// Helper
+$inputs: "input, select, textarea";
+
+@if ($enable-classes and $enable-grid) {
+  $inputs: $inputs + ", .grid";
+}
+
+:where(#{$inputs}) {
+  + small {
+    display: block;
+    width: 100%;
+    margin-top: calc(var(--spacing) * -0.75);
+    margin-bottom: var(--spacing);
+    color: var(--muted-color);
+  }
+}
+
+// Styles for Input inside a label
+label {
+  > :where(input, select, textarea) {
+    margin-top: calc(var(--spacing) * 0.25);
+  }
+}

themes/ccchh/assets/pico-1.5.11/scss/content/_miscs.scss

@@ -0,0 +1,33 @@
+/**
+ * Miscs
+ */
+
+// Reboot based on :
+// - normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css
+// - sanitize.css v13.0.0 | CC0 1.0 Universal | github.com/csstools/sanitize.css
+// ––––––––––––––––––––
+
+// 1. Correct the inheritance of border color in Firefox
+// 2. Add the correct box sizing in Firefox
+hr {
+  height: 0; // 2
+  border: 0;
+  border-top: 1px solid var(--muted-border-color);
+  color: inherit; // 1
+}
+
+// Add the correct display in IE 10+
+[hidden],
+template {
+  @if $enable-important {
+    display: none !important;
+  } 
+  @else {
+    display: none;
+  }
+}
+
+// Add the correct display in IE 9-
+canvas {
+  display: inline-block;
+}

themes/ccchh/assets/pico-1.5.11/scss/content/_table.scss

@@ -0,0 +1,50 @@
+/**
+ * Table
+ */
+
+// Reboot based on :
+// - normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css
+// - sanitize.css v13.0.0 | CC0 1.0 Universal | github.com/csstools/sanitize.css
+// ––––––––––––––––––––
+
+// 1. Collapse border spacing in all browsers (opinionated)
+// 2. Remove text indentation from table contents in Chrome, Edge, and Safari
+:where(table) {
+  width: 100%;
+  border-collapse: collapse; // 1
+  border-spacing: 0;
+  text-indent: 0; // 2
+}
+
+// Pico
+// ––––––––––––––––––––
+
+// Cells
+th,
+td {
+  padding: calc(var(--spacing) / 2) var(--spacing);
+  border-bottom: var(--border-width) solid var(--table-border-color);
+  color: var(--color);
+  font-weight: var(--font-weight);
+  font-size: var(--font-size);
+  text-align: left;
+  text-align: start;
+}
+
+// Footer
+tfoot {
+  th,
+  td {
+    border-top: var(--border-width) solid var(--table-border-color);
+    border-bottom: 0;
+  }
+}
+
+// Striped
+table {
+  &[role="grid"] {
+    tbody tr:nth-child(odd) {
+      background-color: var(--table-row-stripped-background-color);
+    }
+  }
+}

themes/ccchh/assets/pico-1.5.11/scss/content/_typography.scss

@@ -0,0 +1,264 @@
+/**
+ * Typography
+ */
+
+// Reboot based on :
+// - normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css
+// - sanitize.css v13.0.0 | CC0 1.0 Universal | github.com/csstools/sanitize.css
+// ––––––––––––––––––––
+
+// Add the correct font weight in Chrome, Edge, and Safari
+b,
+strong {
+  font-weight: bolder;
+}
+
+// Prevent `sub` and `sup` elements from affecting the line height in all browsers
+sub,
+sup {
+  position: relative;
+  font-size: 0.75em;
+  line-height: 0;
+  vertical-align: baseline;
+}
+sub {
+  bottom: -0.25em;
+}
+sup {
+  top: -0.5em;
+}
+
+// Pico
+// ––––––––––––––––––––
+
+address,
+blockquote,
+dl,
+figure,
+form,
+ol,
+p,
+pre,
+table,
+ul {
+  margin-top: 0;
+  margin-bottom: var(--typography-spacing-vertical);
+  color: var(--color);
+  font-style: normal;
+  font-weight: var(--font-weight);
+  font-size: var(--font-size);
+}
+
+// Links
+// 1. Remove the gray background on active links in IE 10
+a,
+[role="link"] {
+  --color: var(--primary);
+  --background-color: transparent;
+  outline: none;
+  background-color: var(--background-color); // 1
+  color: var(--color);
+  text-decoration: var(--text-decoration);
+
+  @if $enable-transitions {
+    transition: background-color var(--transition), color var(--transition),
+      text-decoration var(--transition), box-shadow var(--transition);
+  }
+
+  &:is([aria-current], :hover, :active, :focus) {
+    --color: var(--primary-hover);
+    --text-decoration: underline;
+  }
+
+  &:focus {
+    --background-color: var(--primary-focus);
+  }
+
+  @if $enable-classes {
+    // Secondary
+    &.secondary {
+      --color: var(--secondary);
+
+      &:is([aria-current], :hover, :active, :focus) {
+        --color: var(--secondary-hover);
+      }
+
+      &:focus {
+        --background-color: var(--secondary-focus);
+      }
+    }
+
+    // Contrast
+    &.contrast {
+      --color: var(--contrast);
+
+      &:is([aria-current], :hover, :active, :focus) {
+        --color: var(--contrast-hover);
+      }
+
+      &:focus {
+        --background-color: var(--contrast-focus);
+      }
+    }
+  }
+}
+
+// Headings
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+  margin-top: 0;
+  margin-bottom: var(--typography-spacing-vertical);
+  color: var(--color);
+  font-weight: var(--font-weight);
+  font-size: var(--font-size);
+  font-family: var(--font-family);
+}
+
+h1 {
+  --color: var(--h1-color);
+}
+h2 {
+  --color: var(--h2-color);
+}
+h3 {
+  --color: var(--h3-color);
+}
+h4 {
+  --color: var(--h4-color);
+}
+h5 {
+  --color: var(--h5-color);
+}
+h6 {
+  --color: var(--h6-color);
+}
+
+// Margin-top for headings after a typography block
+:where(address, blockquote, dl, figure, form, ol, p, pre, table, ul) {
+  ~ :is(h1, h2, h3, h4, h5, h6) {
+    margin-top: var(--typography-spacing-vertical);
+  }
+}
+
+// Heading group
+@if $enable-classes == false {
+  hgroup {
+    margin-bottom: var(--typography-spacing-vertical);
+
+    > * {
+      margin-bottom: 0;
+    }
+
+    > *:last-child {
+      --color: var(--muted-color);
+      --font-weight: unset;
+      font-size: 1rem;
+      font-family: unset;
+    }
+  }
+}
+
+@if $enable-classes {
+  hgroup,
+  .headings {
+    margin-bottom: var(--typography-spacing-vertical);
+
+    > * {
+      margin-bottom: 0;
+    }
+
+    > *:last-child {
+      --color: var(--muted-color);
+      --font-weight: unset;
+      font-size: 1rem;
+      font-family: unset;
+    }
+  }
+}
+
+// Paragraphs
+p {
+  margin-bottom: var(--typography-spacing-vertical);
+}
+
+// Small
+small {
+  font-size: var(--font-size);
+}
+
+// Lists
+:where(dl, ol, ul) {
+  padding-right: 0;
+  padding-left: var(--spacing);
+  padding-inline-start: var(--spacing);
+  padding-inline-end: 0;
+
+  li {
+    margin-bottom: calc(var(--typography-spacing-vertical) * 0.25);
+  }
+}
+
+// Margin-top for nested lists
+// 1. Remove the margin on nested lists in Chrome, Edge, IE, and Safari
+:where(dl, ol, ul) {
+  :is(dl, ol, ul) {
+    margin: 0; // 1
+    margin-top: calc(var(--typography-spacing-vertical) * 0.25);
+  }
+}
+
+ul li {
+  list-style: square;
+}
+
+// Highlighted text
+mark {
+  padding: 0.125rem 0.25rem;
+  background-color: var(--mark-background-color);
+  color: var(--mark-color);
+  vertical-align: baseline;
+}
+
+// Blockquote
+blockquote {
+  display: block;
+  margin: var(--typography-spacing-vertical) 0;
+  padding: var(--spacing);
+  border-right: none;
+  border-left: 0.25rem solid var(--blockquote-border-color);
+  border-inline-start: 0.25rem solid var(--blockquote-border-color);
+  border-inline-end: none;
+
+  footer {
+    margin-top: calc(var(--typography-spacing-vertical) * 0.5);
+    color: var(--blockquote-footer-color);
+  }
+}
+
+// Abbreviations
+// 1. Remove underline decoration in Chrome, Edge, IE, Opera, and Safari
+abbr[title] {
+  border-bottom: 1px dotted;
+  text-decoration: none; // 1
+  cursor: help;
+}
+
+// Ins
+ins {
+  color: var(--ins-color);
+  text-decoration: none;
+}
+
+// del
+del {
+  color: var(--del-color);
+}
+
+// selection
+::selection {
+  background-color: var(--primary-focus);
+}

themes/ccchh/assets/pico-1.5.11/scss/layout/_container.scss

@@ -0,0 +1,42 @@
+@if ($enable-class-container and $enable-classes) {
+  /**
+ * Container
+ */
+
+  .container,
+  .container-fluid {
+    width: 100%;
+    margin-right: auto;
+    margin-left: auto;
+    padding-right: var(--spacing);
+    padding-left: var(--spacing);
+  }
+
+  .container {
+    @if map-get($breakpoints, "sm") {
+      @media (min-width: map-get($breakpoints, "sm")) {
+        max-width: map-get($viewports, "sm");
+        padding-right: 0;
+        padding-left: 0;
+      }
+    }
+
+    @if map-get($breakpoints, "md") {
+      @media (min-width: map-get($breakpoints, "md")) {
+        max-width: map-get($viewports, "md");
+      }
+    }
+
+    @if map-get($breakpoints, "lg") {
+      @media (min-width: map-get($breakpoints, "lg")) {
+        max-width: map-get($viewports, "lg");
+      }
+    }
+
+    @if map-get($breakpoints, "xl") {
+      @media (min-width: map-get($breakpoints, "xl")) {
+        max-width: map-get($viewports, "xl");
+      }
+    }
+  }
+}

themes/ccchh/assets/pico-1.5.11/scss/layout/_document.scss

@@ -0,0 +1,48 @@
+/**
+ * Document
+ * Content-box & Responsive typography
+ */
+
+// Reboot based on :
+// - normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css
+// - sanitize.css v13.0.0 | CC0 1.0 Universal | github.com/csstools/sanitize.css
+// ––––––––––––––––––––
+
+// 1. Add border box sizing in all browsers (opinionated)
+// 2. Backgrounds do not repeat by default (opinionated)
+*,
+*::before,
+*::after {
+  box-sizing: border-box; // 1
+  background-repeat: no-repeat; // 2
+}
+
+// 1. Add text decoration inheritance in all browsers (opinionated)
+// 2. Add vertical alignment inheritance in all browsers (opinionated)
+::before,
+::after {
+  text-decoration: inherit; // 1
+  vertical-align: inherit; // 2
+}
+
+// 1. Use the default cursor in all browsers (opinionated)
+// 2. Change the line height in all browsers (opinionated)
+// 3. Breaks words to prevent overflow in all browsers (opinionated)
+// 4. Use a 4-space tab width in all browsers (opinionated)
+// 5. Remove the grey highlight on links in iOS (opinionated)
+// 6. Prevent adjustments of font size after orientation changes in iOS
+:where(:root) {
+  -webkit-tap-highlight-color: transparent; // 5
+  -webkit-text-size-adjust: 100%; // 6
+  text-size-adjust: 100%; // 6
+  background-color: var(--background-color);
+  color: var(--color);
+  font-weight: var(--font-weight);
+  font-size: var(--font-size);
+  line-height: var(--line-height); // 2
+  font-family: var(--font-family);
+  text-rendering: optimizeLegibility;
+  overflow-wrap: break-word; // 3
+  cursor: default; // 1
+  tab-size: 4; // 4
+}

themes/ccchh/assets/pico-1.5.11/scss/layout/_grid.scss

@@ -0,0 +1,24 @@
+@if ($enable-classes and $enable-grid) {
+  /**
+ * Grid
+ * Minimal grid system with auto-layout columns
+ */
+
+  .grid {
+    grid-column-gap: var(--grid-spacing-horizontal);
+    grid-row-gap: var(--grid-spacing-vertical);
+    display: grid;
+    grid-template-columns: 1fr;
+    margin: 0;
+
+    @if map-get($breakpoints, "lg") {
+      @media (min-width: map-get($breakpoints, "lg")) {
+        grid-template-columns: repeat(auto-fit, minmax(0%, 1fr));
+      }
+    }
+
+    & > * {
+      min-width: 0; // HACK for childs in overflow
+    }
+  }
+}

themes/ccchh/assets/pico-1.5.11/scss/layout/_scroller.scss

@@ -0,0 +1,16 @@
+/**
+ * Horizontal scroller (<figure>)
+ */
+
+// Wrapper to make any content responsive across all viewports
+figure {
+  display: block;
+  margin: 0;
+  padding: 0;
+  overflow-x: auto;
+
+  figcaption {
+    padding: calc(var(--spacing) * 0.5) 0;
+    color: var(--muted-color);
+  }
+}

themes/ccchh/assets/pico-1.5.11/scss/layout/_section.scss

@@ -0,0 +1,8 @@
+/**
+ * Section
+ * Responsive spacings for section
+ */
+
+section {
+  margin-bottom: var(--block-spacing-vertical);
+}

themes/ccchh/assets/pico-1.5.11/scss/layout/_sectioning.scss

@@ -0,0 +1,70 @@
+/**
+ * Sectioning
+ * Container and responsive spacings for header, main, footer
+ */
+
+// Reboot based on :
+// - normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css
+// - sanitize.css v13.0.0 | CC0 1.0 Universal | github.com/csstools/sanitize.css
+// ––––––––––––––––––––
+
+// Render the `main` element consistently in IE
+main {
+  display: block;
+}
+
+// Pico
+// ––––––––––––––––––––
+
+// 1. Remove the margin in all browsers (opinionated)
+#{$semantic-root-element} {
+  width: 100%;
+  margin: 0; // 1
+
+  > header,
+  > main,
+  > footer {
+    width: 100%;
+    margin-right: auto;
+    margin-left: auto;
+
+    // Semantic container
+    @if $enable-semantic-container {
+      padding: var(--block-spacing-vertical) var(--block-spacing-horizontal);
+
+      // Centered viewport
+      @if $enable-viewport {
+        @if map-get($breakpoints, "sm") and $enable-viewport {
+          @media (min-width: map-get($breakpoints, "sm")) {
+            max-width: map-get($viewports, "sm");
+            padding-right: 0;
+            padding-left: 0;
+          }
+        }
+
+        @if map-get($breakpoints, "md") and $enable-viewport {
+          @media (min-width: map-get($breakpoints, "md")) {
+            max-width: map-get($viewports, "md");
+          }
+        }
+
+        @if map-get($breakpoints, "lg") and $enable-viewport {
+          @media (min-width: map-get($breakpoints, "lg")) {
+            max-width: map-get($viewports, "lg");
+          }
+        }
+
+        @if map-get($breakpoints, "xl") and $enable-viewport {
+          @media (min-width: map-get($breakpoints, "xl")) {
+            max-width: map-get($viewports, "xl");
+          }
+        }
+      }
+    }
+
+    // Semantic container
+    @else {
+      padding: var(--block-spacing-vertical) 0;
+    }
+  }
+}

themes/ccchh/assets/pico-1.5.11/scss/pico.classless.scss

@@ -0,0 +1,13 @@
+// Config
+// --------------------
+
+// Enable <header>, <main>, <footer> inside $semantic-root-element as containers
+$enable-semantic-container: true;
+
+// Enable .classes
+$enable-classes: false;
+
+// Pico Lib
+// --------------------
+
+@import "pico";

themes/ccchh/assets/pico-1.5.11/scss/pico.fluid.classless.scss

@@ -0,0 +1,16 @@
+// Config
+// --------------------
+
+// Enable <header>, <main>, <footer> inside $semantic-root-element as containers
+$enable-semantic-container: true;
+
+// Enable a centered viewport for <header>, <main>, <footer> inside $enable-semantic-container 
+$enable-viewport: false;
+
+// Enable .classes
+$enable-classes: false;
+
+// Pico Lib
+// --------------------
+
+@import "pico";

themes/ccchh/assets/pico-1.5.11/scss/pico.scss

@@ -0,0 +1,43 @@
+/*!
+ * Pico CSS v1.5.11 (https://picocss.com)
+ * Copyright 2019-2023 - Licensed under MIT
+ */
+
+// Config
+@import "variables";
+
+// Theming
+@import "themes/default";
+
+// Layout
+@import "layout/document"; // html
+@import "layout/sectioning"; // body, header, main, footer
+@import "layout/container"; // .container, .container-fluid
+@import "layout/section"; // section
+@import "layout/grid"; // .grid
+@import "layout/scroller"; // figure
+
+// Content
+@import "content/typography"; // a, headings, p, ul, blockquote, ...
+@import "content/embedded"; // audio, canvas, iframe, img, svg, video
+@import "content/button"; // button, a[role=button], type=button, type=submit ...
+@import "content/form"; // input, select, textarea, label, fieldset, legend
+@import "content/form-checkbox-radio"; // type=checkbox, type=radio, role=switch
+@import "content/form-alt-input-types"; // type=color, type=date, type=file, type=search, ...
+@import "content/table"; // table, tr, td, ...
+@import "content/code"; // pre, code, ...
+@import "content/miscs"; // hr, template, [hidden], dialog, canvas
+
+// Components
+@import "components/accordion"; // details, summary
+@import "components/card"; // article
+@import "components/modal"; // dialog
+@import "components/nav"; // nav
+@import "components/progress"; // progress
+@import "components/dropdown"; // dropdown
+
+// Utilities
+@import "utilities/loading"; // aria-busy=true
+@import "utilities/tooltip"; // data-tooltip
+@import "utilities/accessibility"; // -ms-touch-action, aria-*
+@import "utilities/reduce-motion"; // prefers-reduced-motion

themes/ccchh/assets/pico-1.5.11/scss/pico.slim.scss

@@ -0,0 +1,47 @@
+/*!
+ * Pico CSS v1.5.11 (https://picocss.com)
+ * Copyright 2019-2023 - Licensed under MIT
+ *
+ * Slim version example
+ * You can export only the modules you need
+ */
+
+// Config
+// --------------------
+
+// Enable responsive spacings for <header>, <main>, <footer>, <section>, <article>
+$enable-responsive-spacings: false;
+
+// Enable transitions
+$enable-transitions: false;
+
+// Enable overriding with !important
+$enable-important: false;
+
+// Pico Lib
+// --------------------
+
+// Config
+@import "variables";
+
+// Theming
+@import "themes/default";
+
+// Layout
+@import "layout/document"; // html
+@import "layout/sectioning"; // body, header, main, footer
+@import "layout/container"; // .container, .container-fluid
+@import "layout/section"; // section
+@import "layout/grid"; // .grid
+@import "layout/scroller"; // figure
+
+// Content
+@import "content/typography"; // a, headings, p, ul, blockquote, ...
+@import "content/embedded"; // audio, canvas, iframe, img, svg, video
+@import "content/button"; // button, a[role=button], type=button, type=submit ...
+@import "content/form"; // input, select, textarea, label, fieldset, legend
+@import "content/table"; // table, tr, td, ...
+
+// Utilities
+@import "utilities/accessibility"; // -ms-touch-action, aria-*
+@import "utilities/reduce-motion"; // prefers-reduced-motion

themes/ccchh/assets/pico-1.5.11/scss/themes/default.scss

@@ -0,0 +1,37 @@
+/**
+ * Theme: default
+ */
+
+// Variables
+@import "../variables";
+@import "default/colors";
+
+// Commons styles
+@import "default/styles";
+
+// Light theme (Default)
+// Can be forced with data-theme="light"
+@import "default/light";
+
+// Dark theme (Auto)
+// Automatically enabled if user has Dark mode enabled
+@import "default/dark";
+@media only screen and (prefers-color-scheme: dark) {
+  :root:not([data-theme]) {
+    @include dark;
+  }
+}
+
+// Dark theme (Forced)
+// Enabled if forced with data-theme="dark"
+[data-theme="dark"] {
+  @include dark;
+}
+
+// Accent-color
+progress,
+[type="checkbox"],
+[type="radio"],
+[type="range"] {
+  accent-color: var(--primary);
+}

themes/ccchh/assets/pico-1.5.11/scss/themes/default/_colors.scss

@@ -0,0 +1,65 @@
+// Navy-Grey
+$grey-hue: 205 !default;
+$grey-50: hsl($grey-hue, 20%, 94%) !default;
+$grey-100: hsl($grey-hue, 18%, 86%) !default;
+$grey-200: hsl($grey-hue, 16%, 77%) !default;
+$grey-300: hsl($grey-hue, 14%, 68%) !default;
+$grey-400: hsl($grey-hue, 12%, 59%) !default;
+$grey-500: hsl($grey-hue, 10%, 50%) !default;
+$grey-600: hsl($grey-hue, 15%, 41%) !default;
+$grey-700: hsl($grey-hue, 20%, 32%) !default;
+$grey-800: hsl($grey-hue, 25%, 23%) !default;
+$grey-900: hsl($grey-hue, 30%, 15%) !default;
+
+// Light Blue
+$primary-hue: 195 !default;
+$primary-50: hsl($primary-hue, 90%, 94%) !default;
+$primary-100: hsl($primary-hue, 88%, 86%) !default;
+$primary-200: hsl($primary-hue, 86%, 77%) !default;
+$primary-300: hsl($primary-hue, 84%, 68%) !default;
+$primary-400: hsl($primary-hue, 82%, 59%) !default;
+$primary-500: hsl($primary-hue, 80%, 50%) !default;
+$primary-600: hsl($primary-hue, 85%, 41%) !default;
+$primary-700: hsl($primary-hue, 90%, 32%) !default;
+$primary-800: hsl($primary-hue, 95%, 23%) !default;
+$primary-900: hsl($primary-hue, 100%, 15%) !default;
+
+// Black & White
+$black: #000 !default;
+$white: #fff !default;
+
+// Amber
+$amber-50: #fff8e1 !default;
+$amber-100: #ffecb3 !default;
+$amber-200: #ffe082 !default;
+$amber-300: #ffd54f !default;
+$amber-400: #ffca28 !default;
+$amber-500: #ffc107 !default;
+$amber-600: #ffb300 !default;
+$amber-700: #ffa000 !default;
+$amber-800: #ff8f00 !default;
+$amber-900: #ff6f00 !default;
+
+// Green
+$green-50: #e8f5e9 !default;
+$green-100: #c8e6c9 !default;
+$green-200: #a5d6a7 !default;
+$green-300: #81c784 !default;
+$green-400: #66bb6a !default;
+$green-500: #4caf50 !default;
+$green-600: #43a047 !default;
+$green-700: #388e3c !default;
+$green-800: #2e7d32 !default;
+$green-900: #1b5e20 !default;
+
+// Red
+$red-50: #ffebee !default;
+$red-100: #ffcdd2 !default;
+$red-200: #ef9a9a !default;
+$red-300: #e57373 !default;
+$red-400: #ef5350 !default;
+$red-500: #f44336 !default;
+$red-600: #e53935 !default;
+$red-700: #d32f2f !default;
+$red-800: #c62828 !default;
+$red-900: #b71c1c !default;

themes/ccchh/assets/pico-1.5.11/scss/themes/default/_dark.scss

@@ -0,0 +1,159 @@
+@import "../../functions";
+
+// Default: Dark theme
+@mixin dark {
+  --background-color: #{mix($black, $grey-900, 37.5%)};
+
+  // Texts colors
+  --color: #{$grey-200};
+  --h1-color: #{$grey-50};
+  --h2-color: #{mix($grey-100, $grey-50)};
+  --h3-color: #{$grey-100};
+  --h4-color: #{mix($grey-200, $grey-100)};
+  --h5-color: #{$grey-200};
+  --h6-color: #{mix($grey-300, $grey-200)};
+
+  // Muted colors
+  --muted-color: #{$grey-500};
+  --muted-border-color: #{mix($grey-900, $grey-800, 75%)};
+
+  // Primary colors
+  --primary: #{$primary-600};
+  --primary-hover: #{$primary-500};
+  --primary-focus: #{rgba($primary-600, 0.25)};
+  --primary-inverse: #{$white};
+
+  // Secondary colors
+  --secondary: #{$grey-600};
+  --secondary-hover: #{$grey-500};
+  --secondary-focus: #{rgba($grey-500, 0.25)};
+  --secondary-inverse: #{$white};
+
+  // Contrast colors
+  --contrast: #{$grey-50};
+  --contrast-hover: #{$white};
+  --contrast-focus: #{rgba($grey-500, 0.25)};
+  --contrast-inverse: #{$black};
+
+  // Highlighted text (<mark>)
+  --mark-background-color: #{mix($grey-300, $amber-300)};
+  --mark-color: #{mix($black, $grey-900, 37.5%)};
+
+  // Inserted (<ins>) & Deleted (<ins>)
+  --ins-color: #{$green-700};
+  --del-color: #{$red-800};
+
+  // Blockquote
+  --blockquote-border-color: var(--muted-border-color);
+  --blockquote-footer-color: var(--muted-color);
+
+  // Button
+  // To disable box-shadow, remove the var or set to '0 0 0 rgba(0, 0, 0, 0)'
+  // Don't use, 'none, 'false, 'null', '0', etc.
+  --button-box-shadow: 0 0 0 rgba(0, 0, 0, 0);
+  --button-hover-box-shadow: 0 0 0 rgba(0, 0, 0, 0);
+
+  // Form elements
+  --form-element-background-color: #{mix($black, $grey-900, 37.5%)};
+  --form-element-border-color: #{mix($grey-800, $grey-700)};
+  --form-element-color: var(--color);
+  --form-element-placeholder-color: var(--muted-color);
+  --form-element-active-background-color: var(--form-element-background-color);
+  --form-element-active-border-color: var(--primary);
+  --form-element-focus-color: var(--primary-focus);
+  --form-element-disabled-background-color: #{$grey-800};
+  --form-element-disabled-border-color: #{$grey-700};
+  --form-element-disabled-opacity: 0.5;
+  --form-element-invalid-border-color: #{$red-900};
+  --form-element-invalid-active-border-color: #{$red-800};
+  --form-element-invalid-focus-color: #{rgba($red-800, 0.25)};
+  --form-element-valid-border-color: #{$green-800};
+  --form-element-valid-active-border-color: #{$green-700};
+  --form-element-valid-focus-color: #{rgba($green-700, 0.25)};
+
+  // Switch (input[type="checkbox"][role="switch"])
+  --switch-background-color: #{mix($grey-800, $grey-700)};
+  --switch-color: var(--primary-inverse);
+  --switch-checked-background-color: var(--primary);
+
+  // Range (input[type="range"])
+  --range-border-color: #{mix($grey-900, $grey-800)};
+  --range-active-border-color: #{$grey-800};
+  --range-thumb-border-color: var(--background-color);
+  --range-thumb-color: var(--secondary);
+  --range-thumb-hover-color: var(--secondary-hover);
+  --range-thumb-active-color: var(--primary);
+
+  // Table
+  --table-border-color: var(--muted-border-color);
+  --table-row-stripped-background-color: #{rgba($grey-500, 0.05)};
+
+  // Code
+  --code-background-color: #{mix($black, $grey-900, 12.5%)};
+  --code-color: var(--muted-color);
+  --code-kbd-background-color: var(--contrast);
+  --code-kbd-color: var(--contrast-inverse);
+  --code-tag-color: #{hsl(330, 30%, 50%)};
+  --code-property-color: #{hsl(185, 30%, 50%)};
+  --code-value-color: #{hsl(40, 10%, 50%)};
+  --code-comment-color: #{mix($grey-700, $grey-600)};
+
+  // Accordion (<details>)
+  --accordion-border-color: var(--muted-border-color);
+  --accordion-active-summary-color: var(--primary);
+  --accordion-close-summary-color: var(--color);
+  --accordion-open-summary-color: var(--muted-color);
+
+  // Card (<article>)
+  $box-shadow-elevation: 1rem;
+  $box-shadow-blur-strengh: 6rem;
+  $box-shadow-opacity: 0.06;
+  --card-background-color: #{mix($black, $grey-900, 25%)};
+  --card-border-color: var(--card-background-color);
+  --card-box-shadow:
+    #{($box-shadow-elevation * 0.5 * 0.029)} #{($box-shadow-elevation * 0.029)} #{($box-shadow-blur-strengh * 0.029)} #{rgba($black, ($box-shadow-opacity * 0.283))},
+    #{($box-shadow-elevation * 0.5 * 0.067)} #{($box-shadow-elevation * 0.067)} #{($box-shadow-blur-strengh * 0.067)} #{rgba($black, ($box-shadow-opacity * 0.4))},
+    #{($box-shadow-elevation * 0.5 * 0.125)} #{($box-shadow-elevation * 0.125)} #{($box-shadow-blur-strengh * 0.125)} #{rgba($black, ($box-shadow-opacity * 0.5))},
+    #{($box-shadow-elevation * 0.5 * 0.225)} #{($box-shadow-elevation * 0.225)} #{($box-shadow-blur-strengh * 0.225)} #{rgba($black, ($box-shadow-opacity * 0.6))},
+    #{($box-shadow-elevation * 0.5 * 0.417)} #{($box-shadow-elevation * 0.417)} #{($box-shadow-blur-strengh * 0.417)} #{rgba($black, ($box-shadow-opacity * 0.717))},
+    #{($box-shadow-elevation * 0.5)} #{$box-shadow-elevation} #{$box-shadow-blur-strengh} #{rgba($black, $box-shadow-opacity)},
+    0 0 0 0.0625rem #{rgba($black, ($box-shadow-opacity * 0.25) )};
+  --card-sectionning-background-color: #{mix($black, $grey-900, 12.5%)};
+
+  // Dropdown (<details role="list">)
+  --dropdown-background-color: #{$grey-900};
+  --dropdown-border-color: #{mix($grey-900, $grey-800)};
+  --dropdown-box-shadow: var(--card-box-shadow);
+  --dropdown-color: var(--color);
+  --dropdown-hover-background-color: #{rgba(mix($grey-900, $grey-800), 0.75)};
+
+  // Modal (<dialog>)
+  --modal-overlay-background-color: #{rgba(mix($grey-900, $grey-800), 0.8)};
+
+  // Progress
+  --progress-background-color: #{mix($grey-900, $grey-800)};
+  --progress-color: var(--primary);
+
+  // Loading ([aria-busy=true])
+  --loading-spinner-opacity: 0.5;
+
+  // Tooltip ([data-tooltip])
+  --tooltip-background-color: var(--contrast);
+  --tooltip-color: var(--contrast-inverse);
+
+  // Icons
+  --icon-checkbox: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='#{to-rgb($white)}' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
+  --icon-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='#{to-rgb($grey-300)}' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
+  --icon-chevron-button: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='#{to-rgb($white)}' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
+  --icon-chevron-button-inverse: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='#{to-rgb($black)}' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
+  --icon-close: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='#{to-rgb($grey-500)}' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='18' y1='6' x2='6' y2='18'%3E%3C/line%3E%3Cline x1='6' y1='6' x2='18' y2='18'%3E%3C/line%3E%3C/svg%3E");
+  --icon-date: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='#{to-rgb($grey-300)}' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2' ry='2'%3E%3C/rect%3E%3Cline x1='16' y1='2' x2='16' y2='6'%3E%3C/line%3E%3Cline x1='8' y1='2' x2='8' y2='6'%3E%3C/line%3E%3Cline x1='3' y1='10' x2='21' y2='10'%3E%3C/line%3E%3C/svg%3E");
+  --icon-invalid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='#{to-rgb($red-900)}' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cline x1='12' y1='8' x2='12' y2='12'%3E%3C/line%3E%3Cline x1='12' y1='16' x2='12.01' y2='16'%3E%3C/line%3E%3C/svg%3E");
+  --icon-minus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='#{to-rgb($white)}' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='5' y1='12' x2='19' y2='12'%3E%3C/line%3E%3C/svg%3E");
+  --icon-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='#{to-rgb($grey-300)}' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
+  --icon-time: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='#{to-rgb($grey-300)}' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cpolyline points='12 6 12 12 16 14'%3E%3C/polyline%3E%3C/svg%3E");
+  --icon-valid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='#{to-rgb($green-800)}' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
+  
+  // Document
+  color-scheme: dark;
+}

themes/ccchh/assets/pico-1.5.11/scss/themes/default/_light.scss

@@ -0,0 +1,159 @@
+@import "../../functions";
+
+// Default: Light theme
+[data-theme="light"],
+:root:not([data-theme="dark"]) {
+  --background-color: #{$white};
+
+  // Texts colors
+  --color: #{$grey-700};
+  --h1-color: #{$grey-900};
+  --h2-color: #{mix($grey-900, $grey-800)};
+  --h3-color: #{$grey-800};
+  --h4-color: #{mix($grey-800, $grey-700)};
+  --h5-color: #{$grey-700};
+  --h6-color: #{mix($grey-700, $grey-600)};
+
+  // Muted colors
+  --muted-color: #{$grey-500};
+  --muted-border-color: #{$grey-50};
+
+  // Primary colors
+  --primary: #{$primary-600};
+  --primary-hover: #{$primary-700};
+  --primary-focus: #{rgba($primary-600, 0.125)};
+  --primary-inverse: #{$white};
+
+  // Secondary colors
+  --secondary: #{$grey-600};
+  --secondary-hover: #{$grey-700};
+  --secondary-focus: #{rgba($grey-600, 0.125)};
+  --secondary-inverse: #{$white};
+
+  // Contrast colors
+  --contrast: #{$grey-900};
+  --contrast-hover: #{$black};
+  --contrast-focus: #{rgba($grey-600, 0.125)};
+  --contrast-inverse: #{$white};
+
+  // Highlighted text (<mark>)
+  --mark-background-color: #{mix($amber-100, $amber-50)};
+  --mark-color: #{mix($grey-900, $amber-900, 75%)};
+
+  // Inserted (<ins>) & Deleted (<ins>)
+  --ins-color: #{$green-700};
+  --del-color: #{$red-800};
+
+  // Blockquote
+  --blockquote-border-color: var(--muted-border-color);
+  --blockquote-footer-color: var(--muted-color);
+
+  // Button
+  // To disable box-shadow, remove the var or set to '0 0 0 rgba(0, 0, 0, 0)'
+  // Don't use, 'none, 'false, 'null', '0', etc.
+  --button-box-shadow: 0 0 0 rgba(0, 0, 0, 0);
+  --button-hover-box-shadow: 0 0 0 rgba(0, 0, 0, 0);
+
+  // Form elements
+  --form-element-background-color: transparent;
+  --form-element-border-color: #{$grey-300};
+  --form-element-color: var(--color);
+  --form-element-placeholder-color: var(--muted-color);
+  --form-element-active-background-color: transparent;
+  --form-element-active-border-color: var(--primary);
+  --form-element-focus-color: var(--primary-focus);
+  --form-element-disabled-background-color: #{$grey-100};
+  --form-element-disabled-border-color: #{$grey-300};
+  --form-element-disabled-opacity: 0.5;
+  --form-element-invalid-border-color: #{$red-800};
+  --form-element-invalid-active-border-color: #{$red-700};
+  --form-element-invalid-focus-color: #{rgba($red-700, 0.125)};
+  --form-element-valid-border-color: #{$green-700};
+  --form-element-valid-active-border-color: #{$green-600};
+  --form-element-valid-focus-color: #{rgba($green-600, 0.125)};
+
+  // Switch (input[type="checkbox"][role="switch"])
+  --switch-background-color: #{$grey-200};
+  --switch-color: var(--primary-inverse);
+  --switch-checked-background-color: var(--primary);
+
+  // Range (input[type="range"])
+  --range-border-color: #{$grey-100};
+  --range-active-border-color: #{$grey-200};
+  --range-thumb-border-color: var(--background-color);
+  --range-thumb-color: var(--secondary);
+  --range-thumb-hover-color: var(--secondary-hover);
+  --range-thumb-active-color: var(--primary);
+
+  // Table
+  --table-border-color: var(--muted-border-color);
+  --table-row-stripped-background-color: #{mix($grey-50, $white)};
+
+  // Code
+  --code-background-color: #{$grey-50};
+  --code-color: var(--muted-color);
+  --code-kbd-background-color: var(--contrast);
+  --code-kbd-color: var(--contrast-inverse);
+  --code-tag-color: #{hsl(330, 40%, 50%)};
+  --code-property-color: #{hsl(185, 40%, 40%)};
+  --code-value-color: #{hsl(40, 20%, 50%)};
+  --code-comment-color: #{$grey-300};
+
+  // Accordion (<details>)
+  --accordion-border-color: var(--muted-border-color);
+  --accordion-close-summary-color: var(--color);
+  --accordion-open-summary-color: var(--muted-color);
+
+  // Card (<article>)
+  $box-shadow-elevation: 1rem;
+  $box-shadow-blur-strengh: 6rem;
+  $box-shadow-opacity: 0.06;
+  --card-background-color: var(--background-color);
+  --card-border-color: var(--muted-border-color);
+  --card-box-shadow:
+    #{($box-shadow-elevation * 0.5 * 0.029)} #{($box-shadow-elevation * 0.029)} #{($box-shadow-blur-strengh * 0.029)} #{rgba($grey-900, ($box-shadow-opacity * 0.283))},
+    #{($box-shadow-elevation * 0.5 * 0.067)} #{($box-shadow-elevation * 0.067)} #{($box-shadow-blur-strengh * 0.067)} #{rgba($grey-900, ($box-shadow-opacity * 0.4))},
+    #{($box-shadow-elevation * 0.5 * 0.125)} #{($box-shadow-elevation * 0.125)} #{($box-shadow-blur-strengh * 0.125)} #{rgba($grey-900, ($box-shadow-opacity * 0.5))},
+    #{($box-shadow-elevation * 0.5 * 0.225)} #{($box-shadow-elevation * 0.225)} #{($box-shadow-blur-strengh * 0.225)} #{rgba($grey-900, ($box-shadow-opacity * 0.6))},
+    #{($box-shadow-elevation * 0.5 * 0.417)} #{($box-shadow-elevation * 0.417)} #{($box-shadow-blur-strengh * 0.417)} #{rgba($grey-900, ($box-shadow-opacity * 0.717))},
+    #{($box-shadow-elevation * 0.5)} #{$box-shadow-elevation} #{$box-shadow-blur-strengh} #{rgba($grey-900, $box-shadow-opacity)},
+    0 0 0 0.0625rem #{rgba($grey-900, ($box-shadow-opacity * 0.25) )};
+  --card-sectionning-background-color: #{mix($grey-50, $white, 25%)};
+
+  // Dropdown (<details role="list">)
+  --dropdown-background-color: #{mix($grey-50, $white, 25%)};
+  --dropdown-border-color: #{mix($grey-100, $grey-50)};
+  --dropdown-box-shadow: var(--card-box-shadow);
+  --dropdown-color: var(--color);
+  --dropdown-hover-background-color: #{$grey-50};
+
+  // Modal (<dialog>)
+  --modal-overlay-background-color: #{rgba($grey-100, 0.7)};
+
+  // Progress
+  --progress-background-color: #{$grey-100};
+  --progress-color: var(--primary);
+
+  // Loading ([aria-busy=true])
+  --loading-spinner-opacity: 0.5;
+
+  // Tooltip ([data-tooltip])
+  --tooltip-background-color: var(--contrast);
+  --tooltip-color: var(--contrast-inverse);
+
+  // Icons
+  --icon-checkbox: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='#{to-rgb($white)}' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
+  --icon-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='#{to-rgb($grey-700)}' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
+  --icon-chevron-button: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='#{to-rgb($white)}' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
+  --icon-chevron-button-inverse: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='#{to-rgb($white)}' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
+  --icon-close: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='#{to-rgb($grey-500)}' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='18' y1='6' x2='6' y2='18'%3E%3C/line%3E%3Cline x1='6' y1='6' x2='18' y2='18'%3E%3C/line%3E%3C/svg%3E");
+  --icon-date: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='#{to-rgb($grey-700)}' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2' ry='2'%3E%3C/rect%3E%3Cline x1='16' y1='2' x2='16' y2='6'%3E%3C/line%3E%3Cline x1='8' y1='2' x2='8' y2='6'%3E%3C/line%3E%3Cline x1='3' y1='10' x2='21' y2='10'%3E%3C/line%3E%3C/svg%3E");
+  --icon-invalid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='#{to-rgb($red-800)}' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cline x1='12' y1='8' x2='12' y2='12'%3E%3C/line%3E%3Cline x1='12' y1='16' x2='12.01' y2='16'%3E%3C/line%3E%3C/svg%3E");
+  --icon-minus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='#{to-rgb($white)}' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='5' y1='12' x2='19' y2='12'%3E%3C/line%3E%3C/svg%3E");
+  --icon-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='#{to-rgb($grey-700)}' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
+  --icon-time: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='#{to-rgb($grey-700)}' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cpolyline points='12 6 12 12 16 14'%3E%3C/polyline%3E%3C/svg%3E"); 
+  --icon-valid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='#{to-rgb($green-700)}' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
+  
+  // Document
+  color-scheme: light;
+}

themes/ccchh/assets/pico-1.5.11/scss/themes/default/_styles.scss

@@ -0,0 +1,247 @@
+// Commons Styles
+:root {
+  // Typography
+  --font-family: system-ui, -apple-system, "Segoe UI", "Roboto", "Ubuntu",
+    "Cantarell", "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji",
+    "Segoe UI Symbol", "Noto Color Emoji";
+  --line-height: 1.5;
+  --font-weight: 400;
+  --font-size: 16px;
+
+  // Responsive typography
+  @if $enable-responsive-typography {
+    @if map-get($breakpoints, "sm") {
+      @media (min-width: map-get($breakpoints, "sm")) {
+        --font-size: 17px;
+      }
+    }
+
+    @if map-get($breakpoints, "md") {
+      @media (min-width: map-get($breakpoints, "md")) {
+        --font-size: 18px;
+      }
+    }
+
+    @if map-get($breakpoints, "lg") {
+      @media (min-width: map-get($breakpoints, "lg")) {
+        --font-size: 19px;
+      }
+    }
+
+    @if map-get($breakpoints, "xl") {
+      @media (min-width: map-get($breakpoints, "xl")) {
+        --font-size: 20px;
+      }
+    }
+  }
+
+  // Borders
+  --border-radius: 0.25rem;
+  --border-width: 1px;
+  --outline-width: 3px;
+
+  // Spacings
+  --spacing: 1rem;
+
+  // Spacings for typography elements
+  --typography-spacing-vertical: 1.5rem;
+
+  // Spacings for body > header, body > main, body > footer, section, article
+  --block-spacing-vertical: calc(var(--spacing) * 2);
+  --block-spacing-horizontal: var(--spacing);
+
+  @if ($enable-classes and $enable-grid) {
+    --grid-spacing-vertical: 0;
+    --grid-spacing-horizontal: var(--spacing);
+  }
+
+  // Spacings for form elements and button
+  --form-element-spacing-vertical: 0.75rem;
+  --form-element-spacing-horizontal: 1rem;
+
+  // Spacings for nav component
+  --nav-element-spacing-vertical: 1rem;
+  --nav-element-spacing-horizontal: 0.5rem;
+  --nav-link-spacing-vertical: 0.5rem;
+  --nav-link-spacing-horizontal: 0.5rem;
+
+  // Font weight for form labels & fieldsets legend
+  --form-label-font-weight: var(--font-weight);
+
+  // Transitions
+  --transition: 0.2s ease-in-out;
+
+  // Modal (<dialog>)
+  --modal-overlay-backdrop-filter: blur(0.25rem);
+}
+
+// Responsives spacings
+@if $enable-responsive-spacings {
+  // Sectioning
+  #{$semantic-root-element} > header,
+  #{$semantic-root-element} > main,
+  #{$semantic-root-element} > footer,
+  section {
+    @if map-get($breakpoints, "sm") {
+      @media (min-width: map-get($breakpoints, "sm")) {
+        --block-spacing-vertical: calc(var(--spacing) * 2.5);
+      }
+    }
+
+    @if map-get($breakpoints, "md") {
+      @media (min-width: map-get($breakpoints, "md")) {
+        --block-spacing-vertical: calc(var(--spacing) * 3);
+      }
+    }
+
+    @if map-get($breakpoints, "lg") {
+      @media (min-width: map-get($breakpoints, "lg")) {
+        --block-spacing-vertical: calc(var(--spacing) * 3.5);
+      }
+    }
+
+    @if map-get($breakpoints, "xl") {
+      @media (min-width: map-get($breakpoints, "xl")) {
+        --block-spacing-vertical: calc(var(--spacing) * 4);
+      }
+    }
+  }
+
+  // Card (<article>)
+  article {
+    @if map-get($breakpoints, "sm") {
+      @media (min-width: map-get($breakpoints, "sm")) {
+        --block-spacing-horizontal: calc(var(--spacing) * 1.25);
+      }
+    }
+
+    @if map-get($breakpoints, "md") {
+      @media (min-width: map-get($breakpoints, "md")) {
+        --block-spacing-horizontal: calc(var(--spacing) * 1.5);
+      }
+    }
+
+    @if map-get($breakpoints, "lg") {
+      @media (min-width: map-get($breakpoints, "lg")) {
+        --block-spacing-horizontal: calc(var(--spacing) * 1.75);
+      }
+    }
+
+    @if map-get($breakpoints, "xl") {
+      @media (min-width: map-get($breakpoints, "xl")) {
+        --block-spacing-horizontal: calc(var(--spacing) * 2);
+      }
+    }
+  }
+
+  // Modal
+  dialog > article {
+
+    --block-spacing-vertical: calc(var(--spacing) * 2);
+    --block-spacing-horizontal: var(--spacing);
+
+    @if map-get($breakpoints, "sm") {
+      @media (min-width: map-get($breakpoints, "sm")) {
+        --block-spacing-vertical: calc(var(--spacing) * 2.5);
+        --block-spacing-horizontal: calc(var(--spacing) * 1.25);
+      }
+    }
+
+    @if map-get($breakpoints, "md") {
+      @media (min-width: map-get($breakpoints, "md")) {
+        --block-spacing-vertical: calc(var(--spacing) * 3);
+        --block-spacing-horizontal: calc(var(--spacing) * 1.5);
+      }
+    }
+  }
+}
+
+// Link
+a {
+  --text-decoration: none;
+
+  // Secondary & Contrast
+  @if $enable-classes {
+    &.secondary,
+    &.contrast {
+      --text-decoration: underline;
+    }
+  }
+}
+
+// Small
+small {
+  --font-size: 0.875em;
+}
+
+// Headings
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+  --font-weight: 700;
+}
+
+h1 {
+  --font-size: 2rem;
+  --typography-spacing-vertical: 3rem;
+}
+
+h2 {
+  --font-size: 1.75rem;
+  --typography-spacing-vertical: 2.625rem;
+}
+
+h3 {
+  --font-size: 1.5rem;
+  --typography-spacing-vertical: 2.25rem;
+}
+
+h4 {
+  --font-size: 1.25rem;
+  --typography-spacing-vertical: 1.874rem;
+}
+
+h5 {
+  --font-size: 1.125rem;
+  --typography-spacing-vertical: 1.6875rem;
+}
+
+// Forms elements
+[type="checkbox"],
+[type="radio"] {
+  --border-width: 2px;
+}
+
+[type="checkbox"][role="switch"] {
+  --border-width: 3px;
+}
+
+// Table
+thead,
+tfoot {
+  th,
+  td {
+    --border-width: 3px;
+  }
+}
+
+:not(thead, tfoot) > * > td {
+  --font-size: 0.875em;
+}
+
+// Code
+pre,
+code,
+kbd,
+samp {
+  --font-family: "Menlo", "Consolas", "Roboto Mono", "Ubuntu Monospace",
+    "Noto Mono", "Oxygen Mono", "Liberation Mono", monospace,
+    "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
+}
+
+kbd {
+  --font-weight: bolder;
+}

themes/ccchh/assets/pico-1.5.11/scss/utilities/_accessibility.scss

@@ -0,0 +1,52 @@
+/**
+ * Accessibility & User interaction
+ */
+
+// Based on :
+// - normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css
+// - sanitize.css v13.0.0 | CC0 1.0 Universal | github.com/csstools/sanitize.css
+// ––––––––––––––––––––
+
+// Accessibility
+
+// Change the cursor on control elements in all browsers (opinionated)
+[aria-controls] {
+  cursor: pointer;
+}
+
+// Change the cursor on disabled, not-editable, or otherwise inoperable elements in all browsers (opinionated)
+[aria-disabled="true"],
+[disabled] {
+  cursor: not-allowed;
+}
+
+// Change the display on visually hidden accessible elements in all browsers (opinionated)
+[aria-hidden="false"][hidden] {
+  display: initial;
+}
+
+[aria-hidden="false"][hidden]:not(:focus) {
+  clip: rect(0, 0, 0, 0);
+  position: absolute;
+}
+
+// User interaction
+// Remove the tapping delay in IE 10
+a,
+area,
+button,
+input,
+label,
+select,
+summary,
+textarea,
+[tabindex] {
+  -ms-touch-action: manipulation;
+}
+
+// Pico
+// ––––––––––––––––––––
+
+[dir="rtl"] {
+  direction: rtl;
+}

themes/ccchh/assets/pico-1.5.11/scss/utilities/_loading.scss

@@ -0,0 +1,58 @@
+/**
+ * Loading ([aria-busy=true])
+ */
+
+
+// Cursor
+[aria-busy="true"] {
+  cursor: progress;
+}
+
+// Everyting except form elements
+[aria-busy="true"]:not(input, select, textarea, html) {
+
+  &::before {
+    display: inline-block;
+    width: 1em;
+    height: 1em;
+    border: 0.1875em solid currentColor;
+    border-radius: 1em;
+    border-right-color: transparent;
+    content: "";
+    vertical-align: text-bottom;
+    vertical-align: -.125em; // Visual alignment
+    animation: spinner 0.75s linear infinite;
+    opacity: var(--loading-spinner-opacity);
+  }
+
+  &:not(:empty) {
+    &::before {
+      margin-right: calc(var(--spacing) * 0.5);
+      margin-left: 0;
+      margin-inline-start: 0;
+      margin-inline-end: calc(var(--spacing) * 0.5);
+    }
+  }
+
+  &:empty {
+    text-align: center;
+  }
+}
+
+// Buttons and links
+button,
+input[type="submit"],
+input[type="button"],
+input[type="reset"],
+a {
+  &[aria-busy="true"] {
+    pointer-events: none;
+  }
+}
+
+// Animation: rotate
+@keyframes spinner {
+  to {
+    transform: rotate(360deg);
+  }
+}

themes/ccchh/assets/pico-1.5.11/scss/utilities/_reduce-motion.scss

@@ -0,0 +1,27 @@
+@if $enable-transitions and $enable-important {
+  /**
+ * Reduce Motion Features
+ */
+
+  // Based on :
+  // - sanitize.css v13.0.0 | CC0 1.0 Universal | github.com/csstools/sanitize.css
+  // ––––––––––––––––––––
+
+  // 1. Remove animations when motion is reduced (opinionated)
+  // 2. Remove fixed background attachments when motion is reduced (opinionated)
+  // 3. Remove timed scrolling behaviors when motion is reduced (opinionated)
+  // 4. Remove transitions when motion is reduced (opinionated)
+  @media (prefers-reduced-motion: reduce) {
+    *:not([aria-busy="true"]),
+    :not([aria-busy="true"])::before,
+    :not([aria-busy="true"])::after {
+      background-attachment: initial !important; // 2
+      animation-duration: 1ms !important; // 1
+      animation-delay: -1ms !important; // 1
+      animation-iteration-count: 1 !important; // 1
+      scroll-behavior: auto !important; // 3
+      transition-delay: 0s !important; // 4
+      transition-duration: 0s !important; // 4
+    }
+  }
+}

themes/ccchh/assets/pico-1.5.11/scss/utilities/_tooltip.scss

@@ -0,0 +1,278 @@
+/**
+ * Tooltip ([data-tooltip])
+ */
+
+[data-tooltip] {
+  position: relative;
+
+  &:not(a, button, input) {
+    border-bottom: 1px dotted;
+    text-decoration: none;
+    cursor: help;
+  }
+
+  &[data-placement="top"]::before,
+  &[data-placement="top"]::after,
+  &::before,
+  &::after {
+    display: block;
+    z-index: 99;
+    position: absolute;
+    bottom: 100%;
+    left: 50%;
+    padding: .25rem .5rem;
+    overflow: hidden;
+    transform: translate(-50%, -.25rem);
+    border-radius: var(--border-radius);
+    background: var(--tooltip-background-color);
+    content: attr(data-tooltip);
+    color: var(--tooltip-color);
+    font-style: normal;
+    font-weight: var(--font-weight);
+    font-size: .875rem;
+    text-decoration: none;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    opacity: 0;
+    pointer-events: none;
+  }
+  
+  // Caret
+  &[data-placement="top"]::after,
+  &::after {
+    padding: 0;
+    transform: translate(-50%, 0rem);
+    border-top: .3rem solid;
+    border-right: .3rem solid transparent;
+    border-left: .3rem solid transparent;
+    border-radius: 0;
+    background-color: transparent;
+    content: "";
+    color: var(--tooltip-background-color);
+  }
+
+  &[data-placement="bottom"] {
+    &::before,
+    &::after {
+      top: 100%;
+      bottom: auto;
+      transform: translate(-50%, .25rem);
+    }
+    
+    &:after{
+      transform: translate(-50%, -.3rem);
+      border: .3rem solid transparent;
+      border-bottom: .3rem solid;
+    }
+  }
+
+  &[data-placement="left"] {
+    &::before,
+    &::after {
+      top: 50%;
+      right: 100%;
+      bottom: auto;
+      left: auto;
+      transform: translate(-.25rem, -50%);
+    }
+    
+    &:after{
+      transform: translate(.3rem, -50%);
+      border: .3rem solid transparent;
+      border-left: .3rem solid;
+    }
+  }
+
+  &[data-placement="right"] {
+    &::before,
+    &::after {
+      top: 50%;
+      right: auto;
+      bottom: auto;
+      left: 100%;
+      transform: translate(.25rem, -50%);
+    }
+    
+    &:after{
+      transform: translate(-.3rem, -50%);
+      border: .3rem solid transparent;
+      border-right: .3rem solid;
+    }
+  }
+
+  // Display
+  &:focus,
+  &:hover {
+    &::before,
+    &::after {
+      opacity: 1;
+    }
+  }
+
+  
+  @if $enable-transitions {
+
+    // Animations, excluding touch devices
+    @media (hover: hover) and (pointer: fine) {
+      &[data-placement="bottom"]:focus,
+      &[data-placement="bottom"]:hover
+      &:focus,
+      &:hover {
+        &::before,
+        &::after {
+          animation-duration: .2s;
+          animation-name: tooltip-slide-top;
+        }
+
+        &::after {
+          animation-name: tooltip-caret-slide-top; 
+        }
+      }
+      
+      &[data-placement="bottom"] {
+        &:focus,
+        &:hover {
+          &::before,
+          &::after {
+            animation-duration: .2s;
+            animation-name: tooltip-slide-bottom;
+          }
+  
+          &::after {
+            animation-name: tooltip-caret-slide-bottom; 
+          }
+        }
+      }
+      
+      &[data-placement="left"] {
+        &:focus,
+        &:hover {
+          &::before,
+          &::after {
+            animation-duration: .2s;
+            animation-name: tooltip-slide-left;
+          }
+  
+          &::after {
+            animation-name: tooltip-caret-slide-left; 
+          }
+        }
+      }
+      
+      &[data-placement="right"] {
+        &:focus,
+        &:hover {
+          &::before,
+          &::after {
+            animation-duration: .2s;
+            animation-name: tooltip-slide-right;
+          }
+  
+          &::after {
+            animation-name: tooltip-caret-slide-right; 
+          }
+        }
+      }
+    }
+
+    @keyframes tooltip-slide-top {
+      from {
+        transform: translate(-50%, .75rem);
+        opacity: 0;
+      }
+      to {
+        transform: translate(-50%, -.25rem);
+        opacity: 1;
+      }
+    }
+    
+    @keyframes tooltip-caret-slide-top {
+      from {
+        opacity: 0;
+      }
+      50% {
+        transform: translate(-50%, -.25rem);
+        opacity: 0;
+      }
+      to {
+        transform: translate(-50%, 0rem);
+        opacity: 1;
+      }
+    }
+  
+    @keyframes tooltip-slide-bottom {
+      from {
+        transform: translate(-50%, -.75rem);
+        opacity: 0;
+      }
+      to {
+        transform: translate(-50%, .25rem);
+        opacity: 1;
+      }
+    }
+    
+    @keyframes tooltip-caret-slide-bottom {
+      from {
+        opacity: 0;
+      }
+      50% {
+        transform: translate(-50%, -.5rem);
+        opacity: 0;
+      }
+      to {
+        transform: translate(-50%, -.3rem);
+        opacity: 1;
+      }
+    }
+  
+    @keyframes tooltip-slide-left {
+      from {
+        transform: translate(.75rem, -50%);
+        opacity: 0;
+      }
+      to {
+        transform: translate(-.25rem, -50%);
+        opacity: 1;
+      }
+    }
+    
+    @keyframes tooltip-caret-slide-left {
+      from {
+        opacity: 0;
+      }
+      50% {
+        transform: translate(.05rem, -50%);
+        opacity: 0;
+      }
+      to {
+        transform: translate(.3rem, -50%);
+        opacity: 1;
+      }
+    }
+  
+    @keyframes tooltip-slide-right {
+      from {
+        transform: translate(-.75rem, -50%);
+        opacity: 0;
+      }
+      to {
+        transform: translate(.25rem, -50%);
+        opacity: 1;
+      }
+    }
+    
+    @keyframes tooltip-caret-slide-right {
+      from {
+        opacity: 0;
+      }
+      50% {
+        transform: translate(-.05rem, -50%);
+        opacity: 0;
+      }
+      to {
+        transform: translate(-.3rem, -50%);
+        opacity: 1;
+      }
+    }
+  }
+}

themes/ccchh/assets/sass/main.scss

@@ -128,6 +128,7 @@ body>main {
   line-height: 1.0em;
   max-width: 8em;
   padding: 5px;
+  white-space: nowrap;
 
   color: $roomstate_color_unknown;
 
@@ -144,7 +145,7 @@ body>main {
   }
 }
 
-// CCCHH Icon in Menu
+// CCCHH icon & hamburger menu in header
 @media only screen and (prefers-color-scheme: light) {
   .invert-on-light {
     filter: invert(1);
@@ -253,6 +254,167 @@ body>main {
   box-shadow: var(--card-box-shadow);
   padding: 0;
   margin: 0;
+
+  --main-header-content-height: calc(var(--font-size) * var(--line-height));
+
+  .container {
+    display: block flex;
+    position: relative;
+    flex-direction: row;
+    justify-content: start;
+    align-items: center;
+    column-gap: var(--spacing);
+  }
+
+  .menu-button,
+  .hamburger,
+  .in-nav-home {
+    // Don't display, when not in mobile mode.
+    display: none;
+  }
+
+  .menu {
+    // Set this to 100% to force the roomstate to "right-align".
+    width: 100%;
+  }
+
+  .ccchh-logo {
+    padding-top: var(--nav-element-spacing-vertical);
+    padding-bottom: var(--nav-element-spacing-vertical);
+
+    img {
+      height: var(--main-header-content-height);
+    }
+  }
+
+
+  // When the header content doesn't display nicely anymore, switch to mobile mode.
+  @import "../pico-1.5.11/scss/variables";
+
+  @media (max-width: map-get($breakpoints, md)) {
+    .hamburger-button {
+      display: unset;
+      position: absolute;
+      top: calc(var(--nav-element-spacing-vertical));
+      right: var(--spacing);
+      height: var(--main-header-content-height);
+      // To have an attempt at a good-looking cross, when converting the burger
+      // stack to one, set the width to the height / sin(45).
+      width: calc(var(--main-header-content-height) / 0.707106781);
+    }
+
+    .menu-button {
+      z-index: 3;
+      opacity: 0%;
+      border: 0;
+      margin: 0;
+    }
+
+    .hamburger {
+      display: flex;
+      flex-direction: column;
+      justify-content: space-between;
+
+      .hamburger-line {
+        height: 4px;
+        width: 100%;
+        background-color: white;
+      }
+    }
+
+    .in-nav-home {
+      display: unset;
+    }
+
+    // Don't display the menu per default in mobile mode.
+    .menu {
+      display: none;
+    }
+
+    .menu-button:checked~.menu {
+      display: unset;
+      position: fixed;
+      width: 100%;
+      height: 100%;
+      top: calc(var(--main-header-content-height) + (var(--nav-element-spacing-vertical) * 2) + 3px);
+      left: 0;
+      background-color: var(--background-color);
+
+      ul,
+      li {
+        display: block;
+        padding-top: calc(var(--nav-element-spacing-vertical) * 0.5);
+        padding-bottom: calc(var(--nav-element-spacing-vertical) * 0.5);
+      }
+
+      ul {
+        padding-left: var(--spacing);
+        padding-right: var(--spacing);
+      }
+
+      li {
+        padding-left: 0;
+        padding-right: 0;
+        border-bottom: 0.2em solid var(--muted-border-color);
+        display: flex;
+
+        // borrowed form pico css for li
+        margin-bottom: calc(var(--typography-spacing-vertical) * .25);
+      }
+
+      a {
+        flex-grow: 1;
+      }
+
+      .main-nav {
+        margin: auto;
+      }
+
+      // Use the media queries, which we need, from here:
+      @if map-get($breakpoints, "sm") {
+        @media (min-width: map-get($breakpoints, "sm")) {
+          ul {
+            padding-left: 0;
+            padding-right: 0;
+          }
+
+          .main-nav {
+            max-width: map-get($viewports, "sm");
+          }
+        }
+      }
+    }
+
+    .hamburger-line-top {
+      transform-origin: top right;
+      transition: all 0.4s ease-in-out;
+    }
+
+    .hamburger-line-middle {
+      transition: all 0.2s ease-in-out;
+    }
+
+    .hamburger-line-bottom {
+      transform-origin: bottom right;
+      transition: all 0.4s ease-in-out;
+    }
+
+    .menu-button:checked~.hamburger {
+      .hamburger-line-top {
+        // After some adjustments to make the cross look decent, rotate -45deg.
+        transform: translateX(-1.5px) translateY(-1.5px) rotate(-45deg);
+      }
+
+      .hamburger-line-middle {
+        transform: scaleY(0);
+      }
+
+      .hamburger-line-bottom {
+        // After some adjustments to make the cross look decent, rotate 45deg.
+        transform: translateX(-1.5px) translateY(1.5px) rotate(45deg);
+      }
+    }
+  }
 }
 
 

themes/ccchh/assets/sass/pico-ccchh.scss

@@ -0,0 +1,68 @@
+/*!
+ * Pico CSS v1.5.11 (https://picocss.com)
+ * Copyright 2019-2023 - Licensed under MIT
+ */
+
+// Config
+@import "../pico-1.5.11/scss/variables";
+
+// Theming
+@import "../pico-1.5.11/scss/themes/default";
+
+h1 {
+  --font-size: 2rem;
+  --typography-spacing-vertical: 1rem;
+}
+
+h2 {
+  --font-size: 1.75rem;
+  --typography-spacing-vertical: 0.875rem;
+}
+
+h3 {
+  --font-size: 1.5rem;
+  --typography-spacing-vertical: 0.75rem;
+}
+
+h4 {
+  --font-size: 1.25rem;
+  --typography-spacing-vertical: 0.625rem;
+}
+
+h5 {
+  --font-size: 1.125rem;
+  --typography-spacing-vertical: 0.5rem;
+}
+
+// Layout
+@import "../pico-1.5.11/scss/layout/document"; // html
+@import "../pico-1.5.11/scss/layout/sectioning"; // body, header, main, footer
+@import "../pico-1.5.11/scss/layout/container"; // .container, .container-fluid
+@import "../pico-1.5.11/scss/layout/section"; // section
+@import "../pico-1.5.11/scss/layout/grid"; // .grid
+@import "../pico-1.5.11/scss/layout/scroller"; // figure
+
+// Content
+@import "../pico-1.5.11/scss/content/typography"; // a, headings, p, ul, blockquote, ...
+@import "../pico-1.5.11/scss/content/embedded"; // audio, canvas, iframe, img, svg, video
+@import "../pico-1.5.11/scss/content/button"; // button, a[role=button], type=button, type=submit ...
+@import "../pico-1.5.11/scss/content/form"; // input, select, textarea, label, fieldset, legend
+@import "../pico-1.5.11/scss/content/form-checkbox-radio"; // type=checkbox, type=radio, role=switch
+@import "../pico-1.5.11/scss/content/form-alt-input-types"; // type=color, type=date, type=file, type=search, ...
+@import "../pico-1.5.11/scss/content/table"; // table, tr, td, ...
+@import "../pico-1.5.11/scss/content/code"; // pre, code, ...
+@import "../pico-1.5.11/scss/content/miscs"; // hr, template, [hidden], dialog, canvas
+
+// Components
+@import "../pico-1.5.11/scss/components/accordion"; // details, summary
+@import "../pico-1.5.11/scss/components/card"; // article
+@import "../pico-1.5.11/scss/components/modal"; // dialog
+@import "../pico-1.5.11/scss/components/nav"; // nav
+@import "../pico-1.5.11/scss/components/progress"; // progress
+@import "../pico-1.5.11/scss/components/dropdown"; // dropdown
+
+// Utilities
+// @import "../pico-1.5.11/scss/utilities/loading"; // aria-busy=true
+// @import "../pico-1.5.11/scss/utilities/tooltip"; // data-tooltip
+@import "../pico-1.5.11/scss/utilities/accessibility"; // -ms-touch-action, aria-*
+@import "../pico-1.5.11/scss/utilities/reduce-motion"; // prefers-reduced-motion

themes/ccchh/layouts/_default/rss.xml

@@ -61,6 +61,11 @@
     <item>
       <title>{{ .Title }}</title>
       <link>{{ .Permalink }}</link>
+      <author>{{ with .GetTerms "authors" }}
+        {{- range $i, $pageAuthor := . }}
+          {{- if $i }}, {{ end }}{{ .Title }}
+        {{- end }}
+      {{- end }}</author>
       <pubDate>{{ .PublishDate.Format "Mon, 02 Jan 2006 15:04:05 -0700" | safeHTML }}</pubDate>
       {{- with $authorEmail }}<author>{{ . }}{{ with $authorName }} ({{ . }}){{ end }}</author>{{ end }}
       <guid>{{ .Permalink }}</guid>

themes/ccchh/layouts/blog/single.html

@@ -8,11 +8,11 @@
     </section>
 
     <div class="meta">
-      {{- with .Params.publishDate }}
+      {{- with .PublishDate }}
       <small class="li-comma">Veröffentlicht: {{ .Format "2006-01-02 15:04" }}</small>
       {{- end }}
-      {{- if .Params.lastmod.After .Params.publishDate }}
-      {{- with .Params.lastmod }}
+      {{- if .Lastmod.After .PublishDate }}
+      {{- with .Lastmod }}
       <small class="li-comma">letzte Änderung: {{ .Format "2006-01-02 15:04" }}</small>
       {{- end }}
       {{- end }}

themes/ccchh/layouts/index.html

@@ -5,7 +5,8 @@
     </div>
 
     {{- $events := where (.Site.GetPage "blog").Pages ".Params.categories" "event" }}
-    {{- $upcoming := where $events ".Params.date" "ge" now }}
+    {{- $lookback := time.ParseDuration "-6h" }}
+    {{- $upcoming := where $events ".Params.date" "ge" (time.Now.Add $lookback) }}
     {{ if $upcoming }}
     <div class="announcements">
       <h2 id="neuigkeiten" class="on-hover-trg">Neuigkeiten <a href="#neuigkeiten" class="on-hover"><i class="fa-solid fa-link small"></i></a></h2>
@@ -18,6 +19,9 @@
         {{- else }}
           <p>{{ .Summary | safeHTML }}</p>
         {{- end }}
+        {{- if .Truncated }}
+          <p class="ellipsis"><a href="{{ .RelPermalink }}">mehr lesen</a></p>
+        {{- end }}
       </div>
       {{- end }}
     </div>
@@ -39,7 +43,11 @@
       {{- range $subsecs }}
       {{- $link := .Params.link }}
         <div class="wide">
+          {{- if eq $link nil }}
+          <h4>{{ .Title }}</h4>
+          {{- else }}
           <h4><a href="{{ $link }}">{{ .Title }}</a></h4>
+          {{- end }}
           {{- $img_path := printf "%s%s" $subsec_dir .Params.Image }}
           {{- with $home.Resources.Get $img_path }}
           <a href="{{ $link }}"><img class="groups-img" src="{{ .RelPermalink }}"></a>

themes/ccchh/layouts/partials/head.html

@@ -1,16 +1,25 @@
-{{- $options := dict "transpiler" "libsass" "targetPath" "css/style.css" -}}
+{{- $cssOptionsMain := dict "transpiler" "libsass" "targetPath" "css/style.css" -}}
+{{- $cssOptionsPico := dict "transpiler" "libsass" "targetPath" "css/pico.css" -}}
 {{- $jsResources := resources.Match "js/*.js" }}
 
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <meta charset="utf-8">
   {{- partial "robots.html" . -}}
-  {{- with resources.GetRemote "https://cdn.jsdelivr.net/npm/@picocss/pico@1/css/pico.min.css" }}
-  <link rel="stylesheet" href="{{ .RelPermalink }}" crossorigin="anonymous">
-  {{ end }}
-  {{ with resources.Get "sass/main.scss" | toCSS $options | minify | fingerprint -}}
+  <link rel="apple-touch-icon" sizes="180x180" href="{{ relURL "apple-touch-icon.png" }}">
+  <link rel="icon" type="image/png" sizes="32x32" href="{{ relURL "favicon-32x32.png" }}">
+  <link rel="icon" type="image/png" sizes="16x16" href="{{ relURL "favicon-16x16.png" }}">
+  <link rel="manifest" href="{{ relURL "site.webmanifest" }}">
+  <link rel="mask-icon" href="{{ relURL "safari-pinned-tab.svg" }}" color="#000000">
+  <meta name="msapplication-TileColor" content="#ffffff">
+  <meta name="theme-color" content="#ffffff">
+
+  {{ with resources.Get "sass/pico-ccchh.scss" | toCSS $cssOptionsPico | minify | fingerprint -}}
   <link rel="stylesheet" href="{{ .RelPermalink }}" integrity="{{ .Data.Integrity }}" crossorigin="anonymous">
   {{- end }}
-  <link rel="stylesheet" href="{{ .Site.BaseURL }}thirdparty/fontawesome6/css/all.min.css" crossorigin="anonymous">
+  {{ with resources.Get "sass/main.scss" | toCSS $cssOptionsMain | minify | fingerprint -}}
+  <link rel="stylesheet" href="{{ .RelPermalink }}" integrity="{{ .Data.Integrity }}" crossorigin="anonymous">
+  {{- end }}
+  <link rel="stylesheet" href="{{ relURL "thirdparty/fontawesome6/css/all.min.css" }}" crossorigin="anonymous">
 
   {{- range $jsResources }}
   {{- with . | js.Build | minify | fingerprint }}
@@ -23,4 +32,3 @@
   {{- end }}
 
   <title>{{ .Title }}</title>
-  <!-- TODO: Favicon -->

themes/ccchh/layouts/partials/header.html

@@ -1,8 +1,21 @@
 
   <header class="main-header header">
     <div class="container">
+      {{ $image := resources.Get "images/logo.svg" }}
+      <a href="{{ .Site.Home.RelPermalink }}" class="ccchh-logo">
+        <img src="{{ $image.RelPermalink }}" class="invert-on-light" alt="CCCHH Icon">
+      </a>
+      <input class="menu-button hamburger-button" type="checkbox">
+      <div class="hamburger hamburger-button invert-on-light">
+        <div class="hamburger-line hamburger-line-top"></div>
+        <div class="hamburger-line hamburger-line-middle"></div>
+        <div class="hamburger-line hamburger-line-bottom"></div>
+      </div>
       <nav class="menu">
       {{- partial "menu.html" (dict "menuID" "main" "page" . ) -}}
       </nav>
+      <div class="roomstate" id="roomstate">
+        <span class="state">unbekannt</span><br><span class="duration">(seit&nbsp;)</span>
+      </div>
     </div>
   </header>

themes/ccchh/layouts/partials/menu.html

@@ -2,10 +2,9 @@
 {{- $menuID := .menuID -}}
 {{- $menuContent := index site.Menus .menuID -}}
 
-    <ul>
+    <ul class="main-nav">
       {{- if compare.Eq $menuID "main" -}}
-      {{- $image := resources.Get "images/logo.svg" }}
-      <li><a href="/{{ .Site.Home.URL }}"><img src="{{ $image.RelPermalink }}" class="invert-on-light" width="150px" alt="CCCHH Icon"></a></li>
+      <li><a href="/{{ .Site.Home.RelPermalink }}" class="in-nav-home">Home</a></li>
       {{- end }}
       {{- range $menuContent }}
       <li>
@@ -22,10 +21,3 @@
         >{{ or (T .Identifier) .Name | safeHTML }}</a></li>
       {{- end }}
     </ul>
-    {{ if compare.Eq $menuID "main" -}}
-    <ul>
-      <li class="roomstate" id="roomstate">
-        <span class="state">unbekannt</span><br><span class="duration">(seit&nbsp;)</span>
-      </li>
-    </ul>
-    {{- end -}}

themes/ccchh/layouts/partials/robots.html

@@ -1,5 +1,5 @@
 {{  $robotsGenerate := false -}}
-{{- if or (isset $.Params.robots "index") (isset $.Params.robots "follow") }}
+{{- if and (isset $.Params "robots") (or (isset $.Params.robots "index") (isset $.Params.robots "follow")) }}
 {{-     $robotsGenerate = true -}}
 {{- else if or (isset $.Site.Params.robots "index") (isset $.Site.Params.robots "follow") -}}
 {{-     $robotsGenerate = true -}}

themes/ccchh/layouts/shortcodes/calendar-table.html

@@ -12,9 +12,18 @@
     {{- if eq ._type "vevent"}}
     <tr>
       {{- $start := time .dtstart }}
-      <td style="font-variant-numeric: tabular-nums;">{{ $start.Local.Format "Mon, 2006-01-02 15:04" }}</td>
+      <td style="font-variant-numeric: tabular-nums;">{{ time.Format "Mon, 2006-01-02 15:04" $start.Local }}</td>
+      {{- $potentialUrl := index (findRE `https?://\S*` .description 1) 0 }}
+      {{- if eq $potentialUrl nil }}
       <td>{{ .summary }}</td>
+      {{- else }}
+      <td><a href="{{ $potentialUrl }}">{{ .summary }}</a></td>
+      {{- end }}
+      {{- if eq .location "Z9" }}
+      <td><a href="https://wiki.hamburg.ccc.de/club:z9:start">Z9</a></td>
+      {{- else }}
       <td>{{ .location }}</td>
+      {{- end }}
     </tr>
     {{- end }}
   {{- end }}

themes/ccchh/static/browserconfig.xml

@@ -0,0 +1,9 @@
+<?xml version="1.0" encoding="utf-8"?>
+<browserconfig>
+    <msapplication>
+        <tile>
+            <square150x150logo src="/mstile-150x150.png" />
+            <TileColor>#ffffff</TileColor>
+        </tile>
+    </msapplication>
+</browserconfig>

themes/ccchh/static/safari-pinned-tab.svg

@@ -0,0 +1,228 @@
+<?xml version="1.0" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN"
+ "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
+<svg version="1.0" xmlns="http://www.w3.org/2000/svg"
+ width="1310.000000pt" height="1310.000000pt" viewBox="0 0 1310.000000 1310.000000"
+ preserveAspectRatio="xMidYMid meet">
+<metadata>
+Created by potrace 1.14, written by Peter Selinger 2001-2017
+</metadata>
+<g transform="translate(0.000000,1310.000000) scale(0.100000,-0.100000)"
+fill="#000000" stroke="none">
+<path d="M2678 11245 c-2 -3 -85 -7 -183 -10 -185 -6 -307 -10 -500 -20 -60
+-3 -157 -7 -215 -10 -97 -4 -209 -10 -400 -20 -41 -3 -118 -7 -170 -9 -52 -3
+-133 -7 -180 -10 -47 -3 -125 -8 -175 -11 -385 -21 -438 -26 -474 -41 -44 -18
+-75 -53 -117 -128 -30 -56 -96 -235 -108 -296 -3 -14 -16 -79 -30 -145 -13
+-66 -27 -138 -31 -160 -3 -22 -8 -53 -11 -70 -3 -16 -7 -46 -9 -65 -2 -19 -4
+-35 -5 -35 -1 0 -3 -22 -5 -50 -2 -27 -4 -50 -5 -50 -1 0 -4 -20 -5 -45 -2
+-25 -4 -45 -5 -45 -1 0 -3 -18 -5 -40 -2 -22 -6 -74 -10 -115 -3 -41 -8 -97
+-10 -125 -20 -245 -26 -753 -12 -1080 17 -417 31 -689 42 -815 3 -36 8 -99 11
+-140 3 -41 7 -91 9 -110 2 -19 6 -64 9 -100 3 -36 10 -96 16 -135 5 -38 12
+-90 16 -115 10 -73 11 -81 28 -175 28 -162 61 -298 96 -390 12 -33 24 -69 28
+-80 7 -25 65 -123 90 -151 25 -29 65 -54 98 -60 16 -3 102 -7 192 -8 89 -2
+165 -6 168 -9 3 -3 17 -2 30 3 14 6 26 6 29 0 4 -7 13 -6 26 0 10 6 19 7 19 2
+0 -4 753 -8 1673 -9 919 0 1845 -4 2057 -8 856 -14 984 -14 1095 5 100 17 186
+50 230 88 32 28 65 98 80 168 2 10 11 47 20 81 9 35 18 71 20 80 2 10 12 54
+24 98 11 44 22 91 25 105 2 14 14 72 26 130 12 58 23 123 25 145 2 22 4 40 5
+40 4 0 10 46 13 103 2 34 6 64 8 66 6 7 2 130 -6 173 -16 88 -62 126 -148 124
+-94 -2 -144 -45 -165 -146 -11 -49 -15 -77 -27 -200 -4 -33 -8 -67 -10 -75 -3
+-8 -7 -28 -10 -45 -14 -82 -30 -142 -62 -235 -32 -94 -56 -141 -101 -201 -37
+-49 -100 -101 -139 -113 -52 -16 -118 -28 -170 -30 -24 0 -43 -3 -43 -6 0 -3
+-21 -6 -48 -6 -79 -2 -327 -13 -327 -14 0 -6 -532 -10 -1315 -9 -973 0 -1887
+-1 -2255 -4 -115 0 -237 2 -270 6 -250 27 -407 108 -503 260 -21 34 -41 71
+-45 82 -3 11 -17 52 -32 90 -14 39 -26 72 -27 75 0 3 -2 10 -3 15 -2 6 -5 19
+-8 30 -3 11 -15 56 -27 100 -12 44 -23 85 -24 90 -4 15 -17 77 -21 100 -2 11
+-4 21 -5 23 -4 4 -6 16 -15 77 -9 63 -11 73 -14 78 -2 2 -10 50 -16 102 -2 17
+-4 30 -5 30 -1 0 -3 17 -15 140 -13 132 -14 145 -21 275 -17 275 -2 1452 20
+1590 3 19 8 67 11 105 3 39 7 77 10 85 2 8 6 31 9 50 18 114 46 231 59 248 5
+6 7 12 4 12 -12 0 74 213 93 230 3 3 17 23 31 45 54 83 135 147 227 179 46 17
+86 23 182 31 36 3 94 7 130 10 163 13 193 16 201 21 5 3 9 0 9 -6 0 -6 5 -8
+11 -4 12 7 51 11 194 18 44 3 80 5 80 6 0 0 41 3 90 5 50 3 135 7 190 10 141
+8 268 14 430 20 77 3 187 8 245 10 58 3 247 8 420 11 173 3 333 7 355 8 22 1
+46 -3 53 -8 6 -5 12 -5 12 0 0 13 103 12 112 -1 5 -7 8 -7 8 0 0 12 358 14
+378 2 6 -5 12 -5 12 0 0 4 33 7 72 6 40 -2 163 -5 273 -8 321 -9 457 -16 730
+-40 44 -4 96 -9 115 -11 19 -3 54 -7 78 -9 24 -3 56 -7 70 -10 15 -3 43 -8 62
+-11 48 -7 65 -11 152 -30 15 -3 29 -5 30 -4 7 2 117 -39 153 -58 79 -40 159
+-150 180 -247 22 -99 31 -167 40 -294 3 -31 7 -73 9 -95 10 -78 46 -156 71
+-156 7 0 15 -4 17 -10 5 -14 177 -18 223 -6 29 9 40 18 46 39 4 15 3 29 -2 33
+-5 3 -7 9 -4 15 14 21 -2 343 -19 389 -3 8 -7 33 -10 55 -9 85 -60 254 -106
+353 -17 35 -30 67 -30 72 0 6 -3 10 -8 10 -4 0 -16 15 -26 34 -19 36 -78 100
+-111 122 -12 8 -36 16 -55 19 -19 2 -46 7 -60 9 -14 3 -45 7 -70 10 -25 3 -63
+8 -85 11 -37 5 -54 8 -137 20 -18 2 -55 6 -83 9 -27 3 -70 8 -95 11 -25 3 -74
+7 -110 10 -36 3 -87 8 -115 10 -84 8 -197 16 -265 20 -164 9 -221 14 -230 20
+-6 3 -10 1 -10 -5 0 -6 -4 -9 -9 -6 -10 6 -104 12 -351 22 -167 7 -1566 14
+-1572 9z"/>
+<path d="M4248 10747 c-1 -21 -3 -34 -8 -49 -4 -14 -6 -23 -15 -83 -21 -151
+-28 -243 -28 -415 0 -145 5 -220 18 -280 3 -14 8 -38 10 -53 9 -50 47 -117 81
+-145 62 -51 293 -156 414 -188 138 -36 268 -60 425 -80 197 -24 656 -24 1140
+1 28 2 156 6 285 9 267 8 378 12 570 22 270 15 710 9 890 -11 89 -10 310 -48
+348 -59 9 -3 28 -7 42 -10 100 -20 252 -76 361 -132 110 -56 134 -69 139 -74
+3 -3 21 -17 40 -30 59 -42 72 -52 152 -131 54 -53 78 -84 78 -100 0 -52 -12
+-52 -108 -6 -49 25 -103 49 -119 55 -15 6 -54 22 -85 35 -32 14 -58 22 -58 20
+0 -3 -7 0 -15 7 -8 7 -15 9 -15 5 0 -4 -6 -3 -12 3 -7 5 -33 16 -58 23 -56 16
+-52 14 -70 22 -15 7 -212 58 -280 73 -19 4 -676 9 -1460 10 -1556 2 -2209 9
+-2490 29 -228 16 -223 16 -269 39 -72 38 -318 262 -437 400 -89 102 -168 203
+-273 346 -22 30 -44 60 -48 65 -5 6 -20 26 -33 45 -13 19 -30 41 -37 48 -6 6
+-14 21 -18 31 -3 11 -12 22 -20 25 -8 3 -15 10 -15 15 0 8 -66 104 -108 156
+-4 6 -23 33 -42 60 -19 28 -40 55 -46 60 -6 6 -24 28 -40 50 -16 22 -33 45
+-39 51 -11 13 -74 89 -90 110 -7 9 -51 15 -135 19 -69 3 -142 6 -162 8 -21 1
+-38 0 -38 -3 0 -3 11 -17 25 -32 14 -15 25 -30 25 -34 0 -6 26 -38 79 -99 9
+-11 45 -56 78 -100 33 -44 69 -90 79 -102 45 -51 54 -64 54 -72 0 -5 4 -11 9
+-13 4 -1 52 -59 105 -128 53 -69 107 -137 119 -152 12 -14 33 -41 47 -59 14
+-18 41 -49 60 -68 20 -20 67 -74 105 -121 39 -47 73 -86 78 -88 4 -2 7 -8 7
+-14 0 -5 6 -15 13 -23 6 -7 21 -25 32 -40 18 -25 94 -126 113 -150 61 -79 88
+-110 152 -177 86 -92 181 -166 260 -204 79 -38 105 -44 200 -49 47 -2 130 -7
+185 -10 208 -11 533 -25 745 -31 433 -12 1200 -24 1777 -27 189 -1 343 -6 343
+-11 0 -5 6 -4 13 1 14 11 57 11 75 0 6 -5 12 -4 12 1 0 10 42 8 59 -3 6 -3 11
+-2 11 4 0 7 8 7 23 2 14 -5 30 -5 40 0 9 6 17 6 17 2 0 -4 125 -9 278 -10 464
+-2 692 -10 798 -28 222 -37 388 -104 482 -194 36 -34 102 -126 102 -141 0 -5
+-30 2 -67 15 -65 23 -134 43 -178 51 -11 2 -74 15 -140 29 -66 13 -133 27
+-150 30 -31 7 -95 10 -434 19 -112 3 -206 7 -208 10 -3 3 -16 1 -29 -4 -13 -5
+-24 -6 -24 -2 0 4 -55 8 -123 9 -67 0 -214 4 -327 7 -238 7 -270 7 -282 0 -4
+-3 -8 -2 -8 3 0 4 -84 9 -188 10 -103 0 -367 4 -587 9 -517 9 -1658 9 -1890 0
+-193 -8 -230 -11 -315 -20 -86 -10 -103 -13 -132 -25 -16 -6 -28 -8 -28 -5 0
+4 -7 1 -15 -6 -8 -7 -15 -10 -15 -6 0 3 -24 -4 -52 -15 -29 -12 -59 -22 -65
+-22 -7 0 -13 -4 -13 -9 0 -4 -5 -8 -11 -8 -38 0 -361 -312 -549 -529 -30 -35
+-60 -69 -66 -75 -10 -11 -244 -303 -288 -359 -11 -15 -26 -33 -31 -40 -6 -7
+-35 -46 -65 -87 -30 -41 -58 -79 -62 -85 -38 -49 -100 -134 -133 -181 -22 -31
+-46 -62 -52 -70 -7 -7 -13 -15 -13 -19 0 -3 -5 -11 -10 -18 -25 -28 -200 -279
+-203 -288 -1 -8 46 -11 147 -11 l149 1 24 28 c14 15 39 44 56 63 56 62 132
+153 191 230 31 41 68 89 81 105 14 17 76 100 139 185 316 428 484 614 716 793
+39 30 128 85 148 91 12 4 22 12 22 17 0 5 3 8 8 7 4 -1 16 3 27 9 33 18 141
+62 166 67 13 3 48 12 77 20 56 16 112 26 172 32 83 8 451 0 468 -10 6 -3 13
+-2 17 4 4 6 11 7 17 4 11 -7 342 -15 710 -17 126 -1 228 -6 228 -10 0 -5 5 -5
+12 -1 16 10 139 11 145 1 3 -4 10 -4 17 2 6 6 18 6 25 2 8 -5 26 -5 42 -1 15
+5 30 6 33 3 3 -3 303 -7 668 -9 1057 -7 1334 -10 1345 -17 7 -4 14 -4 17 1 5
+9 210 8 341 -3 211 -16 381 -74 514 -174 47 -35 52 -48 18 -42 -4 1 -58 4
+-120 7 -62 3 -155 8 -207 11 -119 6 -1732 11 -1743 5 -8 -4 -217 -9 -562 -12
+-82 -1 -258 2 -390 5 -265 8 -776 13 -787 7 -5 -2 -61 -5 -125 -8 -153 -7
+-302 -19 -357 -30 -11 -2 -36 -6 -56 -9 -38 -6 -70 -12 -110 -20 -14 -3 -34
+-7 -45 -9 -43 -9 -161 -48 -170 -57 -5 -5 -15 -9 -23 -9 -8 0 -45 -20 -82 -45
+-54 -36 -73 -56 -97 -102 -30 -57 -48 -104 -57 -153 -33 -165 -35 -192 -41
+-400 -3 -96 -7 -181 -10 -187 -2 -7 -1 -13 3 -13 4 0 8 -21 8 -47 1 -48 12
+-197 18 -243 2 -14 4 -32 5 -42 2 -25 103 -38 181 -23 32 6 67 48 82 100 12
+39 15 230 4 290 -6 35 -19 213 -19 265 0 43 15 159 23 175 3 6 3 6 14 55 5 19
+11 40 14 45 4 6 7 15 8 22 7 41 81 103 134 111 34 4 65 10 65 12 0 1 18 3 40
+5 44 5 107 13 145 19 23 4 94 12 185 21 163 16 175 17 365 30 157 10 466 17
+750 18 278 0 475 -3 1175 -20 318 -7 1029 -9 1222 -2 113 3 124 2 149 -18 23
+-18 25 -26 20 -55 -26 -121 -4 -149 155 -202 44 -15 142 -41 189 -50 14 -3 36
+-7 49 -10 104 -23 382 -24 501 -2 14 2 48 8 75 12 28 4 52 8 55 9 12 3 67 16
+85 20 11 2 35 8 53 14 18 5 33 10 35 10 1 0 9 2 17 5 8 3 49 17 91 30 110 36
+237 90 379 161 171 86 214 109 220 116 3 4 23 16 45 28 59 32 98 55 110 64 28
+22 230 147 237 147 16 0 7 -19 -34 -72 -85 -107 -335 -338 -367 -338 -6 0 -11
+-4 -11 -8 0 -5 -12 -15 -27 -23 -16 -8 -30 -17 -33 -20 -22 -24 -251 -144
+-335 -174 -27 -10 -54 -22 -60 -26 -8 -5 -79 -29 -135 -44 -3 -1 -12 -5 -20
+-8 -23 -9 -260 -65 -300 -71 -19 -2 -44 -7 -56 -9 -11 -3 -41 -6 -65 -8 -24
+-1 -48 -4 -52 -7 -5 -2 -52 -6 -105 -8 -53 -3 -108 -7 -122 -10 -14 -3 -38 -7
+-55 -9 -58 -8 -90 -16 -134 -36 -44 -19 -101 -72 -101 -93 1 -34 159 -119 262
+-141 59 -12 300 -14 353 -2 11 3 40 8 65 12 55 9 63 10 123 24 26 6 64 14 84
+17 20 3 47 10 60 15 13 5 23 6 23 4 0 -2 12 0 28 6 15 6 36 12 46 15 26 5 89
+25 101 33 6 3 17 6 25 8 8 1 23 6 35 12 11 5 43 20 70 32 117 51 232 113 316
+170 32 21 61 39 64 39 4 0 13 6 20 13 8 6 20 17 27 22 134 104 253 214 323
+300 17 20 35 42 42 49 24 26 121 183 152 243 30 60 79 195 87 240 3 18 -1 24
+-23 29 -35 7 -76 26 -85 39 -11 15 -1 90 17 124 8 17 15 32 14 33 0 2 4 16 10
+31 19 50 24 103 11 128 -49 91 -117 93 -177 5 -15 -23 -30 -43 -33 -46 -3 -3
+-17 -23 -31 -45 -32 -50 -76 -76 -90 -55 -8 14 -29 77 -35 108 -1 8 -6 21 -10
+30 -4 9 -8 24 -10 33 -12 60 -70 265 -96 337 -68 195 -139 295 -272 387 -48
+33 -59 37 -80 27 -14 -6 -30 -28 -40 -54 l-17 -44 39 -84 c78 -170 155 -360
+146 -360 -4 0 -2 -6 4 -12 13 -17 86 -260 97 -323 2 -11 6 -30 8 -41 3 -12 8
+-37 11 -55 3 -19 10 -56 15 -82 8 -46 7 -51 -23 -90 -36 -48 -96 -82 -129 -73
+-19 4 -26 21 -46 98 -25 95 -76 251 -106 323 -29 67 -94 209 -104 225 -6 8
+-20 35 -32 60 -13 25 -49 89 -81 143 -32 55 -58 101 -58 103 0 2 -22 39 -50
+82 -27 43 -50 84 -50 90 0 5 -3 12 -8 14 -4 2 -29 39 -56 83 -39 65 -64 92
+-131 145 -113 88 -169 115 -226 114 -53 -2 -93 -19 -83 -37 4 -7 43 -69 88
+-139 45 -70 92 -145 106 -167 14 -22 76 -119 138 -216 61 -97 112 -178 112
+-181 0 -3 8 -18 18 -32 68 -98 259 -492 245 -506 -4 -3 -2 -6 4 -6 6 0 13 -12
+16 -27 3 -16 11 -41 17 -58 6 -16 11 -31 11 -33 -1 -1 5 -17 13 -35 7 -19 22
+-71 31 -116 l18 -83 -43 -39 c-23 -21 -48 -39 -55 -39 -18 0 -61 42 -79 79 -9
+17 -15 31 -12 31 12 0 -122 352 -136 358 -5 2 -8 12 -8 23 0 10 -4 19 -10 19
+-5 0 -10 9 -10 19 0 11 -3 21 -7 23 -5 2 -19 26 -33 53 -32 65 -83 149 -92
+153 -5 2 -8 8 -8 13 0 12 -71 123 -82 127 -4 2 -8 8 -8 13 0 8 -58 97 -70 109
+-3 3 -17 21 -30 40 -13 19 -29 40 -35 47 -30 35 -35 43 -35 48 0 4 -61 85
+-133 175 -7 8 -49 61 -94 118 -78 97 -148 157 -247 211 -48 26 -96 26 -133 -1
+-33 -25 -32 -38 6 -77 22 -24 93 -110 110 -135 8 -12 18 -23 21 -26 12 -9 237
+-295 299 -380 34 -47 69 -93 77 -103 8 -9 14 -20 14 -24 0 -3 7 -15 17 -25 9
+-10 21 -27 27 -37 6 -11 37 -60 69 -110 68 -108 143 -242 153 -273 4 -13 10
+-25 13 -28 12 -8 94 -210 88 -216 -2 -3 -1 -21 3 -40 4 -18 4 -34 0 -34 -5 0
+-5 -12 -1 -27 4 -16 4 -39 0 -53 -5 -17 -7 -19 -8 -7 -1 10 -17 49 -35 87 -19
+39 -32 70 -28 70 4 0 3 4 -3 8 -5 4 -27 41 -47 82 -50 101 -91 174 -100 178
+-5 2 -8 10 -8 18 0 8 -4 14 -10 14 -5 0 -10 5 -10 11 0 9 -100 162 -137 209
+-155 198 -174 220 -293 340 -89 89 -105 101 -235 167 -77 39 -169 81 -205 93
+-36 13 -69 27 -75 30 -5 4 -57 22 -115 39 -58 18 -112 35 -120 38 -8 3 -19 7
+-25 7 -23 3 -131 28 -145 33 -8 3 -25 7 -37 9 -11 1 -59 9 -105 18 -45 8 -107
+18 -137 21 -30 4 -62 8 -72 10 -44 9 -206 22 -394 32 -234 12 -1059 4 -1083
+-11 -6 -3 -13 -2 -17 4 -4 6 -11 8 -16 5 -28 -18 -1204 -22 -1204 -5 0 1 -27
+3 -60 5 -130 8 -256 22 -370 40 -16 3 -42 7 -58 9 -38 6 -106 42 -144 76 -87
+78 -117 175 -115 370 1 74 4 149 6 165 8 48 8 236 1 280 -4 22 -11 47 -16 56
+-4 9 -6 19 -3 22 3 3 -47 5 -110 6 -113 0 -116 -1 -118 -22z"/>
+<path d="M11418 8187 c-21 -19 -79 -107 -124 -187 -12 -21 -19 -31 -105 -150
+-34 -47 -65 -87 -68 -90 -3 -3 -26 -30 -51 -60 -113 -140 -291 -314 -425 -416
+-54 -41 -166 -119 -185 -127 -8 -4 -31 -17 -50 -29 -50 -30 -168 -88 -180 -88
+-5 0 -10 -4 -10 -8 0 -5 -6 -9 -13 -9 -6 0 -42 -12 -79 -26 -36 -15 -71 -27
+-78 -27 -6 0 -29 -9 -52 -21 -86 -44 -163 -59 -373 -74 -86 -7 -99 -8 -184
+-26 -65 -13 -151 -47 -151 -60 0 -5 -6 -9 -14 -9 -31 0 -20 -28 31 -77 30 -29
+61 -53 69 -53 8 0 14 -3 14 -8 0 -6 111 -54 135 -58 6 0 15 -2 20 -4 27 -8
+255 -5 255 4 0 5 2 7 5 4 3 -3 35 1 71 8 35 8 78 16 94 19 16 3 42 10 57 16
+15 6 37 13 47 15 11 2 58 15 105 29 47 13 95 26 106 29 57 11 85 19 85 25 0 4
+16 13 35 21 19 8 35 17 35 22 0 4 5 8 10 8 10 0 199 125 210 139 3 3 22 19 42
+34 73 54 223 196 303 288 96 108 235 297 235 318 0 6 5 11 10 11 6 0 10 4 10
+9 0 7 32 67 60 111 9 14 73 149 75 160 1 3 6 16 12 30 10 22 19 47 49 125 4
+11 8 25 9 30 1 6 3 13 5 18 1 4 4 12 5 17 1 6 3 11 5 13 1 1 4 15 6 31 3 16 9
+37 14 46 7 13 4 22 -9 34 -24 22 -44 20 -73 -7z"/>
+<path d="M11472 7653 c-96 -172 -87 -157 -146 -254 -25 -42 -46 -82 -46 -88 0
+-6 -4 -11 -9 -11 -5 0 -14 -13 -21 -30 -7 -16 -16 -30 -20 -30 -4 0 -10 -8
+-13 -17 -4 -15 -128 -199 -165 -244 -98 -122 -139 -167 -212 -240 -86 -84
+-217 -189 -266 -211 -13 -6 -24 -15 -24 -20 0 -4 -9 -8 -19 -8 -11 0 -21 -4
+-23 -8 -4 -10 -163 -79 -198 -86 -14 -3 -40 -9 -58 -15 -18 -5 -35 -10 -37
+-10 -3 -1 -6 -1 -7 -2 -22 -4 -100 -11 -163 -12 l-80 -3 -3 -44 c-3 -43 -1
+-46 41 -72 72 -46 117 -58 252 -72 11 -1 24 0 28 2 5 2 32 5 62 7 29 1 57 5
+62 8 4 3 26 8 48 12 44 7 53 9 75 17 8 3 51 18 95 33 83 29 285 125 305 145 3
+3 32 23 65 45 74 49 244 218 309 305 53 71 145 219 147 235 1 6 9 21 18 35 10
+14 30 54 45 90 15 36 34 79 41 95 7 17 18 48 25 70 6 22 14 47 17 55 4 8 7 18
+8 23 2 4 3 8 4 10 2 1 5 13 7 27 3 14 9 27 14 28 6 2 8 7 6 11 -4 6 1 33 18
+101 31 118 30 148 -10 216 -21 37 -46 53 -79 54 -6 0 -48 -66 -93 -147z"/>
+<path d="M11384 6577 c-6 -7 -57 -55 -114 -107 -57 -52 -118 -109 -137 -127
+l-33 -31 35 -39 c19 -21 54 -64 77 -95 23 -32 46 -58 50 -58 5 0 8 -4 8 -10 0
+-8 56 -96 70 -110 3 -3 12 -18 20 -35 8 -16 18 -32 21 -35 32 -25 207 -439
+194 -460 -3 -5 -1 -11 5 -15 5 -3 10 -16 10 -29 0 -12 5 -27 12 -34 7 -7 9
+-12 6 -12 -3 0 -1 -21 4 -47 28 -140 36 -239 33 -408 -2 -170 -8 -257 -19
+-294 -3 -9 -8 -29 -11 -46 -5 -32 -12 -62 -21 -97 -8 -32 -14 -67 -19 -108 -3
+-19 -14 -60 -26 -90 -11 -30 -23 -63 -26 -72 -3 -10 -9 -18 -14 -18 -5 0 -9
+-5 -9 -12 0 -20 -80 -121 -152 -190 -39 -38 -112 -99 -163 -138 -87 -65 -93
+-72 -99 -113 -7 -44 -12 -75 -21 -124 -14 -75 -17 -103 -12 -103 37 0 247 129
+342 210 28 24 159 156 181 182 80 98 191 292 237 415 31 81 40 106 42 113 15
+48 37 123 41 141 17 73 33 157 40 207 2 17 6 49 9 70 3 20 8 66 10 102 4 58 1
+92 -21 225 -15 92 -6 210 18 226 4 3 50 -5 100 -18 51 -12 109 -25 128 -28 19
+-3 42 -7 50 -10 8 -2 42 -7 75 -10 33 -4 74 -9 90 -11 42 -5 272 -4 315 1 91
+11 115 14 118 16 2 2 1 2 57 14 22 4 43 8 48 7 4 -1 7 2 7 6 0 4 9 8 19 9 11
+1 46 14 78 30 53 26 58 30 55 58 -5 53 -42 140 -73 173 -64 69 -167 83 -311
+44 -18 -5 -25 -6 -68 -15 -19 -4 -46 -10 -60 -13 -14 -3 -41 -8 -60 -11 -19
+-3 -53 -8 -75 -12 -76 -14 -198 -3 -285 26 -200 65 -369 221 -528 485 -55 92
+-141 258 -141 272 1 5 -3 12 -8 15 -4 3 -24 39 -43 79 -19 39 -37 72 -40 72
+-3 -1 -10 -6 -16 -13z"/>
+<path d="M10694 6100 c-135 -28 -140 -30 -160 -113 -36 -150 -114 -321 -220
+-483 -22 -33 -41 -64 -44 -69 -12 -25 -94 -140 -102 -143 -4 -2 -8 -10 -8 -18
+0 -8 -4 -14 -9 -14 -5 0 -13 -9 -16 -20 -3 -11 -12 -26 -18 -32 -11 -12 -109
+-158 -169 -253 -22 -36 -105 -203 -128 -260 -13 -33 -39 -118 -44 -150 -3 -17
+-8 -48 -12 -70 -9 -54 -11 -235 -3 -260 4 -11 12 -45 18 -75 18 -85 12 -83
+137 -58 l111 21 0 61 c0 62 9 160 18 206 3 14 7 37 10 51 9 52 56 204 67 216
+6 7 8 13 5 13 -6 0 21 60 75 165 33 64 134 228 161 261 8 10 39 51 68 89 29
+39 58 75 64 81 5 6 26 30 45 54 19 24 49 58 65 76 17 18 52 57 80 88 l50 55
+38 -77 c21 -43 40 -97 42 -122 2 -25 5 -45 6 -45 5 0 5 -381 0 -390 -3 -5 -7
+-30 -8 -55 -3 -48 -10 -105 -13 -105 -1 0 -3 -16 -5 -35 -2 -19 -6 -44 -8 -55
+-3 -11 -8 -40 -12 -65 -8 -53 -63 -287 -105 -450 -72 -281 -89 -353 -85 -361
+3 -4 1 -10 -4 -13 -5 -3 -12 -27 -16 -53 -5 -27 -10 -55 -12 -63 -2 -8 -5 -26
+-8 -40 -2 -14 -10 -63 -18 -110 -26 -145 -31 -228 -32 -445 0 -190 7 -316 20
+-370 2 -11 11 -51 19 -88 40 -181 134 -378 232 -483 25 -27 51 -56 57 -64 41
+-53 230 -180 267 -180 31 0 60 35 60 73 0 19 3 36 6 39 3 3 7 37 9 75 l4 68
+-63 65 c-97 101 -178 236 -226 379 -22 65 -42 137 -45 166 -2 11 -7 38 -13 60
+-6 22 -13 56 -16 75 -10 74 -18 127 -26 168 -4 24 -6 63 -5 85 5 64 14 139 21
+167 3 14 7 36 9 50 2 14 4 27 5 30 1 3 2 8 2 11 -1 8 24 149 38 214 16 79 18
+88 24 130 4 22 9 48 12 57 11 36 35 163 37 196 0 6 3 12 6 12 3 0 7 10 8 23 2
+32 11 85 23 137 5 25 12 59 15 75 2 17 9 55 15 85 6 30 13 71 16 90 3 19 7 46
+10 60 2 14 7 45 10 70 3 25 7 56 10 70 2 14 7 50 9 80 3 30 8 66 10 80 9 51
+19 240 19 365 0 173 -10 313 -30 425 -3 19 -7 45 -9 57 -2 11 -6 29 -9 40 -3
+10 -8 32 -11 49 -4 29 -57 198 -72 234 -3 8 -7 20 -8 26 -7 31 -80 174 -89
+175 -54 6 -82 4 -152 -11z"/>
+</g>
+</svg>

themes/ccchh/static/site.webmanifest

@@ -0,0 +1,19 @@
+{
+    "name": "",
+    "short_name": "",
+    "icons": [
+        {
+            "src": "/android-chrome-192x192.png",
+            "sizes": "192x192",
+            "type": "image/png"
+        },
+        {
+            "src": "/android-chrome-512x512.png",
+            "sizes": "512x512",
+            "type": "image/png"
+        }
+    ],
+    "theme_color": "#ffffff",
+    "background_color": "#ffffff",
+    "display": "standalone"
+}