+ 新功能提示框(白/黑)
+ fix: 暗黑模式 一些小问题 + 一些 scss 通用方法 (cherry picked from commit 8c149b6fa82dde3d2c03c236c699939154c65508)remotes/origin/HEAD
邴新科
3 years ago
committed by
MengYX
parent
99926a752e
commit
06530ad092
@ -0,0 +1,39 @@
|
||||
$color-checkbox: $blue;
|
||||
$color-border-el: #DCDFE6;
|
||||
|
||||
$btn-radius: 6px;
|
||||
|
||||
/* FORM */
|
||||
// checkbox
|
||||
.el-checkbox.is-bordered{
|
||||
@include border-radius($btn-radius) ;
|
||||
&:hover{
|
||||
border-color: $color-checkbox;
|
||||
.el-checkbox__label{
|
||||
color: $color-checkbox;
|
||||
}
|
||||
}
|
||||
.el-checkbox__input.is-focus{
|
||||
.el-checkbox__inner{
|
||||
border-color: $color-border-el;
|
||||
}
|
||||
}
|
||||
&.is-checked{
|
||||
background-color: $color-checkbox;
|
||||
.el-checkbox__label{
|
||||
color: white;
|
||||
}
|
||||
.el-checkbox__inner{
|
||||
border-color: white;
|
||||
background-color: white;
|
||||
&:after{
|
||||
border-color: $color-checkbox;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// el-button
|
||||
.el-button{
|
||||
@include border-radius($btn-radius) ;
|
||||
}
|
||||
@ -0,0 +1,72 @@
|
||||
// box-shadow
|
||||
@mixin box-shadow($value...){
|
||||
-webkit-box-shadow: $value;
|
||||
-moz-box-shadow: $value;
|
||||
box-shadow: $value;
|
||||
}
|
||||
|
||||
// border-radius
|
||||
@mixin border-radius($corner...){
|
||||
-webkit-border-radius: $corner;
|
||||
-moz-border-radius: $corner;
|
||||
border-radius: $corner;
|
||||
}
|
||||
|
||||
@mixin clearfix(){
|
||||
&:after{
|
||||
content: '';
|
||||
display: block;
|
||||
clear: both;
|
||||
visibility: hidden;
|
||||
}
|
||||
}
|
||||
|
||||
@mixin transform($value){
|
||||
-webkit-transform: $value;
|
||||
-moz-transform: $value;
|
||||
-ms-transform: $value;
|
||||
-o-transform: $value;
|
||||
transform: $value;
|
||||
}
|
||||
|
||||
@mixin transition($value...){
|
||||
-webkit-transition: $value;
|
||||
-moz-transition: $value;
|
||||
-ms-transition: $value;
|
||||
-o-transition: $value;
|
||||
transition: $value;
|
||||
}
|
||||
|
||||
@mixin animation($value){
|
||||
animation: $value;
|
||||
-webkit-animation: $value;
|
||||
}
|
||||
|
||||
@mixin linear-gradient($direct, $colors){
|
||||
background: linear-gradient($direct, $colors);
|
||||
background: -webkit-linear-gradient($direct, $colors);
|
||||
background: -moz-linear-gradient($direct, $colors);
|
||||
}
|
||||
|
||||
@mixin backdrop-filter($value){
|
||||
backdrop-filter: $value ;
|
||||
-webkit-backdrop-filter: $value;
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
Extension
|
||||
*/
|
||||
|
||||
.unselectable {
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.btn-like{
|
||||
&:active{
|
||||
@include transform(translateY(2px))
|
||||
}
|
||||
}
|
||||
Loading…
Reference in New Issue