移动端展开文档树层级多了以后基本看不到文档标题了,用这个代码片段可以解决这个问题
/* 长文档标题显示两行 */
#sidebar .b3-list--background .b3-list-item__text{
-webkit-line-clamp: 2;
}
/* ------------------------ 聚焦内容突出显示 ------------------------ */
/* 取消聚焦内容左侧边距 */
#sidebar .b3-list--background
.b3-list-item--focus:not(.dragover):not(.dragover__top):not(.dragover__bottom) >
span[style]:has(.b3-list-item__arrow--open) {
/* 仅在展开的时候取消缩进 */
padding-left: 4px !important;
}
/* 取消聚焦子集左侧边距 */
#sidebar .b3-list--background
.b3-list-item--focus:not(.dragover):not(.dragover__top):not(.dragover__bottom) +
ul > .b3-list-item > span[style] {
padding-left: 24px !important;
}
/* 增加突出显示框 */
#sidebar .b3-list--background
.b3-list-item--focus:not(.dragover):not(.dragover__top):not(.dragover__bottom):has(span[style] > .b3-list-item__arrow--open) {
/* 仅在展开的时候添加顶部突出显示框 */
border-top: 2px solid var(--b3-scroll-color);
}
#sidebar .b3-list--background
.b3-list-item--focus:not(.dragover):not(.dragover__top):not(.dragover__bottom)[data-type="navigation-file"] +
ul {
/* 仅在展开文档时添加底部突出显示框 */
border-bottom: 2px solid var(--b3-scroll-color);
}
显示效果:
欢迎来到这里!
我们正在构建一个小众社区,大家在这里相互信任,以平等 • 自由 • 奔放的价值观进行分享交流。最终,希望大家能够找到与自己志同道合的伙伴,共同成长。
注册 关于