|
|
发表于 2025-10-16 15:28:56
|
查看全部
看看新编辑器
项目
说明
备注
1
2
3
看看新编辑器
感觉很牛逼
.ce-block { margin-bottom: 20px;}.ce-block__content,.ce-toolbar__content { /* max-width:calc(100% - 50px) */ margin-left: auto; margin-right: auto;}.ce-paragraph { line-height: 1.6em; outline: none; text-indent: 2em; font-size: 16px;}.ce-paragraph--right { text-align: right;}.ce-paragraph--center { text-align: center;}.ce-paragraph--left { text-align: left;}.ce-paragraph--justify { text-align: justify;}.ce-paragraph-text-indent { text-align: justify;}.ce-paragraph[data-placeholder]:empty::before{ content: attr(data-placeholder); color: #707684; font-weight: normal; opacity: 0;}/** Show placeholder at the first paragraph if Editor is empty */.codex-editor--empty .ce-block:first-child .ce-paragraph[data-placeholder]:empty::before { opacity: 1;}.codex-editor--toolbox-opened .ce-block:first-child .ce-paragraph[data-placeholder]:empty::before,.codex-editor--empty .ce-block:first-child .ce-paragraph[data-placeholder]:empty:focus::before { opacity: 0;}.ce-paragraph p:first-of-type{ margin-top: 0;}.ce-paragraph p:last-of-type{ margin-bottom: 0;}.svg-icon { width: 1em; height: 1em;}.svg-icon path,.svg-icon polygon,.svg-icon rect { fill: #4691f6;}.svg-icon circle { stroke: #4691f6; stroke-width: 1;}.ce-block { margin-bottom: 20px;}.ce-block__content,.ce-toolbar__content { /* max-width:calc(100% - 50px) */ margin-left: auto; margin-right: auto;}.tc-wrap { --color-background:#f9f9fb; --color-text-secondary:#7b7e89; --color-border:#e8e8eb; --cell-size:0px; --toolbox-icon-size:18px; --toolbox-padding:6px; --toolbox-aiming-field-size:calc(var(--toolbox-icon-size) + var(--toolbox-padding)*2); border:1px solid var(--color-border); position:relative; height:100%; width:100%; margin-top:var(--toolbox-icon-size); box-sizing:border-box; display:grid; grid-template-columns:calc(100% - var(--cell-size)) var(--cell-size);}.tc-wrap--readonly { grid-template-columns:100% var(--cell-size)}.tc-wrap svg { vertical-align:top}@media print { .tc-wrap { border-left-color:var(--color-border); border-left-style:solid; border-left-width:1px; grid-template-columns:100% var(--cell-size)}}@media print { .tc-wrap .tc-row:after { display:none}}.tc-table { position:relative; width:100%; height:100%; display:grid; font-size:14px; line-height:1.4;}.tc-table:after { width:calc(var(--cell-size)); height:100%; left:calc(var(--cell-size)*-1); top:0}.tc-table:after,.tc-table:before { position:absolute; content:""}.tc-table:before { width:100%; height:var(--toolbox-aiming-field-size); top:calc(var(--toolbox-aiming-field-size)*-1); left:0}.tc-table--heading .tc-row:first-child { font-weight:600; border-bottom:2px solid var(--color-border);}.tc-table--heading .tc-row:first-child [contenteditable]:empty:before { content:attr(heading); color:var(--color-text-secondary)}.tc-table--heading .tc-row:first-child:after { bottom:-2px; border-bottom:2px solid var(--color-border)}.tc-add-column,.tc-add-row { display:flex; color:var(--color-text-secondary)}@media print { .tc-add { display:none}}.tc-add-column { padding:4px 0; justify-content:center; border-top:1px solid var(--color-border);}@media print { .tc-add-column { display:none}}.tc-add-row { height:var(--cell-size); align-items:center; padding-left:4px; position:relative;}.tc-add-row:before { content:""; position:absolute; right:calc(var(--cell-size)*-1); width:var(--cell-size); height:100%}@media print { .tc-add-row { display:none}}.tc-add-column,.tc-add-row { transition:0s; cursor:pointer; will-change:background-color;}.tc-add-column:hover,.tc-add-row:hover { transition:background-color .1s ease; background-color:var(--color-background)}.tc-add-row { margin-top:1px;}.tc-add-row:hover:before { transition:.1s; background-color:var(--color-background)}.tc-row { display:grid; grid-template-columns:repeat(auto-fit,minmax(10px,1fr)); position:relative; border-bottom:1px solid var(--color-border);}.tc-row:after { content:""; pointer-events:none; position:absolute; width:var(--cell-size); height:100%; bottom:-1px; right:calc(var(--cell-size)*-1); border-bottom:1px solid var(--color-border)}.tc-row--selected { background:var(--color-background)}.tc-row--selected:after { background:var(--color-background)}.tc-cell { border-right:1px solid var(--color-border); padding:6px 12px; overflow:hidden; outline:none; line-break:normal;}.tc-cell--selected { background:var(--color-background)}.tc-wrap--readonly .tc-row:after { display:none}.tc-toolbox { --toolbox-padding:6px; --popover-margin:30px; --toggler-click-zone-size:30px; --toggler-dots-color:#7b7e89; --toggler-dots-color-hovered:#1d202b; position:absolute; cursor:pointer; z-index:1; opacity:0; transition:opacity .1s; will-change:left,opacity;}.tc-toolbox--column { top:calc(var(--toggler-click-zone-size)*-1); transform:translateX(calc(var(--toggler-click-zone-size)*-1/2)); will-change:left,opacity}.tc-toolbox--row { left:calc(var(--popover-margin)*-1); transform:translateY(calc(var(--toggler-click-zone-size)*-1/2)); margin-top:-1px; will-change:top,opacity}.tc-toolbox--showed { opacity:1}.tc-toolbox .tc-popover { position:absolute; top:0; left:var(--popover-margin)}.tc-toolbox__toggler { display:flex; align-items:center; justify-content:center; width:var(--toggler-click-zone-size); height:var(--toggler-click-zone-size); color:var(--toggler-dots-color); opacity:0; transition:opacity .15s ease; will-change:opacity;}.tc-toolbox__toggler:hover { color:var(--toggler-dots-color-hovered)}.tc-toolbox__toggler svg { fill:currentColor}.tc-wrap:hover .tc-toolbox__toggler { opacity:1}.tc-settings .cdx-settings-button { width:50%; margin:0}.tc-popover { --color-border:#eaeaea; --color-background:#fff; --color-background-hover:rgba(232,232,235,0.49); --color-background-confirm:#e24a4a; --color-background-confirm-hover:#d54040; --color-text-confirm:#fff; background:var(--color-background); border:1px solid var(--color-border); box-shadow:0 3px 15px -3px rgba(13,20,33,.13); border-radius:6px; padding:6px; display:none; will-change:opacity,transform;}.tc-popover--opened { display:block; animation:menuShowing .1s cubic-bezier(.215,.61,.355,1) forwards}.tc-popover__item { display:flex; align-items:center; padding:2px 14px 2px 2px; border-radius:5px; cursor:pointer; white-space:nowrap; -webkit-user-select:none; -moz-user-select:none; user-select:none;}.tc-popover__item:hover { background:var(--color-background-hover)}.tc-popover__item:not(:last-of-type) { margin-bottom:2px}.tc-popover__item-icon { display:inline-flex; width:26px; height:26px; align-items:center; justify-content:center; background:var(--color-background); border-radius:5px; border:1px solid var(--color-border); margin-right:8px}.tc-popover__item-label { line-height:22px; font-size:14px; font-weight:500}.tc-popover__item--confirm { background:var(--color-background-confirm); color:var(--color-text-confirm);}.tc-popover__item--confirm:hover { background-color:var(--color-background-confirm-hover)}.tc-popover__item--confirm .tc-popover__item-icon { background:var(--color-background-confirm); border-color:rgba(0,0,0,.1);}.tc-popover__item--confirm .tc-popover__item-icon svg { transition:transform .2s ease-in; transform:rotate(90deg) scale(1.2)}.tc-popover__item--hidden { display:none}@keyframes menuShowing { 0% { opacity:0; transform:translateY(-8px) scale(.9)}70% { opacity:1; transform:translateY(2px)}to { transform:translateY(0)}}.ce-block { margin-bottom: 20px;}.ce-block__content, .ce-toolbar__content { margin-left: auto; margin-right: auto;}.cdx-quote { position: relative; background-color: #f8f8f8; padding: 24px!important; margin: 0px; border-radius: 12px; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); overflow: hidden;}.quote-background-icon { position: absolute; top: 10px; right: 10px; opacity: 0.2; z-index: 1;}.cdx-quote__text { min-height: 30px; margin-bottom: 10px; font-size: 16px; line-height: 1.5; color: #333;}.cdx-quote__caption { padding: 10px 20px 0px 20px; font-size: 14px; color: #777;}.cdx-quote__caption-left { text-align: left;}.cdx-quote__caption-center { text-align: center;}.cdx-quote__caption-right { text-align: right;}.cdx-quote [contentEditable=true][data-placeholder]::before { position: absolute; content: attr(data-placeholder); color: #bbb; font-weight: normal; opacity: 0;}.cdx-quote [contentEditable=true][data-placeholder]:empty::before { opacity: 1;}.cdx-quote [contentEditable=true][data-placeholder]:empty:focus::before { opacity: 0;}.cdx-quote-settings { display: flex;}.cdx-quote-settings .cdx-settings-button { width: 50%;}.inline-code { background: rgba(250, 239, 240, 0.78); color: #b44437; padding: 3px 4px; border-radius: 5px; margin: 0 1px; font-family: inherit; font-size: 0.86em; font-weight: 500; letter-spacing: 0.3px;} |
|
