/* 
Theme Name: 左栏内容SEO博客主题 
Theme URI: https://你的站点地址 
Author: 你的名称 
Description: 主内容左置个人博客主题，原生SEO优化，响应式全适配 
Version: 1.0 
License: GPL v2 
Tags: 博客, 右置边栏, SEO, 个人站, 响应式 
Text Domain: left-blog 
*/ 
 
* { 
    margin: 0; 
    padding: 0; 
    box-sizing: border-box; 
} 
:root { 
    --rev-bg: #fafafa; 
    --rev-card: #ffffff; 
    --rev-text: #333333; 
    --rev-gray: #666666; 
    --rev-primary: #ec4899; 
    --rev-border: #f0f0f0; 
    --rev-shadow: 0 2px 8px rgba(0,0,0,0.04); 
    --rev-radius: 10px; 
} 
body { 
    font-family: "Helvetica Neue", "PingFang SC", sans-serif; 
    background: var(--rev-bg); 
    color: var(--rev-text); 
    line-height: 1.7; 
} 
a { 
    color: var(--rev-primary); 
    text-decoration: none; 
    transition: all 0.2s; 
} 
a:hover { 
    opacity: 0.8; 
} 
img { 
    max-width: 100%; 
    height: auto; 
    border-radius: var(--rev-radius); 
} 
 
/* 全局容器 */ 
.rev-container { 
    max-width: 1200px; 
    margin: 0 auto; 
    padding: 0 20px; 
} 
 
/* 原生左文右栏布局，代码顺序和视觉顺序完全一致 */ 
.rev-content-wrap { 
    display: grid; 
    grid-template-columns: 1fr 300px; /* 左边主内容自适应，右边侧边栏固定300px */ 
    gap: 2rem; 
    padding: 2rem 0; 
} 
.rev-sidebar { 
    position: sticky; 
    top: 2rem; 
    align-self: flex-start; 
} 
 
/* 侧边栏模块 */ 
.rev-author-card { 
    background: var(--rev-card); 
    border-radius: var(--rev-radius); 
    box-shadow: var(--rev-shadow); 
    padding: 2rem; 
    text-align: center; 
    margin-bottom: 1.5rem; 
    border: 1px solid var(--rev-border); 
} 
.rev-avatar { 
    width: 80px; 
    height: 80px; 
    border-radius: 50%; 
    border: 3px solid var(--rev-primary); 
    margin: 0 auto 1rem; 
    overflow: hidden; 
} 
.rev-author-name { 
    font-size: 1.3rem; 
    font-weight: 700; 
    margin-bottom: 0.5rem; 
} 
.rev-author-desc { 
    color: var(--rev-gray); 
    font-size: 0.9rem; 
    margin-bottom: 1rem; 
} 
.rev-social { 
    display: flex; 
    justify-content: center; 
    gap: 0.8rem; 
} 
.rev-social a { 
    width: 36px; 
    height: 36px; 
    border-radius: 50%; 
    background: var(--rev-bg); 
    display: flex; 
    align-items: center; 
    justify-content: center; 
} 
 
.rev-widget { 
    background: var(--rev-card); 
    border-radius: var(--rev-radius); 
    box-shadow: var(--rev-shadow); 
    padding: 1.5rem; 
    margin-bottom: 1.5rem; 
    border: 1px solid var(--rev-border); 
    transition: all 0.3s; 
} 
.rev-widget:hover { 
    transform: translateX(-3px); 
    border-color: var(--rev-primary); 
} 
.rev-widget-title { 
    font-size: 1.1rem; 
    margin-bottom: 1rem; 
    padding-bottom: 0.5rem; 
    border-bottom: 2px solid var(--rev-primary); 
    display: inline-block; 
} 
.rev-widget ul { 
    list-style: none; 
} 
.rev-widget ul li { 
    margin-bottom: 0.8rem; 
    padding-bottom: 0.8rem; 
    border-bottom: 1px dashed var(--rev-border); 
} 
 
/* 面包屑 */ 
.rev-breadcrumb { 
    background: var(--rev-card); 
    padding: 0.8rem 1.2rem; 
    border-radius: var(--rev-radius); 
    font-size: 0.9rem; 
    color: var(--rev-gray); 
    border: 1px solid var(--rev-border); 
    margin-bottom: 1.5rem; 
} 
 
/* 文章列表 */ 
.rev-post-list { 
    counter-reset: post-num; 
    display: flex; 
    flex-direction: column; 
    gap: 1rem; 
} 
.rev-post-item { 
    background: var(--rev-card); 
    border-radius: var(--rev-radius); 
    box-shadow: var(--rev-shadow); 
    padding: 1.5rem; 
    border: 1px solid var(--rev-border); 
    position: relative; 
    padding-left: 3.5rem; 
    counter-increment: post-num; 
    transition: all 0.3s; 
} 
.rev-post-item::before { 
    content: counter(post-num); 
    position: absolute; 
    left: 1rem; 
    top: 50%; 
    transform: translateY(-50%); 
    width: 2rem; 
    height: 2rem; 
    border-radius: 50%; 
    background: var(--rev-primary); 
    color: #fff; 
    display: flex; 
    align-items: center; 
    justify-content: center; 
    font-weight: 700; 
    font-size: 0.9rem; 
} 
.rev-post-item:hover { 
    transform: translateX(5px); 
    border-color: var(--rev-primary); 
} 
.rev-post-title { 
    font-size: 1.2rem; 
    font-weight: 600; 
    margin-bottom: 0.8rem; 
    line-height: 1.5; 
} 
.rev-post-excerpt { 
    color: var(--rev-gray); 
    font-size: 0.95rem; 
    margin-bottom: 1rem; 
    line-height: 1.7; 
} 
.rev-post-meta { 
    font-size: 0.85rem; 
    color: var(--rev-gray); 
    display: flex; 
    gap: 1.5rem; 
    padding-top: 0.8rem; 
    border-top: 1px dashed var(--rev-border); 
} 
.rev-post-meta span:first-child::before { content: '📅 '; } 
.rev-post-meta span:nth-child(2)::before { content: '📂 '; } 
.rev-post-meta span:nth-child(3)::before { content: '👁️ '; } 
 
/* 文章详情页 */ 
.rev-single-card { 
    background: var(--rev-card); 
    border-radius: var(--rev-radius); 
    box-shadow: var(--rev-shadow); 
    padding: 2rem; 
    border: 1px solid var(--rev-border); 
} 
.rev-single-title { 
    font-size: 1.8rem; 
    margin-bottom: 1rem; 
    line-height: 1.4; 
} 
.rev-single-meta { 
    color: var(--rev-gray); 
    margin-bottom: 1.5rem; 
    padding-bottom: 1rem; 
    border-bottom: 1px solid var(--rev-border); 
} 
.rev-single-content { 
    line-height: 1.8; 
} 
.rev-single-content h2, .rev-single-content h3 { 
    margin: 1.5rem 0 1rem 0; 
    font-weight: 600; 
} 
.rev-single-content p { 
    margin-bottom: 1rem; 
} 
.rev-related { 
    margin-top: 2rem; 
    padding-top: 2rem; 
    border-top: 1px solid var(--rev-border); 
} 
.rev-related h3 { 
    font-size: 1.3rem; 
    margin-bottom: 1rem; 
} 
.rev-related-list { 
    display: grid; 
    grid-template-columns: repeat(2, 1fr); 
    gap: 1rem; 
} 
.rev-related-item { 
    padding: 1rem; 
    background: var(--rev-bg); 
    border-radius: var(--rev-radius); 
} 
 
/* 分页 */ 
.rev-pagination { 
    display: flex; 
    gap: 0.5rem; 
    justify-content: center; 
    margin-top: 1.5rem; 
} 
.rev-pagination a, .rev-pagination span { 
    padding: 0.5rem 1rem; 
    border-radius: 6px; 
    background: var(--rev-card); 
    border: 1px solid var(--rev-border); 
} 
.rev-pagination .current { 
    background: var(--rev-primary); 
    color: #fff; 
    border-color: var(--rev-primary); 
} 
 
/* 页脚 */ 
.rev-footer { 
    background: var(--rev-card); 
    border-top: 1px solid var(--rev-border); 
    padding: 2rem 0; 
    text-align: center; 
    color: var(--rev-gray); 
    font-size: 0.9rem; 
} 
 
/* 移动端适配：侧边栏放到主内容下方 */ 
@media (max-width: 992px) { 
    .rev-content-wrap { 
        grid-template-columns: 1fr; 
    } 
    .rev-sidebar { 
        position: static; 
        order: 2; 
    } 
}