页脚:社交按钮提到第一排居中显示(链接行/版权行依次在下)
This commit is contained in:
@@ -108,15 +108,6 @@ onMounted(async () => {
|
|||||||
已删:右栏在窄屏会堆到信息流下方,卡片之后正好接页脚小字,
|
已删:右栏在窄屏会堆到信息流下方,卡片之后正好接页脚小字,
|
||||||
所有宽度都不缺位。 -->
|
所有宽度都不缺位。 -->
|
||||||
<footer class="rail-foot">
|
<footer class="rail-foot">
|
||||||
<nav class="foot-links" aria-label="页脚导航">
|
|
||||||
<template v-for="(l, i) in links" :key="l.to">
|
|
||||||
<span v-if="i" class="dot">·</span>
|
|
||||||
<RouterLink :to="l.to">{{ l.label }}</RouterLink>
|
|
||||||
</template>
|
|
||||||
<span class="dot">·</span>
|
|
||||||
<a href="/rss.xml">RSS</a>
|
|
||||||
</nav>
|
|
||||||
<!-- 后台填的社交账号:单独一排 -->
|
|
||||||
<div v-if="social.length" class="social-row">
|
<div v-if="social.length" class="social-row">
|
||||||
<a
|
<a
|
||||||
v-for="s in social"
|
v-for="s in social"
|
||||||
@@ -132,6 +123,14 @@ onMounted(async () => {
|
|||||||
<span v-else>{{ s.label }}</span>
|
<span v-else>{{ s.label }}</span>
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
|
<nav class="foot-links" aria-label="页脚导航">
|
||||||
|
<template v-for="(l, i) in links" :key="l.to">
|
||||||
|
<span v-if="i" class="dot">·</span>
|
||||||
|
<RouterLink :to="l.to">{{ l.label }}</RouterLink>
|
||||||
|
</template>
|
||||||
|
<span class="dot">·</span>
|
||||||
|
<a href="/rss.xml">RSS</a>
|
||||||
|
</nav>
|
||||||
<!-- 项目信息:固定的源码图标 + 版权,永远在 -->
|
<!-- 项目信息:固定的源码图标 + 版权,永远在 -->
|
||||||
<div class="foot-meta">
|
<div class="foot-meta">
|
||||||
<a class="social-icon" :href="PROJECT_REPO" title="项目源码" aria-label="项目源码" target="_blank" rel="noopener">
|
<a class="social-icon" :href="PROJECT_REPO" title="项目源码" aria-label="项目源码" target="_blank" rel="noopener">
|
||||||
@@ -268,12 +267,13 @@ onMounted(async () => {
|
|||||||
opacity: 0.6;
|
opacity: 0.6;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* 图标 + 版权同排:源码等入口是单色小图标,hover 才亮成强调色 */
|
/* 社交按钮:页脚第一排居中 */
|
||||||
.social-row {
|
.social-row {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
gap: 4px;
|
justify-content: center;
|
||||||
margin-top: 2px;
|
gap: 6px;
|
||||||
|
margin-bottom: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.foot-meta {
|
.foot-meta {
|
||||||
|
|||||||
Reference in New Issue
Block a user