diff --git a/docs/en/source/_static/custom.css b/docs/en/source/_static/custom.css index 7ec1e6fc..42a0b727 100755 --- a/docs/en/source/_static/custom.css +++ b/docs/en/source/_static/custom.css @@ -1,109 +1,49 @@ -/* 让表格自动拉伸到满宽度 */ -table { - width: 100%; - margin-left: auto; - margin-right: auto; + +.lang-switch { + position: fixed !important; + top: 60px !important; + right: 20px !important; + z-index: 1000 !important; + background: rgba(255,255,255,0.95) !important; + border: 1px solid #ddd !important; + border-radius: 6px !important; + padding: 8px 12px !important; + font-size: 0.9em !important; + box-shadow: 0 2px 8px rgba(0,0,0,0.15) !important; + backdrop-filter: blur(5px) !important; + transition: all 0.3s ease !important; } -/* 让表格中的每个 和 也自动拉伸 */ -th, -td { - width: auto; +.lang-switch:hover { + box-shadow: 0 4px 12px rgba(0,0,0,0.2) !important; + transform: translateY(-1px) !important; } -ul { - width: 100%; - /* 列表宽度占满整个容器 */ - } - - -/* 修改 Sphinx Theme 项目标题的字体大小 Book和rtd 均OK */ -.wy-side-nav-search>a { - font-size: 16px; - /* 你可以根据需要调整这个值 */ +.lang-switch a { + text-decoration: none !important; + transition: color 0.2s ease !important; } -/* 修改项目标题的字体大小 Book和rtd 均OK*/ -.wy-side-nav-search>div.version { - font-size: 16px; - /* 你可以根据需要调整这个值 */ +.lang-switch .lang-other { + color: #0078d4 !important; + margin-right: 8px !important; } - -.sidebar-logo { - width: 500px; - /* 或者使用百分比 */ - height: auto; - max-width: 90%; - max-height: 90%; +.lang-switch .lang-other:hover { + color: #106ebe !important; } - -.sidebar-content { - line-height: 1.0; - /* 行间距是字体大小的1.5倍 */ -} - -.sidebar { - padding: 20px; - /* 内边距 */ - margin-bottom: 20px; - /* 外边距 */ -} - -.sidebar-text { - font-size: 30px; -} -/* 修改侧边栏的背景颜色 */ -.wy-nav-side { - background-color: #cecece !important; -} - -/* 针对导航栏链接的选择器 */ -.wy-nav-side a { - color: #000000; - /* 修改为您需要的颜色 */ -} - -/* 如果需要,您可以添加 hover 和 active 状态的样式 */ -.wy-nav-side a:hover { - color: #fffcfc; -} - -.wy-nav-side .current>a { - color: #108bf0 !important; +.lang-switch .lang-current { + color: #333 !important; font-weight: bold !important; - /* 设置为粗体 */ - /* 当前活动项的颜色 */ + margin-left: 8px !important; } -/* 提示:不同版本的 Sphinx 主题生成的 HTML 结构可能有所不同,请根据实际情况调整选择器 */ -h1.wy-banner-title { - color: #0267da !important; - /* 将此处的颜色替换为您希望的颜色 */ -} - -/* 如果也需要修改小标题 */ -h2.wy-banner-subtitle { - color: #7b7b7b !important; - /* 替换为希望的颜色 */ -} - -.wy-side-nav-search>a { - color: #ffffff !important; - /* 将 #your-color 替换为你想要颜色的十六进制代码 */ -} - - -/* 调整最大宽度 OK */ -.wy-nav-content { - max-width: 960px; - -} - - -/* 可选:调整侧边栏宽度 */ -/* .wy-side-scroll { - width: 300px; - -} */ \ No newline at end of file +@media (max-width: 768px) { + .lang-switch { + top: 10px !important; + right: 10px !important; + font-size: 0.8em !important; + padding: 6px 8px !important; + } +} \ No newline at end of file diff --git a/docs/zh/source/_static/custom.css b/docs/zh/source/_static/custom.css index a3ba800d..42a0b727 100755 --- a/docs/zh/source/_static/custom.css +++ b/docs/zh/source/_static/custom.css @@ -1,222 +1,49 @@ -/* 让表格自动拉伸到满宽度 */ -table { - width: 100%; - margin-left: auto; - margin-right: auto; + +.lang-switch { + position: fixed !important; + top: 60px !important; + right: 20px !important; + z-index: 1000 !important; + background: rgba(255,255,255,0.95) !important; + border: 1px solid #ddd !important; + border-radius: 6px !important; + padding: 8px 12px !important; + font-size: 0.9em !important; + box-shadow: 0 2px 8px rgba(0,0,0,0.15) !important; + backdrop-filter: blur(5px) !important; + transition: all 0.3s ease !important; } -/* 让表格中的每个 和 也自动拉伸 */ -th, -td { - width: auto; +.lang-switch:hover { + box-shadow: 0 4px 12px rgba(0,0,0,0.2) !important; + transform: translateY(-1px) !important; } -ul { - width: 100%; - /* 列表宽度占满整个容器 */ - } - - -/* 修改 Sphinx Theme 项目标题的字体大小 Book和rtd 均OK */ -.wy-side-nav-search>a { - font-size: 16px; - /* 你可以根据需要调整这个值 */ +.lang-switch a { + text-decoration: none !important; + transition: color 0.2s ease !important; } -/* 修改项目标题的字体大小 Book和rtd 均OK*/ -.wy-side-nav-search>div.version { - font-size: 16px; - /* 你可以根据需要调整这个值 */ +.lang-switch .lang-other { + color: #0078d4 !important; + margin-right: 8px !important; } - -.sidebar-logo { - width: 500px; - /* 或者使用百分比 */ - height: auto; - max-width: 90%; - max-height: 90%; +.lang-switch .lang-other:hover { + color: #106ebe !important; } - -.sidebar-content { - line-height: 1.0; - /* 行间距是字体大小的1.5倍 */ -} - -.sidebar { - padding: 20px; - /* 内边距 */ - margin-bottom: 20px; - /* 外边距 */ -} - -.sidebar-text { - font-size: 30px; -} -/* 修改侧边栏的背景颜色 */ -.wy-nav-side { - background-color: #cecece !important; -} - -/* 针对导航栏链接的选择器 */ -.wy-nav-side a { - color: #000000; - /* 修改为您需要的颜色 */ -} - -/* 如果需要,您可以添加 hover 和 active 状态的样式 */ -.wy-nav-side a:hover { - color: #fffcfc; -} - -.wy-nav-side .current>a { - color: #108bf0 !important; +.lang-switch .lang-current { + color: #333 !important; font-weight: bold !important; - /* 设置为粗体 */ - /* 当前活动项的颜色 */ + margin-left: 8px !important; } -/* 提示:不同版本的 Sphinx 主题生成的 HTML 结构可能有所不同,请根据实际情况调整选择器 */ -h1.wy-banner-title { - color: #0267da !important; - /* 将此处的颜色替换为您希望的颜色 */ -} - -/* 如果也需要修改小标题 */ -h2.wy-banner-subtitle { - color: #7b7b7b !important; - /* 替换为希望的颜色 */ -} - -.wy-side-nav-search>a { - color: #ffffff !important; - /* 将 #your-color 替换为你想要颜色的十六进制代码 */ -} - - -/* 调整最大宽度 OK */ -.wy-nav-content { - max-width: 960px; - -} - - -/* 可选:调整侧边栏宽度 */ -/* .wy-side-scroll { - width: 300px; - -} */ - -/* ==================== Language Switcher Styles ==================== */ - -/* Language switcher container */ -.language-switcher { - position: relative; - display: inline-block; - margin-left: 15px; - z-index: 1000; -} - -/* Language toggle button */ -.language-toggle { - background-color: #2980b9; - color: white; - border: none; - padding: 8px 15px; - border-radius: 4px; - cursor: pointer; - font-size: 14px; - display: flex; - align-items: center; - gap: 6px; - transition: background-color 0.3s ease; -} - -.language-toggle:hover { - background-color: #3498db; -} - -.language-icon { - font-size: 16px; -} - -.language-text { - font-weight: 500; -} - -/* Language dropdown */ -.language-dropdown { - display: none; - position: absolute; - top: 100%; - right: 0; - margin-top: 5px; - background-color: white; - min-width: 120px; - box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15); - border-radius: 4px; - overflow: hidden; - z-index: 1001; -} - -.language-dropdown.show { - display: block; -} - -/* Language options */ -.language-option { - display: block; - padding: 10px 15px; - color: #333; - text-decoration: none; - transition: background-color 0.2s ease; - font-size: 14px; -} - -.language-option:hover { - background-color: #f0f0f0; -} - -.language-option.active { - background-color: #2980b9; - color: white; - font-weight: 600; -} - -.language-option.active:hover { - background-color: #3498db; -} - -/* Position language switcher in navbar for RTD theme */ -.wy-nav-top .language-switcher { - float: right; - margin-right: 10px; -} - -/* Mobile responsive */ -@media screen and (max-width: 768px) { - .language-switcher { - margin-left: 10px; +@media (max-width: 768px) { + .lang-switch { + top: 10px !important; + right: 10px !important; + font-size: 0.8em !important; + padding: 6px 8px !important; } - - .language-toggle { - padding: 6px 12px; - font-size: 13px; - } - - .language-text { - display: none; - } - - .language-icon { - font-size: 18px; - } -} - -/* For sidebar placement (alternative position) */ -.wy-side-nav-search .language-switcher { - position: absolute; - top: 10px; - right: 10px; } \ No newline at end of file