sanbuphy
bc0644aa4b
- Add style.css to head config for global styling - Refactor image height/width constraints with new classes - Adjust font size and image ratio thresholds - Add max-width constraints to prevent overflow
131 lines
3.8 KiB
CSS
131 lines
3.8 KiB
CSS
:root {
|
|
/* Easy-Vibe Theme Fix v2025-01-12 */
|
|
/* 通过变量控制分组底部留白（默认 24px） */
|
|
--vp-sidebar-nav-section-gap: 8px;
|
|
}
|
|
|
|
.vp-doc {
|
|
font-size: 15px;
|
|
}
|
|
|
|
/* 生产环境（带 data-v-* 的 scoped 样式）会比 class 选择器更高优先级。
|
|
为避免 build/preview 时被覆盖，这里显式匹配 scoped 属性并加 !important。 */
|
|
:where(html) .VPSidebarItem.level-0,
|
|
:where(html) .VPSidebarItem.level-0[data-v-d81de50c] {
|
|
padding-bottom: 8px !important;
|
|
}
|
|
|
|
/* 减少一级标题文字与下方子菜单的间距 */
|
|
:where(html) .VPSidebarItem.level-0 > .item,
|
|
:where(html) .VPSidebarItem.level-0[data-v-d81de50c] > .item {
|
|
padding-bottom: 4px !important;
|
|
}
|
|
|
|
/* 调整子菜单项之间的间距 - 针对所有层级 */
|
|
:where(html) .VPSidebarItem.level-1 .item,
|
|
:where(html) .VPSidebarItem.level-1[data-v-d81de50c] .item,
|
|
:where(html) .VPSidebarItem.level-2 .item,
|
|
:where(html) .VPSidebarItem.level-2[data-v-d81de50c] .item,
|
|
:where(html) .VPSidebarItem.level-3 .item,
|
|
:where(html) .VPSidebarItem.level-3[data-v-d81de50c] .item,
|
|
:where(html) .VPSidebarItem.level-4 .item,
|
|
:where(html) .VPSidebarItem.level-4[data-v-d81de50c] .item {
|
|
padding-top: 3px !important;
|
|
padding-bottom: 3px !important;
|
|
min-height: 26px !important; /* 稍微放大便于点击 */
|
|
}
|
|
|
|
/* 针对可能存在的特定类名进行覆盖，确保紧凑 */
|
|
:where(html) .VPSidebarGroup,
|
|
:where(html) .VPSidebarGroup[data-v-8d50c081] {
|
|
padding-top: 6px !important;
|
|
padding-bottom: 6px !important;
|
|
}
|
|
|
|
/* 进一步压缩分组标题与第一项之间的间距 */
|
|
:where(html) .VPSidebarItem.level-0 + .VPSidebarItem.level-1,
|
|
:where(html) .VPSidebarItem.level-0[data-v-d81de50c] + .VPSidebarItem.level-1[data-v-d81de50c] {
|
|
margin-top: -2px !important;
|
|
}
|
|
|
|
/* 压缩分组标题本身的行高 */
|
|
:where(html) .VPSidebarItem.level-0 .text,
|
|
:where(html) .VPSidebarItem.level-0[data-v-d81de50c] .text {
|
|
line-height: 1.3 !important;
|
|
}
|
|
|
|
/* 压缩子项的行高 */
|
|
:where(html) .VPSidebarItem.level-1 .text,
|
|
:where(html) .VPSidebarItem.level-1[data-v-d81de50c] .text,
|
|
:where(html) .VPSidebarItem.level-2 .text,
|
|
:where(html) .VPSidebarItem.level-2[data-v-d81de50c] .text,
|
|
:where(html) .VPSidebarItem.level-3 .text,
|
|
:where(html) .VPSidebarItem.level-3[data-v-d81de50c] .text {
|
|
line-height: 1.4 !important;
|
|
padding: 0 !important; /* 移除文字本身的内边距 */
|
|
}
|
|
|
|
/* 强制链接本身没有额外的边距 */
|
|
:where(html) .VPSidebarItem .VPLink,
|
|
:where(html) .VPSidebarItem[data-v-d81de50c] .VPLink {
|
|
padding-top: 2px !important;
|
|
padding-bottom: 2px !important;
|
|
min-height: auto !important;
|
|
}
|
|
|
|
/* 清空 sidebar item 自带的 margin，避免垂直间距被放大 */
|
|
:where(html) .VPSidebarItem .item,
|
|
:where(html) .VPSidebarItem[data-v-d81de50c] .item {
|
|
margin-bottom: 0 !important;
|
|
}
|
|
|
|
/* 图片高度限制策略：根据长宽比调整最大高度 */
|
|
/* 越高的图片（长宽比越大），限制的高度越小，避免占用过多纵向空间 */
|
|
.vp-doc img.img-tall {
|
|
max-height: 380px !important;
|
|
max-width: 100% !important;
|
|
width: auto !important;
|
|
height: auto !important;
|
|
}
|
|
|
|
.vp-doc img.img-very-tall {
|
|
max-height: 280px !important;
|
|
max-width: 100% !important;
|
|
width: auto !important;
|
|
height: auto !important;
|
|
}
|
|
|
|
.vp-doc img.img-ultra-tall {
|
|
max-height: 200px !important;
|
|
max-width: 100% !important;
|
|
width: auto !important;
|
|
height: auto !important;
|
|
}
|
|
|
|
.vp-doc img.img-limit-width {
|
|
max-width: 100% !important;
|
|
max-height: 320px !important;
|
|
width: auto !important;
|
|
height: auto !important;
|
|
}
|
|
|
|
.vp-doc img.img-limit-height {
|
|
max-height: 450px !important;
|
|
max-width: 100% !important;
|
|
width: auto !important;
|
|
height: auto !important;
|
|
}
|
|
|
|
/* Fix tagline wrapping issues */
|
|
.VPHomeHero .tagline {
|
|
white-space: pre-wrap;
|
|
word-break: break-word;
|
|
max-width: none !important;
|
|
}
|
|
|
|
@media (min-width: 960px) {
|
|
.VPHomeHero .tagline {
|
|
white-space: nowrap;
|
|
}
|
|
}
|