396 lines
8.5 KiB
CSS
Executable File
396 lines
8.5 KiB
CSS
Executable File
.udot {
|
|
text-decoration-line: underline;
|
|
text-decoration-color: rgb(50, 50, 50);
|
|
text-decoration-style: dashed;
|
|
text-decoration-thickness: 1px;
|
|
}
|
|
|
|
.good {
|
|
background-color: forestgreen;
|
|
color: lightyellow;
|
|
}
|
|
|
|
.bad {
|
|
background-color: orangered;
|
|
color: lightyellow;
|
|
}
|
|
|
|
.del {
|
|
text-decoration-line: line-through;
|
|
text-decoration-color: rgb(222 13 13);
|
|
text-decoration-style: initial;
|
|
text-decoration-thickness: 1.5px;
|
|
}
|
|
|
|
|
|
.todo {
|
|
background-color: darkorange;
|
|
color: lightyellow;
|
|
}
|
|
|
|
.com {
|
|
background-color: #0025ff;
|
|
font-weight: bold;
|
|
color: lightyellow;
|
|
}
|
|
|
|
.add {
|
|
text-decoration-line: underline;
|
|
text-decoration-color: rgb(222 13 13);
|
|
background-color: violet;
|
|
text-decoration-style: initial;
|
|
text-decoration-thickness: 2px;
|
|
}
|
|
|
|
|
|
del {
|
|
text-decoration-line: line-through;
|
|
text-decoration-color: rgb(222 13 13);
|
|
text-decoration-style: initial;
|
|
text-decoration-thickness: 1.0px;
|
|
}
|
|
|
|
|
|
ins {
|
|
text-decoration-color: rgb(222 93 93);
|
|
background-color: violet;
|
|
text-decoration-style: initial;
|
|
text-decoration-thickness: 2px;
|
|
}
|
|
|
|
|
|
.blockquote {
|
|
font-size: inherit;
|
|
padding-left: 1rem;
|
|
padding-right: 1.5rem;
|
|
color: black;
|
|
font-weight: 500;
|
|
margin: 0 0 1rem;
|
|
padding: .625rem 1.25rem;
|
|
border-left: .25rem solid #ffb3b3;
|
|
background-color: #ffb2b32b;
|
|
}
|
|
|
|
/* clab-style.css */
|
|
.clab {
|
|
display: inline !important;
|
|
position: relative !important;
|
|
cursor: pointer !important;
|
|
padding: 2px 4px !important;
|
|
margin: 0 1px !important;
|
|
border-radius: 3px !important;
|
|
font: inherit !important;
|
|
color: #000000 !important;
|
|
text-decoration: none !important;
|
|
vertical-align: baseline !important;
|
|
line-height: inherit !important;
|
|
z-index: 1 !important;
|
|
}
|
|
|
|
/* 随机背景色(使用预定义颜色) */
|
|
.clab:nth-child(10n+1) { background-color: #E3F2FD !important; }
|
|
.clab:nth-child(10n+2) { background-color: #F3E5F5 !important; }
|
|
.clab:nth-child(10n+3) { background-color: #E8F5E9 !important; }
|
|
.clab:nth-child(10n+4) { background-color: #FFF3E0 !important; }
|
|
.clab:nth-child(10n+5) { background-color: #FCE4EC !important; }
|
|
.clab:nth-child(10n+6) { background-color: #E0F7FA !important; }
|
|
.clab:nth-child(10n+7) { background-color: #F1F8E9 !important; }
|
|
.clab:nth-child(10n+8) { background-color: #FFF8E1 !important; }
|
|
.clab:nth-child(10n+9) { background-color: #EDE7F6 !important; }
|
|
.clab:nth-child(10n+10) { background-color: #E8EAF6 !important; }
|
|
|
|
/* 基础hover效果 */
|
|
span.clab:hover {
|
|
outline: 2px solid rgba(0,0,0,0.2) !important;
|
|
outline-offset: 2px !important;
|
|
z-index: 1000 !important;
|
|
}
|
|
|
|
|
|
|
|
|
|
/* clab-tooltip 下方显示样式 */
|
|
.clab-tooltip {
|
|
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
|
|
color: white;
|
|
padding: 5px;
|
|
border: 1px solid #444;
|
|
/* -webkit-user-select: none; */
|
|
position: fixed;
|
|
background: rgba(0, 0, 0, 0.95);
|
|
border-radius: 8px;
|
|
z-index: 10000;
|
|
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3),
|
|
0 0 0 1px rgba(255, 255, 255, 0.1);
|
|
font-size: 14px;
|
|
line-height: 1.1;
|
|
max-width: 500px;
|
|
max-height: 800px;
|
|
overflow-y: auto;
|
|
opacity: 0;
|
|
visibility: hidden;
|
|
transition: opacity 0.2s ease, visibility 0.2s ease, transform 0.2s ease;
|
|
overscroll-behavior: contain;
|
|
pointer-events: auto !important;
|
|
}
|
|
|
|
|
|
/* Tooltip 箭头 */
|
|
.tooltip-arrow {
|
|
position: absolute;
|
|
width: 0;
|
|
height: 0;
|
|
border: 6px solid transparent;
|
|
border-bottom-color: #2a2a2a;
|
|
border-top: none;
|
|
}
|
|
|
|
/* tooltip 在上方的箭头(向下) */
|
|
.clab-tooltip.above .tooltip-arrow {
|
|
border-top-color: #2a2a2a;
|
|
border-bottom: none;
|
|
}
|
|
|
|
/* 标题 */
|
|
.tooltip-title {
|
|
font-weight: 600;
|
|
color: #FF9800;
|
|
margin-bottom: 6px;
|
|
padding-bottom: 4px;
|
|
border-bottom: 1px solid #444;
|
|
font-size: 14px;
|
|
font-family: monospace;
|
|
line-height: 0.8;
|
|
pointer-events: none;
|
|
}
|
|
|
|
/* 单一条目 */
|
|
.entry-single {
|
|
padding: 4px 4px;
|
|
margin-bottom: 6px;
|
|
background: rgba(255, 255, 255, 0.05);
|
|
border-radius: 6px;
|
|
border-left: 3px solid #ffffff;
|
|
line-height: 1.2;
|
|
cursor: default;
|
|
}
|
|
|
|
/* Q标签样式 */
|
|
.q-label {
|
|
display: inline-block;
|
|
color: #FF9800;
|
|
font-weight: 600;
|
|
margin-right: 8px;
|
|
min-width: 35px;
|
|
}
|
|
|
|
/* 多个条目的引用 */
|
|
.entry-multiple {
|
|
padding: 4px 4px;
|
|
margin-bottom: 6px;
|
|
background: rgba(255, 255, 255, 0.05);
|
|
border-radius: 6px;
|
|
border-left: 3px solid #ffffff;
|
|
line-height: 1.2;
|
|
cursor: default;
|
|
}
|
|
|
|
/* 多引用标题 */
|
|
.q-header {
|
|
color: #FF9800;
|
|
font-weight: 600;
|
|
margin-bottom: 8px;
|
|
font-size: 13px;
|
|
pointer-events: none;
|
|
}
|
|
|
|
/* 列表 */
|
|
.q-list {
|
|
margin: 0;
|
|
padding-left: 0;
|
|
list-style: none;
|
|
}
|
|
|
|
.q-list li {
|
|
margin-bottom: 10px;
|
|
padding-left: 0;
|
|
line-height: 1.2;
|
|
position: relative;
|
|
cursor: default;
|
|
padding: 4px 0;
|
|
}
|
|
|
|
/* 子标签样式 */
|
|
.q-sublabel {
|
|
display: inline-block;
|
|
color: #4CAF50;
|
|
font-weight: 600;
|
|
margin-right: 2px;
|
|
min-width: 25px;
|
|
}
|
|
|
|
/* 条目间空行 */
|
|
/* .entry-spacer { */
|
|
/* height: 12px; */
|
|
/* pointer-events: none; */
|
|
/* } */
|
|
|
|
/* 无内容 */
|
|
.tooltip-no-content {
|
|
color: #ff6b6b;
|
|
font-style: italic;
|
|
padding: 20px;
|
|
text-align: center;
|
|
background: rgba(255, 107, 107, 0.05);
|
|
border-radius: 6px;
|
|
cursor: default;
|
|
}
|
|
|
|
/* 滚动条 */
|
|
.clab-tooltip::-webkit-scrollbar {
|
|
width: 8px;
|
|
height: 8px;
|
|
}
|
|
|
|
.clab-tooltip::-webkit-scrollbar-track {
|
|
background: #1a1a1a;
|
|
border-radius: 4px;
|
|
}
|
|
|
|
.clab-tooltip::-webkit-scrollbar-thumb {
|
|
background: #4CAF50;
|
|
border-radius: 4px;
|
|
}
|
|
|
|
.clab-tooltip::-webkit-scrollbar-thumb:hover {
|
|
background: #45a049;
|
|
}
|
|
|
|
|
|
/* 允许内容文本选择 */
|
|
.entry-single,
|
|
.entry-multiple,
|
|
.q-list li {
|
|
user-select: text;
|
|
-webkit-user-select: text;
|
|
}
|
|
|
|
/* 鼠标在 tooltip 上时的样式 */
|
|
.clab-tooltip:hover {
|
|
cursor: default;
|
|
}
|
|
|
|
|
|
.clab-tooltip.active {
|
|
opacity: 1;
|
|
visibility: visible;
|
|
transform: translateY(0);
|
|
}
|
|
|
|
.clab-tooltip ul {
|
|
margin: 0;
|
|
padding-left: 20px;
|
|
}
|
|
|
|
.clab-tooltip li {
|
|
margin-bottom: 8px;
|
|
position: relative;
|
|
}
|
|
|
|
.clab-tooltip .source {
|
|
margin-top: 10px;
|
|
padding-top: 10px;
|
|
border-top: 1px solid rgba(255,255,255,0.1);
|
|
font-size: 11px;
|
|
color: #aaa;
|
|
font-style: italic;
|
|
}
|
|
|
|
.clab-tooltip .entry {
|
|
margin-bottom: 15px;
|
|
padding-bottom: 10px;
|
|
border-bottom: 1px solid rgba(255,255,255,0.1);
|
|
}
|
|
|
|
.clab-tooltip .entry:last-child {
|
|
border-bottom: none;
|
|
}
|
|
|
|
|
|
|
|
.rem {
|
|
background-color: darkorange;
|
|
color: lightyellow;
|
|
text-decoration-thickness: 2px;
|
|
}
|
|
|
|
|
|
#criticnav {
|
|
position: fixed;
|
|
z-index: 1100;
|
|
top: 0;
|
|
right: 0;
|
|
width: 120px;
|
|
border-bottom: solid 1px #ffffff;
|
|
margin: 0;
|
|
padding: 10;
|
|
background-color: rgb(143 38 38 / 95%);
|
|
color: #ffffff;
|
|
font-size: 12px;
|
|
font-family: "Helvetica Neue", helvetica, arial, sans-serif !important
|
|
}
|
|
|
|
#criticnav ul {
|
|
list-style-type: none;
|
|
width: 90%;
|
|
margin: 0 auto;
|
|
padding: 0
|
|
}
|
|
|
|
#criticnav ul li {
|
|
display: block;
|
|
width: 100px;
|
|
min-width: 80px;
|
|
text-align: center;
|
|
padding: 5px 0 3px !important;
|
|
margin: 5px 2px !important;
|
|
line-height: 1em;
|
|
float: center;
|
|
text-transform: uppercase;
|
|
cursor: pointer;
|
|
border-radius: 20px;
|
|
border: 3px solid rgba(255,255,255,0);
|
|
color: #fff !important
|
|
}
|
|
|
|
p {
|
|
text-align: left; /* 小屏幕左对齐 */
|
|
}
|
|
|
|
@media (min-width: 768px) {
|
|
p {
|
|
text-align: justify;
|
|
hyphens: auto; /* 自动断字 */
|
|
-webkit-hyphens: auto; /* Safari 支持 */
|
|
/* 可选:控制断字行为 */
|
|
hyphenate-limit-chars: 6 3 2; /* 最小单词长度 前/后最小字符数 */
|
|
}
|
|
}
|
|
|
|
@media (min-width: 992px) {
|
|
body .page-columns {
|
|
display: grid;
|
|
gap: 0;
|
|
grid-template-columns: [screen-start] 0.5em [screen-start-inset] 0fr [page-start page-start-inset] 5px [body-start-outset] 5px [body-start] 0.5em [body-content-start] minmax(350px, calc(855px - 0em)) [body-content-end] 0.5em [body-end] 5px [body-end-outset] minmax(75px, 550px) [page-end-inset] 1px [page-end] 1fr [screen-end-inset] 0.5em [screen-end];
|
|
}
|
|
}
|
|
|
|
|
|
@media (min-width: 1280px) {
|
|
body .page-columns {
|
|
display: grid;
|
|
gap: 0;
|
|
grid-template-columns: [screen-start] 3.5em [screen-start-inset] 2fr [page-start page-start-inset] 35px [body-start-outset] 35px [body-start] 3.5em [body-content-start] minmax(500px, calc(850px - 3em)) [body-content-end] 1.5em [body-end] 35px [body-end-outset] minmax(75px, 400px) [page-end-inset] 35px [page-end] 2fr [screen-end-inset] 1.5em [screen-end];
|
|
}
|
|
}
|