dongjunchuan/de
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix:frontend css缩进

Browse Source
This commit is contained in:
junjie 2021-06-24 14:30:02 +08:00
parent e5df9df218
commit 7399b5eb2c
5 changed files with 182 additions and 194 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
frontend/src/styles/common/mixins.scss
View File

@ -1,16 +1,15 @@
@mixin flex-row($justify: flex-start, $align: stretch) { @mixin flex-row($justify: flex-start, $align: stretch) {
display: flex; display: flex;
@if $justify != flex-start { @if $justify != flex-start {
justify-content: $justify; justify-content: $justify;
}
@if $align != stretch {
align-items: $align;
}
} }
@if $align != stretch {
@mixin variant($color, $background-color, $border-color) { align-items: $align;
color: $color;
background-color: $background-color;
border-color: $border-color;
} }
}
@mixin variant($color, $background-color, $border-color) {
color: $color;
background-color: $background-color;
border-color: $border-color;
}

141
frontend/src/styles/index.scss
View File

@ -73,34 +73,32 @@ div:focus {
} }
.de-dialog { .de-dialog {
width: 30% !important; width: 30% !important;
.el-dialog__header{ .el-dialog__header{
background-color: #f4f4f5; background-color: #f4f4f5;
padding: 10px 20px !important; padding: 10px 20px !important;
} }
.el-dialog__body{ .el-dialog__body{
padding: 1px 20px !important; padding: 1px 20px !important;
}
}
} }
.de-filter-dialog { .de-filter-dialog {
min-width: 500px !important; min-width: 500px !important;
width: 50% !important; width: 50% !important;
.el-dialog__header{ .el-dialog__header{
// background-color: #f4f4f5; // background-color: #f4f4f5;
padding: 10px 20px !important; padding: 10px 20px !important;
.el-dialog__headerbtn {
top: 15px !important;
}
}
.el-dialog__body{
padding: 1px 15px !important;
.el-dialog__headerbtn {
top: 15px !important;
} }
}
.el-dialog__body{
padding: 1px 15px !important;
}
} }
.de-style-dialog { .de-style-dialog {
@ -117,7 +115,6 @@ div:focus {
} }
.el-dialog__body{ .el-dialog__body{
padding: 1px 15px !important; padding: 1px 15px !important;
} }
} }
@ -129,7 +126,6 @@ div:focus {
.el-dialog__header{ .el-dialog__header{
display:none!important; display:none!important;
} }
.el-dialog__body{ .el-dialog__body{
padding: 0px!important; padding: 0px!important;
@ -138,79 +134,74 @@ div:focus {
} }
.de-search-header { .de-search-header {
.el-tabs__header{ .el-tabs__header{
display: none !important;; display: none !important;;
} }
} }
.de-input{ .de-input{
margin-bottom: 14px; margin-bottom: 14px;
margin-top: 10px; margin-top: 10px;
.el-input{ .el-input{
.el-input__inner { .el-input__inner {
line-height: 30px !important; line-height: 30px !important;
height: 30px !important; height: 30px !important;
border-right: none; border-right: none;
}
} }
.el-input__inner:focus{ }
border-color: #E6E6E6 !important; .el-input__inner:focus{
} border-color: #E6E6E6 !important;
.el-input-group__append { }
background-color: #ffffff; .el-input-group__append {
} background-color: #ffffff;
}
} }
.filter-card-class { .filter-card-class {
width: 100%; width: 100%;
.el-card__header { .el-card__header {
padding: 5px 0 !important; padding: 5px 0 !important;
border-bottom: none !important; border-bottom: none !important;
} }
.el-card__body { .el-card__body {
padding: 10px; padding: 10px;
} }
} }
.real-input { .real-input {
.el-input__inner {
.el-input__inner { height: 25px !important;
height: 25px !important; border: none !important;
border: none !important; }
}
} }
.de-filter-data-table { .de-filter-data-table {
.el-table__body-wrapper >table>{ .el-table__body-wrapper >table>{
tbody { tbody {
.el-table__row { .el-table__row {
:hover { :hover {
cursor: pointer; cursor: pointer;
}
td {
border: none !important;
}
}
} }
td {
border: none !important;
}
}
} }
}
} }
.de-filter-data-table::before { .de-filter-data-table::before {
height: 0px !important; height: 0px !important;
} }
.custom-component-class { .custom-component-class {
width: 100%; width: 100%;
div.el-input-group__append { div.el-input-group__append {
width: 10% !important; width: 10% !important;
} }
div { div {
width: 100% !important; width: 100% !important;
} }
} }
%field-icon{ %field-icon{

10
frontend/src/styles/mixin.scss
View File

@ -38,8 +38,8 @@
} }
@mixin variant($color, $background-color, $border-color) { @mixin variant($color, $background-color, $border-color) {
color: $color; color: $color;
background-color: $background-color; background-color: $background-color;
border-color: $border-color; border-color: $border-color;
} }

2
frontend/src/styles/sidebar.scss
View File

@ -15,7 +15,7 @@
transition: width 0.28s; transition: width 0.28s;
// width: $sideBarWidth !important; // width: $sideBarWidth !important;
background-color: $menuBg; background-color: $menuBg;
// width: 260px; // width: 260px;
height: $contentHeight; height: $contentHeight;
position: fixed; position: fixed;
font-size: 0px; font-size: 0px;

198
frontend/src/styles/topbar.scss
View File

@ -1,118 +1,116 @@
.top-nav { .top-nav {
// margin-left: $sideBarWidth; // margin-left: $sideBarWidth;
width: 100%; width: 100%;
// background-color: #304156; // background-color: #304156;
// background-color: $--color-primary; // background-color: $--color-primary;
position: fixed; position: fixed;
top: 0; top: 0;
left: 0; left: 0;
z-index: 1001; z-index: 1001;
overflow: hidden; overflow: hidden;
border-bottom: 1px solid #DCDFE6; border-bottom: 1px solid #DCDFE6;
.log { .log {
padding: 0 16px; padding: 0 16px;
line-height: 56px; line-height: 56px;
height: 56px; height: 56px;
font-size: 24px; font-size: 24px;
font-weight: bold; font-weight: bold;
// color: rgb(191, 203, 217); // color: rgb(191, 203, 217);
color: rgba(255,255,255,0.87); color: rgba(255,255,255,0.87);
float: left; float: left;
img{ img{
width: auto; width: auto;
max-height: 45px; max-height: 45px;
}
} }
.el-menu { }
float: left; .el-menu {
border: none!important; float: left;
// background-color: #304156; border: none!important;
// background-color: #304156;
// background-color: $--color-primary; // background-color: $--color-primary;
.nav-item { .nav-item {
display: inline-block; display: inline-block;
.el-menu-item:not(.is-active) { .el-menu-item:not(.is-active) {
// color: rgb(191, 203, 217); // color: rgb(191, 203, 217);
color: $menuText; color: $menuText;
&:hover { &:hover {
background-color: $menuHover !important; background-color: $menuHover !important;
// color: $subMenuActiveText !important; // color: $subMenuActiveText !important;
}
&:focus {
background-color: $subMenuHover !important;
color: $subMenuActiveText !important;
}
} }
.is-active { &:focus {
background-color: $subMenuHover !important; background-color: $subMenuHover !important;
color: $subMenuActiveText !important; color: $subMenuActiveText !important;
}
}
.is-active {
background-color: $subMenuHover !important;
color: $subMenuActiveText !important;
}
}
}
.right-menu {
float: right;
height: 56px;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
&:focus {
outline: none;
}
.right-menu-item {
display: inline-block;
padding: 10px 8px;
height: 100%;
font-size: 18px;
// color: #5a5e66;
color: #606266;
vertical-align: text-bottom;
&.hover-effect {
cursor: pointer;
transition: background .3s;
&:hover {
background-color: rgba(0, 0, 0, .025)
} }
} }
} }
.right-menu { .avatar-container {
float: right; margin-right: 30px;
height: 56px; .avatar-wrapper {
display: flex; margin-top: 5px;
flex-direction: row; position: relative;
align-items: center; .user-avatar {
justify-content: center;
&:focus {
outline: none;
}
.right-menu-item {
display: inline-block;
padding: 10px 8px;
height: 100%;
font-size: 18px;
// color: #5a5e66;
color: #606266;
vertical-align: text-bottom;
&.hover-effect {
cursor: pointer; cursor: pointer;
transition: background .3s; width: 40px;
height: 40px;
&:hover { border-radius: 10px;
background-color: rgba(0, 0, 0, .025) }
.de-user-avatar {
cursor: pointer;
height: 40px;
border-radius: 10px;
span {
color: #ffffff;
} }
} }
}
.avatar-container { .el-icon-caret-bottom {
margin-right: 30px; cursor: pointer;
position: absolute;
.avatar-wrapper { right: -20px;
margin-top: 5px; top: 25px;
position: relative; font-size: 12px;
.user-avatar {
cursor: pointer;
width: 40px;
height: 40px;
border-radius: 10px;
}
.de-user-avatar {
cursor: pointer;
height: 40px;
border-radius: 10px;
span {
color: #ffffff;
}
}
.el-icon-caret-bottom {
cursor: pointer;
position: absolute;
right: -20px;
top: 25px;
font-size: 12px;
}
} }
} }
} }
} }
}