diff --git a/assets/scss/layout/_sidebar.scss b/assets/scss/layout/_sidebar.scss index eaad470..a0a1304 100644 --- a/assets/scss/layout/_sidebar.scss +++ b/assets/scss/layout/_sidebar.scss @@ -247,6 +247,76 @@ $sidebar-display: 'sidebar-display'; /* the attribute for sidebar display */ } } } /* .sidebar-bottom */ + .lang-selector-wrapper { + padding: 0.35rem; + margin: 0.15rem 0; + text-align: center; + } + + /* Dropdown container */ + .lang-dropdown { + position: relative; + display: inline-block; + width: auto; + min-width: 120px; + max-width: 80%; +} + + /* Select input element */ + .lang-select { + /* Basic styles */ + appearance: none; + -webkit-appearance: none; + -moz-appearance: none; + width: 100%; + // padding: 0.5rem 2rem 0.5rem 1rem; + border: none; + /* Font and colors */ + font-size: 0.95rem; + font-weight: 600; + color: var(--sidebar-muted); + background-color: var(--sidebar-bg); + + /* Shape and interaction */ + border-radius: var(--bs-border-radius, 0.375rem); + cursor: pointer; + transition: all 0.2s ease; + + /* Add arrow icon */ + background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='gray' 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"); + background-repeat: no-repeat; + background-position: right 0.75rem center; + background-size: 1rem; + } + + /* Hover state */ + .lang-select:hover { + color: var(--sidebar-active); + background-color: var(--sidebar-hover); + } + + /* Focus state */ + .lang-select:focus { + outline: 2px solid var(--sidebar-active); + outline-offset: 2px; + color: var(--sidebar-active); + } + + /* Firefox browser support */ + .lang-select:-moz-focusring { + color: transparent; + text-shadow: 0 0 0 var(--sidebar-muted); + } + + /* IE browser support */ + .lang-select::-ms-expand { + display: none; + } + + .no-hover:hover { + background-color: var(--sidebar-bg) !important; + } + } /* #sidebar */ [#{$sidebar-display}] { diff --git a/hugo.toml b/hugo.toml index f6094d1..c802f0f 100644 --- a/hugo.toml +++ b/hugo.toml @@ -1,4 +1,3 @@ -baseURL = 'https://example.org/' title = 'Chirpy' enableGitInfo = true diff --git a/layouts/partials/language-selector.html b/layouts/partials/language-selector.html index 27043c0..9fd9178 100644 --- a/layouts/partials/language-selector.html +++ b/layouts/partials/language-selector.html @@ -1,9 +1,9 @@ -
- {{ $currentLang := .Site.Language.Lang }} {{ range .Site.Languages }} {{ end }} diff --git a/layouts/partials/sidebar.html b/layouts/partials/sidebar.html index d580103..fe652ba 100644 --- a/layouts/partials/sidebar.html +++ b/layouts/partials/sidebar.html @@ -34,8 +34,8 @@ {{ end }} -