formula-editor-vue3/dist/style.css

codemirror formula editor for vue3

:root{--formula-editor-primary: #409eff;--formula-editor-primary-light: #c6e2ff;--formula-editor-border: 1px solid #dcdfe6;--formula-editor-func: #770088;--formula-editor-bg: #f2f3f5;--formula-editor-bg-header: #f2f3f5;--formula-editor-desc: #67c23a}.formula-editor *{box-sizing:border-box;-ms-overflow-style:none;overflow:-moz-scrollbars-none;margin:0;padding:0}.formula-editor .formula-editor-title{height:30px;padding:0 15px;background-color:var(--formula-editor-bg-header);line-height:30px;font-size:14px}.formula-editor .formula-editor-container{border:var(--formula-editor-border);overflow:hidden}.formula-params{height:260px;padding:15px 10px}.formula-params .formula-params-list{height:100%;margin-right:10px;border:var(--formula-editor-border);overflow-x:hidden;overflow:auto;padding:10px 0;float:left;list-style:none}.formula-params .formula-params-item{height:30px;display:flex;align-items:center;font-size:14px;padding:0 10px;cursor:pointer;list-style:none}.formula-params .formula-params-variable{width:35%}.formula-params .formula-params-variable .variable-item:hover{background-color:var(--formula-editor-primary-light)}.formula-params .formula-params-variable .variable-item:hover .variable-item-label{color:var(--formula-editor-primary);font-weight:700}.formula-params .formula-params-variable .variable-item .variable-item-label{flex:1;padding-right:10px}.formula-params .formula-params-variable .variable-item .variable-item-desc{display:inline-block;font-size:10px;line-height:14px;padding:0 5px;color:var(--formula-editor-desc);border:1px solid var(--formula-editor-desc);border-radius:20px}.formula-params .formula-params-maths{width:25%}.formula-params .formula-params-maths .maths-item:hover{background-color:var(--formula-editor-primary-light);color:var(--formula-editor-primary)}.formula-params .formula-maths-desc.formula-params-list{width:calc(40% - 20px);margin-right:0;padding:10px}.formula-params .formula-maths-desc.formula-params-list>p{font-size:14px;line-height:18px;margin-bottom:5px}.formula-params .formula-maths-desc.formula-params-list .math-desc{font-weight:700}.formula-editor-codemirror.v-codemirror .cm-focused{outline:none}.formula-editor-codemirror.v-codemirror .cm-widget-placeholder.cm-widget-placeholder__variable{color:var(--formula-editor-primary);background-color:var(--formula-editor-primary-light);padding:0 4px;margin:0 1px;border-radius:2px;border:1px solid var(--formula-editor-bg-header);cursor:pointer}.formula-editor-codemirror.v-codemirror .cm-widget-placeholder.cm-widget-placeholder__variable:hover{border-color:var(--formula-editor-primary)}.formula-editor-codemirror.v-codemirror .cm-widget-placeholder.cm-widget-placeholder__mathfunc{color:var(--formula-editor-func)}