gfwleak/cyber-narrator-cn-ui
Archived
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: 将知识库新增编辑页的部分css样式移入css文件内

Browse Source
This commit is contained in:
刘洪洪
2023-04-21 14:57:18 +08:00
parent 0d43e2141f
commit 0e0d6b1ed0
2 changed files with 224 additions and 179 deletions
Download Patch File Download Diff File Expand all files Collapse all files

149
src/assets/css/components/views/setting/knowledgeBase.scss
View File

@@ -2,12 +2,13 @@
&.list-page { &.list-page {
height: calc(100% - 52px); height: calc(100% - 52px);
} }
.type-tag { .type-tag {
display: inline-block; display: inline-block;
padding: 0 10px; padding: 0 10px;
background-color: #EBF7FA; background-color: #EBF7FA;
color: #046ECA; color: #046ECA;
box-shadow: 0 2px 4px 0 rgba(51,51,51,0.02); box-shadow: 0 2px 4px 0 rgba(51, 51, 51, 0.02);
border-radius: 12px; border-radius: 12px;
} }
@@ -20,9 +21,10 @@
align-items: center; align-items: center;
padding-bottom: 8px; padding-bottom: 8px;
padding-top: 20px; padding-top: 20px;
margin-left:20px; margin-left: 20px;
} }
} }
.edit-knowledge-base { .edit-knowledge-base {
height: 100%; height: 100%;
@@ -33,6 +35,7 @@
font-weight: 900; font-weight: 900;
color: #353636; color: #353636;
} }
.edit-knowledge-base__body { .edit-knowledge-base__body {
display: flex; display: flex;
height: calc(100% - 147px); height: calc(100% - 147px);
@@ -45,6 +48,7 @@
.el-step { .el-step {
transition: flex-basis ease-in-out .28s; transition: flex-basis ease-in-out .28s;
} }
.el-step__head { .el-step__head {
.el-step__line { .el-step__line {
top: 26px; top: 26px;
@@ -92,6 +96,7 @@
height: 260px; height: 260px;
} }
} }
.el-collapse-item { .el-collapse-item {
min-height: 58px; min-height: 58px;
position: relative; position: relative;
@@ -106,37 +111,45 @@
&.focusing:focus:not(:hover) { &.focusing:focus:not(:hover) {
color: unset; color: unset;
} }
.form-sub-title { .form-sub-title {
padding-left: 35px; padding-left: 35px;
} }
} }
[role|=tab] { [role|=tab] {
display: flex; display: flex;
align-items: flex-start; align-items: flex-start;
} }
.el-collapse-item__arrow { .el-collapse-item__arrow {
position: absolute; position: absolute;
color: #38ACD2; color: #38ACD2;
font-weight: bold; font-weight: bold;
} }
.el-collapse-item__wrap { .el-collapse-item__wrap {
padding-left: 35px; padding-left: 35px;
border: none; border: none;
} }
.el-collapse-item__content { .el-collapse-item__content {
position: relative; position: relative;
padding-bottom: 20px; padding-bottom: 20px;
} }
.form-input .el-input__inner{
.form-input .el-input__inner {
padding-right: 50px !important; padding-right: 50px !important;
} }
.upload-error-tip, .preview-error-tip { .upload-error-tip, .preview-error-tip {
color: $--color-danger; color: $--color-danger;
} }
.upload-error-tip { .upload-error-tip {
margin-top: -11px; margin-top: -11px;
} }
.el-upload { .el-upload {
margin-top: 12px; margin-top: 12px;
@@ -144,6 +157,7 @@
font-size: 12px; font-size: 12px;
color: #999999; color: #999999;
} }
.el-upload-dragger { .el-upload-dragger {
width: 320px; width: 320px;
border-radius: 2px; border-radius: 2px;
@@ -151,9 +165,11 @@
} }
} }
.el-upload--error .el-upload-dragger { .el-upload--error .el-upload-dragger {
border-color: $--color-danger; border-color: $--color-danger;
} }
.el-upload-list { .el-upload-list {
.el-upload-list__item { .el-upload-list__item {
padding: 0 5px; padding: 0 5px;
@@ -167,9 +183,11 @@
.el-icon-close { .el-icon-close {
top: 11px; top: 11px;
} }
.el-icon-close-tip { .el-icon-close-tip {
top: 11px; top: 11px;
} }
.el-progress.el-progress--line { .el-progress.el-progress--line {
top: unset; top: unset;
} }
@@ -192,6 +210,7 @@
.el-form-item { .el-form-item {
margin-bottom: 12px; margin-bottom: 12px;
} }
.el-form-item__content { .el-form-item__content {
line-height: unset; line-height: unset;
@@ -200,6 +219,7 @@
font-size: 14px; font-size: 14px;
color: #353636; color: #353636;
} }
.el-textarea__inner { .el-textarea__inner {
padding-left: 8px; padding-left: 8px;
} }
@@ -213,6 +233,7 @@
} }
} }
} }
.skeleton-border { .skeleton-border {
position: relative; position: relative;
margin-top: 12px; margin-top: 12px;
@@ -223,9 +244,11 @@
.skeleton-item-row:not(:nth-of-type(6)) { .skeleton-item-row:not(:nth-of-type(6)) {
margin-bottom: 5px; margin-bottom: 5px;
} }
.el-skeleton__item { .el-skeleton__item {
background: #F5F8FA; background: #F5F8FA;
} }
.skeleton-tip { .skeleton-tip {
position: absolute; position: absolute;
top: 50%; top: 50%;
@@ -235,6 +258,7 @@
color: #353636; color: #353636;
} }
} }
.imported-tip { .imported-tip {
margin-top: 8px; margin-top: 8px;
margin-bottom: 4px; margin-bottom: 4px;
@@ -246,9 +270,11 @@
color: #38ACD2; color: #38ACD2;
} }
} }
.imported-table-box { .imported-table-box {
position: relative; position: relative;
height: 413px; //height: 413px;
height: 394px !important;
border: 1px solid #DEDEDE; border: 1px solid #DEDEDE;
border-radius: 2px; border-radius: 2px;
transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1); transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
@@ -256,6 +282,7 @@
&.imported-table-box--error { &.imported-table-box--error {
border-color: $--color-danger; border-color: $--color-danger;
} }
.imported-table { .imported-table {
padding: 0 12px; padding: 0 12px;
width: 100%; width: 100%;
@@ -266,21 +293,32 @@
font-size: 14px; font-size: 14px;
color: #353636;; color: #353636;;
} }
td { td {
font-size: 14px; font-size: 14px;
color: #353636; color: #353636;
} }
.imported-data-msg, .imported-data-item, .imported-data-value { .imported-data-msg, .imported-data-item, .imported-data-value {
white-space: nowrap; white-space: nowrap;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
} }
:deep .imported-data-item-edit__input .el-input {
.imported-data-item-edit__input {
.el-input {
height: 30px; height: 30px;
} }
:deep .imported-data-item-edit__input .el-input__inner {
height: 30px; .el-input__inner {
width: calc(100% - 50px);
height: 24px;
line-height: 0;
padding: 0 !important;
border-radius: 2px;
} }
}
.imported-data-msg { .imported-data-msg {
width: 140px; width: 140px;
} }
@@ -294,47 +332,132 @@
color: #111; color: #111;
} }
} }
.el-icon-success { .el-icon-success {
color: #749F4D; color: #749F4D;
} }
.el-icon-error { .el-icon-error {
color: #E26154; color: #E26154;
} }
.imported-data-btn {
display: flex;
align-items: center;
justify-content: flex-end;
.imported-data-left-btn {
font-size: 14px;
margin: 0 7px;
color: #666;
cursor: pointer;
}
.imported-data-back {
color: #666;
cursor: pointer;
}
.imported-data-save {
color: #38ACD2;
cursor: pointer;
}
}
} }
.imported-pagination.pagination { .imported-pagination.pagination {
position: absolute; position: absolute;
width: 100%; width: 100%;
bottom: 48px;
margin-top: 4px;
padding-top: 8px;
height: 42px; height: 42px;
bottom: 42px !important;
margin-top: 4px;
padding-top: 10px;
border-top: 1px solid #eee; border-top: 1px solid #eee;
border-top: 0 !important;
border-bottom: 1px solid #eee;
margin-bottom: 0;
padding-bottom: 0;
.btn-prev, .btn-next, .number { .btn-prev, .btn-next, .number {
margin: 0 2px; margin: 0 2px;
} }
.el-pager li, .el-pagination .btn-next, .el-pagination .btn-prev { .el-pager li, .el-pagination .btn-next, .el-pagination .btn-prev {
border: none; border: none;
font-size: 12px; font-size: 12px;
} }
.el-pagination .el-pager li { .el-pagination .el-pager li {
color: #353636; color: #353636;
} }
.el-pagination .el-pager li.active { .el-pagination .el-pager li.active {
background-color: #38ACD2; background-color: #38ACD2;
color: white; color: white;
} }
} }
.el-form {
margin-top: 0 !important;
}
.el-input {
height: 24px;
}
.el-form-item__content {
margin-top: -16px;
margin-bottom: -17px;
}
.el-form-item__error {
display: none;
}
.addTagBtn {
position: absolute;
bottom: 9px;
height: 24px !important;
min-height: 24px !important;
font-size: 12px;
color: #353636;
font-weight: 500;
width: 598px;
margin-left: 10px;
background: rgb(245, 248, 250);
border: 1px #DEDEDE solid;
padding: 0 !important;
box-shadow: 0 2px 4px 0 rgba(51, 51, 51, 0.02);
border-radius: 2px;
font-family: NotoSansHans-Medium !important;
.add-tag-btn {
color: #575757 !important;
font-size: 9px !important;
margin: 0 8px 2px 8px;
}
span {
font-family: NotoSansHans-Medium !important;
} }
} }
.addTagBtn:hover {
i {
color: #699DC9 !important;
}
}
}
}
.edit-knowledge-base__footer { .edit-knowledge-base__footer {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
height: 60px; height: 60px;
margin-top: 3px; margin-top: 3px;
box-shadow: 0 -1px 4px 0 rgba(0,0,0,0.10); box-shadow: 0 -1px 4px 0 rgba(0, 0, 0, 0.10);
.footer__btn { .footer__btn {
margin: 0 10px; margin: 0 10px;
@@ -350,19 +473,23 @@
cursor: pointer; cursor: pointer;
transition: background-color linear .2s, color linear .1s; transition: background-color linear .2s, color linear .1s;
} }
.footer__btn:hover:not(.footer__btn--disabled) { .footer__btn:hover:not(.footer__btn--disabled) {
background-color: lighten(#699DC9, 10%); background-color: lighten(#699DC9, 10%);
} }
.footer__btn--light { .footer__btn--light {
background-color: #F5F6F7; background-color: #F5F6F7;
border: 1px solid $--border-color-primary; border: 1px solid $--border-color-primary;
color: #333; color: #333;
} }
.footer__btn.footer__btn--light:hover:not(.footer__btn--disabled) { .footer__btn.footer__btn--light:hover:not(.footer__btn--disabled) {
background-color: white; background-color: white;
border-color: lighten(#38ACD2, 40%); border-color: lighten(#38ACD2, 40%);
color: #38ACD2; color: #38ACD2;
} }
.footer__btn--disabled { .footer__btn--disabled {
opacity: .6; opacity: .6;
cursor: default; cursor: default;

172
src/views/setting/KnowledgeBaseForm.vue
View File

@@ -1058,115 +1058,25 @@ export default {
} }
</script> </script>
<style scoped lang="scss">
:deep .imported-table-box .el-form {
margin-top: 0 !important;
}
.imported-table-box {
height:394px !important;
}
.imported-table-box .imported-pagination.pagination {
border-top: 0px !important;
border-bottom: 1px solid #eee;
bottom: 42px !important;
margin-bottom: 0px;
padding-bottom: 0px;
padding-top: 10px;
}
:deep .imported-table .el-input {
height: 24px;
}
:deep .imported-table .el-form-item__content {
margin-top: -16px;
margin-bottom: -17px;
}
:deep .imported-table .el-form-item__error {
display: none;
}
:deep .imported-data-item-edit__input .el-input__inner {
width: calc(100% - 50px);
height: 24px;
line-height: 0;
padding: 0 !important;
border-radius: 2px;
}
.imported-data-btn {
display: flex;
align-items: center;
justify-content: flex-end;
}
.imported-data-left-btn {
font-size: 14px;
margin: 0 7px;
color: #666;
cursor: pointer;
}
.imported-data-back {
color: #666;
cursor: pointer;
}
.imported-data-save {
color: #38ACD2;
cursor: pointer;
}
.addTagBtn {
position: absolute;
bottom: 9px;
height:24px !important;
min-height: 24px !important;
font-size: 12px;
color: #353636;
font-weight: 500;
width: 598px;
margin-left: 10px;
background: rgb(245, 248, 250);
border: 1px #DEDEDE solid;
padding: 0px !important;
box-shadow: 0 2px 4px 0 rgba(51,51,51,0.02);
border-radius: 2px;
font-family:NotoSansHans-Medium !important;
.add-tag-btn {
color: #575757 !important;
font-size: 9px !important;
margin: 0 8px 2px 8px;
}
}
.addTagBtn:hover {
i {
color: #699DC9 !important;
}
}
.addTagBtn span {
font-family:NotoSansHans-Medium !important;
}
</style>
<style lang="scss"> <style lang="scss">
.del-model { .del-model {
display:flex; display: flex;
flex-direction: column; flex-direction: column;
padding-bottom:0px !important; padding-bottom: 0 !important;
width:480px !important; width: 480px !important;
height:190px; height: 190px;
.el-message-box__header{
.el-message-box__header {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
border-bottom:1px solid #eee; border-bottom: 1px solid #eee;
height:42px; height: 42px;
background: #F7F7F7; background: #F7F7F7;
box-shadow: 0 1px 0 0 rgba(53,54,54,0.08); box-shadow: 0 1px 0 0 rgba(53, 54, 54, 0.08);
padding-left:20px; padding-left: 20px;
padding-top:14px; padding-top: 14px;
padding-bottom:14px; padding-bottom: 14px;
.el-message-box__headerbtn { .el-message-box__headerbtn {
display: flex !important; display: flex !important;
flex-direction: row-reverse; flex-direction: row-reverse;
@@ -1175,11 +1085,13 @@ export default {
font-size: 10px; font-size: 10px;
line-height: 10px; line-height: 10px;
padding-right: 5px !important; padding-right: 5px !important;
i { i {
width:10px; width: 10px;
height:10px; height: 10px;
} }
} }
.el-message-box__title { .el-message-box__title {
font-size: 14px !important; font-size: 14px !important;
color: #353636; color: #353636;
@@ -1187,48 +1099,54 @@ export default {
font-weight: 400; font-weight: 400;
} }
} }
.el-message-box__content { .el-message-box__content {
height:96px; height: 96px;
font-size: 14px; font-size: 14px;
color: #353636; color: #353636;
letter-spacing: 0; letter-spacing: 0;
line-height: 22px; line-height: 22px;
font-weight: 400; font-weight: 400;
padding-top:8px; padding-top: 8px;
padding-right:20px; padding-right: 20px;
padding-left:20px; padding-left: 20px;
.el-message-box__message { .el-message-box__message {
padding-left:0px !important; padding-left: 0 !important;
padding-right:0px !important; padding-right: 0 !important;
} }
} }
.el-message-box__btns { .el-message-box__btns {
height:52px; height: 52px;
border-top:1px solid #eee; border-top: 1px solid #eee;
box-shadow: inset 0 -1px 0 0 rgba(0,0,0,0.07); box-shadow: inset 0 -1px 0 0 rgba(0, 0, 0, 0.07);
padding:11px 0px 12px!important; padding: 11px 0 12px !important;
.el-button--small { .el-button--small {
padding:8px 21px !important; padding: 8px 21px !important;
line-height: 12px; line-height: 12px;
font-family: NotoSansHans-Medium !important; font-family: NotoSansHans-Medium !important;
font-size: 12px; font-size: 12px;
font-weight: 500; font-weight: 500;
min-height: 28px; min-height: 28px;
} }
.el-button:nth-child(1) { .el-button:nth-child(1) {
margin-right:20px; margin-right: 20px;
width:80px; width: 80px;
height:28px; height: 28px;
color: #353636; color: #353636;
} }
.el-button:nth-child(2) { .el-button:nth-child(2) {
width:80px; width: 80px;
height:28px; height: 28px;
margin-right:20px; margin-right: 20px;
margin-left:0px !important; margin-left: 0 !important;
background-color:#2d8cf0; background-color: #2d8cf0;
border-color:#2d8cf0; border-color: #2d8cf0;
}
} }
} }
}
</style> </style>