tweak
This commit is contained in:
		@@ -2,8 +2,10 @@
 | 
			
		||||
 | 
			
		||||
@mixin colorBtn($color) {
 | 
			
		||||
  background: $color;
 | 
			
		||||
 | 
			
		||||
  &:hover {
 | 
			
		||||
    color: $color;
 | 
			
		||||
 | 
			
		||||
    &:before,
 | 
			
		||||
    &:after {
 | 
			
		||||
      background: $color;
 | 
			
		||||
@@ -49,14 +51,17 @@
 | 
			
		||||
  transition: 600ms ease all;
 | 
			
		||||
  position: relative;
 | 
			
		||||
  display: inline-block;
 | 
			
		||||
 | 
			
		||||
  &:hover {
 | 
			
		||||
    background: #fff;
 | 
			
		||||
 | 
			
		||||
    &:before,
 | 
			
		||||
    &:after {
 | 
			
		||||
      width: 100%;
 | 
			
		||||
      transition: 600ms ease all;
 | 
			
		||||
    }
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  &:before,
 | 
			
		||||
  &:after {
 | 
			
		||||
    content: '';
 | 
			
		||||
@@ -67,6 +72,7 @@
 | 
			
		||||
    width: 0;
 | 
			
		||||
    transition: 400ms ease all;
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  &::after {
 | 
			
		||||
    right: inherit;
 | 
			
		||||
    top: inherit;
 | 
			
		||||
@@ -91,4 +97,3 @@
 | 
			
		||||
  font-size: 14px;
 | 
			
		||||
  border-radius: 4px;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
 
 | 
			
		||||
@@ -1,82 +1,85 @@
 | 
			
		||||
 //覆盖一些element-ui样式
 | 
			
		||||
//覆盖一些element-ui样式
 | 
			
		||||
 | 
			
		||||
 .el-breadcrumb__inner, .el-breadcrumb__inner a{
 | 
			
		||||
  font-weight: 400!important;
 | 
			
		||||
.el-breadcrumb__inner,
 | 
			
		||||
.el-breadcrumb__inner a {
 | 
			
		||||
  font-weight: 400 !important;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
 .el-upload {
 | 
			
		||||
   input[type="file"] {
 | 
			
		||||
     display: none !important;
 | 
			
		||||
   }
 | 
			
		||||
 }
 | 
			
		||||
.el-upload {
 | 
			
		||||
  input[type="file"] {
 | 
			
		||||
    display: none !important;
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
 .el-upload__input {
 | 
			
		||||
   display: none;
 | 
			
		||||
 }
 | 
			
		||||
.el-upload__input {
 | 
			
		||||
  display: none;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
 .cell {
 | 
			
		||||
   .el-tag {
 | 
			
		||||
     margin-right: 0px;
 | 
			
		||||
   }
 | 
			
		||||
 }
 | 
			
		||||
.cell {
 | 
			
		||||
  .el-tag {
 | 
			
		||||
    margin-right: 0px;
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
 .small-padding {
 | 
			
		||||
   .cell {
 | 
			
		||||
     padding-left: 5px;
 | 
			
		||||
     padding-right: 5px;
 | 
			
		||||
   }
 | 
			
		||||
 }
 | 
			
		||||
.small-padding {
 | 
			
		||||
  .cell {
 | 
			
		||||
    padding-left: 5px;
 | 
			
		||||
    padding-right: 5px;
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
 .fixed-width{
 | 
			
		||||
  .el-button--mini{
 | 
			
		||||
.fixed-width {
 | 
			
		||||
  .el-button--mini {
 | 
			
		||||
    padding: 7px 10px;
 | 
			
		||||
    width: 60px;
 | 
			
		||||
  }
 | 
			
		||||
 }
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
 .status-col {
 | 
			
		||||
   .cell {
 | 
			
		||||
     padding: 0 10px;
 | 
			
		||||
     text-align: center;
 | 
			
		||||
     .el-tag {
 | 
			
		||||
       margin-right: 0px;
 | 
			
		||||
     }
 | 
			
		||||
   }
 | 
			
		||||
 }
 | 
			
		||||
.status-col {
 | 
			
		||||
  .cell {
 | 
			
		||||
    padding: 0 10px;
 | 
			
		||||
    text-align: center;
 | 
			
		||||
 | 
			
		||||
 //暂时性解决dialog 问题 https://github.com/ElemeFE/element/issues/2461
 | 
			
		||||
 .el-dialog {
 | 
			
		||||
   transform: none;
 | 
			
		||||
   left: 0;
 | 
			
		||||
   position: relative;
 | 
			
		||||
   margin: 0 auto;
 | 
			
		||||
 }
 | 
			
		||||
    .el-tag {
 | 
			
		||||
      margin-right: 0px;
 | 
			
		||||
    }
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
 //文章页textarea修改样式
 | 
			
		||||
 .article-textarea {
 | 
			
		||||
   textarea {
 | 
			
		||||
     padding-right: 40px;
 | 
			
		||||
     resize: none;
 | 
			
		||||
     border: none;
 | 
			
		||||
     border-radius: 0px;
 | 
			
		||||
     border-bottom: 1px solid #bfcbd9;
 | 
			
		||||
   }
 | 
			
		||||
 }
 | 
			
		||||
//暂时性解决dialog 问题 https://github.com/ElemeFE/element/issues/2461
 | 
			
		||||
.el-dialog {
 | 
			
		||||
  transform: none;
 | 
			
		||||
  left: 0;
 | 
			
		||||
  position: relative;
 | 
			
		||||
  margin: 0 auto;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
 //element ui upload
 | 
			
		||||
 .upload-container {
 | 
			
		||||
   .el-upload {
 | 
			
		||||
     width: 100%;
 | 
			
		||||
     .el-upload-dragger {
 | 
			
		||||
       width: 100%;
 | 
			
		||||
       height: 200px;
 | 
			
		||||
     }
 | 
			
		||||
   }
 | 
			
		||||
 }
 | 
			
		||||
//文章页textarea修改样式
 | 
			
		||||
.article-textarea {
 | 
			
		||||
  textarea {
 | 
			
		||||
    padding-right: 40px;
 | 
			
		||||
    resize: none;
 | 
			
		||||
    border: none;
 | 
			
		||||
    border-radius: 0px;
 | 
			
		||||
    border-bottom: 1px solid #bfcbd9;
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
//element ui upload
 | 
			
		||||
.upload-container {
 | 
			
		||||
  .el-upload {
 | 
			
		||||
    width: 100%;
 | 
			
		||||
 | 
			
		||||
    .el-upload-dragger {
 | 
			
		||||
      width: 100%;
 | 
			
		||||
      height: 200px;
 | 
			
		||||
    }
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
//dropdown
 | 
			
		||||
 .el-dropdown-menu{
 | 
			
		||||
  a{
 | 
			
		||||
.el-dropdown-menu {
 | 
			
		||||
  a {
 | 
			
		||||
    display: block
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
 
 | 
			
		||||
@@ -22,7 +22,7 @@ html {
 | 
			
		||||
  box-sizing: border-box;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#app{
 | 
			
		||||
#app {
 | 
			
		||||
  height: 100%;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
@@ -53,9 +53,9 @@ a:hover {
 | 
			
		||||
  text-decoration: none;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
div:focus{
 | 
			
		||||
div:focus {
 | 
			
		||||
  outline: none;
 | 
			
		||||
 }
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.fr {
 | 
			
		||||
  float: right;
 | 
			
		||||
@@ -104,23 +104,26 @@ code {
 | 
			
		||||
  line-height: 36px;
 | 
			
		||||
  font-size: 15px;
 | 
			
		||||
  font-family: "Source Sans Pro", "Helvetica Neue", Arial, sans-serif;
 | 
			
		||||
 | 
			
		||||
  a {
 | 
			
		||||
    color: #337ab7;
 | 
			
		||||
    cursor: pointer;
 | 
			
		||||
 | 
			
		||||
    &:hover {
 | 
			
		||||
      color: rgb(32, 160, 255);
 | 
			
		||||
    }
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.warn-content{
 | 
			
		||||
  background: rgba(66,185,131,.1);
 | 
			
		||||
.warn-content {
 | 
			
		||||
  background: rgba(66, 185, 131, .1);
 | 
			
		||||
  border-radius: 2px;
 | 
			
		||||
  padding: 16px;
 | 
			
		||||
  padding: 1rem;
 | 
			
		||||
  line-height: 1.6rem;
 | 
			
		||||
  word-spacing: .05rem;
 | 
			
		||||
  a{
 | 
			
		||||
 | 
			
		||||
  a {
 | 
			
		||||
    color: #42b983;
 | 
			
		||||
    font-weight: 600;
 | 
			
		||||
  }
 | 
			
		||||
@@ -153,13 +156,16 @@ code {
 | 
			
		||||
  padding-right: 20px;
 | 
			
		||||
  transition: 600ms ease position;
 | 
			
		||||
  background: linear-gradient(90deg, rgba(32, 182, 249, 1) 0%, rgba(32, 182, 249, 1) 0%, rgba(33, 120, 241, 1) 100%, rgba(33, 120, 241, 1) 100%);
 | 
			
		||||
 | 
			
		||||
  .subtitle {
 | 
			
		||||
    font-size: 20px;
 | 
			
		||||
    color: #fff;
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  &.draft {
 | 
			
		||||
    background: #d0d0d0;
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  &.deleted {
 | 
			
		||||
    background: #d0d0d0;
 | 
			
		||||
  }
 | 
			
		||||
@@ -169,6 +175,7 @@ code {
 | 
			
		||||
.link-type:focus {
 | 
			
		||||
  color: #337ab7;
 | 
			
		||||
  cursor: pointer;
 | 
			
		||||
 | 
			
		||||
  &:hover {
 | 
			
		||||
    color: rgb(32, 160, 255);
 | 
			
		||||
  }
 | 
			
		||||
@@ -176,6 +183,7 @@ code {
 | 
			
		||||
 | 
			
		||||
.filter-container {
 | 
			
		||||
  padding-bottom: 10px;
 | 
			
		||||
 | 
			
		||||
  .filter-item {
 | 
			
		||||
    display: inline-block;
 | 
			
		||||
    vertical-align: middle;
 | 
			
		||||
 
 | 
			
		||||
@@ -10,9 +10,11 @@
 | 
			
		||||
  &::-webkit-scrollbar-track-piece {
 | 
			
		||||
    background: #d3dce6;
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  &::-webkit-scrollbar {
 | 
			
		||||
    width: 6px;
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  &::-webkit-scrollbar-thumb {
 | 
			
		||||
    background: #99a9bf;
 | 
			
		||||
    border-radius: 20px;
 | 
			
		||||
@@ -37,21 +39,25 @@
 | 
			
		||||
  $transparent-border-style: $width solid transparent;
 | 
			
		||||
  height: 0;
 | 
			
		||||
  width: 0;
 | 
			
		||||
 | 
			
		||||
  @if $direction==up {
 | 
			
		||||
    border-bottom: $color-border-style;
 | 
			
		||||
    border-left: $transparent-border-style;
 | 
			
		||||
    border-right: $transparent-border-style;
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  @else if $direction==right {
 | 
			
		||||
    border-left: $color-border-style;
 | 
			
		||||
    border-top: $transparent-border-style;
 | 
			
		||||
    border-bottom: $transparent-border-style;
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  @else if $direction==down {
 | 
			
		||||
    border-top: $color-border-style;
 | 
			
		||||
    border-left: $transparent-border-style;
 | 
			
		||||
    border-right: $transparent-border-style;
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  @else if $direction==left {
 | 
			
		||||
    border-right: $color-border-style;
 | 
			
		||||
    border-top: $transparent-border-style;
 | 
			
		||||
 
 | 
			
		||||
@@ -1,4 +1,5 @@
 | 
			
		||||
#app {
 | 
			
		||||
 | 
			
		||||
  // 主体区域 Main container
 | 
			
		||||
  .main-container {
 | 
			
		||||
    min-height: 100%;
 | 
			
		||||
@@ -6,6 +7,7 @@
 | 
			
		||||
    margin-left: $sideBarWidth;
 | 
			
		||||
    position: relative;
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  // 侧边栏 Sidebar container
 | 
			
		||||
  .sidebar-container {
 | 
			
		||||
    transition: width 0.28s;
 | 
			
		||||
@@ -18,62 +20,79 @@
 | 
			
		||||
    left: 0;
 | 
			
		||||
    z-index: 1001;
 | 
			
		||||
    overflow: hidden;
 | 
			
		||||
 | 
			
		||||
    //reset element-ui css
 | 
			
		||||
    .horizontal-collapse-transition {
 | 
			
		||||
      transition: 0s width ease-in-out, 0s padding-left ease-in-out, 0s padding-right ease-in-out;
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    .scrollbar-wrapper {
 | 
			
		||||
      overflow-x: hidden!important;
 | 
			
		||||
      overflow-x: hidden !important;
 | 
			
		||||
 | 
			
		||||
      .el-scrollbar__view {
 | 
			
		||||
        height: 100%;
 | 
			
		||||
      }
 | 
			
		||||
    }
 | 
			
		||||
    .el-scrollbar__bar.is-vertical{
 | 
			
		||||
 | 
			
		||||
    .el-scrollbar__bar.is-vertical {
 | 
			
		||||
      right: 0px;
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    .is-horizontal {
 | 
			
		||||
      display: none;
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    a {
 | 
			
		||||
      display: inline-block;
 | 
			
		||||
      width: 100%;
 | 
			
		||||
      overflow: hidden;
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    .svg-icon {
 | 
			
		||||
      margin-right: 16px;
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    .el-menu {
 | 
			
		||||
      border: none;
 | 
			
		||||
      height: 100%;
 | 
			
		||||
      width: 100% !important;
 | 
			
		||||
    }
 | 
			
		||||
    .is-active > .el-submenu__title{
 | 
			
		||||
        color: #f4f4f5!important;
 | 
			
		||||
 | 
			
		||||
    .is-active>.el-submenu__title {
 | 
			
		||||
      color: #f4f4f5 !important;
 | 
			
		||||
    }
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  .hideSidebar {
 | 
			
		||||
    .sidebar-container {
 | 
			
		||||
      width: 36px !important;
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    .main-container {
 | 
			
		||||
      margin-left: 36px;
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    .submenu-title-noDropdown {
 | 
			
		||||
      padding-left: 10px !important;
 | 
			
		||||
      position: relative;
 | 
			
		||||
 | 
			
		||||
      .el-tooltip {
 | 
			
		||||
        padding: 0 10px !important;
 | 
			
		||||
      }
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    .el-submenu {
 | 
			
		||||
      overflow: hidden;
 | 
			
		||||
 | 
			
		||||
      &>.el-submenu__title {
 | 
			
		||||
        padding-left: 10px !important;
 | 
			
		||||
 | 
			
		||||
        .el-submenu__icon-arrow {
 | 
			
		||||
          display: none;
 | 
			
		||||
        }
 | 
			
		||||
      }
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    .el-menu--collapse {
 | 
			
		||||
      .el-submenu {
 | 
			
		||||
        &>.el-submenu__title {
 | 
			
		||||
@@ -88,14 +107,17 @@
 | 
			
		||||
      }
 | 
			
		||||
    }
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  .sidebar-container .nest-menu .el-submenu>.el-submenu__title,
 | 
			
		||||
  .sidebar-container .el-submenu .el-menu-item {
 | 
			
		||||
    min-width: $sideBarWidth !important;
 | 
			
		||||
    background-color: $subMenuBg !important;
 | 
			
		||||
 | 
			
		||||
    &:hover {
 | 
			
		||||
      background-color: $menuHover !important;
 | 
			
		||||
    }
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  .el-menu--collapse .el-menu .el-submenu {
 | 
			
		||||
    min-width: $sideBarWidth !important;
 | 
			
		||||
  }
 | 
			
		||||
@@ -105,10 +127,12 @@
 | 
			
		||||
    .main-container {
 | 
			
		||||
      margin-left: 0px;
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    .sidebar-container {
 | 
			
		||||
      transition: transform .28s;
 | 
			
		||||
      width: $sideBarWidth !important;
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    &.hideSidebar {
 | 
			
		||||
      .sidebar-container {
 | 
			
		||||
        transition-duration: 0.3s;
 | 
			
		||||
@@ -116,7 +140,9 @@
 | 
			
		||||
      }
 | 
			
		||||
    }
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  .withoutAnimation {
 | 
			
		||||
 | 
			
		||||
    .main-container,
 | 
			
		||||
    .sidebar-container {
 | 
			
		||||
      transition: none;
 | 
			
		||||
@@ -124,9 +150,9 @@
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.el-menu--vertical{
 | 
			
		||||
  & >.el-menu{
 | 
			
		||||
    .svg-icon{
 | 
			
		||||
.el-menu--vertical {
 | 
			
		||||
  &>.el-menu {
 | 
			
		||||
    .svg-icon {
 | 
			
		||||
      margin-right: 16px;
 | 
			
		||||
    }
 | 
			
		||||
  }
 | 
			
		||||
 
 | 
			
		||||
@@ -16,10 +16,12 @@
 | 
			
		||||
.fade-transform-enter-active {
 | 
			
		||||
  transition: all .5s;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.fade-transform-enter {
 | 
			
		||||
  opacity: 0;
 | 
			
		||||
  transform: translateX(-30px);
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.fade-transform-leave-to {
 | 
			
		||||
  opacity: 0;
 | 
			
		||||
  transform: translateX(30px);
 | 
			
		||||
@@ -44,4 +46,3 @@
 | 
			
		||||
.breadcrumb-leave-active {
 | 
			
		||||
  position: absolute;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
 
 | 
			
		||||
@@ -1,3 +1,4 @@
 | 
			
		||||
// base color
 | 
			
		||||
$blue:#324157;
 | 
			
		||||
$light-blue:#3A71A8;
 | 
			
		||||
$red:#C03639;
 | 
			
		||||
@@ -11,5 +12,4 @@ $panGreen: #30B08F;
 | 
			
		||||
$menuBg:#304156;
 | 
			
		||||
$subMenuBg:#1f2d3d;
 | 
			
		||||
$menuHover:#001528;
 | 
			
		||||
 | 
			
		||||
$sideBarWidth: 180px;
 | 
			
		||||
 
 | 
			
		||||
		Reference in New Issue
	
	Block a user