Compare commits
2
Commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
9f677a9f0d | ||
|
|
c1950e142a |
+1
-1
@@ -1,5 +1,5 @@
|
|||||||
{
|
{
|
||||||
"version": "1.1.7",
|
"version": "1.1.9",
|
||||||
"type": "module",
|
"type": "module",
|
||||||
"engines": {
|
"engines": {
|
||||||
"node": ">=22.12.0"
|
"node": ">=22.12.0"
|
||||||
|
|||||||
@@ -575,6 +575,11 @@ spec:
|
|||||||
- group: links
|
- group: links
|
||||||
label: 友情链接
|
label: 友情链接
|
||||||
formSchema:
|
formSchema:
|
||||||
|
- $formkit: switch
|
||||||
|
name: links_apply_form_enabled
|
||||||
|
label: 显示友链申请表单
|
||||||
|
value: true
|
||||||
|
help: 在友链页底部展示访客申请表单;需链接管理插件开启「友链申请」功能,未开启时表单自动隐藏
|
||||||
- $formkit: text
|
- $formkit: text
|
||||||
name: links_page_title
|
name: links_page_title
|
||||||
label: 页面标题
|
label: 页面标题
|
||||||
|
|||||||
@@ -281,7 +281,7 @@
|
|||||||
inset: 0;
|
inset: 0;
|
||||||
background-size: cover;
|
background-size: cover;
|
||||||
background-position: center;
|
background-position: center;
|
||||||
opacity: 0.15;
|
opacity: 1;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* 深色模式背景图切换:未配置双图时不生效,保持单一背景图 */
|
/* 深色模式背景图切换:未配置双图时不生效,保持单一背景图 */
|
||||||
@@ -313,6 +313,12 @@
|
|||||||
letter-spacing: -0.03em;
|
letter-spacing: -0.03em;
|
||||||
color: var(--hero-title-text, var(--ink));
|
color: var(--hero-title-text, var(--ink));
|
||||||
line-height: var(--leading-tight);
|
line-height: var(--leading-tight);
|
||||||
|
/* 背景图完整显示后,用轻投影保证文字在复杂图片上仍可读 */
|
||||||
|
text-shadow: 0 1px 3px rgba(255, 253, 250, 0.6), 0 1px 14px rgba(255, 253, 250, 0.4);
|
||||||
|
}
|
||||||
|
|
||||||
|
html.dark .hero__title {
|
||||||
|
text-shadow: 0 1px 3px rgba(0, 0, 0, 0.55), 0 1px 14px rgba(0, 0, 0, 0.35);
|
||||||
}
|
}
|
||||||
|
|
||||||
.hero__subtitle {
|
.hero__subtitle {
|
||||||
@@ -321,6 +327,11 @@
|
|||||||
color: var(--hero-subtitle-text, var(--ink-2));
|
color: var(--hero-subtitle-text, var(--ink-2));
|
||||||
letter-spacing: 0.05em;
|
letter-spacing: 0.05em;
|
||||||
line-height: var(--leading-normal);
|
line-height: var(--leading-normal);
|
||||||
|
text-shadow: 0 1px 3px rgba(255, 253, 250, 0.6), 0 1px 10px rgba(255, 253, 250, 0.4);
|
||||||
|
}
|
||||||
|
|
||||||
|
html.dark .hero__subtitle {
|
||||||
|
text-shadow: 0 1px 3px rgba(0, 0, 0, 0.55), 0 1px 10px rgba(0, 0, 0, 0.35);
|
||||||
}
|
}
|
||||||
|
|
||||||
.hero__description {
|
.hero__description {
|
||||||
@@ -330,6 +341,11 @@
|
|||||||
max-width: 560px;
|
max-width: 560px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
transition: opacity 0.3s ease;
|
transition: opacity 0.3s ease;
|
||||||
|
text-shadow: 0 1px 3px rgba(255, 253, 250, 0.55);
|
||||||
|
}
|
||||||
|
|
||||||
|
html.dark .hero__description {
|
||||||
|
text-shadow: 0 1px 3px rgba(0, 0, 0, 0.5);
|
||||||
}
|
}
|
||||||
|
|
||||||
.hero__scroll-indicator {
|
.hero__scroll-indicator {
|
||||||
|
|||||||
@@ -21,6 +21,16 @@
|
|||||||
class="wi-mobile-menu__link"
|
class="wi-mobile-menu__link"
|
||||||
th:data-href="${menuItem.status.href}"
|
th:data-href="${menuItem.status.href}"
|
||||||
></a>
|
></a>
|
||||||
|
<th:block th:if="${not #lists.isEmpty(menuItem.children)}">
|
||||||
|
<a
|
||||||
|
th:each="child : ${menuItem.children}"
|
||||||
|
th:href="@{${child.status.href}}"
|
||||||
|
th:target="${child.spec?.target?.value == '_blank'} ? '_blank' : '_self'"
|
||||||
|
th:text="${'| ' + child.status.displayName}"
|
||||||
|
class="wi-mobile-menu__link wi-mobile-menu__link--sub"
|
||||||
|
th:data-href="${child.status.href}"
|
||||||
|
></a>
|
||||||
|
</th:block>
|
||||||
</th:block>
|
</th:block>
|
||||||
</th:block>
|
</th:block>
|
||||||
</th:block>
|
</th:block>
|
||||||
@@ -213,6 +223,14 @@
|
|||||||
background var(--duration-fast) var(--ease-out-quart);
|
background var(--duration-fast) var(--ease-out-quart);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* 二级菜单项:缩进 + 弱化,与一级项区分 */
|
||||||
|
.wi-mobile-menu__link--sub {
|
||||||
|
padding-left: 2rem;
|
||||||
|
font-size: var(--text-base);
|
||||||
|
font-weight: 400;
|
||||||
|
color: var(--ink-3);
|
||||||
|
}
|
||||||
|
|
||||||
.wi-mobile-menu__link:hover {
|
.wi-mobile-menu__link:hover {
|
||||||
color: var(--accent);
|
color: var(--accent);
|
||||||
background: var(--bg-raised);
|
background: var(--bg-raised);
|
||||||
|
|||||||
+102
-1
@@ -32,15 +32,34 @@ import ThemeSwitcher from "./ThemeSwitcher.astro";
|
|||||||
<th:block th:if="${menuFinder != null}">
|
<th:block th:if="${menuFinder != null}">
|
||||||
<th:block th:with="menu = ${menuFinder.getPrimary()}">
|
<th:block th:with="menu = ${menuFinder.getPrimary()}">
|
||||||
<th:block th:if="${menu != null and menu.menuItems != null and not #lists.isEmpty(menu.menuItems)}">
|
<th:block th:if="${menu != null and menu.menuItems != null and not #lists.isEmpty(menu.menuItems)}">
|
||||||
<a
|
<div
|
||||||
th:each="menuItem : ${menu.menuItems}"
|
th:each="menuItem : ${menu.menuItems}"
|
||||||
|
class="wi-navbar__item"
|
||||||
|
th:classappend="${not #lists.isEmpty(menuItem.children)} ? 'wi-navbar__item--has-children'"
|
||||||
|
>
|
||||||
|
<a
|
||||||
th:href="@{${menuItem.status.href}}"
|
th:href="@{${menuItem.status.href}}"
|
||||||
th:target="${menuItem.spec?.target?.value == '_blank'} ? '_blank' : '_self'"
|
th:target="${menuItem.spec?.target?.value == '_blank'} ? '_blank' : '_self'"
|
||||||
th:text="${menuItem.status.displayName}"
|
th:text="${menuItem.status.displayName}"
|
||||||
class="wi-navbar__link"
|
class="wi-navbar__link"
|
||||||
th:data-href="${menuItem.status.href}"
|
th:data-href="${menuItem.status.href}"
|
||||||
|
th:aria-haspopup="${not #lists.isEmpty(menuItem.children)} ? 'true' : null"
|
||||||
>
|
>
|
||||||
</a>
|
</a>
|
||||||
|
<div
|
||||||
|
class="wi-navbar__submenu"
|
||||||
|
th:if="${not #lists.isEmpty(menuItem.children)}"
|
||||||
|
>
|
||||||
|
<a
|
||||||
|
th:each="child : ${menuItem.children}"
|
||||||
|
th:href="@{${child.status.href}}"
|
||||||
|
th:target="${child.spec?.target?.value == '_blank'} ? '_blank' : '_self'"
|
||||||
|
th:text="${child.status.displayName}"
|
||||||
|
class="wi-navbar__submenu-link"
|
||||||
|
>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</th:block>
|
</th:block>
|
||||||
</th:block>
|
</th:block>
|
||||||
</th:block>
|
</th:block>
|
||||||
@@ -257,6 +276,88 @@ import ThemeSwitcher from "./ThemeSwitcher.astro";
|
|||||||
min-width: 0;
|
min-width: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* 一级菜单项容器(含子菜单时作为下拉的定位锚点) */
|
||||||
|
.wi-navbar__item {
|
||||||
|
position: relative;
|
||||||
|
display: inline-flex;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 二级下拉:纯 CSS 悬停/聚焦展开,无 JS 开销 */
|
||||||
|
.wi-navbar__submenu {
|
||||||
|
position: absolute;
|
||||||
|
top: 100%;
|
||||||
|
left: 50%;
|
||||||
|
transform: translateX(-50%) translateY(6px);
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
min-width: 168px;
|
||||||
|
padding: 6px;
|
||||||
|
margin: 0;
|
||||||
|
list-style: none;
|
||||||
|
border-radius: var(--radius-md, 12px);
|
||||||
|
background: var(--bg-raised);
|
||||||
|
border: 1px solid var(--rule);
|
||||||
|
box-shadow: var(--shadow-lg);
|
||||||
|
opacity: 0;
|
||||||
|
visibility: hidden;
|
||||||
|
transition: opacity 0.18s ease, transform 0.18s var(--ease-out-quart),
|
||||||
|
visibility 0.18s;
|
||||||
|
z-index: 101;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 悬停桥:避免鼠标从一级移到二级途中经过空隙导致菜单关闭 */
|
||||||
|
.wi-navbar__item--has-children::after {
|
||||||
|
content: "";
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
top: 100%;
|
||||||
|
height: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.wi-navbar__item--has-children:hover .wi-navbar__submenu,
|
||||||
|
.wi-navbar__item--has-children:focus-within .wi-navbar__submenu {
|
||||||
|
opacity: 1;
|
||||||
|
visibility: visible;
|
||||||
|
transform: translateX(-50%) translateY(0);
|
||||||
|
}
|
||||||
|
|
||||||
|
.wi-navbar__submenu-link {
|
||||||
|
display: block;
|
||||||
|
padding: 0.5rem 0.75rem;
|
||||||
|
border-radius: 8px;
|
||||||
|
font-size: var(--text-sm);
|
||||||
|
color: var(--ink-2);
|
||||||
|
text-decoration: none;
|
||||||
|
white-space: nowrap;
|
||||||
|
transition: color 0.15s ease, background 0.15s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.wi-navbar__submenu-link:hover {
|
||||||
|
color: var(--accent);
|
||||||
|
background: color-mix(in srgb, var(--accent) 8%, transparent);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 有子菜单的一级项带下拉小箭头 */
|
||||||
|
.wi-navbar__item--has-children > .wi-navbar__link::after {
|
||||||
|
content: "";
|
||||||
|
display: inline-block;
|
||||||
|
width: 4px;
|
||||||
|
height: 4px;
|
||||||
|
margin-left: 0.3rem;
|
||||||
|
margin-top: -2px;
|
||||||
|
border-right: 1.5px solid currentColor;
|
||||||
|
border-bottom: 1.5px solid currentColor;
|
||||||
|
transform: rotate(45deg);
|
||||||
|
opacity: 0.6;
|
||||||
|
transition: transform 0.18s var(--ease-out-quart);
|
||||||
|
}
|
||||||
|
|
||||||
|
.wi-navbar__item--has-children:hover > .wi-navbar__link::after {
|
||||||
|
transform: rotate(225deg);
|
||||||
|
margin-top: 2px;
|
||||||
|
}
|
||||||
|
|
||||||
.wi-navbar__link {
|
.wi-navbar__link {
|
||||||
display: inline-flex;
|
display: inline-flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
|||||||
@@ -87,6 +87,92 @@ import Layout from "../layouts/Layout.astro";
|
|||||||
</div>
|
</div>
|
||||||
</th:block>
|
</th:block>
|
||||||
|
|
||||||
|
<div
|
||||||
|
class="wi-links__apply"
|
||||||
|
th:if="${theme.config?.links?.links_apply_form_enabled != false}"
|
||||||
|
th:with="applied=${param.applied != null and !#lists.isEmpty(param.applied) and param.applied[0] == 'true'},
|
||||||
|
applyMsg=${param.message != null and !#lists.isEmpty(param.message) ? param.message[0] : null}"
|
||||||
|
>
|
||||||
|
<h2 class="wi-links__apply-title" th:text="'申请友链'">申请友链</h2>
|
||||||
|
<p
|
||||||
|
class="wi-links__apply-result"
|
||||||
|
th:if="${applied}"
|
||||||
|
th:text="'申请已提交,等待站长审核 🌙'"
|
||||||
|
role="status"
|
||||||
|
></p>
|
||||||
|
<p
|
||||||
|
class="wi-links__apply-result wi-links__apply-result--error"
|
||||||
|
th:if="${not applied and applyMsg != null}"
|
||||||
|
th:text="${applyMsg}"
|
||||||
|
role="alert"
|
||||||
|
></p>
|
||||||
|
|
||||||
|
<form
|
||||||
|
class="wi-links__apply-form"
|
||||||
|
method="post"
|
||||||
|
th:action="@{/links/apply/submit}"
|
||||||
|
>
|
||||||
|
<input type="hidden" name="_csrf" th:value="${csrfToken}" />
|
||||||
|
<div class="wi-links__apply-row">
|
||||||
|
<label class="wi-links__apply-field">
|
||||||
|
<span th:text="'站点名称 *'">站点名称 *</span>
|
||||||
|
<input type="text" name="displayName" required maxlength="50" placeholder="你的站点名称" th:attr="value=${param.value != null and !#lists.isEmpty(param.value) ? param.value[0] : ''}" />
|
||||||
|
</label>
|
||||||
|
<label class="wi-links__apply-field">
|
||||||
|
<span th:text="'站点链接 *'">站点链接 *</span>
|
||||||
|
<input type="url" name="url" required placeholder="https://" />
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
<div class="wi-links__apply-row">
|
||||||
|
<label class="wi-links__apply-field">
|
||||||
|
<span th:text="'图标地址'">图标地址</span>
|
||||||
|
<input type="url" name="logo" placeholder="https://" />
|
||||||
|
</label>
|
||||||
|
<label class="wi-links__apply-field">
|
||||||
|
<span th:text="'联系邮箱'">联系邮箱</span>
|
||||||
|
<input type="email" name="email" placeholder="用于通知审核结果" />
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
<label class="wi-links__apply-field">
|
||||||
|
<span th:text="'站点描述'">站点描述</span>
|
||||||
|
<input type="text" name="description" maxlength="120" placeholder="一句话介绍你的站点" />
|
||||||
|
</label>
|
||||||
|
<label class="wi-links__apply-field">
|
||||||
|
<span th:text="'反链页面'">反链页面</span>
|
||||||
|
<input type="url" name="backlink" placeholder="https://" />
|
||||||
|
</label>
|
||||||
|
<label class="wi-links__apply-field">
|
||||||
|
<span th:text="'RSS / Atom 地址(每行一个)'">RSS / Atom 地址(每行一个)</span>
|
||||||
|
<textarea name="feedUrls" rows="2" placeholder="https://"></textarea>
|
||||||
|
</label>
|
||||||
|
<div class="wi-links__apply-row">
|
||||||
|
<label class="wi-links__apply-field">
|
||||||
|
<span th:text="'验证码 *'">验证码 *</span>
|
||||||
|
<input type="text" name="captchaCode" required maxlength="8" autocomplete="off" placeholder="图中五位字符" />
|
||||||
|
</label>
|
||||||
|
<div class="wi-links__apply-captcha">
|
||||||
|
<img
|
||||||
|
class="wi-links__apply-captcha-img"
|
||||||
|
th:src="@{/links/apply/captcha}"
|
||||||
|
alt="验证码"
|
||||||
|
width="120"
|
||||||
|
height="44"
|
||||||
|
loading="lazy"
|
||||||
|
title="点击刷新验证码"
|
||||||
|
onclick="this.src=this.src.split('?')[0]+'?ts='+Date.now()"
|
||||||
|
th:onerror="|this.closest('.wi-links__apply').classList.add('wi-links__apply--unavailable')|"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<button class="wi-links__apply-submit" type="submit" th:text="'提交申请'">提交申请</button>
|
||||||
|
</form>
|
||||||
|
<p
|
||||||
|
class="wi-links__apply-unavailable-tip"
|
||||||
|
th:text="'友链申请暂未开放。'"
|
||||||
|
hidden
|
||||||
|
></p>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div class="wi-links__comment" th:if="${theme.config?.links?.links_show_comment == true}">
|
<div class="wi-links__comment" th:if="${theme.config?.links?.links_show_comment == true}">
|
||||||
<halo:comment group="plugin.halo.run" kind="Plugin" name="PluginLinks"></halo:comment>
|
<halo:comment group="plugin.halo.run" kind="Plugin" name="PluginLinks"></halo:comment>
|
||||||
</div>
|
</div>
|
||||||
@@ -189,6 +275,132 @@ import Layout from "../layouts/Layout.astro";
|
|||||||
margin-top: var(--space-3xl);
|
margin-top: var(--space-3xl);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* ===== 友链申请表单 ===== */
|
||||||
|
.wi-links__apply {
|
||||||
|
margin-top: var(--space-3xl);
|
||||||
|
padding: var(--space-xl);
|
||||||
|
border: 1px solid var(--rule);
|
||||||
|
border-radius: var(--radius-lg, 16px);
|
||||||
|
background: var(--bg-raised);
|
||||||
|
}
|
||||||
|
|
||||||
|
.wi-links__apply-title {
|
||||||
|
text-align: center;
|
||||||
|
font-size: var(--text-xl);
|
||||||
|
font-weight: 700;
|
||||||
|
color: var(--ink);
|
||||||
|
margin-bottom: var(--space-lg);
|
||||||
|
}
|
||||||
|
|
||||||
|
.wi-links__apply-result {
|
||||||
|
text-align: center;
|
||||||
|
font-size: var(--text-sm);
|
||||||
|
color: var(--accent);
|
||||||
|
margin-bottom: var(--space-md);
|
||||||
|
}
|
||||||
|
|
||||||
|
.wi-links__apply-result--error {
|
||||||
|
color: #e6162d;
|
||||||
|
}
|
||||||
|
|
||||||
|
html.dark .wi-links__apply-result--error {
|
||||||
|
color: #ff6b6b;
|
||||||
|
}
|
||||||
|
|
||||||
|
.wi-links__apply-form {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: var(--space-md);
|
||||||
|
}
|
||||||
|
|
||||||
|
.wi-links__apply-row {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: 1fr 1fr;
|
||||||
|
gap: var(--space-md);
|
||||||
|
}
|
||||||
|
|
||||||
|
.wi-links__apply-field {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 0.35rem;
|
||||||
|
font-size: var(--text-sm);
|
||||||
|
color: var(--ink-2);
|
||||||
|
}
|
||||||
|
|
||||||
|
.wi-links__apply-field input,
|
||||||
|
.wi-links__apply-field textarea {
|
||||||
|
padding: 0.6rem 0.8rem;
|
||||||
|
border: 1px solid var(--rule);
|
||||||
|
border-radius: 10px;
|
||||||
|
background: var(--bg);
|
||||||
|
color: var(--ink);
|
||||||
|
font-family: inherit;
|
||||||
|
font-size: var(--text-sm);
|
||||||
|
transition: border-color 0.15s ease, box-shadow 0.15s ease;
|
||||||
|
resize: vertical;
|
||||||
|
}
|
||||||
|
|
||||||
|
.wi-links__apply-field input:focus,
|
||||||
|
.wi-links__apply-field textarea:focus {
|
||||||
|
outline: none;
|
||||||
|
border-color: var(--accent);
|
||||||
|
box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 15%, transparent);
|
||||||
|
}
|
||||||
|
|
||||||
|
.wi-links__apply-captcha {
|
||||||
|
display: flex;
|
||||||
|
align-items: flex-end;
|
||||||
|
padding-bottom: 2px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.wi-links__apply-captcha-img {
|
||||||
|
border-radius: 8px;
|
||||||
|
border: 1px solid var(--rule);
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.wi-links__apply-submit {
|
||||||
|
align-self: center;
|
||||||
|
padding: 0.65rem 2.2rem;
|
||||||
|
min-height: 44px;
|
||||||
|
border: none;
|
||||||
|
border-radius: 9999px;
|
||||||
|
font-size: var(--text-sm);
|
||||||
|
font-weight: 600;
|
||||||
|
font-family: inherit;
|
||||||
|
color: #fff;
|
||||||
|
background: linear-gradient(135deg, var(--accent), color-mix(in srgb, var(--accent) 70%, #000));
|
||||||
|
cursor: pointer;
|
||||||
|
transition: transform var(--duration-fast) var(--ease-out-quart), opacity 0.15s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.wi-links__apply-submit:hover {
|
||||||
|
transform: translateY(-1px);
|
||||||
|
opacity: 0.95;
|
||||||
|
}
|
||||||
|
|
||||||
|
.wi-links__apply-submit:active {
|
||||||
|
transform: translateY(0) scale(0.98);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 插件未开放申请时(验证码 404)自动隐藏表单并提示 */
|
||||||
|
.wi-links__apply--unavailable .wi-links__apply-form {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.wi-links__apply--unavailable .wi-links__apply-unavailable-tip {
|
||||||
|
display: block !important;
|
||||||
|
text-align: center;
|
||||||
|
color: var(--ink-3);
|
||||||
|
font-size: var(--text-sm);
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 640px) {
|
||||||
|
.wi-links__apply-row {
|
||||||
|
grid-template-columns: 1fr;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.wi-links__title {
|
.wi-links__title {
|
||||||
font-size: var(--text-4xl);
|
font-size: var(--text-4xl);
|
||||||
margin-bottom: var(--space-xs);
|
margin-bottom: var(--space-xs);
|
||||||
|
|||||||
+70
-2
@@ -31,6 +31,28 @@ import LightGallery from "../components/LightGallery.astro";
|
|||||||
<div class="wi-moments-page__cards" th:if="${theme.config?.moments?.moments_style == 'cards' or theme.config?.moments?.moments_style == null or theme.config?.moments?.moments_style == 'timeline'}">
|
<div class="wi-moments-page__cards" th:if="${theme.config?.moments?.moments_style == 'cards' or theme.config?.moments?.moments_style == null or theme.config?.moments?.moments_style == 'timeline'}">
|
||||||
<th:block th:if="${momentsResult != null and not #lists.isEmpty(momentsResult.items)}">
|
<th:block th:if="${momentsResult != null and not #lists.isEmpty(momentsResult.items)}">
|
||||||
<div class="wi-moments-page__card-item" th:each="moment : ${momentsResult.items}">
|
<div class="wi-moments-page__card-item" th:each="moment : ${momentsResult.items}">
|
||||||
|
<div class="wi-moments-page__card-layout">
|
||||||
|
<img
|
||||||
|
th:if="${moment.owner != null and !#strings.isEmpty(moment.owner.avatar)}"
|
||||||
|
class="wi-moments-page__avatar"
|
||||||
|
th:src="${moment.owner.avatar}"
|
||||||
|
th:alt="''"
|
||||||
|
loading="lazy"
|
||||||
|
decoding="async"
|
||||||
|
/>
|
||||||
|
<div
|
||||||
|
th:unless="${moment.owner != null and !#strings.isEmpty(moment.owner.avatar)}"
|
||||||
|
class="wi-moments-page__avatar wi-moments-page__avatar--fallback"
|
||||||
|
aria-hidden="true"
|
||||||
|
>
|
||||||
|
<span th:text="${#strings.substring(site.title, 0, 1)}"></span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="wi-moments-page__main">
|
||||||
|
<div
|
||||||
|
class="wi-moments-page__name"
|
||||||
|
th:text="${moment.owner != null and !#strings.isEmpty(moment.owner.displayName) ? moment.owner.displayName : site.title}"
|
||||||
|
></div>
|
||||||
<div class="wi-moments-page__card-text" th:utext="${moment.spec?.content?.html ?: moment.spec?.content?.raw ?: moment.spec?.content}"></div>
|
<div class="wi-moments-page__card-text" th:utext="${moment.spec?.content?.html ?: moment.spec?.content?.raw ?: moment.spec?.content}"></div>
|
||||||
<div class="wi-moments-page__card-media" th:if="${moment.spec.content.medium != null and !#lists.isEmpty(moment.spec.content.medium)}">
|
<div class="wi-moments-page__card-media" th:if="${moment.spec.content.medium != null and !#lists.isEmpty(moment.spec.content.medium)}">
|
||||||
<th:block th:each="media : ${moment.spec.content.medium}">
|
<th:block th:each="media : ${moment.spec.content.medium}">
|
||||||
@@ -75,6 +97,8 @@ import LightGallery from "../components/LightGallery.astro";
|
|||||||
th:attr="name=${moment.metadata.name}"
|
th:attr="name=${moment.metadata.name}"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
</div> <!-- /__main -->
|
||||||
|
</div> <!-- /__card-layout -->
|
||||||
</div>
|
</div>
|
||||||
</th:block>
|
</th:block>
|
||||||
<th:block th:if="${momentsResult == null or #lists.isEmpty(momentsResult.items)}">
|
<th:block th:if="${momentsResult == null or #lists.isEmpty(momentsResult.items)}">
|
||||||
@@ -527,6 +551,43 @@ import LightGallery from "../components/LightGallery.astro";
|
|||||||
transform: translateY(-3px);
|
transform: translateY(-3px);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* 朋友圈式布局:头像在左,昵称/正文/九宫格在右 */
|
||||||
|
.wi-moments-page__card-layout {
|
||||||
|
display: flex;
|
||||||
|
gap: var(--space-md);
|
||||||
|
align-items: flex-start;
|
||||||
|
}
|
||||||
|
|
||||||
|
.wi-moments-page__avatar {
|
||||||
|
flex-shrink: 0;
|
||||||
|
width: 44px;
|
||||||
|
height: 44px;
|
||||||
|
border-radius: 10px;
|
||||||
|
object-fit: cover;
|
||||||
|
}
|
||||||
|
|
||||||
|
.wi-moments-page__avatar--fallback {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
background: color-mix(in srgb, var(--accent) 14%, transparent);
|
||||||
|
color: var(--accent);
|
||||||
|
font-weight: 700;
|
||||||
|
font-size: var(--text-lg);
|
||||||
|
}
|
||||||
|
|
||||||
|
.wi-moments-page__main {
|
||||||
|
flex: 1;
|
||||||
|
min-width: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.wi-moments-page__name {
|
||||||
|
font-size: var(--text-base);
|
||||||
|
font-weight: 600;
|
||||||
|
color: var(--accent);
|
||||||
|
margin-bottom: var(--space-xs);
|
||||||
|
}
|
||||||
|
|
||||||
.wi-moments-page__card-text {
|
.wi-moments-page__card-text {
|
||||||
font-size: var(--text-base);
|
font-size: var(--text-base);
|
||||||
line-height: var(--leading-relaxed);
|
line-height: var(--leading-relaxed);
|
||||||
@@ -568,8 +629,15 @@ import LightGallery from "../components/LightGallery.astro";
|
|||||||
grid-template-columns: repeat(2, 1fr);
|
grid-template-columns: repeat(2, 1fr);
|
||||||
}
|
}
|
||||||
|
|
||||||
.wi-moments-page__card-media:has(.wi-moments-page__card-image:nth-child(4)) {
|
/* 微信九宫格规则:4 张时 2x2 排布 */
|
||||||
grid-template-columns: repeat(3, 1fr);
|
.wi-moments-page__card-media:has(.wi-moments-page__card-image:nth-child(4)):not(:has(.wi-moments-page__card-image:nth-child(5))) {
|
||||||
|
grid-template-columns: repeat(2, 1fr);
|
||||||
|
max-width: 72%;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 三列九宫格限制宽度,避免大屏下图片单元过大 */
|
||||||
|
.wi-moments-page__card-media:has(.wi-moments-page__card-image:nth-child(3)) {
|
||||||
|
max-width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.wi-moments-page__card-footer {
|
.wi-moments-page__card-footer {
|
||||||
|
|||||||
+49
-5
@@ -69,6 +69,14 @@ import Layout from "../layouts/Layout.astro";
|
|||||||
.then(function (html) {
|
.then(function (html) {
|
||||||
container.innerHTML = html;
|
container.innerHTML = html;
|
||||||
|
|
||||||
|
/* 笔记弹窗是 position:fixed,但 innerHTML 会把它留在 .wi-main 内,
|
||||||
|
而 .wi-main 有自己的层叠上下文(z-index:1),导致弹窗被导航栏
|
||||||
|
(z-index:100)和页脚遮挡。移到 body 下即可恢复正常层级。 */
|
||||||
|
var modal = document.getElementById("wrNotesModal");
|
||||||
|
if (modal && modal.parentNode !== document.body) {
|
||||||
|
document.body.appendChild(modal);
|
||||||
|
}
|
||||||
|
|
||||||
/* innerHTML 插入的脚本不会执行,需要重建后才会运行 */
|
/* innerHTML 插入的脚本不会执行,需要重建后才会运行 */
|
||||||
var oldScripts = container.querySelectorAll("script");
|
var oldScripts = container.querySelectorAll("script");
|
||||||
Array.prototype.forEach.call(oldScripts, function (oldScript) {
|
Array.prototype.forEach.call(oldScripts, function (oldScript) {
|
||||||
@@ -149,6 +157,19 @@ import Layout from "../layouts/Layout.astro";
|
|||||||
padding-top: 0;
|
padding-top: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* 统计数据水平居中,紧贴主题标题区(标题 + 强调线)下方 */
|
||||||
|
.wi-weread__shelf :global(.wr-head) {
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.wi-weread__shelf :global(.wr-head-stats) {
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.wi-weread__shelf :global(.wr-head-stats span) {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
.wi-weread__shelf :global(img) {
|
.wi-weread__shelf :global(img) {
|
||||||
max-width: 100%;
|
max-width: 100%;
|
||||||
height: auto;
|
height: auto;
|
||||||
@@ -161,12 +182,13 @@ import Layout from "../layouts/Layout.astro";
|
|||||||
|
|
||||||
/* ===== 暗黑模式:插件内容为苹果风格浅色配色,深色下需要接管 ===== */
|
/* ===== 暗黑模式:插件内容为苹果风格浅色配色,深色下需要接管 ===== */
|
||||||
|
|
||||||
/* 覆盖插件内部变量(按其命名约定 --wr-*,未命中也无副作用) */
|
/* 覆盖插件内部变量(按其命名约定 --wr-*,未命中也无副作用)。
|
||||||
|
--wr-line 比全站分隔线略亮:年份分组等装饰线在深色底上需要保证可见 */
|
||||||
html.dark .wi-weread__shelf :global(.wr-shelf) {
|
html.dark .wi-weread__shelf :global(.wr-shelf) {
|
||||||
--wr-ink: var(--ink);
|
--wr-ink: var(--ink);
|
||||||
--wr-muted: var(--ink-2);
|
--wr-muted: var(--ink-2);
|
||||||
--wr-bg: var(--bg-raised);
|
--wr-bg: var(--bg-raised);
|
||||||
--wr-line: var(--rule);
|
--wr-line: #4a4238;
|
||||||
--wr-fill: color-mix(in srgb, var(--ink) 8%, transparent);
|
--wr-fill: color-mix(in srgb, var(--ink) 8%, transparent);
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -179,8 +201,30 @@ import Layout from "../layouts/Layout.astro";
|
|||||||
color: var(--ink-2);
|
color: var(--ink-2);
|
||||||
}
|
}
|
||||||
|
|
||||||
/* 笔记弹窗浅色底在深色页面中过于突兀 */
|
/* ===== 笔记弹窗:运行时被移到 body 下,脱离了 .wr-shelf 的变量作用域,
|
||||||
html.dark .wi-weread__shelf :global(.wr-notes-modal) {
|
需要独立适配(选择器整体 :global,否则 scoped 属性匹配不到注入节点) ===== */
|
||||||
background: color-mix(in srgb, var(--bg) 94%, transparent);
|
:global(html.dark .wr-notes-modal) {
|
||||||
|
--wr-ink: var(--ink);
|
||||||
|
--wr-muted: var(--ink-2);
|
||||||
|
--wr-bg: var(--bg-raised);
|
||||||
|
--wr-line: #4a4238;
|
||||||
|
--wr-fill: color-mix(in srgb, var(--ink) 8%, transparent);
|
||||||
|
}
|
||||||
|
|
||||||
|
:global(html.dark .wr-notes-dialog) {
|
||||||
|
background: var(--bg-raised);
|
||||||
|
}
|
||||||
|
|
||||||
|
:global(html.dark .wr-notes-close) {
|
||||||
|
background: color-mix(in srgb, var(--ink) 10%, transparent);
|
||||||
|
color: var(--ink);
|
||||||
|
}
|
||||||
|
|
||||||
|
:global(html.dark .wr-notes-modal :where(h3, h4, strong)) {
|
||||||
|
color: var(--ink);
|
||||||
|
}
|
||||||
|
|
||||||
|
:global(html.dark .wr-notes-modal :where(p, span, small, em, li)) {
|
||||||
|
color: var(--ink-2);
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
+1
-1
@@ -28,7 +28,7 @@ spec:
|
|||||||
description: 微信读书书架(依赖微信读书插件)
|
description: 微信读书书架(依赖微信读书插件)
|
||||||
screenshot:
|
screenshot:
|
||||||
file: weread.html
|
file: weread.html
|
||||||
version: "1.1.7"
|
version: "1.1.9"
|
||||||
requires: ">=2.24.0"
|
requires: ">=2.24.0"
|
||||||
license:
|
license:
|
||||||
- name: "GPL-3.0"
|
- name: "GPL-3.0"
|
||||||
|
|||||||
Reference in New Issue
Block a user