diff --git a/directory/src/component/dropdown.jsx b/directory/src/component/dropdown.jsx
index 3ab7869..433dd9d 100644
--- a/directory/src/component/dropdown.jsx
+++ b/directory/src/component/dropdown.jsx
@@ -20,6 +20,11 @@ export default function Dropdown(props) {
>
{props.text}
+
{
@@ -75,4 +80,5 @@ Dropdown.propTypes = {
onClick: PropTypes.func,
activeColor: PropTypes.object,
activeRule: PropTypes.func,
+ altText: PropTypes.string,
};
\ No newline at end of file
diff --git a/directory/src/component/scss/dropdown.module.scss b/directory/src/component/scss/dropdown.module.scss
index 58afc33..7cb3c99 100644
--- a/directory/src/component/scss/dropdown.module.scss
+++ b/directory/src/component/scss/dropdown.module.scss
@@ -11,6 +11,36 @@
flex-direction: row;
align-items: center;
color: var(--text-color);
+
+ &:hover {
+ .popup {
+ visibility: unset;
+ opacity: 1;
+ }
+ }
+
+ .popup {
+ opacity: 0;
+ position: absolute;
+ background-color: var(--root-background-color);
+ width: max-content;
+ height: max-content;
+ max-height: 61.8vh;
+ max-width: 61.8vw;
+ z-index: -1;
+ top: 2em;
+ right: 0;
+ cursor: auto;
+ transition: all cubic-bezier(0.65, 0.05, 0.36, 1) 0.3s;
+ overflow: auto;
+ padding: 0.5rem;
+ border: 1px solid var(--border-color);
+ visibility: hidden;
+
+ .text {
+ font-size: 1rem;
+ }
+ }
}
.content {
diff --git a/directory/src/i18n.json b/directory/src/i18n.json
index 5b7078c..fea15e5 100644
--- a/directory/src/i18n.json
+++ b/directory/src/i18n.json
@@ -142,6 +142,14 @@
"ko-KR": {
"zh-CN": "韩语",
"en-US": "Korean"
+ },
+ "switch_language": {
+ "zh-CN": "🌐 切换语言",
+ "en-US": "🌐 Switch Language"
+ },
+ "fast_navigation": {
+ "zh-CN": "🧭 快速导航",
+ "en-US": "🧭 Fast Navigation"
}
}
}
\ No newline at end of file
diff --git a/directory/src/routes/Root.jsx b/directory/src/routes/Root.jsx
index 581aa8f..3a7e0ef 100644
--- a/directory/src/routes/Root.jsx
+++ b/directory/src/routes/Root.jsx
@@ -242,6 +242,7 @@ function LanguageDropdown() {
return (
{
return {
name: i18n(item),
@@ -286,6 +287,7 @@ function HeaderButton() {
let location = useLocation();
const { operators } = useConfig()
const { language } = useLanguage()
+ const { i18n } = useI18n()
const fastNavigateDict = useMemo(() => {
const dict = {}
@@ -325,6 +327,7 @@ function HeaderButton() {
{
navigate(item.value)
}}