[rulkc] [PATCH v2 6/7] themes: landau-hacker: Add languadge switcher

Wed Sep 16 15:43:33 MSK 2026

Reviewed-by: Dmitry Rokosov <rockosov at rulkc.org>

On Fri, Sep 11, 2026 at 10:47:45AM +0300, Nikita Shubin wrote:
> Add languadge switcher to support switching between translations.
> 
> Signed-off-by: Nikita Shubin <nikita.shubin at maquefel.me>
> ---
>  themes/landau-hacker/layouts/_default/baseof.html  | 15 ++++--
>  .../layouts/partials/language-switcher.html        | 36 +++++++++++++
>  themes/landau-hacker/static/css/hacker.css         | 62 +++++++++++++++++++++-
>  3 files changed, 107 insertions(+), 6 deletions(-)
> 
> diff --git a/themes/landau-hacker/layouts/_default/baseof.html b/themes/landau-hacker/layouts/_default/baseof.html
> index 57080b5..1fa8cfb 100644
> --- a/themes/landau-hacker/layouts/_default/baseof.html
> +++ b/themes/landau-hacker/layouts/_default/baseof.html
> @@ -20,11 +20,16 @@
>  </head>
>  <body>
>    <header>
> -    <div class="container">
> -      <a id="a-title" href="{{ "/" | relURL }}">
> -        <h1>{{ site.Title }}</h1>
> -      </a>
> -      <h2>{{ site.Params.description }}</h2>
> +    <div class="container header-flex">
> +      <div class="header-left">
> +        <a id="a-title" href="{{ "/" | relURL }}">
> +          <h1>{{ site.Title }}</h1>
> +        </a>
> +        <h2>{{ site.Params.description }}</h2>
> +      </div>
> +      <div class="header-right">
> +        {{ partial "language-switcher" . }}
> +      </div>
>      </div>
>    </header>
>  
> diff --git a/themes/landau-hacker/layouts/partials/language-switcher.html b/themes/landau-hacker/layouts/partials/language-switcher.html
> new file mode 100644
> index 0000000..4c73ff5
> --- /dev/null
> +++ b/themes/landau-hacker/layouts/partials/language-switcher.html
> @@ -0,0 +1,36 @@
> +<div class="language-switcher">
> +  {{ range .Site.Languages }}
> +    {{ $lang := .Lang }}
> +    {{ $isCurrent := eq $lang $.Site.Language.Lang }}
> +    {{ $flag := "" }}
> +    {{ if eq $lang "ru" }}{{ $flag = "🇷🇺" }}{{ else if eq $lang "en" }}{{ $flag = "🇬🇧" }}{{ else }}{{ $flag = "🌐" }}{{ end }}
> +
> +    {{ $translation := false }}
> +    {{ if $.IsTranslated }}
> +      {{ range $.Translations }}
> +        {{ if eq .Language.Lang $lang }}
> +          {{ $translation = . }}
> +        {{ end }}
> +      {{ end }}
> +    {{ end }}
> +
> +    {{ if $isCurrent }}
> +      <span class="active" hreflang="{{ $lang }}" lang="{{ $lang }}">
> +        {{ $flag }}
> +        <span class="code">{{ .LanguageName }}</span>
> +      </span>
> +    {{ else }}
> +      {{ if $translation }}
> +        <a href="{{ $translation.Permalink }}" hreflang="{{ $lang }}" lang="{{ $lang }}">
> +          {{ $flag }}
> +          <span class="code">{{ .LanguageName }}</span>
> +        </a>
> +      {{ else }}
> +        <a href="{{ relLangURL "" }}" hreflang="{{ $lang }}" lang="{{ $lang }}">
> +          {{ $flag }}
> +          <span class="code">{{ .LanguageName }}</span>
> +        </a>
> +      {{ end }}
> +    {{ end }}
> +  {{ end }}
> +</div>
> \ No newline at end of file
> diff --git a/themes/landau-hacker/static/css/hacker.css b/themes/landau-hacker/static/css/hacker.css
> index 736bb29..400f7d1 100644
> --- a/themes/landau-hacker/static/css/hacker.css
> +++ b/themes/landau-hacker/static/css/hacker.css
> @@ -94,6 +94,66 @@ header h2 {
>    margin: 0;
>  }
>  
> +/* Language switcher (LANDAU addition); not part of upstream pages-themes/hacker)  */
> +.language-switcher {
> +  display: flex;
> +  gap: 1rem;
> +  align-items: center;
> +  justify-content: flex-end;
> +  font-size: 0.9rem;
> +  margin-top: 5px;
> +}
> +
> +.language-switcher a,
> +.language-switcher .active {
> +  display: inline-flex;
> +  align-items: center;
> +  gap: 0.3rem;
> +  padding: 0.2rem 0.5rem;
> +  border-radius: 4px;
> +  text-decoration: none;
> +  transition: background 0.2s, opacity 0.2s;
> +}
> +
> +.language-switcher a {
> +  color: #b8b8b8;
> +  background: transparent;
> +}
> +
> +.language-switcher a:hover {
> +  background: rgba(255, 255, 255, 0.1);
> +  color: #fff;
> +}
> +
> +.language-switcher .active {
> +  color: #b5e853;
> +  background: rgba(181, 232, 83, 0.1);
> +  cursor: default;
> +  font-weight: bold;
> +}
> +
> +.language-switcher .lang-code {
> +  font-size: 0.75rem;
> +  text-transform: uppercase;
> +  letter-spacing: 0.5px;
> +}
> +
> + at media (max-width: 600px) {
> +  .language-switcher {
> +    justify-content: center;
> +    gap: 0.5rem;
> +    flex-wrap: wrap;
> +  }
> +  .language-switcher a,
> +  .language-switcher .active {
> +    padding: 0.1rem 0.3rem;
> +    font-size: 0.8rem;
> +  }
> +  .language-switcher .lang-code {
> +    display: none;
> +  }
> +}
> +
>  /* Main Content */
>  
>  #main_content {
> @@ -287,4 +347,4 @@ footer .version {
>  .highlight .nt, .highlight .nn, .highlight .nc, .highlight .no            { color: #f4bf75; }
>  .highlight .na                                                            { color: #6a9fb5; }
>  .highlight .m, .highlight .mf, .highlight .mh, .highlight .mi, .highlight .il, .highlight .mo, .highlight .mb, .highlight .mx { color: #90a959; }
> -.highlight .ss                                                            { color: #90a959; }
> +.highlight .ss                                                            { color: #90a959; }
> \ No newline at end of file
> 
> -- 
> 2.54.0
> 

-- 
Thank you,
Dmitry