feat: multilingual site switch

This commit is contained in:
Jimmy Cai 2022-02-27 09:07:53 +00:00 committed by GitHub
parent b3b8fa73ef
commit 0ac8af4639
3 changed files with 45 additions and 7 deletions

View File

@ -200,6 +200,13 @@
}
}
}
.menu-bottom-section {
margin-top: auto;
display: flex;
flex-direction: column;
width: 100%;
}
}
.social-menu {

View File

@ -158,3 +158,20 @@
display: none;
}
}
#i18n-switch {
color: var(--body-text-color);
display: inline-flex;
align-content: center;
select {
border: 0;
background-color: transparent;
color: var(--body-text-color);
option {
color: var(--card-text-color-main);
background-color: var(--card-background);
}
}
}

View File

@ -73,12 +73,26 @@
</li>
{{ end }}
{{ if (default false .Site.Params.colorScheme.toggle) }}
<li id="dark-mode-toggle">
{{ partial "helper/icon" "toggle-left" }}
{{ partial "helper/icon" "toggle-right" }}
<span>{{ T "darkMode" }}</span>
</li>
{{ end }}
<div class="menu-bottom-section">
{{- $currentLanguageCode := .Language.Lang -}}
{{ with .Site.Home.AllTranslations }}
<li id="i18n-switch">
{{ partial "helper/icon" "language" }}
<select name="language" onchange="window.location.href = this.selectedOptions[0].value">
{{ range . }}
<option value="{{ .Permalink }}" {{ if eq .Language.Lang $currentLanguageCode }}selected{{ end }}>{{ .Language.LanguageName }}</option>
{{ end }}
</select>
</li>
{{ end }}
{{ if (default false .Site.Params.colorScheme.toggle) }}
<li id="dark-mode-toggle">
{{ partial "helper/icon" "toggle-left" }}
{{ partial "helper/icon" "toggle-right" }}
<span>{{ T "darkMode" }}</span>
</li>
{{ end }}
</div>
</ol>
</aside>