1
0
mirror of synced 2026-04-04 07:08:34 +08:00
Files
tmagic-editor/packages/editor/src/theme/code-block.scss

160 lines
2.8 KiB
SCSS

.m-editor-code-block-list {
margin-top: 5px;
.code-header-wrapper {
display: flex;
align-items: center;
justify-content: center;
.code-filter-input {
margin: 0 5px;
}
.code-filter-input-no-btn {
margin-left: 5px;
margin-right: 10px;
}
.create-code-button {
margin-left: 2px;
margin-right: 10px;
}
}
.divider {
margin: 10px 0 0 0;
}
.list-container {
width: 100%;
overflow: hidden;
margin-left: -25px;
.list-item {
display: flex;
align-items: center;
.right-tool {
position: absolute;
right: 15px;
padding-left: 5px;
display: flex;
align-items: center;
.edit-icon {
margin: 0 5px;
}
}
.code-name {
font-size: 14px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
padding: 10px 15px;
margin-right: 60px;
}
}
}
}
.m-fields-code-select {
width: 100%;
.el-card__body {
padding: 5px;
}
.tool-bar {
display: flex;
align-items: center;
justify-content: end;
height: 20px;
.tool-item {
display: flex;
align-items: center;
}
}
}
.code-editor-dialog {
.el-dialog__body {
height: 90%;
padding-top: 10px;
}
.el-card {
height: 100%;
background: #fff;
.el-card__body {
height: 80%;
background: #fff;
}
}
.code-editor-layout {
height: 100%;
border: 1px solid #e4e7ed;
.side-tree {
height: 100%;
overflow: auto;
.list-container {
width: 100%;
overflow: hidden;
margin-left: -10px;
.list-item {
width: 100%;
margin: 10px 0;
line-height: 30px;
.code-name {
width: 100%;
font-size: 14px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
}
}
}
}
.code-name-wrapper {
display: flex;
align-items: center;
font-size: 16px;
.code-name-label {
margin-right: 10px;
}
.code-name-input {
width: 300px;
}
}
.m-editor-code-block-editor-panel-list-mode {
height: 100%;
z-index: 10;
background: #fff;
.el-card {
border: 0;
}
}
.m-editor-code-block-editor-panel {
position: absolute;
top: 0;
left: 4px;
width: 100%;
height: 100%;
z-index: 10;
background: #fff;
}
.m-editor-wrapper {
height: 100%;
.m-editor-container {
height: 100%;
}
.m-editor-content-bottom {
height: 40px;
width: 100%;
display: flex;
justify-content: end;
background: #fff;
> button {
height: 30px;
margin-top: 5px;
}
}
}
}