/** * WangEditor 自带样式的**降级层**(cascade layer)。 * * 为什么需要:编辑器的编辑面要和签署预览、签署工作台、导出的 PDF 用**同一份正文排版** * —— 就是 `utils/document-paper.ts` 里以 `.doc-paper` 开头那一套,编辑器面也挂了 * `doc-paper` 类(见 EditorWangPane)。 * * 但 WangEditor 自己对正文有一套默认值,而且选择器权重比我们高: * * .w-e-text-container [data-slate-editor] p { margin: 15px 0 } ← (0,2,1) * .w-e-text-container [data-slate-editor] h1…h5 { margin: 20px 0 } ← (0,2,1) * .w-e-text-container li, p, td, th { line-height: 1.5 } ← (0,1,1) * .w-e-text-container * { margin: 0; padding: 0 } ← (0,1,0) * * 而 `.doc-paper p { margin: 0 0 6px }` 只有 (0,1,1),比不过它 —— 结果就是 * 「编辑时段落间距 15px、纸上是 6px」,同一份文书在编辑区与预览里换行都不一样。 * * 解法不是在那份排版里堆 `!important`:那会让「唯一一份排版」变成谁也别想覆盖的 * 暴力规则,以后想为某个特定页面调一处间距都没有退路。改用层叠层—— * **未分层的规则一律优先于分层规则,与选择器权重无关**,所以只需要把整包 vendor * 样式压进最低优先级的层,我们那份排版就自然生效,而且不必在这里复述 vendor 的 * 任何数值(复述一遍就等于又开了一份副本,正是要避免的事)。 * * 影响面:本应用只有文书编辑器用 WangEditor,且我们的规则都是精确选择器, * 只会在确实要覆盖的(正文 p / h / li / table / td / th)那些属性上生效; * 工具栏、悬浮菜单、表格操作手柄等没有对应规则的地方仍按 vendor 自己的样式渲染。 * * ⚠️ 换成别的编辑器引擎时,这里要跟着换成那个引擎的样式入口 * (换引擎要一并处理的几件事,列在 WordEditorDialog 里 EditorPaneHandle 的注释上)。 */ @import '@wangeditor/editor/dist/css/style.css' layer(vendor-editor);