完善页脚
This commit is contained in:
1 parent
1bf7107966
commit
93dc21e69b
18 files changed
+550
-137
No files matched your search
@@ -10,7 +10,7 @@ const today = new Date();
|
||||
<span class="footer-copyright" th:if="${theme.config?.footer?.footer_copyright}" th:text="${theme.config?.footer?.footer_copyright}"></span>
|
||||
<span class="footer-copyright" th:unless="${theme.config?.footer?.footer_copyright}">
|
||||
© {today.getFullYear()}
|
||||
<th:block th:text="${site.title}"></th:block>
|
||||
<th:block th:text="${theme.config?.basic?.owner_name ?: site.title}"></th:block>
|
||||
</span>
|
||||
<span class="footer-icp" th:if="${theme.config?.footer?.footer_icp}">
|
||||
<a href="https://beian.miit.gov.cn/" target="_blank" rel="noopener noreferrer" th:text="${theme.config?.footer?.footer_icp}"></a>
|
||||
@@ -172,7 +172,6 @@ const today = new Date();
|
||||
|
||||
.footer-custom :global(img) {
|
||||
display: inline-block;
|
||||
max-height: 26px;
|
||||
vertical-align: middle;
|
||||
border-radius: 4px;
|
||||
}
|
||||
@@ -208,7 +207,6 @@ const today = new Date();
|
||||
|
||||
.footer-injected :global(img) {
|
||||
display: inline-block;
|
||||
max-height: 26px;
|
||||
vertical-align: middle;
|
||||
border-radius: 4px;
|
||||
}
|
||||
@@ -236,10 +234,5 @@ const today = new Date();
|
||||
.footer-injected {
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.footer-custom :global(img),
|
||||
.footer-injected :global(img) {
|
||||
max-height: 20px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -44,14 +44,16 @@ import ThemeSwitcher from "./ThemeSwitcher.vue";
|
||||
th:if="${pluginFinder.available('PluginSearchWidget') and theme.config?.navbar?.navbar_show_search != false}"
|
||||
class="wi-navbar__action-btn"
|
||||
type="button"
|
||||
aria-label="Search"
|
||||
th:aria-label="${theme.config?.basic?.label_search ?: '搜索'}"
|
||||
onclick="SearchWidget.open()"
|
||||
>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="11" cy="11" r="8"/><path d="m21 21-4.3-4.3"/></svg>
|
||||
</button>
|
||||
|
||||
<th:block th:if="${theme.config?.navbar?.navbar_show_theme_switch != false}">
|
||||
<ThemeSwitcher client:idle />
|
||||
<span th:attr="data-label=${theme.config?.basic?.label_theme_switch ?: '切换主题'}" style="display:inline-flex">
|
||||
<ThemeSwitcher client:idle />
|
||||
</span>
|
||||
</th:block>
|
||||
|
||||
<button
|
||||
|
||||
@@ -4,9 +4,14 @@ import MingcuteMoonLine from "~icons/mingcute/moon-line";
|
||||
import MingcuteSunLine from "~icons/mingcute/sun-line";
|
||||
|
||||
const isDark = ref(false);
|
||||
const label = ref("切换主题");
|
||||
|
||||
onMounted(() => {
|
||||
isDark.value = document.documentElement.classList.contains("dark");
|
||||
const parent = document.querySelector("[data-label]");
|
||||
if (parent) {
|
||||
label.value = parent.getAttribute("data-label") || "切换主题";
|
||||
}
|
||||
});
|
||||
|
||||
function toggle() {
|
||||
@@ -24,10 +29,10 @@ function toggle() {
|
||||
<button
|
||||
class="theme-toggle"
|
||||
type="button"
|
||||
:aria-label="isDark ? 'Switch to light mode' : 'Switch to dark mode'"
|
||||
:aria-label="label"
|
||||
:title="label"
|
||||
@click="toggle"
|
||||
>
|
||||
<!-- Moon: shown in light mode -->
|
||||
<MingcuteSunLine v-if="isDark" />
|
||||
<MingcuteMoonLine v-else />
|
||||
</button>
|
||||
|
||||
Reference in new issue
Block a user