提示:很多缺点 +bug,仅供分享
(我的手机预览图)
/*"手机端:文档树"“电脑端:主菜单”文字*/
.toolbar__text {
word-break: break-all;
-webkit-line-clamp: 1;
overflow: hidden !important;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
display: -webkit-box;
flex: none;
}
/*笔记本边框(手机端)*/
ul.b3-list.b3-list--background {
padding: 10px 5px;
border-radius: 12.5px;
margin: 20px 35px;
outline: 0.5px solid #d7dadb;
}
/*双链引用(文档)*/
.protyle-wysiwyg [data-node-id] [spellcheck] {
min-height: 1.625em;
word-break: break-word;
white-space: normal;
}
/*编辑器备边框*/
.protyle-wysiwyg [data-node-id][data-plugin-focus=true] {
box-shadow: 0 0 0px 1px #505860;
}
/*块折叠*/
.protyle-wysiwyg [data-node-id][fold="1"]:not(.li):not([data-type=NodeHeading]) {
word-break: break-all;
-webkit-line-clamp: 1;
overflow: hidden !important;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
display: -webkit-box;
opacity: .38;
font-size: 16px;
height: 26px;
line-height: 27.5px;
}
/*设置阴影*/
.b3-dialog__scrim {
background-color: rgb(220 220 220 / 0%);
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
opacity: 0;
transition: opacity 150ms linear;
}
/*页面边栏*/
.layout__resize::after {
content: "";
width: 100%;
height: .5px;
display: block;
background-color: #ffffff;
top: 3px;
position: absolute;
left: 0;
transition: var(--b3-transition);
}
.layout__resize--lr::after {
top: 0;
width: 5px;
left: 0;
height: 100%;
}
/*编辑页面名称栏*/
.layout-tab-bar {
list-style: none;
align-items: center;
overflow: auto;
position: relative;
background-color: var(--b3-theme-background);
border-bottom: 0px solid var(--b3-theme-background-light);
}
/*右栏*/
.dock#dockRight {
border-left: 0px solid var(--b3-border-color);
}
/*底栏*/
.status {
background-color: var(--b3-theme-surface);
box-sizing: border-box;
z-index: 2;
height: 32px;
line-height: 35px;
border-top: 0px solid var(--b3-border-color);
padding: 0 5px;
}
/*顶栏*/
.toolbar {
background-color: var(--b3-toolbar-background);
box-sizing: border-box;
height: auto;
line-height: normal;
padding: 0px 25px 0px 25px;
overflow: hidden;
border-bottom: 0px solid var(--b3-border-color);
display: flex
;
flex-wrap: wrap;
/* gap: 10px; */
}
/*块属性位置*/
.protyle-attr {
display: flex;
position: absolute;
right: 12.5px;
top: 1.5px;
opacity: 0;
font-size: 10px;
font-weight: normal;
align-items: center;
line-height: 5px;
background-color: #f6f6f600;
}
/*笔记本边框(电脑端)*/
.sy__file ul.b3-list.b3-list--background {
padding:10px 5px;
border-radius: 12.5px;
margin: 12.5px 15px;
outline: 0.5px solid #d7dadb;
}
/*表情图片*/
img {
border-radius: 5px;
}
/*引用*/
.protyle-wysiwyg [data-node-id] span[data-type~=block-ref]:not(.av__celltext), .protyle-wysiwyg [data-node-id] span[data-type~=file-annotation-ref] {
background: linear-gradient(to bottom, #01B5D8 5%, #F3668F 75%);
-webkit-background-clip: text;
color: rgb(0 0 0 / 10%);
opacity: .86;
transition: var(--b3-transition);
}
/*搜索外观*/
.search__list .b3-list-item__text {
user-select: none;
border-bottom: 5px solid #e0e0e0;
min-height: 30px;
margin: 15px 5px;
padding: 0px 10px;
}
/*选择阴影*/
.b3-list--background .b3-list-item--focus:not(.dragover):not(.protyle-wysiwyg--select):not(.protyle-wysiwyg--hl):not(.dragover__top):not(.dragover__bottom) {
background-color: var(--b3-list-hover);
margin: 10px !important;
}
/*下划线*/
.b3-typography u, .b3-typography span[data-type~=u], .protyle-wysiwyg u, .protyle-wysiwyg span[data-type~=u] {
border-bottom: 1.75px solid;
border-color: #384048;
margin: 0px 2.5px 0px 2.5px;
border-radius: 5px;
}
/*内置头题图*/
.b3-cards {
display: flex;
flex-wrap: wrap;
margin: 0 0px 0px 0;
}
/*内置头题图*/
.b3-card--wrap {
flex: 1;
margin: 25px 25px 0 27.5px;
min-width: 300px;
min-height: 315px;
}
/*笔记编辑框*/
.protyle-wysiwyg [data-node-id]#plugin-focus-unique-id {
box-shadow: 0 0 0px 1px #e4e4e4 inset;
/*box-shadow: 0 0 5px 2.5px #DAD6D2 inset;*/
/*background-image: linear-gradient(to right, #DAD6D2,#E8ECED);*/
}
/*备注*/
.b3-text-field, .pcr-app .pcr-interaction .pcr-result {
padding: 4px 20px;
background-color: #F9F9FB;
font-size: 14px;
}
/*头题图*/
.protyle-background__img img {
object-fit: cover;
width: 100%;
height: 30vh;
opacity: 1;
object-position: center;
border-radius: 25px;
margin: 25px 0 0 0;
}
/*笔记页*/
.protyle-content {
overflow: auto;
flex: 1;
scrollbar-gutter: stable;
margin: 15px;
}
/*手机端图标*/
.toolbar__icon {
height: 16px;
width: 16px;
padding: 10px;
flex-shrink: 0;
margin: 6px 4px;
color: var(--b3-theme-on-surface);
border-radius: 10px;
}
/*手机端设置面板*/
.b3-menu--fullscreen .b3-menu__items {
padding: 0px 30px;
}
/*手机端设置面板*/
.b3-menu--fullscreen .b3-menu__item {
border-bottom: .5px solid var(--b3-theme-background-light);
line-height: 42px;
background-color: #DDDEE2;
text-decoration: none;
border-radius: 25px;
margin: 20px 0px;
padding: 7.5px 0px;
}
/*图标*/
svg {
fill: currentColor;
display: inline-block;
/*margin: 10px; */
/*padding: 0px;*/
}
/*设置背景*/
.config__tab-container {
overflow: auto;
box-sizing: border-box;
height: 100%;
background: #F3F3F3;
margin: 25px;
border-radius: 2.5px;
padding: 25px;
}
/*设置背景*/
.config__tab-container .b3-label:not(.b3-label--inner) {
padding: 0;
margin: 16px 24px 32px;
box-shadow: 0 0px 0 0 #ffffff, 0 0px 0 0 var(--b3-border-color);
border-bottom: 0;
border-radius: 25px;
}
/*块内字符*/
.b3-typography>p, .b3-typography blockquote>p, .b3-typography [data-node-id], .protyle-wysiwyg li>p, .protyle-wysiwyg>p, .protyle-wysiwyg blockquote>p, .protyle-wysiwyg [data-node-id] {
line-height: 1.80;
padding: 7.5px;
margin: 2.5px;
border-radius: var(--b3-border-radius);
}
/*备注*/
.b3-typography span[data-type~=inline-memo], .protyle-wysiwyg span[data-type~=inline-memo] {
background-image: linear-gradient(to bottom, #F5F1FF 90%, #E83878 10%);
border-bottom: 0px solid #E83878;
border-radius: 10px 10px 0px 0px;
margin: 0px 2.5px;
padding: 0px 2.5px;
}
/*标注*/
.b3-typography mark, .b3-typography span[data-type~=mark], .protyle-wysiwyg mark, .protyle-wysiwyg span[data-type~=mark] {
background-image: linear-gradient(to right, #F5F1FF 75%, #FF8B67 100%);
/* border-bottom: 5px solid #FF8B67; */
border-radius: 25px 2.5px 25px 2.5px;
padding: 0px 5px;
margin: 0px 2.5px;
}
/*字体效果*/
:root {
--b3-font-color1: #F88880;
--b3-font-color2: #FF00B2;
--b3-font-color3: #FC4349;
--b3-font-color4: #D87080;
--b3-font-color5: #2A9FC0;
--b3-font-color6: #A1A79D;
--b3-font-color7: #F8B48F;
--b3-font-color8: #2F507D;
--b3-font-color9: #79ADE7;
--b3-font-color10: #FFD38E;
--b3-font-color11: #E088C0;
--b3-font-color12: #AEA2D4;
--b3-font-color13: var(--b3-theme-background);
--b3-font-background1: #F6F792;
--b3-font-background2: #FFD611;
--b3-font-background3: #FCE6B9;
--b3-font-background4: #E7D7C1;
--b3-font-background12: #5668FF;
--b3-font-background8: #F3547A;
--b3-font-background9: #C4D6A1;
--b3-font-background5: #D1D4DB;
--b3-font-background6: #BFC4DE;
--b3-font-background11: #68E6FC;
--b3-font-background7: #F69CB6;
--b3-font-background10: #A1E8D9;
--b3-font-background13: var(--b3-theme-on-background);
--b3-switch-checked-background: #D7DADB;
}
/*块圆角等*/
:root{
--b3-border-radius: 15px;
--b3-border-padding:10px;
}
/*笔记本名*/
.b3-list-item__text {
flex: 1;
background-color: rgba(0, 0, 0, 0);
text-align: left;
border: 0;
padding: 0;
color: var(--b3-theme-on-background);
word-break: break-word;
-webkit-line-clamp: 5;
overflow: hidden !important;
-webkit-box-orient: vertical;
display: -webkit-box;
border-bottom: 1px solid rgb(228 228 228);
margin: 0px 10px 0px 10px;
}
.b3-list-item {
line-height: 35px;
min-height: 28px;
padding: 0 4px;
display: flex
;
cursor: pointer;
align-items: center;
position: relative;
background-color: rgba(0, 0, 0, 0);
text-align: left;
border: 0;
color: var(--b3-theme-on-background);
margin: 5px 10px;
}
/*左侧dock图标外边距大小,可根据需要微调 */
.dock#dockLeft .dock__item {
margin: 3px;
}
/*每个图标的内外边距,计算公式是 (dock宽-图标宽)/4 */
.dock__item {
padding: 4px; /* 内边距 */
margin: 4px; /* 外边距 */
}
/*两侧dock栏宽度 */
.dock--vertical {
width:32px; /* 根据自己需要调整 */
}
欢迎来到这里!
我们正在构建一个小众社区,大家在这里相互信任,以平等 • 自由 • 奔放的价值观进行分享交流。最终,希望大家能够找到与自己志同道合的伙伴,共同成长。
注册 关于