.doc-container{ width:100%; min-height:90vh; position:relative; .editor-top{ display: flex; width:100%; height:60px; min-height: 60px; flex-direction: row; justify-content: space-between; align-items: center; position:fixed; top:0; z-index: 999; background: #fff; border-bottom:1px solid #ebebeb; .left{ width:50%; height:100%; display: flex; flex-direction: row; justify-content: flex-start; align-items: center; font-size:14px; padding-left:10px; .doc{ margin-right:20px; font-size:14px; >span{ font-weight:800; } } .creator{ font-size:14px; >span{ font-weight:800; } } } .right{ width:50%; display: flex; flex-direction: row; justify-content: flex-end; justify-items: center; padding-right: 10px; } } .editor-content{ width:100%; min-height:80vh; margin-top:60px; border:1px solid #ebebeb; display: flex; justify-content: space-between; .left_scheme { width: 170px; border-right: 1px solid #e6e6e6; height: 93vh; .scheme-header { padding: 10px; border-bottom: 1px solid #e6e6e6; .title { font-size: 14px; font-weight: bold; margin-bottom: 10px; display: flex; justify-content: space-between; align-items: center; .count { color: #666; font-size: 12px; font-weight: normal; } } .search { margin-bottom: 10px; } .action-btns { display: flex; gap: 10px; margin-bottom: 10px; .el-button { flex: 1; } } .current-scheme { font-size: 13px; color: #666; margin-top: 5px; } } .scheme-content { padding: 10px; height: calc(100% - 180px); overflow-y: auto; .el-tree { background: transparent; } .custom-tree-node { display: flex; align-items: center; i { margin-right: 5px; font-size: 16px; color: #909399; } } } } .natural{ width: 200px; border-right: 1px solid #e6e6e6; height: 93vh; background: #fff; .resource-header-title { display: flex; justify-content: space-between; align-items: center; padding: 10px 15px; border-bottom: 1px solid #e6e6e6; .title-left { display: flex; align-items: center; gap: 8px; font-size: 14px; .resource-count { color: #666; font-size: 12px; } } .el-icon-menu { color: #666; font-size: 18px; cursor: pointer; } } .resource-container { padding: 15px; .resource-header { margin-bottom: 15px; .el-input { margin-bottom: 10px; } .action-btns { display: flex; gap: 10px; .el-button { flex: 1; height: 32px; padding: 0; font-size: 12px; } } } .resource-status { display: flex; justify-content: space-between; align-items: center; margin: 10px 0; color: #666; font-size: 12px; } .resource-content { .el-collapse { border: none; .el-collapse-item { margin-bottom: 2px; &__header { background: #f7f7f7; height: 40px; line-height: 40px; padding: 0 15px; font-size: 13px; position: relative; .el-icon-arrow-up { position: absolute; right: 15px; transition: transform 0.3s; font-size: 12px; .el-collapse-item.is-active & { transform: rotate(180deg); } } } &__content { padding: 10px 0; } } } .resource-list { .resource-item { display: flex; justify-content: space-between; align-items: center; padding: 8px 15px; font-size: 12px; &:hover { background: #f5f7fa; } .el-checkbox { margin-right: 10px; } .el-icon-menu { color: #999; cursor: move; font-size: 14px; } } } } } } .neary-doc{ position:fixed; left:0; width:205px; // min-height: 100%; height: 99vh; border:1px solid #ebebeb; padding:5px; border-radius: 10px; border-top-left-radius: 0; z-index:1000!important; background:#FFF; .left-content{ padding:10px; height:80vh; overflow:hidden; overflow-y:auto; overflow-x: auto; /* Enable horizontal scrolling */ .new-article{ background:#FFF; margin-top:5px; .sub-title{ height:30px; line-height: 30px; font-weight: bold; margin-top:10px; font-size:14px; border-bottom: 1px solid #e5e5e5; } .el-collapse{ width:90%; margin:auto; .el-collapse-item { .el-collapse-item__header{ height: 30px; } .el-collapse-item__content{ padding-bottom: 5px; .sub-menus{ margin-left:15px; font-size:12px; height:20px; line-height: 20px; /* cursor:move; */ } } } } } } } .leftContent{ margin-top: 110px; width:200px; } .editor-main{ width:56%; overflow: hidden; /* overflow-y: auto; */ position:relative; margin:0 auto; margin-right: 20px; .editor-tabs { height: 100%; .el-tabs { height: 100%; .el-tabs__content { height: calc(100% - 40px); .el-tab-pane { height: 100%; } } } } .catalog-content { padding: 20px; height: 100%; overflow-y: auto; .el-tree { .custom-tree-node { flex: 1; display: flex; align-items: center; justify-content: space-between; font-size: 14px; padding-right: 8px; } .expand-icon { color: #909399; } } } .template-content { height: 100%; display: flex; flex-direction: column; .menus-box{ position: absolute; background: #FFF; z-index: 3; width: 100%; } .editor-box { margin-top:80px; flex: 1; // 原有的editor-box样式 } } .editor{ width: 100%; div{ span{ } } .template-textarea{ .rich-editor{ padding: 0 10px; } } } } .editor-option{ width:255px; height: 100vh; position:fixed; top:61px; right:0; border:1px solid #f0f0f0; z-index: 1000 !important; background:#FFF; .editor-menu{ writing-mode: vertical-rl; position: fixed; width:60px; right:254px; top:65px; font-size:12px; .item{ background-color: #fff; border: 1px solid rgba(0,0,0,.1); /* -webkit-box-shadow: 0 2px 8px 0 rgba(0,0,0,.1); box-shadow: 0 2px 8px 0 rgba(0,0,0,.1); */ border-radius: 2px; /* width: 94px; */ letter-spacing: 3px; height: 75px; display: inline-block; text-align: center; line-height: 32px; margin-bottom: 12px; -webkit-transition: all .8s; transition: all .8s; cursor: pointer; .name{ font-size:12px; } } .active-item{ background-color: #155bd4; color: #fff; } } } } } /* .neary-doc { display: flex; } .left-content { flex: 1; } */ .right-sidebarew{ position: absolute; left: 203px; top: 10px; display: flex; writing-mode: vertical-rl; flex-direction: row; font-size: 12px; } .sidebar-item { background-color: #fff; border: 1px solid #ddd; padding: 10px; letter-spacing: 3px; margin-bottom: 10px; cursor: pointer; text-align: center; } .active-item{ background-color: #155bd4; color: #fff; } /* ::v-deep .el-collapse { border: none; .el-collapse-item__header { background-color: #f5f7fa; padding: 0 15px; font-weight: bold; } .el-collapse-item__content { padding: 10px 15px; } } */ ::v-deep .el-collapse-item__header { .el-collapse-item__arrow { display: none; // 隐藏默认箭头 } }