easy-email-extensions 4.2.0 → 4.3.0

package/lib/style.css

@@ -1 +1,12 @@
-[arco-theme=dark] .easy-email-editor-tabWrapper,[arco-theme=dark] .arco-layout{background-color:var(--color-bg-3)}[arco-theme=dark] .easy-email-editor-button{background-color:var(--color-secondary);color:var(--color-text-2);border:1px solid transparent}[arco-theme=dark] .easy-email-editor-button:hover{border-color:var(--color-neutral-4);color:var(--color-text-2);background-color:var(--color-fill-3)}[arco-theme=dark] .easy-email-editor-button[disabled],[arco-theme=dark] .easy-email-editor-button[disabled]:hover{background-color:var(--color-secondary);color:var(--color-text-2);border:1px solid transparent}._title_1f523_1{display:flex;flex:1;justify-content:space-between;align-items:center;position:relative}._title_1f523_1 .icon-eye{position:absolute;top:50%;transform:translateY(-50%);right:30px;opacity:0;font-size:14px;color:rgb(var(--primary-6))!important}._title_1f523_1 .icon-eye-invisible{position:absolute;top:50%;transform:translateY(-50%);font-size:14px;right:30px;opacity:1!important;color:rgb(var(--primary-6))!important}#BlockLayerManager .arco-tree-node-expanded{overflow:hidden}#BlockLayerManager .arco-tree-node-selected .arco-tree-node-title{background-color:rgb(var(--primary-1))}#BlockLayerManager .arco-tree-node-title:hover .icon-eye{opacity:1}#BlockLayerManager .arco-tree-node-indent-block{width:8px}#BlockLayerManager .arco-tree-node-drag-icon{cursor:grab}._wrap_aul3a_1{position:fixed;left:500px;top:200px;z-index:9999;background-color:#fff;box-shadow:1px 1px 4px #0000004d;border-radius:8px;overflow:hidden;font-family:"Lato",sans-serif;font-weight:500}._wrap_aul3a_1 ._listItem_aul3a_13{padding:5px 15px;display:flex;flex-wrap:nowrap;cursor:default!important}._wrap_aul3a_1 ._listItem_aul3a_13:hover{background-color:#0000001a}._contextmenuMark_aul3a_23{position:fixed;width:100vw;height:100vh;left:0;top:0;z-index:9998}._container_jzksr_1{display:flex;flex-wrap:wrap}._error_jzksr_6{border-color:#ff4d4f!important}._item_jzksr_10{margin:0 8px 8px 0;border-radius:4px;border:1px solid #d9d9d9;padding:8px;width:104px;height:104px}._item_jzksr_10 ._info_jzksr_18{position:relative;height:100%;width:100%;display:flex;align-items:center;justify-content:center;overflow:hidden}._item_jzksr_10 ._info_jzksr_18:before{content:" ";position:absolute;z-index:1;background-color:#00000080;-webkit-transition:all .3s;transition:all .3s;width:100%;height:100%;opacity:0}._item_jzksr_10 ._info_jzksr_18 img{width:100%;border:1px solid #f2f2f2;transition:all .3s}._item_jzksr_10 ._info_jzksr_18 ._btn-wrap_jzksr_43{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:10;white-space:nowrap;-webkit-transition:all .3s;transition:all .3s;opacity:0}._item_jzksr_10 ._info_jzksr_18 ._btn-wrap_jzksr_43 a{color:#eee;margin:0 4px}._item_jzksr_10 ._info_jzksr_18 ._btn-wrap_jzksr_43 a:hover{color:#fff}._item_jzksr_10 ._info_jzksr_18:hover:before,._item_jzksr_10 ._info_jzksr_18:hover ._btn-wrap_jzksr_43{opacity:1}._upload_jzksr_68{margin:0 8px 8px 0;border:1px dotted;width:104px;height:104px;display:flex;justify-content:center;align-items:center;flex-direction:column;cursor:pointer}._wrap_jzksr_80 ._urlInput_jzksr_80{display:flex;align-items:center}._helperText_1m9nq_1{color:#6d7175;font-weight:400;line-height:1.3;text-transform:none;letter-spacing:normal}._label-hidden_1m9nq_9{position:absolute!important;top:0;clip:rect(1px,1px,1px,1px)!important;overflow:hidden!important;height:1px!important;width:1px!important;padding:0!important;border:0!important}._editTab_1m9nq_20 .arco-tabs-content{border:none}._editTab_1m9nq_20 .arco-tabs-header-nav{padding-right:15px}._inputWithUnit_1m9nq_27 .arco-select-view{padding:0 5px!important;text-align:center}._inputWithUnit_1m9nq_27 .arco-select-view .arco-select-view-value{overflow:visible}._inputWithUnitSelectOption_1m9nq_35{padding:0 5px!important;text-align:center!important}._colorPicker_1m9nq_40 .sketch-picker .flexbox-fix:nth-child(3){display:none!important}._BlocksPanel_15fho_1 img{max-width:100%}._blockItem_15fho_5{text-align:center;padding:3px 12px;border-radius:15px;min-width:60px}._closeBtn_15fho_12{width:30px;height:30px;display:flex;align-items:center;justify-content:center;border-radius:50%}._closeBtn_15fho_12:hover{background-color:#f7f8f8}._mask_1a0xw_1{width:270px;display:flex;justify-content:flex-end;align-items:center;cursor:default;position:relative;transition:all .3s;pointer-events:auto}._drag_1a0xw_12{background-color:#000000a6}._SimpleLayout_pu31r_1 .arco-layout-sider-children{overflow-x:hidden}._SimpleLayout_pu31r_1 .arco-layout-sider-children .arco-tabs-content{padding:0}._SimpleLayout_pu31r_1 .arco-collapse-item-content-expanded{overflow:visible}._SimpleLayout_pu31r_1 *::-webkit-scrollbar{-webkit-appearance:none;width:8px!important}._SimpleLayout_pu31r_1 *::-webkit-scrollbar-thumb{background-color:#00000080;box-shadow:0 0 1px #ffffff80;-webkit-box-shadow:0 0 1px rgba(255,255,255,.5)}._customScrollBar_pu31r_20{overflow:scroll}._customScrollBar_pu31r_20::-webkit-scrollbar{-webkit-appearance:none;width:8px!important}._customScrollBar_pu31r_20::-webkit-scrollbar-thumb{background-color:#00000080;box-shadow:0 0 1px #ffffff80;-webkit-box-shadow:0 0 1px rgba(255,255,255,.5)}._customScrollBar_pu31r_20 .arco-tabs-content{padding:0}._customScrollBarV2_pu31r_36{overflow:scroll}._customScrollBarV2_pu31r_36::-webkit-scrollbar{-webkit-appearance:none;width:8px!important}._customScrollBarV2_pu31r_36::-webkit-scrollbar-thumb{background-color:#00000080;box-shadow:0 0 1px #ffffff80;-webkit-box-shadow:0 0 1px rgba(255,255,255,.5)}.CodeMirror{font-family:monospace;height:300px;color:#000;direction:ltr}.CodeMirror-lines{padding:4px 0}.CodeMirror pre.CodeMirror-line,.CodeMirror pre.CodeMirror-line-like{padding:0 4px}.CodeMirror-scrollbar-filler,.CodeMirror-gutter-filler{background-color:#fff}.CodeMirror-gutters{border-right:1px solid #ddd;background-color:#f7f7f7;white-space:nowrap}.CodeMirror-linenumber{padding:0 3px 0 5px;min-width:20px;text-align:right;color:#999;white-space:nowrap}.CodeMirror-guttermarker{color:#000}.CodeMirror-guttermarker-subtle{color:#999}.CodeMirror-cursor{border-left:1px solid black;border-right:none;width:0}.CodeMirror div.CodeMirror-secondarycursor{border-left:1px solid silver}.cm-fat-cursor .CodeMirror-cursor{width:auto;border:0!important;background:#7e7}.cm-fat-cursor div.CodeMirror-cursors{z-index:1}.cm-fat-cursor-mark{background-color:#14ff1480;-webkit-animation:blink 1.06s steps(1) infinite;-moz-animation:blink 1.06s steps(1) infinite;animation:blink 1.06s steps(1) infinite}.cm-animate-fat-cursor{width:auto;-webkit-animation:blink 1.06s steps(1) infinite;-moz-animation:blink 1.06s steps(1) infinite;animation:blink 1.06s steps(1) infinite;background-color:#7e7}@-moz-keyframes blink{50%{background-color:transparent}}@-webkit-keyframes blink{50%{background-color:transparent}}@keyframes blink{50%{background-color:transparent}}.cm-tab{display:inline-block;text-decoration:inherit}.CodeMirror-rulers{position:absolute;inset:-50px 0 0;overflow:hidden}.CodeMirror-ruler{border-left:1px solid #ccc;top:0;bottom:0;position:absolute}.cm-s-default .cm-header{color:#00f}.cm-s-default .cm-quote{color:#090}.cm-negative{color:#d44}.cm-positive{color:#292}.cm-header,.cm-strong{font-weight:bold}.cm-em{font-style:italic}.cm-link{text-decoration:underline}.cm-strikethrough{text-decoration:line-through}.cm-s-default .cm-keyword{color:#708}.cm-s-default .cm-atom{color:#219}.cm-s-default .cm-number{color:#164}.cm-s-default .cm-def{color:#00f}.cm-s-default .cm-variable-2{color:#05a}.cm-s-default .cm-variable-3,.cm-s-default .cm-type{color:#085}.cm-s-default .cm-comment{color:#a50}.cm-s-default .cm-string{color:#a11}.cm-s-default .cm-string-2{color:#f50}.cm-s-default .cm-meta,.cm-s-default .cm-qualifier{color:#555}.cm-s-default .cm-builtin{color:#30a}.cm-s-default .cm-bracket{color:#997}.cm-s-default .cm-tag{color:#170}.cm-s-default .cm-attribute{color:#00c}.cm-s-default .cm-hr{color:#999}.cm-s-default .cm-link{color:#00c}.cm-s-default .cm-error,.cm-invalidchar{color:red}.CodeMirror-composing{border-bottom:2px solid}div.CodeMirror span.CodeMirror-matchingbracket{color:#0b0}div.CodeMirror span.CodeMirror-nonmatchingbracket{color:#a22}.CodeMirror-matchingtag{background:rgba(255,150,0,.3)}.CodeMirror-activeline-background{background:#e8f2ff}.CodeMirror{position:relative;overflow:hidden;background:white}.CodeMirror-scroll{overflow:scroll!important;margin-bottom:-50px;margin-right:-50px;padding-bottom:50px;height:100%;outline:none;position:relative}.CodeMirror-sizer{position:relative;border-right:50px solid transparent}.CodeMirror-vscrollbar,.CodeMirror-hscrollbar,.CodeMirror-scrollbar-filler,.CodeMirror-gutter-filler{position:absolute;z-index:6;display:none;outline:none}.CodeMirror-vscrollbar{right:0;top:0;overflow-x:hidden;overflow-y:scroll}.CodeMirror-hscrollbar{bottom:0;left:0;overflow-y:hidden;overflow-x:scroll}.CodeMirror-scrollbar-filler{right:0;bottom:0}.CodeMirror-gutter-filler{left:0;bottom:0}.CodeMirror-gutters{position:absolute;left:0;top:0;min-height:100%;z-index:3}.CodeMirror-gutter{white-space:normal;height:100%;display:inline-block;vertical-align:top;margin-bottom:-50px}.CodeMirror-gutter-wrapper{position:absolute;z-index:4;background:none!important;border:none!important}.CodeMirror-gutter-background{position:absolute;top:0;bottom:0;z-index:4}.CodeMirror-gutter-elt{position:absolute;cursor:default;z-index:4}.CodeMirror-gutter-wrapper ::selection,.CodeMirror-gutter-wrapper ::-moz-selection{background-color:transparent}.CodeMirror-lines{cursor:text;min-height:1px}.CodeMirror pre.CodeMirror-line,.CodeMirror pre.CodeMirror-line-like{-moz-border-radius:0;-webkit-border-radius:0;border-radius:0;border-width:0;background:transparent;font-family:inherit;font-size:inherit;margin:0;white-space:pre;word-wrap:normal;line-height:inherit;color:inherit;z-index:2;position:relative;overflow:visible;-webkit-tap-highlight-color:transparent;-webkit-font-variant-ligatures:contextual;font-variant-ligatures:contextual}.CodeMirror-wrap pre.CodeMirror-line,.CodeMirror-wrap pre.CodeMirror-line-like{word-wrap:break-word;white-space:pre-wrap;word-break:normal}.CodeMirror-linebackground{position:absolute;inset:0;z-index:0}.CodeMirror-linewidget{position:relative;z-index:2;padding:.1px}.CodeMirror-rtl pre{direction:rtl}.CodeMirror-code{outline:none}.CodeMirror-scroll,.CodeMirror-sizer,.CodeMirror-gutter,.CodeMirror-gutters,.CodeMirror-linenumber{-moz-box-sizing:content-box;box-sizing:content-box}.CodeMirror-measure{position:absolute;width:100%;height:0;overflow:hidden;visibility:hidden}.CodeMirror-cursor{position:absolute;pointer-events:none}.CodeMirror-measure pre{position:static}div.CodeMirror-cursors{visibility:hidden;position:relative;z-index:3}div.CodeMirror-dragcursors,.CodeMirror-focused div.CodeMirror-cursors{visibility:visible}.CodeMirror-selected{background:#d9d9d9}.CodeMirror-focused .CodeMirror-selected{background:#d7d4f0}.CodeMirror-crosshair{cursor:crosshair}.CodeMirror-line::selection,.CodeMirror-line>span::selection,.CodeMirror-line>span>span::selection,.CodeMirror-line::-moz-selection,.CodeMirror-line>span::-moz-selection,.CodeMirror-line>span>span::-moz-selection{background:#d7d4f0}.cm-searching{background-color:#ffa;background-color:#ff06}.cm-force-border{padding-right:.1px}@media print{.CodeMirror div.CodeMirror-cursors{visibility:hidden}}.cm-tab-wrap-hack:after{content:""}span.CodeMirror-selectedtext{background:none}.cm-s-material.CodeMirror{background-color:#263238;color:#eff}.cm-s-material .CodeMirror-gutters{background:#263238;color:#546e7a;border:none}.cm-s-material .CodeMirror-guttermarker,.cm-s-material .CodeMirror-guttermarker-subtle,.cm-s-material .CodeMirror-linenumber{color:#546e7a}.cm-s-material .CodeMirror-cursor{border-left:1px solid #FFCC00}.cm-s-material.cm-fat-cursor .CodeMirror-cursor,.cm-s-material .cm-animate-fat-cursor{background-color:#5d6d5c80!important}.cm-s-material div.CodeMirror-selected,.cm-s-material.CodeMirror-focused div.CodeMirror-selected,.cm-s-material .CodeMirror-line::selection,.cm-s-material .CodeMirror-line>span::selection,.cm-s-material .CodeMirror-line>span>span::selection,.cm-s-material .CodeMirror-line::-moz-selection,.cm-s-material .CodeMirror-line>span::-moz-selection,.cm-s-material .CodeMirror-line>span>span::-moz-selection{background:rgba(128,203,196,.2)}.cm-s-material .CodeMirror-activeline-background{background:rgba(0,0,0,.5)}.cm-s-material .cm-keyword{color:#c792ea}.cm-s-material .cm-operator{color:#89ddff}.cm-s-material .cm-variable-2{color:#eff}.cm-s-material .cm-variable-3,.cm-s-material .cm-type{color:#f07178}.cm-s-material .cm-builtin{color:#ffcb6b}.cm-s-material .cm-atom{color:#f78c6c}.cm-s-material .cm-number{color:#ff5370}.cm-s-material .cm-def{color:#82aaff}.cm-s-material .cm-string{color:#c3e88d}.cm-s-material .cm-string-2{color:#f07178}.cm-s-material .cm-comment{color:#546e7a}.cm-s-material .cm-variable{color:#f07178}.cm-s-material .cm-tag{color:#ff5370}.cm-s-material .cm-meta{color:#ffcb6b}.cm-s-material .cm-attribute,.cm-s-material .cm-property{color:#c792ea}.cm-s-material .cm-qualifier,.cm-s-material .cm-variable-3,.cm-s-material .cm-type{color:#decb6b}.cm-s-material .cm-error{color:#fff;background-color:#ff5370}.cm-s-material .CodeMirror-matchingbracket{text-decoration:underline;color:#fff!important}.cm-s-neat span.cm-comment{color:#a86}.cm-s-neat span.cm-keyword{line-height:1em;font-weight:bold;color:#00f}.cm-s-neat span.cm-string{color:#a22}.cm-s-neat span.cm-builtin{line-height:1em;font-weight:bold;color:#077}.cm-s-neat span.cm-special{line-height:1em;font-weight:bold;color:#0aa}.cm-s-neat span.cm-variable{color:#000}.cm-s-neat span.cm-number,.cm-s-neat span.cm-atom{color:#3a3}.cm-s-neat span.cm-meta{color:#555}.cm-s-neat span.cm-link{color:#3a3}.cm-s-neat .CodeMirror-activeline-background{background:#e8f2ff}.cm-s-neat .CodeMirror-matchingbracket{outline:1px solid grey;color:#000!important}._container_13rz9_1,._container_13rz9_1 .CodeMirror{height:100%}
+[arco-theme=dark] .easy-email-editor-tabWrapper,[arco-theme=dark] .arco-layout{background-color:var(--color-bg-3)}[arco-theme=dark] .easy-email-editor-button{background-color:var(--color-secondary);color:var(--color-text-2);border:1px solid transparent}[arco-theme=dark] .easy-email-editor-button:hover{border-color:var(--color-neutral-4);color:var(--color-text-2);background-color:var(--color-fill-3)}[arco-theme=dark] .easy-email-editor-button[disabled],[arco-theme=dark] .easy-email-editor-button[disabled]:hover{background-color:var(--color-secondary);color:var(--color-text-2);border:1px solid transparent}._title_1f523_1{display:flex;flex:1;justify-content:space-between;align-items:center;position:relative}._title_1f523_1 .icon-eye{position:absolute;top:50%;transform:translateY(-50%);right:30px;opacity:0;font-size:14px;color:rgb(var(--primary-6))!important}._title_1f523_1 .icon-eye-invisible{position:absolute;top:50%;transform:translateY(-50%);font-size:14px;right:30px;opacity:1!important;color:rgb(var(--primary-6))!important}#BlockLayerManager .arco-tree-node-expanded{overflow:hidden}#BlockLayerManager .arco-tree-node-selected .arco-tree-node-title{background-color:rgb(var(--primary-1))}#BlockLayerManager .arco-tree-node-title:hover .icon-eye{opacity:1}#BlockLayerManager .arco-tree-node-indent-block{width:8px}#BlockLayerManager .arco-tree-node-drag-icon{cursor:grab}._wrap_aul3a_1{position:fixed;left:500px;top:200px;z-index:9999;background-color:#fff;box-shadow:1px 1px 4px #0000004d;border-radius:8px;overflow:hidden;font-family:"Lato",sans-serif;font-weight:500}._wrap_aul3a_1 ._listItem_aul3a_13{padding:5px 15px;display:flex;flex-wrap:nowrap;cursor:default!important}._wrap_aul3a_1 ._listItem_aul3a_13:hover{background-color:#0000001a}._contextmenuMark_aul3a_23{position:fixed;width:100vw;height:100vh;left:0;top:0;z-index:9998}._container_jzksr_1{display:flex;flex-wrap:wrap}._error_jzksr_6{border-color:#ff4d4f!important}._item_jzksr_10{margin:0 8px 8px 0;border-radius:4px;border:1px solid #d9d9d9;padding:8px;width:104px;height:104px}._item_jzksr_10 ._info_jzksr_18{position:relative;height:100%;width:100%;display:flex;align-items:center;justify-content:center;overflow:hidden}._item_jzksr_10 ._info_jzksr_18:before{content:" ";position:absolute;z-index:1;background-color:#00000080;-webkit-transition:all .3s;transition:all .3s;width:100%;height:100%;opacity:0}._item_jzksr_10 ._info_jzksr_18 img{width:100%;border:1px solid #f2f2f2;transition:all .3s}._item_jzksr_10 ._info_jzksr_18 ._btn-wrap_jzksr_43{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:10;white-space:nowrap;-webkit-transition:all .3s;transition:all .3s;opacity:0}._item_jzksr_10 ._info_jzksr_18 ._btn-wrap_jzksr_43 a{color:#eee;margin:0 4px}._item_jzksr_10 ._info_jzksr_18 ._btn-wrap_jzksr_43 a:hover{color:#fff}._item_jzksr_10 ._info_jzksr_18:hover:before,._item_jzksr_10 ._info_jzksr_18:hover ._btn-wrap_jzksr_43{opacity:1}._upload_jzksr_68{margin:0 8px 8px 0;border:1px dotted;width:104px;height:104px;display:flex;justify-content:center;align-items:center;flex-direction:column;cursor:pointer}._wrap_jzksr_80 ._urlInput_jzksr_80{display:flex;align-items:center}._helperText_1m9nq_1{color:#6d7175;font-weight:400;line-height:1.3;text-transform:none;letter-spacing:normal}._label-hidden_1m9nq_9{position:absolute!important;top:0;clip:rect(1px,1px,1px,1px)!important;overflow:hidden!important;height:1px!important;width:1px!important;padding:0!important;border:0!important}._editTab_1m9nq_20 .arco-tabs-content{border:none}._editTab_1m9nq_20 .arco-tabs-header-nav{padding-right:15px}._inputWithUnit_1m9nq_27 .arco-select-view{padding:0 5px!important;text-align:center}._inputWithUnit_1m9nq_27 .arco-select-view .arco-select-view-value{overflow:visible}._inputWithUnitSelectOption_1m9nq_35{padding:0 5px!important;text-align:center!important}._colorPicker_1m9nq_40 .sketch-picker .flexbox-fix:nth-child(3){display:none!important}._BlocksPanel_15fho_1 img{max-width:100%}._blockItem_15fho_5{text-align:center;padding:3px 12px;border-radius:15px;min-width:60px}._closeBtn_15fho_12{width:30px;height:30px;display:flex;align-items:center;justify-content:center;border-radius:50%}._closeBtn_15fho_12:hover{background-color:#f7f8f8}._mask_1a0xw_1{width:270px;display:flex;justify-content:flex-end;align-items:center;cursor:default;position:relative;transition:all .3s;pointer-events:auto}._drag_1a0xw_12{background-color:#000000a6}._SimpleLayout_pu31r_1 .arco-layout-sider-children{overflow-x:hidden}._SimpleLayout_pu31r_1 .arco-layout-sider-children .arco-tabs-content{padding:0}._SimpleLayout_pu31r_1 .arco-collapse-item-content-expanded{overflow:visible}._SimpleLayout_pu31r_1 *::-webkit-scrollbar{-webkit-appearance:none;width:8px!important}._SimpleLayout_pu31r_1 *::-webkit-scrollbar-thumb{background-color:#00000080;box-shadow:0 0 1px #ffffff80;-webkit-box-shadow:0 0 1px rgba(255,255,255,.5)}._customScrollBar_pu31r_20{overflow:scroll}._customScrollBar_pu31r_20::-webkit-scrollbar{-webkit-appearance:none;width:8px!important}._customScrollBar_pu31r_20::-webkit-scrollbar-thumb{background-color:#00000080;box-shadow:0 0 1px #ffffff80;-webkit-box-shadow:0 0 1px rgba(255,255,255,.5)}._customScrollBar_pu31r_20 .arco-tabs-content{padding:0}._customScrollBarV2_pu31r_36{overflow:scroll}._customScrollBarV2_pu31r_36::-webkit-scrollbar{-webkit-appearance:none;width:8px!important}._customScrollBarV2_pu31r_36::-webkit-scrollbar-thumb{background-color:#00000080;box-shadow:0 0 1px #ffffff80;-webkit-box-shadow:0 0 1px rgba(255,255,255,.5)}._StandardLayout_xv0bc_1 .arco-layout-sider-children{overflow-x:hidden}._StandardLayout_xv0bc_1 .arco-layout-sider-children .arco-tabs-content{padding:0}._StandardLayout_xv0bc_1 .arco-collapse-item-content-expanded{overflow:visible}._StandardLayout_xv0bc_1 .easy-email-editor-tabWrapper{padding:5px}._layoutItem_1ajtj_1 .arco-collapse-item-header{background-color:#fff!important;border-color:transparent!important}._blockItem_1ajtj_6{margin-bottom:20px;box-shadow:#373f470a 0 0 0 1px,#373f4714 0 4px 4px,#373f4714 0 8px 24px;border:2px solid transparent;border-radius:4px;margin-right:15px}._blockItem_1ajtj_6:hover{box-shadow:0 0 2px 2px rgb(var(--primary-4, #1890ff))!important}._blockItem_1ajtj_6 ._blockItemContainer_1ajtj_16{width:96px;height:96px;padding:10px;text-align:center;display:flex;align-items:center;justify-content:center;flex-direction:column}._blockItem_1ajtj_6:nth-child(3n+1){margin-left:15px}._blockItem_1ajtj_6:nth-child(3n+0){margin-right:0}/*!
+* OverlayScrollbars
+* https://github.com/KingSora/OverlayScrollbars
+*
+* Version: 1.13.0
+*
+* Copyright KingSora | Rene Haas.
+* https://github.com/KingSora
+*
+* Released under the MIT license.
+* Date: 02.08.2020
+*/html.os-html,html.os-html>.os-host{display:block;overflow:hidden;box-sizing:border-box;height:100%!important;width:100%!important;min-width:100%!important;min-height:100%!important;margin:0!important;position:absolute!important}html.os-html>.os-host>.os-padding{position:absolute}body.os-dragging,body.os-dragging *{cursor:default}.os-host,.os-host-textarea{position:relative;overflow:visible!important;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-ms-flex-wrap:nowrap;flex-wrap:nowrap;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-ms-flex-line-pack:start;align-content:flex-start;-webkit-box-align:start;-ms-flex-align:start;-ms-grid-row-align:flex-start;align-items:flex-start}.os-host-flexbox{overflow:hidden!important;display:-webkit-box;display:-ms-flexbox;display:flex}.os-host-flexbox>.os-size-auto-observer{height:inherit!important}.os-host-flexbox>.os-content-glue{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;-ms-flex-negative:0;flex-shrink:0}.os-host-flexbox>.os-size-auto-observer,.os-host-flexbox>.os-content-glue{min-height:0;min-width:0;-webkit-box-flex:0;-ms-flex-positive:0;flex-grow:0;-ms-flex-negative:1;flex-shrink:1;-ms-flex-preferred-size:auto;flex-basis:auto}#os-dummy-scrollbar-size{position:fixed;opacity:0;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";visibility:hidden;overflow:scroll;height:500px;width:500px}#os-dummy-scrollbar-size>div{width:200%;height:200%;margin:10px 0}#os-dummy-scrollbar-size:before,#os-dummy-scrollbar-size:after,.os-content:before,.os-content:after{content:"";display:table;width:.01px;height:.01px;line-height:0;font-size:0;flex-grow:0;flex-shrink:0;visibility:hidden}#os-dummy-scrollbar-size,.os-viewport{-ms-overflow-style:scrollbar!important}.os-viewport-native-scrollbars-invisible#os-dummy-scrollbar-size,.os-viewport-native-scrollbars-invisible.os-viewport{scrollbar-width:none!important}.os-viewport-native-scrollbars-invisible#os-dummy-scrollbar-size::-webkit-scrollbar,.os-viewport-native-scrollbars-invisible.os-viewport::-webkit-scrollbar,.os-viewport-native-scrollbars-invisible#os-dummy-scrollbar-size::-webkit-scrollbar-corner,.os-viewport-native-scrollbars-invisible.os-viewport::-webkit-scrollbar-corner{display:none!important;width:0px!important;height:0px!important;visibility:hidden!important;background:transparent!important}.os-content-glue{box-sizing:inherit;max-height:100%;max-width:100%;width:100%;pointer-events:none}.os-padding{box-sizing:inherit;direction:inherit;position:absolute;overflow:visible;padding:0;margin:0;inset:0;width:auto!important;height:auto!important;z-index:0}.os-host-overflow>.os-padding{overflow:hidden}.os-viewport{direction:inherit!important;box-sizing:inherit!important;resize:none!important;outline:none!important;position:absolute;overflow:hidden;inset:0;padding:0;margin:0;-webkit-overflow-scrolling:touch}.os-content-arrange{position:absolute;z-index:-1;min-height:1px;min-width:1px;pointer-events:none}.os-content{direction:inherit;box-sizing:border-box!important;position:relative;display:block;height:100%;width:100%;visibility:visible}.os-content>.os-textarea{box-sizing:border-box!important;direction:inherit!important;background:transparent!important;outline:0px none transparent!important;overflow:hidden!important;position:absolute!important;display:block!important;top:0!important;left:0!important;margin:0!important;border-radius:0!important;float:none!important;-webkit-filter:none!important;filter:none!important;border:none!important;resize:none!important;-webkit-transform:none!important;transform:none!important;max-width:none!important;max-height:none!important;box-shadow:none!important;-webkit-perspective:none!important;perspective:none!important;opacity:1!important;z-index:1!important;clip:auto!important;vertical-align:baseline!important;padding:0}.os-host-rtl>.os-padding>.os-viewport>.os-content>.os-textarea{right:0!important}.os-content>.os-textarea-cover{z-index:-1;pointer-events:none}.os-content>.os-textarea[wrap=off]{white-space:pre!important;margin:0!important}.os-text-inherit{font-family:inherit;font-size:inherit;font-weight:inherit;font-style:inherit;font-variant:inherit;text-transform:inherit;text-decoration:inherit;text-indent:inherit;text-align:inherit;text-shadow:inherit;text-overflow:inherit;letter-spacing:inherit;word-spacing:inherit;line-height:inherit;unicode-bidi:inherit;direction:inherit;color:inherit;cursor:text}.os-resize-observer,.os-resize-observer-host{box-sizing:inherit;display:block;visibility:hidden;position:absolute;top:0;left:0;height:100%;width:100%;overflow:hidden;pointer-events:none;z-index:-1}.os-resize-observer-host{padding:inherit;border:inherit;border-color:transparent;border-style:solid;box-sizing:border-box}.os-resize-observer-host.observed{display:flex;flex-direction:column;justify-content:flex-start;align-items:flex-start}.os-resize-observer-host>.os-resize-observer,.os-resize-observer-host.observed>.os-resize-observer{height:200%;width:200%;padding:inherit;border:inherit;margin:0;display:block;box-sizing:content-box}.os-resize-observer-host.observed>.os-resize-observer,.os-resize-observer-host.observed>.os-resize-observer:before{display:flex;position:relative;flex-grow:1;flex-shrink:0;flex-basis:auto;box-sizing:border-box}.os-resize-observer-host.observed>.os-resize-observer:before{content:"";box-sizing:content-box;padding:inherit;border:inherit;margin:0}.os-size-auto-observer{box-sizing:inherit!important;height:100%;width:inherit;max-width:1px;position:relative;float:left;max-height:1px;overflow:hidden;z-index:-1;padding:0;margin:0;pointer-events:none;-webkit-box-flex:inherit;-ms-flex-positive:inherit;flex-grow:inherit;-ms-flex-negative:0;flex-shrink:0;-ms-flex-preferred-size:0;flex-basis:0}.os-size-auto-observer>.os-resize-observer{width:1000%;height:1000%;min-height:1px;min-width:1px}.os-resize-observer-item{position:absolute;inset:0;overflow:hidden;z-index:-1;opacity:0;direction:ltr!important;-webkit-box-flex:0!important;-ms-flex:none!important;flex:none!important}.os-resize-observer-item-final{position:absolute;left:0;top:0;-webkit-transition:none!important;transition:none!important;-webkit-box-flex:0!important;-ms-flex:none!important;flex:none!important}.os-resize-observer{-webkit-animation-duration:1ms;animation-duration:1ms;-webkit-animation-name:os-resize-observer-dummy-animation;animation-name:os-resize-observer-dummy-animation}object.os-resize-observer{box-sizing:border-box!important}@-webkit-keyframes os-resize-observer-dummy-animation{0%{cursor:auto}to{cursor:none}}@keyframes os-resize-observer-dummy-animation{0%{cursor:auto}to{cursor:none}}.os-host-transition>.os-scrollbar,.os-host-transition>.os-scrollbar-corner{-webkit-transition:opacity .3s,visibility .3s,top .3s,right .3s,bottom .3s,left .3s;transition:opacity .3s,visibility .3s,top .3s,right .3s,bottom .3s,left .3s}html.os-html>.os-host>.os-scrollbar{position:absolute;z-index:999999}.os-scrollbar,.os-scrollbar-corner{position:absolute;opacity:1;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";z-index:1}.os-scrollbar-corner{bottom:0;right:0}.os-scrollbar{pointer-events:none}.os-scrollbar-track{pointer-events:auto;position:relative;height:100%;width:100%;padding:0!important;border:none!important}.os-scrollbar-handle{pointer-events:auto;position:absolute;width:100%;height:100%}.os-scrollbar-handle-off,.os-scrollbar-track-off{pointer-events:none}.os-scrollbar.os-scrollbar-unusable,.os-scrollbar.os-scrollbar-unusable *{pointer-events:none!important}.os-scrollbar.os-scrollbar-unusable .os-scrollbar-handle{opacity:0!important}.os-scrollbar-horizontal{bottom:0;left:0}.os-scrollbar-vertical{top:0;right:0}.os-host-rtl>.os-scrollbar-horizontal{right:0}.os-host-rtl>.os-scrollbar-vertical,.os-host-rtl>.os-scrollbar-corner{right:auto;left:0}.os-scrollbar-auto-hidden,.os-padding+.os-scrollbar-corner,.os-host-resize-disabled.os-host-scrollbar-horizontal-hidden>.os-scrollbar-corner,.os-host-scrollbar-horizontal-hidden>.os-scrollbar-horizontal,.os-host-resize-disabled.os-host-scrollbar-vertical-hidden>.os-scrollbar-corner,.os-host-scrollbar-vertical-hidden>.os-scrollbar-vertical,.os-scrollbar-horizontal.os-scrollbar-auto-hidden+.os-scrollbar-vertical+.os-scrollbar-corner,.os-scrollbar-horizontal+.os-scrollbar-vertical.os-scrollbar-auto-hidden+.os-scrollbar-corner,.os-scrollbar-horizontal.os-scrollbar-auto-hidden+.os-scrollbar-vertical.os-scrollbar-auto-hidden+.os-scrollbar-corner{opacity:0;visibility:hidden;pointer-events:none}.os-scrollbar-corner-resize-both{cursor:nwse-resize}.os-host-rtl>.os-scrollbar-corner-resize-both{cursor:nesw-resize}.os-scrollbar-corner-resize-horizontal{cursor:ew-resize}.os-scrollbar-corner-resize-vertical{cursor:ns-resize}.os-dragging .os-scrollbar-corner.os-scrollbar-corner-resize{cursor:default}.os-host-resize-disabled.os-host-scrollbar-horizontal-hidden>.os-scrollbar-vertical{top:0;bottom:0}.os-host-resize-disabled.os-host-scrollbar-vertical-hidden>.os-scrollbar-horizontal,.os-host-rtl.os-host-resize-disabled.os-host-scrollbar-vertical-hidden>.os-scrollbar-horizontal{right:0;left:0}.os-scrollbar:hover,.os-scrollbar-corner.os-scrollbar-corner-resize{opacity:1!important;visibility:visible!important}.os-scrollbar-corner.os-scrollbar-corner-resize{background-image:url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+PHN2ZyAgIHhtbG5zOmRjPSJodHRwOi8vcHVybC5vcmcvZGMvZWxlbWVudHMvMS4xLyIgICB4bWxuczpjYz0iaHR0cDovL2NyZWF0aXZlY29tbW9ucy5vcmcvbnMjIiAgIHhtbG5zOnJkZj0iaHR0cDovL3d3dy53My5vcmcvMTk5OS8wMi8yMi1yZGYtc3ludGF4LW5zIyIgICB4bWxuczpzdmc9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiAgIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgICB3aWR0aD0iMTAiICAgaGVpZ2h0PSIxMCIgICB2ZXJzaW9uPSIxLjEiPiAgPGcgICAgIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAsLTEwNDIuMzYyMikiICAgICBzdHlsZT0iZGlzcGxheTppbmxpbmUiPiAgICA8cGF0aCAgICAgICBzdHlsZT0iZmlsbDojMDAwMDAwO2ZpbGwtb3BhY2l0eTowLjQ5NDExNzY1O2ZpbGwtcnVsZTpldmVub2RkO3N0cm9rZTpub25lIiAgICAgICBkPSJtIDcuNDI0MjE4NywxMDQyLjM2MjIgYyAtMC43MjM1NzkyLDAgLTEuMzEwMTU2MiwwLjU4NjYgLTEuMzEwMTU2MiwxLjMxMDIgMCwwLjI5OSAwLjEwNDM0MTksMC41NzEgMC4yNzI5NDkyLDAuNzkxNSAwLjIwOTEwMjQsMC4xNDEzIDAuNDY1NjIwNiwwLjIxODQgMC43MzY5NjI5LDAuMjE4NCAwLjcyMzU3OTMsMCAxLjMxMDE1NjMsLTAuNTg2NiAxLjMxMDE1NjMsLTEuMzEwMiAwLC0wLjI3MTMgLTAuMDc3MDkzLC0wLjUyNzggLTAuMjE4MzU5NCwtMC43MzcgLTAuMjIwNDk0MSwtMC4xNjg2IC0wLjQ5MjU0NDMsLTAuMjcyOSAtMC43OTE1NTI4LC0wLjI3MjkgeiBtIDAsMy4wODQzIGMgLTAuNzIzNTc5MiwwIC0xLjMxMDE1NjIsMC41ODY2IC0xLjMxMDE1NjIsMS4zMTAyIDAsMC4yOTkgMC4xMDQzNDE5LDAuNTcxIDAuMjcyOTQ5MiwwLjc5MTUgMC4yMDkxMDI0LDAuMTQxMyAwLjQ2NTYyMDYsMC4yMTg0IDAuNzM2OTYyOSwwLjIxODQgMC43MjM1NzkzLDAgMS4zMTAxNTYzLC0wLjU4NjYgMS4zMTAxNTYzLC0xLjMxMDIgMCwtMC4yNzEzIC0wLjA3NzA5MywtMC41Mjc4IC0wLjIxODM1OTQsLTAuNzM2OSAtMC4yMjA0OTQxLC0wLjE2ODYgLTAuNDkyNTQ0MywtMC4yNzMgLTAuNzkxNTUyOCwtMC4yNzMgeiBtIC0zLjA4NDMyNjEsMCBjIC0wLjcyMzU3OTMsMCAtMS4zMTAxNTYzLDAuNTg2NiAtMS4zMTAxNTYzLDEuMzEwMiAwLDAuMjk5IDAuMTA0MzQxOSwwLjU3MSAwLjI3Mjk0OTIsMC43OTE1IDAuMjA5MTAyNCwwLjE0MTMgMC40NjU2MjA3LDAuMjE4NCAwLjczNjk2MjksMC4yMTg0IDAuNzIzNTc5MywwIDEuMzEwMTU2MywtMC41ODY2IDEuMzEwMTU2MywtMS4zMTAyIDAsLTAuMjcxMyAtMC4wNzcwOTMsLTAuNTI3OCAtMC4yMTgzNTk0LC0wLjczNjkgLTAuMjIwNDk0LC0wLjE2ODYgLTAuNDkyNTQ0MiwtMC4yNzMgLTAuNzkxNTUyNywtMC4yNzMgeiBtIC0zLjAyOTczNjQsMy4wMjk4IEMgMC41ODY1NzY5MywxMDQ4LjQ3NjMgMCwxMDQ5LjA2MjggMCwxMDQ5Ljc4NjQgYyAwLDAuMjk5IDAuMTA0MzQxOSwwLjU3MTEgMC4yNzI5NDkyMiwwLjc5MTYgMC4yMDkxMDIyOSwwLjE0MTIgMC40NjU2MjA2NSwwLjIxODMgMC43MzY5NjI4OCwwLjIxODMgMC43MjM1NzkzLDAgMS4zMTAxNTYzLC0wLjU4NjUgMS4zMTAxNTYzLC0xLjMxMDEgMCwtMC4yNzE0IC0wLjA3NzA5MywtMC41Mjc5IC0wLjIxODM1OTQsLTAuNzM3IC0wLjIyMDQ5NDEsLTAuMTY4NiAtMC40OTI1NDQzLC0wLjI3MjkgLTAuNzkxNTUyOCwtMC4yNzI5IHogbSAzLjAyOTczNjQsMCBjIC0wLjcyMzU3OTMsMCAtMS4zMTAxNTYzLDAuNTg2NSAtMS4zMTAxNTYzLDEuMzEwMSAwLDAuMjk5IDAuMTA0MzQxOSwwLjU3MTEgMC4yNzI5NDkyLDAuNzkxNiAwLjIwOTEwMjQsMC4xNDEyIDAuNDY1NjIwNywwLjIxODMgMC43MzY5NjI5LDAuMjE4MyAwLjcyMzU3OTMsMCAxLjMxMDE1NjMsLTAuNTg2NSAxLjMxMDE1NjMsLTEuMzEwMSAwLC0wLjI3MTQgLTAuMDc3MDkzLC0wLjUyNzkgLTAuMjE4MzU5NCwtMC43MzcgLTAuMjIwNDk0LC0wLjE2ODYgLTAuNDkyNTQ0MiwtMC4yNzI5IC0wLjc5MTU1MjcsLTAuMjcyOSB6IG0gMy4wODQzMjYxLDAgYyAtMC43MjM1NzkyLDAgLTEuMzEwMTU2MiwwLjU4NjUgLTEuMzEwMTU2MiwxLjMxMDEgMCwwLjI5OSAwLjEwNDM0MTksMC41NzExIDAuMjcyOTQ5MiwwLjc5MTYgMC4yMDkxMDI0LDAuMTQxMiAwLjQ2NTYyMDYsMC4yMTgzIDAuNzM2OTYyOSwwLjIxODMgMC43MjM1NzkzLDAgMS4zMTAxNTYzLC0wLjU4NjUgMS4zMTAxNTYzLC0xLjMxMDEgMCwtMC4yNzE0IC0wLjA3NzA5MywtMC41Mjc5IC0wLjIxODM1OTQsLTAuNzM3IC0wLjIyMDQ5NDEsLTAuMTY4NiAtMC40OTI1NDQzLC0wLjI3MjkgLTAuNzkxNTUyOCwtMC4yNzI5IHoiLz4gIDwvZz4gIDxnICAgICBzdHlsZT0iZGlzcGxheTppbmxpbmUiPiAgICA8cGF0aCAgICAgICBzdHlsZT0iZmlsbDojZmZmZmZmO2ZpbGwtb3BhY2l0eToxO2ZpbGwtcnVsZTpldmVub2RkO3N0cm9rZTpub25lIiAgICAgICBkPSJtIDguMjE1NzcxNSwwLjI3Mjk0OTIyIGMgMC4xNDEyNjY3LDAuMjA5MTAyMjkgMC4yMTgzNTk0LDAuNDY1NjIwNjUgMC4yMTgzNTk0LDAuNzM2OTYyODggMCwwLjcyMzU3OTMgLTAuNTg2NTc3LDEuMzEwMTU2MyAtMS4zMTAxNTYzLDEuMzEwMTU2MyAtMC4yNzEzNDIzLDAgLTAuNTI3ODYwNSwtMC4wNzcwOTMgLTAuNzM2OTYyOSwtMC4yMTgzNTk0IDAuMjM5NDEwNCwwLjMxMzA4NTkgMC42MTI2MzYyLDAuNTE4NjAzNSAxLjAzNzIwNywwLjUxODYwMzUgMC43MjM1NzkzLDAgMS4zMTAxNTYzLC0wLjU4NjU3NyAxLjMxMDE1NjMsLTEuMzEwMTU2MyAwLC0wLjQyNDU3MDc2IC0wLjIwNTUxNzYsLTAuNzk3Nzk2NTkgLTAuNTE4NjAzNSwtMS4wMzcyMDY5OCB6IG0gMCwzLjA4NDMyNjE4IGMgMC4xNDEyNjY3LDAuMjA5MTAyMyAwLjIxODM1OTQsMC40NjU2MjA2IDAuMjE4MzU5NCwwLjczNjk2MjkgMCwwLjcyMzU3OTMgLTAuNTg2NTc3LDEuMzEwMTU2MiAtMS4zMTAxNTYzLDEuMzEwMTU2MiAtMC4yNzEzNDIzLDAgLTAuNTI3ODYwNSwtMC4wNzcwOTMgLTAuNzM2OTYyOSwtMC4yMTgzNTkzIDAuMjM5NDEwNCwwLjMxMzA4NTkgMC42MTI2MzYyLDAuNTE4NjAzNSAxLjAzNzIwNywwLjUxODYwMzUgMC43MjM1NzkzLDAgMS4zMTAxNTYzLC0wLjU4NjU3NyAxLjMxMDE1NjMsLTEuMzEwMTU2MyAwLC0wLjQyNDU3MDggLTAuMjA1NTE3NiwtMC43OTc3OTY3IC0wLjUxODYwMzUsLTEuMDM3MjA3IHogbSAtMy4wODQzMjYyLDAgYyAwLjE0MTI2NjcsMC4yMDkxMDIzIDAuMjE4MzU5NCwwLjQ2NTYyMDYgMC4yMTgzNTk0LDAuNzM2OTYyOSAwLDAuNzIzNTc5MyAtMC41ODY1NzcsMS4zMTAxNTYyIC0xLjMxMDE1NjMsMS4zMTAxNTYyIC0wLjI3MTM0MjIsMCAtMC41Mjc4NjA1LC0wLjA3NzA5MyAtMC43MzY5NjI5LC0wLjIxODM1OTMgMC4yMzk0MTA0LDAuMzEzMDg1OSAwLjYxMjYzNjMsMC41MTg2MDM1IDEuMDM3MjA3MSwwLjUxODYwMzUgMC43MjM1NzkzLDAgMS4zMTAxNTYyLC0wLjU4NjU3NyAxLjMxMDE1NjIsLTEuMzEwMTU2MyAwLC0wLjQyNDU3MDggLTAuMjA1NTE3NSwtMC43OTc3OTY3IC0wLjUxODYwMzUsLTEuMDM3MjA3IHogTSAyLjEwMTcwOSw2LjM4NzAxMTcgYyAwLjE0MTI2NjcsMC4yMDkxMDI0IDAuMjE4MzU5NCwwLjQ2NTYyMDYgMC4yMTgzNTk0LDAuNzM2OTYyOSAwLDAuNzIzNTc5MyAtMC41ODY1NzcsMS4zMTAxNTYzIC0xLjMxMDE1NjMsMS4zMTAxNTYzIC0wLjI3MTM0MjIzLDAgLTAuNTI3ODYwNTksLTAuMDc3MDkzIC0wLjczNjk2Mjg4LC0wLjIxODM1OTQgMC4yMzk0MTAzOSwwLjMxMzA4NTkgMC42MTI2MzYyMiwwLjUxODYwMzUgMS4wMzcyMDY5OCwwLjUxODYwMzUgMC43MjM1NzkzLDAgMS4zMTAxNTYzLC0wLjU4NjU3NyAxLjMxMDE1NjMsLTEuMzEwMTU2MyAwLC0wLjQyNDU3MDggLTAuMjA1NTE3NiwtMC43OTc3OTY2IC0wLjUxODYwMzUsLTEuMDM3MjA3IHogbSAzLjAyOTczNjMsMCBjIDAuMTQxMjY2NywwLjIwOTEwMjQgMC4yMTgzNTk0LDAuNDY1NjIwNiAwLjIxODM1OTQsMC43MzY5NjI5IDAsMC43MjM1NzkzIC0wLjU4NjU3NywxLjMxMDE1NjMgLTEuMzEwMTU2MywxLjMxMDE1NjMgLTAuMjcxMzQyMiwwIC0wLjUyNzg2MDUsLTAuMDc3MDkzIC0wLjczNjk2MjksLTAuMjE4MzU5NCAwLjIzOTQxMDQsMC4zMTMwODU5IDAuNjEyNjM2MywwLjUxODYwMzUgMS4wMzcyMDcxLDAuNTE4NjAzNSAwLjcyMzU3OTMsMCAxLjMxMDE1NjIsLTAuNTg2NTc3IDEuMzEwMTU2MiwtMS4zMTAxNTYzIDAsLTAuNDI0NTcwOCAtMC4yMDU1MTc1LC0wLjc5Nzc5NjYgLTAuNTE4NjAzNSwtMS4wMzcyMDcgeiBtIDMuMDg0MzI2MiwwIGMgMC4xNDEyNjY3LDAuMjA5MTAyNCAwLjIxODM1OTQsMC40NjU2MjA2IDAuMjE4MzU5NCwwLjczNjk2MjkgMCwwLjcyMzU3OTMgLTAuNTg2NTc3LDEuMzEwMTU2MyAtMS4zMTAxNTYzLDEuMzEwMTU2MyAtMC4yNzEzNDIzLDAgLTAuNTI3ODYwNSwtMC4wNzcwOTMgLTAuNzM2OTYyOSwtMC4yMTgzNTk0IDAuMjM5NDEwNCwwLjMxMzA4NTkgMC42MTI2MzYyLDAuNTE4NjAzNSAxLjAzNzIwNywwLjUxODYwMzUgMC43MjM1NzkzLDAgMS4zMTAxNTYzLC0wLjU4NjU3NyAxLjMxMDE1NjMsLTEuMzEwMTU2MyAwLC0wLjQyNDU3MDggLTAuMjA1NTE3NiwtMC43OTc3OTY2IC0wLjUxODYwMzUsLTEuMDM3MjA3IHoiIC8+ICA8L2c+PC9zdmc+);background-repeat:no-repeat;background-position:100% 100%;pointer-events:auto!important}.os-host-rtl>.os-scrollbar-corner.os-scrollbar-corner-resize{-webkit-transform:scale(-1,1);transform:scaleX(-1)}.os-host-overflow{overflow:hidden!important}.os-theme-none>.os-scrollbar-horizontal,.os-theme-none>.os-scrollbar-vertical,.os-theme-none>.os-scrollbar-corner{display:none!important}.os-theme-none>.os-scrollbar-corner-resize{display:block!important;min-width:10px;min-height:10px}.os-theme-dark>.os-scrollbar-horizontal,.os-theme-light>.os-scrollbar-horizontal{right:10px;height:10px}.os-theme-dark>.os-scrollbar-vertical,.os-theme-light>.os-scrollbar-vertical{bottom:10px;width:10px}.os-theme-dark.os-host-rtl>.os-scrollbar-horizontal,.os-theme-light.os-host-rtl>.os-scrollbar-horizontal{left:10px;right:0}.os-theme-dark>.os-scrollbar-corner,.os-theme-light>.os-scrollbar-corner{height:10px;width:10px}.os-theme-dark>.os-scrollbar-corner,.os-theme-light>.os-scrollbar-corner{background-color:transparent}.os-theme-dark>.os-scrollbar,.os-theme-light>.os-scrollbar{padding:2px;box-sizing:border-box;background:transparent}.os-theme-dark>.os-scrollbar.os-scrollbar-unusable,.os-theme-light>.os-scrollbar.os-scrollbar-unusable,.os-theme-dark>.os-scrollbar>.os-scrollbar-track,.os-theme-light>.os-scrollbar>.os-scrollbar-track{background:transparent}.os-theme-dark>.os-scrollbar-horizontal>.os-scrollbar-track>.os-scrollbar-handle,.os-theme-light>.os-scrollbar-horizontal>.os-scrollbar-track>.os-scrollbar-handle{min-width:30px}.os-theme-dark>.os-scrollbar-vertical>.os-scrollbar-track>.os-scrollbar-handle,.os-theme-light>.os-scrollbar-vertical>.os-scrollbar-track>.os-scrollbar-handle{min-height:30px}.os-theme-dark.os-host-transition>.os-scrollbar>.os-scrollbar-track>.os-scrollbar-handle,.os-theme-light.os-host-transition>.os-scrollbar>.os-scrollbar-track>.os-scrollbar-handle{-webkit-transition:background-color .3s;transition:background-color .3s}.os-theme-dark>.os-scrollbar>.os-scrollbar-track>.os-scrollbar-handle,.os-theme-light>.os-scrollbar>.os-scrollbar-track>.os-scrollbar-handle,.os-theme-dark>.os-scrollbar>.os-scrollbar-track,.os-theme-light>.os-scrollbar>.os-scrollbar-track{border-radius:10px}.os-theme-dark>.os-scrollbar>.os-scrollbar-track>.os-scrollbar-handle{background:rgba(0,0,0,.4)}.os-theme-light>.os-scrollbar>.os-scrollbar-track>.os-scrollbar-handle{background:rgba(255,255,255,.4)}.os-theme-dark>.os-scrollbar:hover>.os-scrollbar-track>.os-scrollbar-handle{background:rgba(0,0,0,.55)}.os-theme-light>.os-scrollbar:hover>.os-scrollbar-track>.os-scrollbar-handle{background:rgba(255,255,255,.55)}.os-theme-dark>.os-scrollbar>.os-scrollbar-track>.os-scrollbar-handle.active{background:rgba(0,0,0,.7)}.os-theme-light>.os-scrollbar>.os-scrollbar-track>.os-scrollbar-handle.active{background:rgba(255,255,255,.7)}.os-theme-dark>.os-scrollbar-horizontal .os-scrollbar-handle:before,.os-theme-dark>.os-scrollbar-vertical .os-scrollbar-handle:before,.os-theme-light>.os-scrollbar-horizontal .os-scrollbar-handle:before,.os-theme-light>.os-scrollbar-vertical .os-scrollbar-handle:before{content:"";position:absolute;inset:0;display:block}.os-theme-dark.os-host-scrollbar-horizontal-hidden>.os-scrollbar-horizontal .os-scrollbar-handle:before,.os-theme-dark.os-host-scrollbar-vertical-hidden>.os-scrollbar-vertical .os-scrollbar-handle:before,.os-theme-light.os-host-scrollbar-horizontal-hidden>.os-scrollbar-horizontal .os-scrollbar-handle:before,.os-theme-light.os-host-scrollbar-vertical-hidden>.os-scrollbar-vertical .os-scrollbar-handle:before{display:none}.os-theme-dark>.os-scrollbar-horizontal .os-scrollbar-handle:before,.os-theme-light>.os-scrollbar-horizontal .os-scrollbar-handle:before{top:-6px;bottom:-2px}.os-theme-dark>.os-scrollbar-vertical .os-scrollbar-handle:before,.os-theme-light>.os-scrollbar-vertical .os-scrollbar-handle:before{left:-6px;right:-2px}.os-host-rtl.os-theme-dark>.os-scrollbar-vertical .os-scrollbar-handle:before,.os-host-rtl.os-theme-light>.os-scrollbar-vertical .os-scrollbar-handle:before{right:-6px;left:-2px}._largeTabsHeader_d2sio_1 .arco-tabs-header{width:100%;display:flex}._largeTabsHeader_d2sio_1 .arco-tabs-header .arco-tabs-header-title{flex:1;margin:0!important;padding:0!important;height:60px;line-height:60px}._largeTabsHeader_d2sio_1 .arco-tabs-header .arco-tabs-header-title .arco-tabs-header-title-text{display:block;text-align:center;width:100%}._largeTabsHeader_d2sio_1 .arco-tabs-header .arco-tabs-header-title .arco-tabs-header-title-text:before{display:none}.CodeMirror{font-family:monospace;height:300px;color:#000;direction:ltr}.CodeMirror-lines{padding:4px 0}.CodeMirror pre.CodeMirror-line,.CodeMirror pre.CodeMirror-line-like{padding:0 4px}.CodeMirror-scrollbar-filler,.CodeMirror-gutter-filler{background-color:#fff}.CodeMirror-gutters{border-right:1px solid #ddd;background-color:#f7f7f7;white-space:nowrap}.CodeMirror-linenumber{padding:0 3px 0 5px;min-width:20px;text-align:right;color:#999;white-space:nowrap}.CodeMirror-guttermarker{color:#000}.CodeMirror-guttermarker-subtle{color:#999}.CodeMirror-cursor{border-left:1px solid black;border-right:none;width:0}.CodeMirror div.CodeMirror-secondarycursor{border-left:1px solid silver}.cm-fat-cursor .CodeMirror-cursor{width:auto;border:0!important;background:#7e7}.cm-fat-cursor div.CodeMirror-cursors{z-index:1}.cm-fat-cursor-mark{background-color:#14ff1480;-webkit-animation:blink 1.06s steps(1) infinite;-moz-animation:blink 1.06s steps(1) infinite;animation:blink 1.06s steps(1) infinite}.cm-animate-fat-cursor{width:auto;-webkit-animation:blink 1.06s steps(1) infinite;-moz-animation:blink 1.06s steps(1) infinite;animation:blink 1.06s steps(1) infinite;background-color:#7e7}@-moz-keyframes blink{50%{background-color:transparent}}@-webkit-keyframes blink{50%{background-color:transparent}}@keyframes blink{50%{background-color:transparent}}.cm-tab{display:inline-block;text-decoration:inherit}.CodeMirror-rulers{position:absolute;inset:-50px 0 0;overflow:hidden}.CodeMirror-ruler{border-left:1px solid #ccc;top:0;bottom:0;position:absolute}.cm-s-default .cm-header{color:#00f}.cm-s-default .cm-quote{color:#090}.cm-negative{color:#d44}.cm-positive{color:#292}.cm-header,.cm-strong{font-weight:bold}.cm-em{font-style:italic}.cm-link{text-decoration:underline}.cm-strikethrough{text-decoration:line-through}.cm-s-default .cm-keyword{color:#708}.cm-s-default .cm-atom{color:#219}.cm-s-default .cm-number{color:#164}.cm-s-default .cm-def{color:#00f}.cm-s-default .cm-variable-2{color:#05a}.cm-s-default .cm-variable-3,.cm-s-default .cm-type{color:#085}.cm-s-default .cm-comment{color:#a50}.cm-s-default .cm-string{color:#a11}.cm-s-default .cm-string-2{color:#f50}.cm-s-default .cm-meta,.cm-s-default .cm-qualifier{color:#555}.cm-s-default .cm-builtin{color:#30a}.cm-s-default .cm-bracket{color:#997}.cm-s-default .cm-tag{color:#170}.cm-s-default .cm-attribute{color:#00c}.cm-s-default .cm-hr{color:#999}.cm-s-default .cm-link{color:#00c}.cm-s-default .cm-error,.cm-invalidchar{color:red}.CodeMirror-composing{border-bottom:2px solid}div.CodeMirror span.CodeMirror-matchingbracket{color:#0b0}div.CodeMirror span.CodeMirror-nonmatchingbracket{color:#a22}.CodeMirror-matchingtag{background:rgba(255,150,0,.3)}.CodeMirror-activeline-background{background:#e8f2ff}.CodeMirror{position:relative;overflow:hidden;background:white}.CodeMirror-scroll{overflow:scroll!important;margin-bottom:-50px;margin-right:-50px;padding-bottom:50px;height:100%;outline:none;position:relative}.CodeMirror-sizer{position:relative;border-right:50px solid transparent}.CodeMirror-vscrollbar,.CodeMirror-hscrollbar,.CodeMirror-scrollbar-filler,.CodeMirror-gutter-filler{position:absolute;z-index:6;display:none;outline:none}.CodeMirror-vscrollbar{right:0;top:0;overflow-x:hidden;overflow-y:scroll}.CodeMirror-hscrollbar{bottom:0;left:0;overflow-y:hidden;overflow-x:scroll}.CodeMirror-scrollbar-filler{right:0;bottom:0}.CodeMirror-gutter-filler{left:0;bottom:0}.CodeMirror-gutters{position:absolute;left:0;top:0;min-height:100%;z-index:3}.CodeMirror-gutter{white-space:normal;height:100%;display:inline-block;vertical-align:top;margin-bottom:-50px}.CodeMirror-gutter-wrapper{position:absolute;z-index:4;background:none!important;border:none!important}.CodeMirror-gutter-background{position:absolute;top:0;bottom:0;z-index:4}.CodeMirror-gutter-elt{position:absolute;cursor:default;z-index:4}.CodeMirror-gutter-wrapper ::selection,.CodeMirror-gutter-wrapper ::-moz-selection{background-color:transparent}.CodeMirror-lines{cursor:text;min-height:1px}.CodeMirror pre.CodeMirror-line,.CodeMirror pre.CodeMirror-line-like{-moz-border-radius:0;-webkit-border-radius:0;border-radius:0;border-width:0;background:transparent;font-family:inherit;font-size:inherit;margin:0;white-space:pre;word-wrap:normal;line-height:inherit;color:inherit;z-index:2;position:relative;overflow:visible;-webkit-tap-highlight-color:transparent;-webkit-font-variant-ligatures:contextual;font-variant-ligatures:contextual}.CodeMirror-wrap pre.CodeMirror-line,.CodeMirror-wrap pre.CodeMirror-line-like{word-wrap:break-word;white-space:pre-wrap;word-break:normal}.CodeMirror-linebackground{position:absolute;inset:0;z-index:0}.CodeMirror-linewidget{position:relative;z-index:2;padding:.1px}.CodeMirror-rtl pre{direction:rtl}.CodeMirror-code{outline:none}.CodeMirror-scroll,.CodeMirror-sizer,.CodeMirror-gutter,.CodeMirror-gutters,.CodeMirror-linenumber{-moz-box-sizing:content-box;box-sizing:content-box}.CodeMirror-measure{position:absolute;width:100%;height:0;overflow:hidden;visibility:hidden}.CodeMirror-cursor{position:absolute;pointer-events:none}.CodeMirror-measure pre{position:static}div.CodeMirror-cursors{visibility:hidden;position:relative;z-index:3}div.CodeMirror-dragcursors,.CodeMirror-focused div.CodeMirror-cursors{visibility:visible}.CodeMirror-selected{background:#d9d9d9}.CodeMirror-focused .CodeMirror-selected{background:#d7d4f0}.CodeMirror-crosshair{cursor:crosshair}.CodeMirror-line::selection,.CodeMirror-line>span::selection,.CodeMirror-line>span>span::selection,.CodeMirror-line::-moz-selection,.CodeMirror-line>span::-moz-selection,.CodeMirror-line>span>span::-moz-selection{background:#d7d4f0}.cm-searching{background-color:#ffa;background-color:#ff06}.cm-force-border{padding-right:.1px}@media print{.CodeMirror div.CodeMirror-cursors{visibility:hidden}}.cm-tab-wrap-hack:after{content:""}span.CodeMirror-selectedtext{background:none}.cm-s-material.CodeMirror{background-color:#263238;color:#eff}.cm-s-material .CodeMirror-gutters{background:#263238;color:#546e7a;border:none}.cm-s-material .CodeMirror-guttermarker,.cm-s-material .CodeMirror-guttermarker-subtle,.cm-s-material .CodeMirror-linenumber{color:#546e7a}.cm-s-material .CodeMirror-cursor{border-left:1px solid #FFCC00}.cm-s-material.cm-fat-cursor .CodeMirror-cursor,.cm-s-material .cm-animate-fat-cursor{background-color:#5d6d5c80!important}.cm-s-material div.CodeMirror-selected,.cm-s-material.CodeMirror-focused div.CodeMirror-selected,.cm-s-material .CodeMirror-line::selection,.cm-s-material .CodeMirror-line>span::selection,.cm-s-material .CodeMirror-line>span>span::selection,.cm-s-material .CodeMirror-line::-moz-selection,.cm-s-material .CodeMirror-line>span::-moz-selection,.cm-s-material .CodeMirror-line>span>span::-moz-selection{background:rgba(128,203,196,.2)}.cm-s-material .CodeMirror-activeline-background{background:rgba(0,0,0,.5)}.cm-s-material .cm-keyword{color:#c792ea}.cm-s-material .cm-operator{color:#89ddff}.cm-s-material .cm-variable-2{color:#eff}.cm-s-material .cm-variable-3,.cm-s-material .cm-type{color:#f07178}.cm-s-material .cm-builtin{color:#ffcb6b}.cm-s-material .cm-atom{color:#f78c6c}.cm-s-material .cm-number{color:#ff5370}.cm-s-material .cm-def{color:#82aaff}.cm-s-material .cm-string{color:#c3e88d}.cm-s-material .cm-string-2{color:#f07178}.cm-s-material .cm-comment{color:#546e7a}.cm-s-material .cm-variable{color:#f07178}.cm-s-material .cm-tag{color:#ff5370}.cm-s-material .cm-meta{color:#ffcb6b}.cm-s-material .cm-attribute,.cm-s-material .cm-property{color:#c792ea}.cm-s-material .cm-qualifier,.cm-s-material .cm-variable-3,.cm-s-material .cm-type{color:#decb6b}.cm-s-material .cm-error{color:#fff;background-color:#ff5370}.cm-s-material .CodeMirror-matchingbracket{text-decoration:underline;color:#fff!important}.cm-s-neat span.cm-comment{color:#a86}.cm-s-neat span.cm-keyword{line-height:1em;font-weight:bold;color:#00f}.cm-s-neat span.cm-string{color:#a22}.cm-s-neat span.cm-builtin{line-height:1em;font-weight:bold;color:#077}.cm-s-neat span.cm-special{line-height:1em;font-weight:bold;color:#0aa}.cm-s-neat span.cm-variable{color:#000}.cm-s-neat span.cm-number,.cm-s-neat span.cm-atom{color:#3a3}.cm-s-neat span.cm-meta{color:#555}.cm-s-neat span.cm-link{color:#3a3}.cm-s-neat .CodeMirror-activeline-background{background:#e8f2ff}.cm-s-neat .CodeMirror-matchingbracket{outline:1px solid grey;color:#000!important}._container_13rz9_1,._container_13rz9_1 .CodeMirror{height:100%}

package/package.json

@@ -2,7 +2,7 @@
   "name": "easy-email-extensions",
   "license": "MIT",
   "description": "Email editor",
-  "version": "4.2.0",
+  "version": "4.3.0",
   "author": "m-Ryan",
   "repository": {
     "type": "git",
@@ -74,6 +74,8 @@
     "is-hotkey": "^0.2.0",
     "lodash": "^4.17.21",
     "mjml-browser": "^4.10.4",
+    "overlayscrollbars": "^1.13.2",
+    "overlayscrollbars-react": "^0.3.0",
     "react-codemirror2": "^7.2.1",
     "react-color": "^2.19.3",
     "react-final-form-arrays": "^3.1.3",
@@ -86,5 +88,5 @@
     "react-dom": "^17.0.2",
     "react-final-form": "^6.5.7"
   },
-  "gitHead": "3d2222aae62405f631a9db5b33ef83c48cde03a5"
+  "gitHead": "b008e0b87f27df9f1edd013498ba3c0661510cc7"
 }

package/readme.md

@@ -18,20 +18,88 @@ $ yarn add easy-email-extensions
 
 ```js
 import React from 'react';
-import { BlockManager, BasicType } from 'easy-email-core';
+import { BlockManager, BasicType, AdvancedType } from 'easy-email-core';
 import { EmailEditor, EmailEditorProvider } from 'easy-email-editor';
-import { SimpleLayout } from 'easy-email-extensions';
+import { ExtensionProps, StandardLayout } from 'easy-email-extensions';
+import { useWindowSize } from 'react-use';
 
 import 'easy-email-editor/lib/style.css';
 import 'easy-email-extensions/lib/style.css';
 
+const categories: ExtensionProps['categories'] = [
+  {
+    label: 'Content',
+    active: true,
+    blocks: [
+      {
+        type: AdvancedType.TEXT,
+      },
+      {
+        type: AdvancedType.IMAGE,
+        payload: { attributes: { padding: '0px 0px 0px 0px' } },
+      },
+      {
+        type: AdvancedType.BUTTON,
+      },
+      {
+        type: AdvancedType.SOCIAL,
+      },
+      {
+        type: AdvancedType.DIVIDER,
+      },
+      {
+        type: AdvancedType.SPACER,
+      },
+      {
+        type: AdvancedType.HERO,
+      },
+      {
+        type: AdvancedType.WRAPPER,
+      },
+    ],
+  },
+  {
+    label: 'Layout',
+    active: true,
+    displayType: 'column',
+    blocks: [
+      {
+        title: '2 columns',
+        payload: [
+          ['50%', '50%'],
+          ['33%', '67%'],
+          ['67%', '33%'],
+          ['25%', '75%'],
+          ['75%', '25%'],
+        ],
+      },
+      {
+        title: '3 columns',
+        payload: [
+          ['33.33%', '33.33%', '33.33%'],
+          ['25%', '25%', '50%'],
+          ['50%', '25%', '25%'],
+        ],
+      },
+      {
+        title: '4 columns',
+        payload: [[['25%', '25%', '25%', '25%']]],
+      },
+    ],
+  },
+];
+
 const initialValues = {
   subject: 'Welcome to Easy-email',
   subTitle: 'Nice to meet you!',
   content: BlockManager.getBlockByType(BasicType.PAGE)!.create({}),
 };
 
-export function App() {
+export default function App() {
+  const { width } = useWindowSize();
+
+  const smallScene = width < 1400;
+
   return (
     <EmailEditorProvider
       data={initialValues}
@@ -41,14 +109,19 @@ export function App() {
     >
       {({ values }) => {
         return (
-          <SimpleLayout>
+          <StandardLayout
+            compact={!smallScene}
+            categories={categories}
+            showSourceCode={true}
+          >
             <EmailEditor />
-          </SimpleLayout>
+          </StandardLayout>
         );
       }}
     </EmailEditorProvider>
   );
 }
+
 ```
 
 ## Extensions
@@ -62,7 +135,7 @@ export function App() {
   - You can add or overwrite
 
     ```tsx
-    import { BlockAttributeConfigurationManager } from "easy-email-extensions";
+    import { BlockAttributeConfigurationManager } from 'easy-email-extensions';
 
     BlockAttributeConfigurationManager.add({
       [BasicType.TEXT]: () => <div>will be overwrite `Text`</div>,
@@ -88,40 +161,40 @@ export function App() {
   - You can add or overwrite popover's preset blocks
 
     ```tsx
-    import { BasicType } from "easy-email-core";
+    import { BasicType } from 'easy-email-core';
     import {
       BlockMarketManager,
       BlockMaskWrapper,
-    } from "easy-email-extensions";
+    } from 'easy-email-extensions';
 
     BlockMarketManager.addCategories([
       {
-        title: "Custom",
-        name: "custom",
+        title: 'Custom',
+        name: 'custom',
         blocks: [
           {
             type: BasicType.TEXT,
-            title: "Text",
-            description: "This block allows you to display text in your email.",
+            title: 'Text',
+            description: 'This block allows you to display text in your email.',
             component: () => {
               return (
                 <BlockMaskWrapper
                   type={BasicType.TEXT}
                   payload={{
                     attributes: {
-                      "font-size": "20px",
-                      align: "center",
-                      padding: "0px 0px 0px 0px",
-                      color: "#4A90E2",
+                      'font-size': '20px',
+                      align: 'center',
+                      padding: '0px 0px 0px 0px',
+                      color: '#4A90E2',
                     },
                     data: {
                       value: {
-                        content: "20px",
+                        content: '20px',
                       },
                     },
                   }}
                 >
-                  <div style={{ fontSize: 20, width: "100%", paddingLeft: 20 }}>
+                  <div style={{ fontSize: 20, width: '100%', paddingLeft: 20 }}>
                     20px
                   </div>
                 </BlockMaskWrapper>
@@ -135,4 +208,13 @@ export function App() {
 
 - `SimpleLayout`
 
-  - All in one extension, provide basic and complete layout example. Refer to the above extension for configuration items.
+  - props
+    - showSourceCode
+    - defaultShowLayer
+
+- `StandardLayout`
+
+  - props
+    - compact
+    - categories
+    - showSourceCode