css选择xlink:href属性
see https://ld246.com/article/1734427196426
@namespace xlink 'http://www.w3.org/1999/xlink';
.protyle-breadcrumb__item:has(use[xlink|href*=iconListItem]) .protyle-breadcrumb__text {
display: none;
}
数据库底部计算行一直显示
see https://ld246.com/article/1734565049720
.av__row--footer .av__calc,.av__row--footer.av__row--show .av__calc {
opacity: 1
}
数据库优化css
see https://ld246.com/article/1735096220866
see https://ld246.com/article/1734565049720
/* 数据库优化css */
/* 设置数据库最大高度 */
.av__scroll {
max-height: 600px;
overflow: auto;
}
/* 显示底部计算(求和等) */
.av__row--footer .av__calc,.av__row--footer.av__row--show .av__calc {
opacity: 1
}
/* 头部固定不动 */
.av__row--header{
top: 0px;
position: sticky;
z-index:2; /* 防止与cell内容及右侧列重叠 */
}
/* 底部固定不动 */
.av__row--footer{
position: sticky;
bottom: 0;
z-index:2; /* 防止与cell内容及右侧列重叠 */
}
/* 左侧第一列固定位置,更改这里的nth-child可以实现任意一列固定位置,nth-child从2开始算第一列,因为左侧有一列控制列 */
.av__row .av__cell:nth-child(2){
position: sticky;
left: 22.75px; /* 左侧控制列宽度 */
/* 防止与右侧列重叠 */
background-color:var(--av-background);
z-index:1;
}
/* 底部计算第一列固定位置,更改这里的nth-child可以实现任意一列固定位置,nth-child从1开始算第一列 */
.av__row--footer .av__calc:nth-child(1){
position: sticky;
left: 0;
/* 防止与右侧列重叠 */
background-color:var(--av-background);
z-index:1;
}
/* 底部计算从第2列起需加上左侧控制列的宽度 */
.av__row--footer .av__calc:nth-child(n+2) {
left: 22.75px; /* 左侧控制列宽度 */
}
左侧dock栏宽度调整
see https://ld246.com/article/1734652659115/comment/1735186442068?r=wilsons#comments
.dock#dockLeft.dock--vertical {
/* 左侧dock栏宽度 */
width:52px;
/* 每个图标的内外边距,计算公式是 (dock宽-图标宽)/4 */
.dock__item {
padding: 6px; /* 内边距 */
margin: 7px; /* 外边距,可根据需要微调 */
}
/* 图标的宽度,高度自适应,1:1 显示,计算公式是 (dock宽-图标内外边距和*2)/2 */
.dock__item svg {
width: 20px;
height: 20px;
}
}
两侧dock栏宽度调整
see https://ld246.com/article/1735316551273
/* 两侧dock栏宽度 */
.dock--vertical {
width:32px; /* 根据自己需要调整 */
}
/* 每个图标的内外边距,计算公式是 (dock宽-图标宽)/4 */
.dock__item {
padding: 4px; /* 内边距 */
margin: 4px; /* 外边距 */
}
/* 左侧dock图标外边距大小,可根据需要微调 */
.dock#dockLeft .dock__item {
margin: 3px;
}
/* 图标的宽度,高度自适应,1:1 显示,计算公式是 (dock宽-图标内外边距和*2)/2 */
.dock svg {
width: 16px;
height: 16px;
}
判断闪卡头部
see https://ld246.com/article/1735727743856
/* 仅手机版生效 */
:has(#sidebar) {
/* 非闪卡头部 */
:not(.card__main) > .toolbar {
background-color: green!important;
}
/* 闪卡头部 */
.card__main > .toolbar{
background-color: red!important;
}
}
查找不存在的内容块
select *
from blocks
where id in (
select block_id
from refs
where not def_block_id in (
select id
from blocks
)
)
调整子任务行间距
/* 不支持在支持超级,引用等内 */
.protyle-wysiwyg > [data-subtype="t"] > [data-subtype="t"] {
/* 这里用于调试,可忽略 */
/* background: #483838;
border: 1px solid #ef4c4c; */
[data-subtype="t"], .protyle-action--task ~ .p {
margin-bottom: -5px; /* 可在这里调整间距 */
}
}
或
/* 支持在支持超级,引用等内 */
.protyle-wysiwyg [data-node-index][data-subtype="t"] > [data-subtype="t"] {
/* 这里用于调试,可忽略 */
/* background: #483838;
border: 1px solid #ef4c4c; */
[data-subtype="t"], .protyle-action--task ~ .p {
margin-bottom: -5px; /* 可在这里调整间距 */
}
}
效果
屏蔽某元素的所有样式,只使用祖先样式,并排除特定元素下的样式不屏蔽
.b3-typography span[custom-js] *:not(.custom-js-content,.custom-js-content *), .protyle-wysiwyg span[custom-js] *:not(.custom-js-content,.custom-js-content *) {
all: inherit!important;
}
/* 或 兼容性更好 */
.b3-typography span[custom-js] *:not(.custom-js-content):not(.custom-js-content *), .protyle-wysiwyg span[custom-js] *:not(.custom-js-content):not(.custom-js-content *) {
all: inherit!important;
}
或
.b3-typography span[custom-js] *,
.protyle-wysiwyg span[custom-js] * {
all: inherit !important;
}
/* 让 .custom-js-content 及其子元素“恢复为你自己定义的样式” */
.b3-typography span[custom-js] .custom-js-content,
.b3-typography span[custom-js] .custom-js-content *,
.protyle-wysiwyg span[custom-js] .custom-js-content,
.protyle-wysiwyg span[custom-js] .custom-js-content * {
all: revert !important;
}
调整默认图片大小
see https://ld246.com/article/1750249787083
see https://ld246.com/article/1748670613696
.b3-typography .img>span:nth-child(2), .protyle-wysiwyg .img>span:nth-child(2){
width: 50%;
}
.b3-typography .img>span:nth-child(2) img, .protyle-wysiwyg .img>span:nth-child(2) img {
width: 100%;
}
首行缩进
see https://ld246.com/article/1752224633634
/* 段落块首行缩进 CSS片段 */
:is(.b3-typography, .protyle-wysiwyg) :is(p, .p) {
text-indent: 2em;
}
隐藏文档树文档信息和新建,更多提示
see https://ld246.com/article/1752577255723
.sy__file .b3-tooltips:hover::before, .sy__file .b3-tooltips:hover::after, /* 隐藏更多新建提示 */
body:has(.sy__file .b3-list-item--hide-action:hover>.b3-list-item__action) #tooltip /* 隐藏文档信息提示 */
{
display: none;
}
滚动条样式
/* 定义滚动条 */
::-webkit-scrollbar {
width: 8px; /* 设置滚动条宽度 */
height: 8px; /* 设置水平滚动条高度 */
}
/* 定义滚动条轨道 */
::-webkit-scrollbar-track {
background: transparent; /* 轨道透明 */
}
/* 定义滚动条滑块 */
::-webkit-scrollbar-thumb {
background: rgba(0, 0, 0, 0.3); /* 半透明滑块 */
border-radius: 10px;
}
/* 当滑动条被悬停时 */
::-webkit-scrollbar-thumb:hover {
background: rgba(0, 0, 0, 0.5); /* 悬停时滑块变得更明显 */
}
取消制卡闪动动画
see https://ld246.com/article/1744014086208
/* see https://github.com/siyuan-note/siyuan/blob/1317020c1791edf440da7f836d366567e03dd843/app/src/protyle/wysiwyg/transaction.ts#L598 */
@keyframes addCard {
/* 不定义任何关键帧 */
}
顶部工具栏和tab融合css
see https://ld246.com/article/1754653136440
#toolbar {
background-color: transparent;
border-bottom-color: transparent;
margin-bottom: -38px;
pointer-events: none;
z-index: 5;
-webkit-app-region: drag;
app-region: drag;
}
#toolbar .toolbar__item {
pointer-events: auto;
-webkit-app-region: no-drag;
app-region: no-drag;
}
#drag {
opacity: 0;
}
.layout__center {
padding-top: 3.75px;
box-sizing: border-box;
&#layouts {
padding-top: 3.75px;
}
}
.layout__center [data-type="wnd"] > .fn__flex:first-child > .layout-tab-bar {
background-color: transparent;
}
.layout__center [data-type="wnd"] > .fn__flex:first-child > .layout-tab-bar [data-type="tab-header"] {
-webkit-app-region: no-drag;
app-region: no-drag;
}
.layout__center [data-type="wnd"] > .fn__flex:first-child > .layout-tab-bar.layout-tab-bar--readonly {
max-width: 80px;
-webkit-app-region: drag;
app-region: drag;
}
.layout__center [data-type="wnd"] > .fn__flex:first-child > .layout-tab-bar.layout-tab-bar--readonly :is([data-type="new"], [data-type="more"]) {
-webkit-app-region: no-drag;
app-region: no-drag;
}
.layout__center [data-type="wnd"] > .fn__flex:first-child + .layout-tab-container {
border-radius: var(--b3-border-radius);
}
#layouts.layout__center [data-type="wnd"] > :is(.fn__flex-column, .fn__flex-1, .fn__flex):first-child {
-webkit-app-region: drag;
app-region: drag;
& > .layout-tab-bar.layout-tab-bar--readonly {
max-width: 80px;
}
}
.toolbar__window {
-webkit-app-region: no-drag;
app-region: no-drag;
}
.layout__center [data-type="wnd"] > .fn__flex:first-child.fn__none + .layout-tab-container {
height: calc(100% - 34px);
margin-top: 34px;
}
#dockLeft {
padding-top: 38px;
}
#dockRight {
padding-top: 38px;
}
:is(.layout__dockl, .layout__dockr):not(.layout--float) {
padding-top: 38px;
min-height: 50%;
}
#layouts .layout__resize.layout__resize--lr {
clip-path: inset(38px 0 0 0 round var(--b3-border-radius));
}
#layouts .layout--float.layout__dockb .layout__resize.layout__resize--lr {
clip-path: none;
}
修改head 悬停图标大小和颜色
see https://ld246.com/article/1757851752752
.protyle-gutters button[data-type="NodeHeading"] svg {
color: #000; /* 颜色 */
zoom: 1.5; /* 放大倍数 */
margin-top: -3px; /* 微调上下位置 */
}
dock瘦身
.dock__item {
margin: 7px 3px
}
.dock--vertical{
width: 32px;
}
隐藏标签新建按钮占空间
/* 隐藏标签新建按钮占空间 */
.layout__center [data-type="wnd"] > .fn__flex:first-child > .layout-tab-bar.layout-tab-bar--readonly :is([data-type="new"]) {
display: none;
}
.layout-tab-bar .item--readonly {
padding-left: 4px;
padding-right: 4px;
justify-content: center;
width: 24px;
}
.layout-tab-bar--readonly{
min-width: 24px;
}
