Files
wordpress-theme-aksrt/assets/css/frontend/pages/base-3.css
T

194 lines
4.0 KiB
CSS
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
.category-recommend-card__post-title:hover {
color: var(--color-primary);
}
.category-recommend-card__post-date {
flex-shrink: 0;
font-size: 12px;
color: var(--color-ink-4);
}
.category-recommend-card__more {
padding: 12px 16px;
text-align: center;
border-top: 1px solid var(--color-line);
}
.category-recommend-card__more a {
font-size: 14px;
font-weight: 600;
color: var(--color-primary);
transition: color 0.15s ease;
}
.category-recommend-card__more a:hover {
color: var(--color-primary-dark);
text-decoration: underline;
}
/* 分类推荐懒加载骨架 */
.category-recommend-card__hero .aksrt-skeleton {
position: absolute;
inset: 0;
}
.category-recommend-card__hero img.aksrt-lazy {
opacity: 0;
transition: opacity 0.3s ease;
}
.category-recommend-card__hero img.aksrt-loaded {
opacity: 1;
}
/* 分类推荐响应式 */
@media (max-width: 767px) {
.category-recommend {
margin: 24px auto;
padding: 0 16px;
}
.category-recommend__title {
font-size: 20px;
}
.category-recommend__grid {
grid-template-columns: 1fr;
gap: 16px;
}
.category-recommend-card__name {
font-size: 16px;
}
.category-recommend-card__meta {
padding: 12px 14px 10px;
}
.category-recommend-card__posts {
padding: 0 14px;
}
}
/* ============================================================
* 通知"敬请期待"占位(profile dashboard)
* ============================================================ */
.notif-coming-soon {
text-align: center;
padding: var(--space-9, 48px) var(--space-5, 20px) !important;
}
.notif-coming-soon__icon {
width: 64px;
height: 64px;
margin: 0 auto var(--space-4, 16px);
display: inline-flex;
align-items: center;
justify-content: center;
border-radius: var(--radius-pill);
background: var(--color-primary-soft, var(--color-primary-50));
color: var(--color-primary);
}
.notif-coming-soon__icon svg {
width: 32px;
height: 32px;
}
.notif-coming-soon__title {
font-size: var(--text-lg, 1.25rem);
font-weight: 700;
margin: 0 0 var(--space-2, 8px);
color: var(--color-ink);
}
.notif-coming-soon__pill {
display: inline-block;
padding: 4px 12px;
margin: 0 0 var(--space-3, 12px);
font-size: 0.75rem;
font-weight: 600;
letter-spacing: 0.04em;
background: var(--color-primary-soft, var(--color-primary-50));
color: var(--color-primary-active, var(--color-primary-dark));
border-radius: var(--radius-pill);
}
.notif-coming-soon__desc {
max-width: 420px;
margin: 0 auto;
font-size: var(--text-sm, 0.875rem);
line-height: var(--leading-relaxed, 1.7);
color: var(--color-ink-3);
}
/* ============================================================
* Forum Page
* ============================================================ */
.aksrt-forum-header {
padding: clamp(32px, 5vw, 64px) 0 clamp(16px, 3vw, 32px);
background: linear-gradient(135deg, var(--color-primary-soft, #e6f4ff) 0%, var(--surface-2, #f5f7fa) 100%);
margin-bottom: 32px;
text-align: center;
}
.aksrt-forum-header__title {
font: 700 clamp(28px, 4vw, 40px)/1.15 var(--font-display, inherit);
margin: 0 0 8px;
color: var(--color-ink);
}
.aksrt-forum-header__desc {
margin: 0 0 24px;
color: var(--color-ink-2, #666);
font-size: 15px;
}
.aksrt-forum-header__stats {
display: flex;
justify-content: center;
gap: 32px;
}
.aksrt-forum-header__stat-num {
display: block;
font-size: 28px;
font-weight: 700;
color: var(--color-primary);
}
.aksrt-forum-header__stat-label {
font-size: 13px;
color: var(--color-ink-3, #999);
}
.aksrt-forum__layout {
display: grid;
grid-template-columns: 1fr 280px;
gap: 24px;
}
@media (max-width: 1023px) {
.aksrt-forum__layout {
grid-template-columns: 1fr;
}
}
.aksrt-forum-section__title {
display: flex;
align-items: center;
gap: 8px;
font-size: 16px;
font-weight: 600;
color: var(--color-ink);
margin: 0 0 16px;
padding-bottom: 8px;
border-bottom: 1px solid var(--color-line, #e8e8e8);
}
.aksrt-forum-section__title i {
color: var(--color-primary);
}