feat: Improve dark mode

assets/sass/_variables.scss

@@ -39,15 +39,17 @@ html {
   --highlight-color-tip: #C4F2FF;
   --highlight-color-inofficial: #F0F3F5;
   --highlight-color-important: #FFE3D9;
+  --border: .1rem solid transparent;
+  --pagefind-ui-font: roboto,Arial,Helvetica,sans-serif;
 }
 
 html[data-theme="dark"] {
   --pagefind-ui-text: #fff;
   --link-default: #FF6B3D;
   --link-hovered: #FF8A5B;
   --link-special: #FFFFFF;
-  --bg-default: #1a1a1a;
-  --bg-neutral: #2d2d2d;
+  --bg-default: #151b23;
+  --bg-neutral: #0d1117;
   --bg-accent: #86761a;
   --bg-accent2: #DABA00;
   --bg-accent3: #fff284;
@@ -61,4 +63,5 @@ html[data-theme="dark"] {
   --highlight-color-tip: #1A4A5C;
   --highlight-color-inofficial: #2A2D30;
   --highlight-color-important: #4A2A1A;
+  --border: .1rem solid #3d444d;
 }

assets/sass/anchorlink.scss

@@ -15,19 +15,29 @@
 }
 
 .o-divider {
-  display: block;
-  width: 100%;
+  display: grid;
+  grid-template-columns: 7fr 1fr 7fr;
   margin: 2rem 0;
-  background-image: url("/intersector.svg");
-  background-position: center;
-  background-repeat: no-repeat;
   height: 2.4rem;
-  opacity: 50%;
+  opacity: 66%;
   border: 0;
+  overflow: hidden;
+  align-items: center;
+
+  hr {
+    color: var(--link-default);
+    border-width: 2px;
+    opacity: 1;
+  }
 
   @media print {
     margin: 0;
   }
+
+  svg {
+    min-width: 37px;
+    margin: 0 .5rem;
+  }
 }
 
 .a-anchorlink__link {

assets/sass/expander.scss

@@ -32,6 +32,7 @@ details {
   background-color: var(--bg-neutral);
   border-radius: var(--border-radius-m);
   margin-bottom: 1.2rem;
+  border: var(--border);
 }
 
 details[open] > .o-expander__summary {

assets/sass/navigation.scss

@@ -1,4 +1,3 @@
-
 .o-header {
   position: sticky;
   width: 100%;
@@ -8,6 +7,7 @@
   z-index: 5;
   height: 6rem;
   padding-left: calc((100vw - 100%) / 2);
+  border-bottom: var(--border);
 }
 
 .o-header__wrapper {
@@ -59,7 +59,7 @@
     background-color: var(--bg-neutral);
   }
 
-  img {
+  svg {
     width: auto;
     height: 4.4rem;
     padding: .2rem .4rem;
@@ -203,6 +203,7 @@
     background-color: var(--bg-default);
     padding: 1rem;
     overflow-y: scroll;
+    border-left: var(--border);
 
     > menu {
       margin-top: 4rem;

assets/sass/search.scss

@@ -13,7 +13,7 @@
     .pagefind-ui__search-input {
         z-index: 3;
         outline: .2rem solid transparent;
-        border: 0;
+        border: var(--border);
         box-shadow: var(--box-shadow);
 
         &:focus {
@@ -22,7 +22,8 @@
         }
 
         &::placeholder {
-            opacity: .5;
+            opacity: .7;
+            color: var(--color-body);
         }
     }
 

assets/sass/styles.scss

@@ -70,7 +70,7 @@ main {
   margin-right: auto;
 }
 
-.o-card{
+.o-card {
   background-color: var(--bg-default);
   border-radius: var(--border-radius-l);
   padding: 2rem;
@@ -159,21 +159,23 @@ img {
   @include add-columns(3);
 }
 
-.o-single,
-.o-list {
+.o-single {
   padding: 2rem;
   background-color: var(--bg-default);
   border-radius: var(--border-radius-l);
+  border: var(--border);
 
   &--with-sidemenu {
     padding: 0;
     background-color: inherit;
+    border: unset;
   }
 
   &__container {
     background-color: var(--bg-default);
     padding: 2rem;
     border-radius: var(--border-radius-l);
+    border: var(--border);
   }
 
   &__content-wrapper {
@@ -224,6 +226,13 @@ img {
   }
 }
 
+.o-list {
+  padding: 2rem;
+  background-color: var(--bg-default);
+  border-radius: var(--border-radius-l);
+  border: var(--border);
+}
+
 .o-list--news {
   padding: 0;
   background-color: unset;

assets/sass/teaser.scss

@@ -10,6 +10,7 @@
     border-radius: var(--border-radius-l);
     display: flex;
     flex-direction: column;
+    border: var(--border);
 
     &:hover,
     &:focus {

layouts/_default/rss.xml

@@ -5,7 +5,7 @@
         <link>{{ .Site.BaseURL }}</link>
         <description>{{ .Site.Params.description }}</description>
         <language>{{ site.Language.LanguageCode }}</language>
-        <image>{{ (resources.Get "images/logo.svg").Permalink }}</image>
+        <image>{{ partial "header-logo" }}</image>
         {{ range where .Site.RegularPages "Section" "news" }}
         <item>
             <title>{{ .Title }}</title>

layouts/country/single.html

@@ -21,7 +21,7 @@ <h1 data-pagefind-meta="title">{{ .Title }}</h1>
             {{ $title := print (T "_operator__list_title") " in " .Title}}
             {{ partial "related" (dict "index" "country" "pageType" "operator" "title" $title "page" . "identifier" "operators") }}
             {{ with .Params.operators_without_fip }}
-                <hr class="o-divider">
+            {{ partial "intersector" }}
                 <h3 id="operators-without-fip-title">{{ T "operators_without_fip"}} in {{ $.Title }}</h3>
                 <ul aria-labelledby="operators-without-fip-title">
                     {{ range . }}

layouts/operator/list.html

@@ -6,7 +6,7 @@ <h1 data-pagefind-meta="title">{{ .Title }}</h1>
     {{ range .Pages }}
     <a href="{{ .RelPermalink }}" class="o-list__link">
       <div class="o-list__picture">
-        {{ partial "logo" (dict "operator" .File.ContentBaseName) }}
+        {{ partial "operator-logo" (dict "operator" .File.ContentBaseName) }}
       </div>
       <div>
         {{ .Title }}

layouts/operator/single.html

@@ -5,7 +5,7 @@
             <div class="o-single__container content_with_heading">
                 <div class="o-single__content-header">
                     <div class="o-single__content-header-title">
-                        {{ partial "logo" (dict "operator" .File.ContentBaseName "pagefind" true)}}
+                        {{ partial "operator-logo" (dict "operator" .File.ContentBaseName "pagefind" true)}}
                         <h1 data-pagefind-meta="title">{{ .Title }}</h1>
                     </div>
                     {{ partial "updateDate.html" . }}

layouts/partials/content.html

@@ -1,3 +1,3 @@
 {{- with .Content -}}
-    {{ . | replaceRE "(<h[2] id=\"([^\"]+)\".+)(</h[2]+>)" (print `<hr class="o-divider" aria-hidden="true"><span class="a-anchorlink">${1}${3}<button data-anchor="#${2}" class="a-anchorlink__link" title="` (T "anchorLink.copy") `">` (partial "icon" "link") `</button></span>`) | safeHTML }}
+    {{ . | replaceRE "(<h[2] id=\"([^\"]+)\".+)(</h[2]+>)" (print (partial "intersector") `<span class="a-anchorlink">${1}${3}<button data-anchor="#${2}" class="a-anchorlink__link" title="` (T "anchorLink.copy") `">` (partial "icon" "link") `</button></span>`) | safeHTML }}
 {{- end -}}