feat: 添加知识库培训离线网页及互动练习

This commit is contained in:
admin committed 2026-11-03 11:54:27 +08:00
1 parent cdf677cab7
commit f1e45178d2
43 files changed
+1513 -166

No files matched your search

+12
View File
@@ -0,0 +1,12 @@
:root{--ink:#163d35;--green:#276450;--mint:#bde6d1;--light:#eaf3ee;--paper:#f7faf8;--muted:#60756d;--line:#d9e3dd;--dark:#102f29;--bar:72px;--shadow:0 24px 80px #061b2633}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden}body{font-family:"PingFang SC","Microsoft YaHei","Noto Sans CJK SC",sans-serif;background:#dce5df;color:var(--ink)}button,input,textarea{font:inherit}button{cursor:pointer;background:transparent;border:1px solid var(--line);border-radius:9px;color:inherit;padding:10px 16px;transition:background .18s}button:hover{background:var(--light)}button:disabled{opacity:.3;cursor:default}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid #4f9b7d;outline-offset:3px}a{color:var(--green);text-underline-offset:4px}h2,p{margin:0}button.primary{background:var(--green);color:white;border-color:var(--green)}
#viewport{position:fixed;inset:0 0 var(--bar);display:grid;place-items:center;overflow:hidden}#stage{width:1280px;height:720px;position:absolute;transform-origin:center;box-shadow:var(--shadow);background:var(--paper)}
.slide{position:absolute;inset:0;background:var(--paper);display:none;overflow:hidden}.slide.active{display:block;animation:none}.slide.dark{background:var(--dark);color:white}.page-kicker{position:absolute;left:64px;top:35px;font-size:16px;line-height:28px;color:var(--muted)}.dark .page-kicker{color:var(--mint)}.page-title{position:absolute;left:64px;top:89px;width:1152px;height:104px;display:flex;align-items:center;font-size:42px;font-weight:650;line-height:1.25;letter-spacing:-.5px}.artboard{position:absolute;inset:0}.element{position:absolute}.text{display:flex;align-items:center;pointer-events:auto}.text-inner{width:100%;min-width:0}.text p{line-height:1.25;overflow-wrap:break-word;white-space:pre-wrap}.decoration{pointer-events:none}.page-footer{position:absolute;left:64px;right:64px;bottom:26px;display:flex;justify-content:space-between;font-size:13px;color:var(--muted);pointer-events:none}.dark .page-footer{color:#aac7ba}.table-wrap table{width:100%;height:100%;border-collapse:collapse;table-layout:fixed}.table-wrap td,.table-wrap th{border:1px solid var(--line);padding:12px 10px;text-align:left;vertical-align:middle}.table-wrap p{line-height:1.4;white-space:pre-wrap;overflow-wrap:break-word}.image-zoom{border:0;padding:0;border-radius:4px;overflow:hidden;cursor:zoom-in}.image-zoom img{width:100%;height:100%;object-fit:contain;display:block}.image-zoom:hover{box-shadow:0 0 0 3px #85b69f}.slide-action{position:absolute;right:64px;bottom:69px;background:var(--green);border-color:var(--green);color:white;font-size:16px;padding:8px 18px;z-index:2}.slide-action:hover{background:#1b493b}.practice-tools{position:absolute;left:68px;bottom:68px;display:flex;gap:10px}.dark .practice-tools button{color:var(--mint);border-color:#4a7762;font-size:15px}.dark .practice-tools button:hover{background:#254a3f}.prompt-copy{cursor:text}
#toolbar{position:fixed;inset:auto 0 0;height:var(--bar);z-index:20;display:flex;align-items:center;gap:10px;padding:0 24px;background:#ffffffed;border-top:1px solid #cad9ce;backdrop-filter:blur(20px);font-size:13px}#progress{position:absolute;top:-3px;left:0;height:3px;background:var(--green);transition:width .2s}#toolbar button{padding:8px 11px;white-space:nowrap}.brand{display:flex;gap:9px;align-items:center;font-weight:600;text-decoration:none;margin-right:25px;color:var(--ink)}.brand-mark{width:31px;height:31px;display:grid;place-items:center;background:var(--green);border-radius:9px;color:var(--mint);font-size:17px}.nav-group{display:flex;align-items:center;gap:8px}#page-label{font-variant-numeric:tabular-nums;min-width:62px;text-align:center}#hint{font-size:12px;color:var(--muted);margin-left:8px}.key{font-size:10px;color:var(--muted);margin-left:9px}.spacer{flex:1}#mini-timer{color:var(--green);font-weight:600;font-variant-numeric:tabular-nums}#reading-toggle[aria-pressed=true]{background:var(--green);color:white;border-color:var(--green)}
dialog{border:1px solid var(--line);border-radius:18px;padding:32px;background:var(--paper);color:var(--ink);width:min(1040px,94vw);max-height:88vh;box-shadow:var(--shadow)}dialog::backdrop{background:#0c251fcc;backdrop-filter:blur(7px)}dialog header{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:24px}dialog header h2{font-size:26px;line-height:1.5}dialog header button{flex-shrink:0}dialog p{line-height:1.85;color:var(--muted);margin:12px 0}dialog .eyebrow{font-size:13px;color:var(--green);margin:0 0 5px}#toc-search{width:100%;border:1px solid var(--line);border-radius:10px;padding:13px 16px;background:white;margin-bottom:20px}#toc-list{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.toc-item{padding:16px;text-align:left;font-size:14px;line-height:1.65;display:flex;gap:12px;align-items:flex-start}.toc-item span{font-variant-numeric:tabular-nums;color:var(--green)}.toc-item.current{background:var(--light);border-color:var(--green);font-weight:600}.toc-item[hidden]{display:none}#notes-body{font-size:21px;line-height:1.95;white-space:pre-wrap}#material-list{display:grid;gap:10px;margin:20px 0}.material-item{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;background:white;border:1px solid var(--line);border-radius:10px;gap:15px}.material-item span{line-height:1.7}.material-item small{display:block;color:var(--muted)}details{margin-top:24px;border-top:1px solid var(--line);padding-top:20px}summary{cursor:pointer;font-weight:600}#image-dialog{width:min(1400px,96vw)}#zoom-image{width:100%;height:68vh;object-fit:contain}#copy-text{width:100%;height:240px;resize:vertical;padding:18px;border:1px solid var(--line);border-radius:10px;line-height:1.8}#toast{position:fixed;left:50%;bottom:calc(var(--bar) + 18px);transform:translateX(-50%);padding:12px 22px;border-radius:10px;background:var(--green);color:white;opacity:0;transition:opacity .2s;pointer-events:none;z-index:100;max-width:90vw;font-size:15px}#toast.show{opacity:1}.checks{display:grid;gap:14px}.checks label{display:flex;gap:14px;align-items:center;background:white;border:1px solid var(--line);border-radius:10px;padding:16px;font-size:19px;cursor:pointer}.checks input{width:21px;height:21px;accent-color:var(--green)}.visually-hidden{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}.no-script{position:fixed;z-index:1000;padding:30px;background:white}
body.reading{overflow:auto;background:var(--paper)}.reading #viewport{position:static;display:block;overflow:visible;padding:30px 24px 100px}.reading #stage{position:static;width:min(1040px,100%);height:auto;transform:none!important;box-shadow:none;margin:auto;background:none}.reading .slide,.reading .slide.active{position:relative;display:block;height:auto;min-height:0;overflow:visible;padding:45px 48px;margin:20px 0 40px;background:white;border:1px solid var(--line);border-radius:20px;color:var(--ink);animation:none}.reading .page-kicker{position:static;color:var(--green);margin-bottom:12px}.reading .page-title,.reading .page-title.visually-hidden{position:static!important;width:auto!important;height:auto!important;clip:auto!important;overflow:visible!important;white-space:normal!important;margin:0 0 30px!important;font-size:32px;display:block}.reading .artboard{position:static;display:flex;flex-direction:column;gap:18px}.reading .element{position:static!important;width:auto!important;height:auto!important}.reading .decoration,.reading .text[data-role=number],.reading .page-footer{display:none}.reading .text span{font-size:21px!important;color:var(--ink)!important}.reading .text p{line-height:1.8}.reading .table-wrap{overflow-x:auto}.reading table{min-width:650px;height:auto}.reading table span{font-size:18px!important;color:var(--ink)!important}.reading th span{color:white!important}.reading td,.reading th{padding:16px}.reading .image-zoom{width:100%!important;aspect-ratio:16/9}.reading .slide-action,.reading .practice-tools{position:static;margin-top:24px}.reading .practice-tools button{color:var(--green);border-color:var(--line)}.reading .dark .practice-tools button:hover{background:var(--light)}.reading .prompt-copy{padding:20px;background:var(--light);border-radius:12px}.reading .brand{margin-right:10px}
@keyframes page-in{from{opacity:.4;transform:translateY(7px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
@media(max-width:1100px){.brand span:last-child,#hint{display:none}.brand{margin-right:8px}.key{display:none}#toolbar{padding:0 16px}.toc-item{font-size:13px}}
@media(max-width:640px){:root{--bar:64px}.brand,.full-button{display:none}#toolbar{padding:0 8px;gap:5px}#toolbar button{font-size:12px;padding:9px 7px}.nav-group{gap:3px}#page-label{min-width:49px;font-size:12px}.spacer{min-width:0}#mini-timer{position:fixed;top:10px;right:10px;background:var(--mint);padding:5px 9px;border-radius:6px;font-size:12px}#mini-timer:empty{display:none}#toc-list{grid-template-columns:1fr}dialog{padding:23px;max-height:85vh}dialog header h2{font-size:21px}#notes-body{font-size:17px}.material-item{align-items:flex-start;font-size:14px;padding:12px}.material-item button{padding:8px}.reading #viewport{padding:5px 12px 75px}.reading .slide{padding:28px 22px;margin-bottom:20px}.reading .page-title{font-size:27px!important}.reading .text span{font-size:18px!important}.reading .practice-tools{flex-wrap:wrap}}
@media print{@page{size:13.333in 7.5in;margin:0}html,body,body.reading{height:auto;overflow:visible;background:white}#viewport,.reading #viewport{position:static;display:block;padding:0;overflow:visible}#stage,.reading #stage{position:static;width:1280px;max-width:none;height:auto;transform:none!important;box-shadow:none}body .slide,body .slide.active,body.reading .slide{display:block;position:relative;width:1280px;height:720px;min-height:720px;padding:0;margin:0;border:0;border-radius:0;overflow:hidden;break-after:page;page-break-after:always;print-color-adjust:exact;-webkit-print-color-adjust:exact}.slide:last-child{break-after:auto}#toolbar,dialog,#toast,.slide-action,.practice-tools,#live-status{display:none!important}.reading .artboard{position:absolute;inset:0;display:block}.reading .element{position:absolute!important}.reading .decoration{display:block}.reading .page-title{position:absolute!important;left:64px;top:89px;font-size:42px!important}.reading .page-kicker{position:absolute}.reading .text span{font-size:revert-layer!important}.reading .page-footer{display:flex}.reading .text[data-role=number]{display:flex}}