/* ================================================== MindLynx Theme — Custom Styles Theme toggle: [data-theme="dark"] on ================================================== */ /* ===== CSS Variables ===== */ :root { --mlx-hero-gradient: linear-gradient(135deg, #0f0c29 0%, #302b63 25%, #4f46e5 50%, #1e1b4b 75%, #111827 100%); --mlx-hero-gradient-dark: linear-gradient(135deg, #020617 0%, #1e1b4b 30%, #312e81 60%, #020617 100%); --mlx-bg: #f3f4f6; --mlx-bg-card: #ffffff; --mlx-text: #111827; --mlx-text-secondary: #6b7280; --mlx-border: rgba(0,0,0,0.08); --mlx-header-bg: rgba(243,244,246,0.82); } body { text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; background-color: var(--mlx-bg); color: var(--mlx-text); line-height: 1.75; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif; } /* ===== Header / Navigation ===== */ .mindlynx-header { position: fixed; top: 0; left: 0; right: 0; z-index: 50; border-bottom: 1px solid var(--mlx-border); transition: background-color 0.3s, border-color 0.3s; } .mindlynx-header::before { content: ''; position: absolute; inset: 0; z-index: -1; background: var(--mlx-header-bg); backdrop-filter: saturate(180%) blur(20px); -webkit-backdrop-filter: saturate(180%) blur(20px); will-change: backdrop-filter; } .mindlynx-header > .wp-block-group { position: relative; max-width: 1200px; margin: 0 auto; } .mindlynx-header .wp-block-site-title { font-weight: 700; font-size: 1.25rem; display: flex; align-items: center; gap: 0.55rem; } .mindlynx-header .wp-block-site-title a { text-decoration: none; color: var(--mlx-text); } /* Site icon via CSS — shows left of site name, bypasses FSE template cache */ .mindlynx-header .wp-block-site-title::before { content: ''; display: inline-block; flex-shrink: 0; width: 28px; height: 28px; border-radius: 7px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='28' viewBox='0 0 32 32' fill='none'%3E%3Ccircle cx='10' cy='16' r='3' fill='white' opacity='0.9'/%3E%3Ccircle cx='16' cy='10' r='2.5' fill='white' opacity='0.7'/%3E%3Ccircle cx='22' cy='16' r='3' fill='white' opacity='0.9'/%3E%3Ccircle cx='16' cy='22' r='2.5' fill='white' opacity='0.7'/%3E%3Cline x1='12.5' y1='14.5' x2='14' y2='11.5' stroke='white' stroke-width='1' stroke-opacity='0.5'/%3E%3Cline x1='19.5' y1='14.5' x2='18' y2='11.5' stroke='white' stroke-width='1' stroke-opacity='0.5'/%3E%3Cline x1='12.5' y1='17.5' x2='14' y2='20.5' stroke='white' stroke-width='1' stroke-opacity='0.5'/%3E%3Cline x1='19.5' y1='17.5' x2='18' y2='20.5' stroke='white' stroke-width='1' stroke-opacity='0.5'/%3E%3C/svg%3E"); background-size: cover; background-position: center; } /* Navigation items — bold + hover effects */ .mindlynx-header .wp-block-navigation-item__content { font-weight: 700; font-size: 0.95rem; padding: 0.5rem 0.75rem; border-radius: 0.5rem; transition: background-color 0.2s, color 0.2s; } .mindlynx-header .wp-block-navigation-item__content:hover { background: rgba(99,102,241,0.08); color: var(--wp--preset--color--primary); } .mindlynx-header .wp-block-navigation-item.current-menu-item .wp-block-navigation-item__content { color: var(--wp--preset--color--primary); } /* 平板/手机横屏：只显示 "MindLynx"，节省空间 */ @media (max-width: 1024px) { .mindlynx-header .wp-block-site-title a { font-size: 0; } .mindlynx-header .wp-block-site-title a::after { content: "MindLynx"; font-size: 1rem; font-weight: 700; display: inline-block; vertical-align: middle; } } /* 移动端汉堡菜单 */ @media (max-width: 768px) { /* 允许背景滚动 */ html.has-modal-open { overflow: auto; } body .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open.is-menu-open { left: auto; right: 0; width: 30%; max-width: 280px; background: rgba(255,255,255,0.72); backdrop-filter: saturate(180%) blur(20px); -webkit-backdrop-filter: saturate(180%) blur(20px); } body .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open.is-menu-open::before { display: none; } [data-theme="dark"] body .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open.is-menu-open { background: rgba(17,24,39,0.82); } body .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content, body .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container, body .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item { align-items: center; } } #mlx-theme-toggle { display: inline-flex; align-items: center; justify-content: center; cursor: pointer; font-size: 1.1rem; border: none; background: none; padding: 0; color: var(--mlx-text); line-height: 1; transition: color 0.2s; } #mlx-theme-toggle:hover { color: var(--wp--preset--color--primary); } #mindlynx-progress { position: fixed; top: 0; left: 0; z-index: 999; height: 3px; background: linear-gradient(90deg, var(--wp--preset--color--primary), #8b5cf6, #ec4899); width: 0; transition: width 0.1s linear; pointer-events: none; } /* ===== Hero ===== */ .mindlynx-hero.wp-block-cover { position: relative; overflow: clip !important; } .mindlynx-hero .wp-block-cover__inner-container { overflow: visible !important; } .mindlynx-hero .wp-block-cover__background.has-background-dim { background: radial-gradient(ellipse at center, transparent 20%, rgba(0,0,0,0.5) 100%); backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px); } .mindlynx-hero-content { max-width: 100%; margin: 0 auto; text-align: center; background: rgba(0,0,0,0.15); backdrop-filter: blur(16px) saturate(140%); -webkit-backdrop-filter: blur(16px) saturate(140%); padding: 2.5rem 2rem; border-top: 1px solid rgba(255,255,255,0.1); border-bottom: 1px solid rgba(255,255,255,0.1); position: sticky; top: 5rem; } .mindlynx-hero-label { display: inline-flex; align-items: center; gap: 0.5rem; border-radius: 9999px; width: fit-content; max-width: 100%; border: 1px solid rgba(255,255,255,0.4); background: linear-gradient(135deg, rgba(251,191,36,0.15), rgba(239,68,68,0.22)); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); padding: 0.65rem 1.5rem; margin: 0 auto 1.5rem; animation: mlx-float 3s ease-in-out infinite; } .mindlynx-hero-label-dot { width: 0.5rem; height: 0.5rem; border-radius: 6px; flex-shrink: 0; animation: mlx-pulse 2s ease-in-out infinite; margin: 0; } .mindlynx-hero-label-dot img { width: 100%; height: 100%; display: block; border-radius: 6px; } .mindlynx-hero-label-text { font-size: 0.875rem; font-weight: 600; color: rgba(255,255,255,0.9); margin: 0; } .mindlynx-hero .wp-block-heading.mindlynx-hero-title, .mindlynx-hero .wp-block-site-title.mindlynx-hero-title { font-size: clamp(2rem, 5vw, 3.75rem); font-weight: 800; line-height: 1.15; color: #fff; text-shadow: 0 2px 20px rgba(0,0,0,0.5); margin-bottom: 1rem; } .mindlynx-hero .mindlynx-hero-subtitle, .mindlynx-hero .wp-block-site-tagline.mindlynx-hero-subtitle { font-size: clamp(1rem, 2vw, 1.2rem); color: rgba(255,255,255,0.85); max-width: 600px; margin: 0 auto 2rem; line-height: 1.8; } .mindlynx-hero-btn-primary .wp-block-button__link { background: linear-gradient(135deg, var(--wp--preset--color--primary), #8b5cf6); color: #fff; padding: 0.875rem 2rem; border-radius: 9999px; font-weight: 600; box-shadow: 0 4px 15px rgba(99,102,241,0.4); text-decoration: none; border: none; transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.3s ease; } .mindlynx-hero-btn-primary .wp-block-button__link:hover { transform: translateY(-2px); box-shadow: 0 8px 25px rgba(99,102,241,0.5); } .mindlynx-hero-btn-secondary .wp-block-button__link { background: rgba(255,255,255,0.15); color: #fff; padding: 0.875rem 2rem; border-radius: 9999px; font-weight: 600; backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border: 1px solid rgba(255,255,255,0.3); text-decoration: none; transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1), background 0.3s ease; } .mindlynx-hero-btn-secondary .wp-block-button__link:hover { transform: translateY(-2px); background: rgba(255,255,255,0.25); } .mindlynx-hero-buttons { gap: 1rem; } .mindlynx-hero-arrow { position: fixed; bottom: 1.5rem; left: 50%; transform: translateX(-50%); z-index: 10; cursor: pointer; animation: mlx-bouncy 2s ease-in-out infinite; } /* ===== Category / Archive Hero ===== */ .mindlynx-category-hero { background: var(--mlx-hero-gradient); } .mindlynx-category-hero .wp-block-cover__background.has-background-dim { background: radial-gradient(ellipse at center, transparent 20%, rgba(0,0,0,0.5) 100%); backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px); } .mindlynx-category-hero-content { text-align: center; } .mindlynx-category-icon-box, .mindlynx-category-hero-content .wp-block-group.mindlynx-category-icon-box { display: none; } .mindlynx-category-icon { display: flex; align-items: center; justify-content: center; width: 4rem; height: 4rem; border-radius: 1rem; background: rgba(255,255,255,0.12); border: 1px solid rgba(255,255,255,0.2); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); margin: 0 auto; } .mindlynx-category-title { font-size: clamp(2rem, 5vw, 3rem); font-weight: 800; color: #fff; text-shadow: 0 2px 20px rgba(0,0,0,0.5); margin-bottom: 0.75rem; } .mindlynx-category-desc { font-size: 1.05rem; color: rgba(255,255,255,0.8); max-width: 600px; margin: 0 auto 1.5rem; line-height: 1.7; } .mindlynx-category-stats { gap: 1.5rem; } .mindlynx-category-stat-item { font-size: 0.9rem; color: rgba(255,255,255,0.65); margin: 0; } .mindlynx-category-stat-value { /* 数量由 PHP 通过 ::after 动态注入 */ display: inline-block; } /* ===== Posts ===== */ .mindlynx-posts-section { max-width: 1200px; margin: 0 auto; padding: var(--wp--preset--spacing--50) var(--wp--preset--spacing--30); } .mindlynx-posts-section h2 { font-size: var(--wp--preset--font-size--3xl); font-weight: 700; margin-bottom: var(--wp--preset--spacing--40); } .wp-block-query .wp-block-post { background: var(--mlx-bg-card); border: 1px solid var(--mlx-border); border-radius: 1rem; overflow: hidden; transition: transform 0.35s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.35s ease; display: flex; flex-direction: column; position: relative; } .wp-block-query .wp-block-post::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: linear-gradient(90deg, var(--wp--preset--color--primary), #8b5cf6, #ec4899); transform: scaleX(0); transform-origin: center; transition: transform 0.35s ease; z-index: 2; } .wp-block-query .wp-block-post:hover { transform: translateY(-4px); box-shadow: var(--wp--preset--shadow--lg); } .wp-block-query .wp-block-post:hover::before { transform: scaleX(1); } .wp-block-query .wp-block-post .wp-block-post-featured-image { margin: 0; aspect-ratio: 16/9; overflow: hidden; } .wp-block-query .wp-block-post .wp-block-post-featured-image img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.5s ease; will-change: transform; } .wp-block-query .wp-block-post:hover .wp-block-post-featured-image img { transform: scale(1.05); } /* Card content area */ .wp-block-query .wp-block-post > .wp-block-group { flex: 1; display: flex; flex-direction: column; } .wp-block-query .wp-block-post > .wp-block-group > :last-child { margin-top: auto; } /* Category pills — 叠加在缩略图右上角 */ .wp-block-query .wp-block-post-terms { display: flex; flex-wrap: wrap; gap: 0.35rem; margin: 0; position: absolute; top: 0.6rem; right: 0.6rem; z-index: 3; } .wp-block-query .wp-block-post-terms a { display: inline-block; background: rgba(0,0,0,0.55); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); color: rgba(255,255,255,0.9); padding: 0.15rem 0.55rem; border-radius: 9999px; font-size: 0.68rem; font-weight: 600; letter-spacing: 0.04em; text-decoration: none; transition: background 0.2s; } .wp-block-query .wp-block-post-terms a:hover { background: var(--wp--preset--color--primary); color: #fff; } /* Title */ .wp-block-query .wp-block-post-title { font-size: 1rem; font-weight: 700; line-height: 1.3; margin: 0; } .wp-block-query .wp-block-post-title a { color: var(--mlx-text); text-decoration: none; transition: color 0.2s; } .wp-block-query .wp-block-post:hover .wp-block-post-title a { color: var(--wp--preset--color--primary); } /* Date */ .wp-block-query .wp-block-post-date { font-size: 0.72rem; color: var(--mlx-text-secondary); margin: 0; } /* Excerpt */ .wp-block-query .wp-block-post-excerpt { font-size: 0.82rem; color: var(--wp--preset--color--gray-500); line-height: 1.45; margin: 0; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } .wp-block-query .wp-block-post-excerpt__more-text { display: none; } /* Card content area — 紧凑 padding */ .wp-block-query .wp-block-post > .wp-block-group { flex: 1; display: flex; flex-direction: column; padding: 0.75rem 0.85rem; gap: 0.3rem; } .wp-block-query .wp-block-post > .wp-block-group > :last-child { margin-top: auto; } .wp-block-query .wp-block-post-terms a { display: inline-block; background: rgba(99,102,241,0.08); color: var(--wp--preset--color--primary); padding: 0.15rem 0.6rem; border-radius: 9999px; font-size: 0.7rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; text-decoration: none; transition: background 0.2s, color 0.2s; } .wp-block-query .wp-block-post-terms a:hover { background: var(--wp--preset--color--primary); color: #fff; } /* Title */ .wp-block-query .wp-block-post-title { font-size: 1.05rem; font-weight: 700; line-height: 1.35; margin: 0; } .wp-block-query .wp-block-post-title a { color: var(--mlx-text); text-decoration: none; transition: color 0.2s; } .wp-block-query .wp-block-post:hover .wp-block-post-title a { color: var(--wp--preset--color--primary); } /* Date */ .wp-block-query .wp-block-post-date { font-size: 0.78rem; color: var(--mlx-text-secondary); margin: 0; } /* Excerpt */ .wp-block-query .wp-block-post-excerpt { font-size: 0.85rem; color: var(--wp--preset--color--gray-500); line-height: 1.55; margin: 0; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } .wp-block-query .wp-block-post-excerpt__more-text { display: none; } /* ===== Single Post Hero ===== */ .mindlynx-single-hero { background: var(--mlx-hero-gradient); } .mindlynx-single-hero .wp-block-cover__background.has-background-dim { background: radial-gradient(ellipse at center, transparent 10%, rgba(0,0,0,0.6) 100%); backdrop-filter: blur(2px); -webkit-backdrop-filter: blur(2px); } .mindlynx-single-hero-content { text-align: center; } .mindlynx-single-hero-cats { display: flex; flex-wrap: wrap; gap: 0.5rem; justify-content: center; margin-bottom: 1rem; } .mindlynx-single-hero-cats a { display: inline-block; background: rgba(255,255,255,0.15); color: rgba(255,255,255,0.9); padding: 0.25rem 0.8rem; border-radius: 9999px; font-size: 0.75rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; text-decoration: none; backdrop-filter: blur(4px); transition: background 0.2s; } .mindlynx-single-hero-cats a:hover { background: rgba(255,255,255,0.3); } .mindlynx-single-hero-title { font-size: clamp(1.75rem, 4vw, 2.75rem); font-weight: 800; color: #fff; text-shadow: 0 2px 15px rgba(0,0,0,0.5); line-height: 1.2; margin-bottom: 0.75rem; } .mindlynx-single-hero-meta { gap: 1rem; font-size: 0.85rem; color: rgba(255,255,255,0.75); } .mindlynx-single-hero-meta a { color: rgba(255,255,255,0.9); text-decoration: none; } .mindlynx-single-hero-meta a:hover { text-decoration: underline; } /* ===== Code & Syntax Highlighting ===== */ /* highlight.js handles token colors — we style containers and inline code */ .entry-content, .wp-block-post-content { font-size: 1rem; line-height: 1.75; } /* Inline code */ .entry-content code, .wp-block-post-content code { background: rgba(0,0,0,0.06); padding: 0.15rem 0.45rem; border-radius: 5px; font-family: 'SF Mono', 'Fira Code', 'Cascadia Code', Consolas, monospace; font-size: 0.88em; color: #be185d; word-break: break-word; } /* Code blocks — covers pre.codehilite, .wp-block-code, .wp-block-preformatted */ .entry-content pre, .wp-block-post-content pre, .entry-content .codehilite, .wp-block-post-content .codehilite, .wp-block-code, .wp-block-preformatted { background: #f8fafc; color: #334155; padding: 1.25rem 1.5rem; border-radius: 12px; overflow-x: auto; box-sizing: border-box; font-family: 'SF Mono', 'Fira Code', 'Cascadia Code', Consolas, monospace; font-size: 0.85rem; line-height: 1.7; margin: 1.3rem 0; border: 1px solid rgba(99,102,241,0.12); } /* 统一 box-sizing 防止块元素超宽 */ .entry-content > *, .wp-block-post-content > * { box-sizing: border-box; max-width: 100%; } /* Reset inline code inside blocks */ .entry-content pre code, .wp-block-post-content pre code, .entry-content .codehilite code, .wp-block-post-content .codehilite code { background: none; padding: 0; border-radius: 0; color: inherit; font-size: inherit; font-family: inherit; } /* ===== Headings ===== */ .entry-content h2, .wp-block-post-content h2 { font-size: 1.4rem; font-weight: 700; margin: 1.8rem 0 0.6rem; padding-bottom: 0.4rem; border-bottom: 2px solid rgba(99,102,241,0.25); color: var(--mlx-text); } .entry-content h3, .wp-block-post-content h3 { font-size: 1.15rem; font-weight: 650; margin: 1.4rem 0 0.4rem; color: var(--mlx-text); } .entry-content h4, .wp-block-post-content h4 { font-size: 1.05rem; font-weight: 600; margin: 1.2rem 0 0.35rem; color: var(--mlx-text); } .entry-content h5, .wp-block-post-content h5 { font-size: 1rem; font-weight: 600; margin: 1.25rem 0 0.35rem; color: var(--mlx-text-secondary); } .entry-content h6, .wp-block-post-content h6 { font-size: 0.95rem; font-weight: 600; margin: 1rem 0 0.35rem; color: var(--mlx-text-secondary); letter-spacing: 0.03em; } /* ===== Paragraphs & Strong ===== */ .entry-content p, .wp-block-post-content p { margin: 0 0 0.85rem; line-height: 1.75; } .entry-content strong, .wp-block-post-content strong { font-weight: 700; color: var(--mlx-text); } /* ===== Links ===== */ .entry-content a, .wp-block-post-content a { color: var(--wp--preset--color--primary); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; transition: color 0.2s; } .entry-content a:hover, .wp-block-post-content a:hover { color: var(--wp--preset--color--primary-lighter); } /* ===== Blockquote ===== */ .entry-content blockquote, .wp-block-post-content blockquote { border-left: 4px solid var(--wp--preset--color--primary); margin: 1.2rem 0; padding: 0.9rem 1.15rem; background: rgba(99,102,241,0.04); border-radius: 0 10px 10px 0; color: var(--wp--preset--color--gray-600); } .entry-content blockquote p, .wp-block-post-content blockquote p { margin-bottom: 0.5rem; } /* ===== Lists ===== */ .entry-content ul, .entry-content ol, .wp-block-post-content ul, .wp-block-post-content ol { padding-left: 1.4rem; margin: 0.9rem 0; } .entry-content li, .wp-block-post-content li { margin-bottom: 0.35rem; line-height: 1.75; } .entry-content li:last-child, .wp-block-post-content li:last-child { margin-bottom: 0; } .entry-content ul ::marker, .wp-block-post-content ul ::marker { color: var(--wp--preset--color--primary); } /* ===== Figures & Images ===== */ .entry-content figure, .wp-block-post-content figure { margin: 1.75rem 0; } .entry-content figure.aligncenter, .wp-block-post-content figure.aligncenter { display: flex; flex-direction: column; align-items: center; margin-left: auto; margin-right: auto; } .entry-content figcaption, .wp-block-post-content figcaption { font-size: 0.85rem; color: var(--wp--preset--color--gray-500); text-align: center; margin-top: 0.6rem; } .entry-content img, .wp-block-post-content img { max-width: 100%; height: auto; border-radius: 10px; margin: 1.5rem 0; } /* ===== Tables ===== */ .entry-content table, .wp-block-post-content table { width: 100%; border-collapse: separate; border-spacing: 0; margin: 1.5rem 0; font-size: 0.92rem; border-radius: 10px; overflow: hidden; border: 1px solid var(--mlx-border); } .entry-content th, .wp-block-post-content th { background: rgba(99,102,241,0.06); padding: 0.75rem 1rem; text-align: left; font-weight: 650; border-bottom: 2px solid var(--wp--preset--color--primary); } .entry-content td, .wp-block-post-content td { padding: 0.65rem 1rem; border-bottom: 1px solid var(--mlx-border); } .entry-content tr:last-child td, .wp-block-post-content tr:last-child td { border-bottom: none; } .entry-content tr:hover td, .wp-block-post-content tr:hover td { background: rgba(99,102,241,0.03); } /* ===== Hidden elements ===== */ .entry-content hr, .wp-block-post-content hr { display: none; } .wp-block-separator { display: none; } /* ===== Comments / Form ===== */ .comment-respond { margin-top: 2rem; } .comment-reply-title { font-size: 1.25rem; font-weight: 700; margin-bottom: 1rem; color: var(--mlx-text); } .comment-form { display: flex; flex-direction: column; gap: 1rem; } .comment-form-comment textarea, .comment-form-author input, .comment-form-email input, .comment-form-url input { width: 100%; max-width: 100%; box-sizing: border-box; padding: 0.75rem 1rem; border-radius: 8px; border: 1px solid var(--mlx-border); background: var(--mlx-bg-card); color: var(--mlx-text); font-family: inherit; font-size: 0.95rem; line-height: 1.6; transition: border-color 0.2s, box-shadow 0.2s; } .comment-form-comment textarea:focus, .comment-form-author input:focus, .comment-form-email input:focus, .comment-form-url input:focus { outline: none; border-color: var(--wp--preset--color--primary); box-shadow: 0 0 0 3px rgba(99,102,241,0.15); } .comment-form-comment textarea { min-height: 140px; resize: vertical; } .comment-form-comment label, .comment-form-author label, .comment-form-email label, .comment-form-url label { display: block; font-size: 0.85rem; font-weight: 600; color: var(--mlx-text-secondary); margin-bottom: 0.35rem; } .form-submit { margin-top: 0.5rem; } .form-submit .submit { background: linear-gradient(135deg, var(--wp--preset--color--primary), #8b5cf6); color: #fff; border: none; border-radius: 9999px; padding: 0.7rem 1.75rem; font-size: 0.95rem; font-weight: 600; cursor: pointer; transition: transform 0.2s ease, box-shadow 0.2s ease; } .form-submit .submit:hover { transform: translateY(-1px); box-shadow: 0 4px 15px rgba(99,102,241,0.35); } .comment-notes, .logged-in-as { font-size: 0.85rem; color: var(--mlx-text-secondary); margin-bottom: 0.5rem; } .logged-in-as a { color: var(--wp--preset--color--primary); } .commentlist { list-style: none; padding: 0; margin: 2rem 0 0; } .commentlist .comment { padding: 1rem 0; border-bottom: 1px solid var(--mlx-border); } .commentlist .comment:last-child { border-bottom: none; } .comment-meta { font-size: 0.85rem; color: var(--mlx-text-secondary); margin-bottom: 0.5rem; } .comment-meta a { color: var(--wp--preset--color--primary); text-decoration: none; } .comment-content { font-size: 0.95rem; line-height: 1.7; color: var(--mlx-text); } .comment-content p { margin: 0 0 0.5rem; } .reply { margin-top: 0.5rem; } .reply a { font-size: 0.85rem; color: var(--wp--preset--color--primary); text-decoration: none; } /* ===== Pagination / Load More ===== */ .wp-block-query-pagination .page-numbers.current { background: var(--wp--preset--color--primary); color: #fff; border-color: var(--wp--preset--color--primary); } .mlx-load-more-wrap { text-align: center; margin: 2rem 0 1rem; } .mlx-load-more-btn { display: inline-block; background: var(--mlx-bg-card); color: var(--wp--preset--color--primary); border: 1.5px solid var(--wp--preset--color--primary); border-radius: 9999px; padding: 0.7rem 2.25rem; font-size: 0.95rem; font-weight: 600; font-family: inherit; cursor: pointer; transition: all 0.25s ease; } .mlx-load-more-btn:hover { background: var(--wp--preset--color--primary); color: #fff; transform: translateY(-1px); box-shadow: 0 4px 15px rgba(99,102,241,0.3); } .mlx-load-more-btn.loading { opacity: 0.7; pointer-events: none; } .mlx-load-more-end { color: var(--mlx-text-secondary); font-size: 0.85rem; } /* ===== Footer ===== */ .mindlynx-footer { max-width: 1200px; margin: var(--wp--preset--spacing--50) auto 0; padding: 0 var(--wp--preset--spacing--30) 0.5rem; } .mindlynx-footer.is-layout-constrained > * + * { margin-block-start: 0.15rem !important; } .mindlynx-footer p { margin: 0; line-height: 1.5; font-size: 0.85rem; color: var(--mlx-text-secondary); } .mindlynx-footer a { color: var(--wp--preset--color--primary); text-decoration: none; } /* Filing info (ICP / 公安备案) — injected via wp_footer */ .mindlynx-filing { max-width: 1200px; margin: 0 auto; padding: 0 var(--wp--preset--spacing--30) var(--wp--preset--spacing--30); text-align: center; font-size: 0.78rem; color: var(--mlx-text-secondary); } .mindlynx-filing-item { display: inline-flex; align-items: center; gap: 2px; } .mindlynx-filing-item a { color: var(--mlx-text-secondary); text-decoration: none; } .mindlynx-filing-item a:hover { color: var(--wp--preset--color--primary); } .mindlynx-filing-sep { margin: 0 0.5rem; opacity: 0.4; } /* ===== Scroll to Top ===== */ #mlx-scroll-top { position: fixed; bottom: 2rem; right: 2rem; z-index: 100; width: 2.75rem; height: 2.75rem; border-radius: 6px; border: 1px solid var(--mlx-border); background: var(--mlx-bg-card); color: var(--wp--preset--color--primary); cursor: pointer; font-size: 1.2rem; display: flex; align-items: center; justify-content: center; box-shadow: var(--wp--preset--shadow--md); opacity: 0; transform: translateY(1rem); transition: opacity 0.3s, transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1); pointer-events: none; } #mlx-scroll-top.visible { opacity: 1; transform: translateY(0); pointer-events: auto; } #mlx-scroll-top:hover { background: var(--wp--preset--color--primary); color: #fff; transform: translateY(-3px); box-shadow: 0 6px 20px rgba(99,102,241,0.3); } /* ===== Animations ===== */ @keyframes mlx-float { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-6px)} } @keyframes mlx-pulse { 0%,100%{opacity:1;transform:scale(1)} 50%{opacity:0.5;transform:scale(0.8)} } @keyframes mlx-bouncy { 0%,20%,50%,80%,100%{transform:translate(-50%,0)} 40%{transform:translate(-50%,-10px)} 60%{transform:translate(-50%,-5px)} } @media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; } } /* ===== Focus Styles ===== */ :focus-visible { outline: 2px solid var(--wp--preset--color--primary); outline-offset: 2px; border-radius: 2px; } #mlx-theme-toggle:focus-visible, #mlx-scroll-top:focus-visible { outline-offset: 4px; } /* ===== Theme Transition ===== */ body, .mindlynx-header, .wp-block-group, .wp-block-post, .wp-block-post-content, .entry-content, pre, code, blockquote, table, th, td, a, input, textarea, select, button, .wp-block-query-pagination .page-numbers, .mlx-load-more-btn, .comment-form input, .comment-form textarea { transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease; } /* ===== Dark Mode ===== */ [data-theme="dark"] { --mlx-bg: #111827; --mlx-bg-card: rgba(31,41,55,0.85); --mlx-text: #e5e7eb; --mlx-text-secondary: rgba(255,255,255,0.4); --mlx-border: rgba(255,255,255,0.08); --mlx-header-bg: rgba(17,24,39,0.82); } [data-theme="dark"] .mindlynx-hero { --mlx-hero-gradient: var(--mlx-hero-gradient-dark); } [data-theme="dark"] .wp-block-query .wp-block-post { background: rgba(30,41,59,0.95); border: 1px solid rgba(255,255,255,0.1); } [data-theme="dark"] .wp-block-query .wp-block-post:hover { background: rgba(30,41,59,1); border-color: rgba(99,102,241,0.3); box-shadow: 0 12px 40px rgba(0,0,0,0.5), 0 0 0 1px rgba(99,102,241,0.15); } [data-theme="dark"] .wp-block-query-pagination .page-numbers { border-color: rgba(255,255,255,0.1); color: #9ca3af; } [data-theme="dark"] .wp-block-query-pagination .page-numbers:hover:not(.current) { background: rgba(99,102,241,0.15); } [data-theme="dark"] .entry-content code, [data-theme="dark"] .wp-block-post-content code { background: rgba(255,255,255,0.08); color: #cbd5e1; } [data-theme="dark"] .entry-content .codehilite, [data-theme="dark"] .wp-block-post-content .codehilite, [data-theme="dark"] .entry-content pre, [data-theme="dark"] .wp-block-post-content pre, [data-theme="dark"] .wp-block-code, [data-theme="dark"] .wp-block-preformatted { background: #1e293b; color: #d4d4d4; border-color: rgba(255,255,255,0.08); } [data-theme="dark"] .entry-content pre code, [data-theme="dark"] .wp-block-post-content pre code, [data-theme="dark"] .entry-content .codehilite code, [data-theme="dark"] .wp-block-post-content .codehilite code { background: none; color: inherit; } [data-theme="dark"] .wp-block-post-content blockquote { background: rgba(99,102,241,0.08); color: rgba(255,255,255,0.7); border-left-color: rgba(99,102,241,0.5); } [data-theme="dark"] .entry-content blockquote p, [data-theme="dark"] .wp-block-post-content blockquote p { color: inherit; } [data-theme="dark"] .entry-content th, [data-theme="dark"] .wp-block-post-content th { background: rgba(99,102,241,0.12); } /* ===== Dark Mode Link & Content ===== */ [data-theme="dark"] a { color: #a5b4fc; } [data-theme="dark"] a:hover { color: #c7d2fe; } /* Dark mode: post content text */ [data-theme="dark"] .wp-block-post-content, [data-theme="dark"] .entry-content { color: rgba(255,255,255,0.85); } [data-theme="dark"] .wp-block-post-content h2, [data-theme="dark"] .wp-block-post-content h3, [data-theme="dark"] .wp-block-post-content h4, [data-theme="dark"] .wp-block-post-content h5, [data-theme="dark"] .wp-block-post-content h6, [data-theme="dark"] .entry-content h2, [data-theme="dark"] .entry-content h3, [data-theme="dark"] .entry-content h4, [data-theme="dark"] .entry-content h5, [data-theme="dark"] .entry-content h6 { } [data-theme="dark"] .wp-block-post-content p, [data-theme="dark"] .entry-content p { color: rgba(255,255,255,0.8); } [data-theme="dark"] .wp-block-post-content li, [data-theme="dark"] .entry-content li { color: rgba(255,255,255,0.8); } [data-theme="dark"] .wp-block-post-content table, [data-theme="dark"] .entry-content table { color: rgba(255,255,255,0.8); } [data-theme="dark"] .wp-block-post-content td, [data-theme="dark"] .entry-content td { border-color: rgba(255,255,255,0.08); } [data-theme="dark"] .wp-block-post-content tr:hover td, [data-theme="dark"] .entry-content tr:hover td { background: rgba(99,102,241,0.06); } [data-theme="dark"] .wp-block-post-content figcaption, [data-theme="dark"] .entry-content figcaption { color: rgba(255,255,255,0.5); } /* Dark mode: WP inline color class overrides */ [data-theme="dark"] .has-black-color, [data-theme="dark"] .has-gray-800-color, [data-theme="dark"] .has-gray-900-color, [data-theme="dark"] .has-foreground-color { color: rgba(255,255,255,0.85); } [data-theme="dark"] .has-gray-600-color, [data-theme="dark"] .has-gray-700-color { color: rgba(255,255,255,0.7); } [data-theme="dark"] .has-gray-500-color { color: rgba(255,255,255,0.55); } [data-theme="dark"] .has-background-color { color: var(--mlx-bg); } [data-theme="dark"] .has-white-background-color { background-color: var(--mlx-bg-card); } [data-theme="dark"] .has-gray-100-background-color { background-color: rgba(255,255,255,0.05); } [data-theme="dark"] .has-base-background-color { background-color: var(--mlx-bg); } /* Dark mode: card & meta */ [data-theme="dark"] .wp-block-post-title a { } [data-theme="dark"] .wp-block-post-date { color: rgba(255,255,255,0.45); } [data-theme="dark"] .wp-block-post-excerpt { color: rgba(255,255,255,0.55); } [data-theme="dark"] .mindlynx-single-hero-meta { color: rgba(255,255,255,0.75); } /* Dark mode: footer */ [data-theme="dark"] .mindlynx-footer { color: var(--mlx-text-secondary); } [data-theme="dark"] .mindlynx-footer p { color: rgba(255,255,255,0.5); } [data-theme="dark"] .mindlynx-filing, [data-theme="dark"] .mindlynx-filing-item a { color: rgba(255,255,255,0.4); } [data-theme="dark"] .mindlynx-filing-item a:hover { color: #a5b4fc; } /* Dark mode: navigation */ [data-theme="dark"] .mindlynx-header .wp-block-navigation-item__content:hover { background: rgba(99,102,241,0.15); color: #a5b4fc; } /* Dark mode: comments form */ [data-theme="dark"] .comment-form-comment textarea, [data-theme="dark"] .comment-form-author input, [data-theme="dark"] .comment-form-email input, [data-theme="dark"] .comment-form-url input { background: rgba(31,41,55,0.85); border-color: rgba(255,255,255,0.12); } [data-theme="dark"] .comment-form-comment textarea:focus, [data-theme="dark"] .comment-form-author input:focus, [data-theme="dark"] .comment-form-email input:focus, [data-theme="dark"] .comment-form-url input:focus { border-color: #818cf8; } [data-theme="dark"] .commentlist .comment { border-color: rgba(255,255,255,0.08); } [data-theme="dark"] .comment-content { color: rgba(255,255,255,0.85); } /* Dark mode: load more button */ [data-theme="dark"] .mlx-load-more-btn { background: rgba(31,41,55,0.85); border-color: rgba(99,102,241,0.5); color: #a5b4fc; } [data-theme="dark"] .mlx-load-more-btn:hover { background: var(--wp--preset--color--primary); color: #fff; } @media (prefers-color-scheme: dark) { html:not([data-theme]) { --mlx-bg:#111827;--mlx-bg-card:rgba(31,41,55,0.85);--mlx-text:#e5e7eb;--mlx-text-secondary:rgba(255,255,255,0.4);--mlx-border:rgba(255,255,255,0.08);--mlx-header-bg:rgba(17,24,39,0.82); } html:not([data-theme]) .mindlynx-hero { --mlx-hero-gradient: var(--mlx-hero-gradient-dark); } html:not([data-theme]) a { color: #a5b4fc; } html:not([data-theme]) a:hover { color: #c7d2fe; } } /* ===== Responsive ===== */ /* Desktop: widen content for better reading on large screens */ @media (min-width: 1200px) { .wp-block-post-content, .entry-content { max-width: 780px; margin-left: auto; margin-right: auto; } } @media (min-width: 900px) and (max-width: 1199px) { .wp-block-post-content, .entry-content { max-width: 720px; margin-left: auto; margin-right: auto; } } @media (max-width: 1024px) { .wp-block-post-template { grid-template-columns: repeat(2, 1fr); } } @media (max-width: 768px) { /* 首页隐藏英雄区，直达文章；分类/文章页保留并缩小 */ .mindlynx-hero.wp-block-cover { display: none; } .mindlynx-category-hero.wp-block-cover { min-height: 40vh !important; } .mindlynx-single-hero.wp-block-cover { min-height: 30vh !important; } .mindlynx-hero .wp-block-heading.mindlynx-hero-title, .mindlynx-hero .wp-block-site-title.mindlynx-hero-title { font-size: 1.75rem; } .wp-block-post-template { grid-template-columns: 1fr; } #mlx-scroll-top { bottom: 1.25rem; right: 1.25rem; } .mindlynx-footer { text-align: center; } /* Mobile card: slightly bigger for touch */ .wp-block-query .wp-block-post-title { font-size: 1.08rem; } .wp-block-query .wp-block-post-excerpt { font-size: 0.85rem; } } @media (max-width: 480px) { .mindlynx-hero .wp-block-heading.mindlynx-hero-title, .mindlynx-hero .wp-block-site-title.mindlynx-hero-title { font-size: 1.5rem; } .mindlynx-hero .mindlynx-hero-subtitle { font-size: 0.9rem; } .mindlynx-hero-content { padding: 1.25rem 1rem; } .mindlynx-hero-btn-primary .wp-block-button__link, .mindlynx-hero-btn-secondary .wp-block-button__link { padding: 0.7rem 1.25rem; font-size: 0.9rem; } .mindlynx-single-hero-title { font-size: 1.5rem; } .mindlynx-category-title { font-size: 1.5rem; } .entry-content h2, .wp-block-post-content h2 { font-size: 1.25rem; } .entry-content .codehilite, .wp-block-post-content .codehilite, .entry-content pre, .wp-block-post-content pre { padding: 0.75rem; font-size: 0.8rem; border-radius: 6px; } /* Small phone: shorten site title */ .mindlynx-header .wp-block-site-title a { font-size: 0; } .mindlynx-header .wp-block-site-title a::after { content: "MindLynx开源探索"; font-size: 1rem; font-weight: 700; display: inline-block; vertical-align: middle; } /* Small phone card */ .wp-block-query .wp-block-post > .wp-block-group { padding: 0.7rem 0.8rem; } .wp-block-query .wp-block-post-title { font-size: 1rem; } .wp-block-query .wp-block-post-excerpt { font-size: 0.82rem; } } /* 缩小汉堡按钮和主题切换按钮的间距 */ .wp-container-core-group-is-layout-a61d4a11 { gap: 0.35rem !important; }