init commit
This commit is contained in:
@@ -0,0 +1,37 @@
|
||||
/*页面统一样式*/
|
||||
html,
|
||||
body {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
font-size: 14px !important;
|
||||
overflow: hidden;
|
||||
font-family: "Roboto", sans-serif !important;
|
||||
background-color: #1190d6 !important;
|
||||
}
|
||||
/*添加手形*/
|
||||
a[href],
|
||||
input[type="submit"],
|
||||
input[type="image"],
|
||||
label[for],
|
||||
select,
|
||||
button,
|
||||
.c-pointer {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
/*整体部分*/
|
||||
::-webkit-scrollbar {
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
}
|
||||
/*滑动轨道*/
|
||||
::-webkit-scrollbar-track {
|
||||
background: rgba(0, 0, 0, 0.06);
|
||||
}
|
||||
/*滑块*/
|
||||
::-webkit-scrollbar-thumb {
|
||||
background: rgba(0, 0, 0, 0.08);
|
||||
&:hover {
|
||||
background: rgba(0, 0, 0, 0.15);
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,208 @@
|
||||
/* 字体大小 */
|
||||
.fz-12 {
|
||||
font-size: 12px !important;
|
||||
}
|
||||
.fz-14 {
|
||||
font-size: 14px !important;
|
||||
}
|
||||
.fz-16 {
|
||||
font-size: 16px !important;
|
||||
}
|
||||
.fz-18 {
|
||||
font-size: 18px !important;
|
||||
}
|
||||
.fz-20 {
|
||||
font-size: 20px !important;
|
||||
}
|
||||
.fz-22 {
|
||||
font-size: 22px !important;
|
||||
}
|
||||
.fz-24 {
|
||||
font-size: 24px !important;
|
||||
}
|
||||
|
||||
/* 外边距 */
|
||||
.m-5 {
|
||||
margin: 5px !important;
|
||||
}
|
||||
.m-10 {
|
||||
margin: 10px !important;
|
||||
}
|
||||
.m-15 {
|
||||
margin: 15px !important;
|
||||
}
|
||||
.m-20 {
|
||||
margin: 20px !important;
|
||||
}
|
||||
.m-25 {
|
||||
margin: 25px !important;
|
||||
}
|
||||
.m-30 {
|
||||
margin: 30px !important;
|
||||
}
|
||||
|
||||
/* 内边距 */
|
||||
.p-5 {
|
||||
padding: 5px !important;
|
||||
}
|
||||
.p-10 {
|
||||
padding: 10px !important;
|
||||
}
|
||||
.p-15 {
|
||||
padding: 15px !important;
|
||||
}
|
||||
.p-20 {
|
||||
padding: 20px !important;
|
||||
}
|
||||
.p-25 {
|
||||
padding: 25px !important;
|
||||
}
|
||||
.p-30 {
|
||||
padding: 30px !important;
|
||||
}
|
||||
|
||||
.dip {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
label.custom-radio {
|
||||
@padding-right: 0;
|
||||
padding-left: 0;
|
||||
margin-bottom: 0;
|
||||
& > input {
|
||||
height: 0;
|
||||
z-index: -100 !important;
|
||||
opacity: 0;
|
||||
position: absolute;
|
||||
&:checked {
|
||||
& + span {
|
||||
&:before {
|
||||
content: "\f00c";
|
||||
font-weight: 300;
|
||||
}
|
||||
}
|
||||
}
|
||||
&:disabled {
|
||||
& + span {
|
||||
color: rgba(255, 255, 255, 0.4);
|
||||
cursor: not-allowed;
|
||||
&:before {
|
||||
border-color: rgba(255, 255, 255, 0.4) !important;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
& > span {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
margin: 0;
|
||||
line-height: 16px;
|
||||
font-weight: 300;
|
||||
cursor: pointer;
|
||||
padding-left: 22px;
|
||||
width: 100%;
|
||||
&:before {
|
||||
cursor: pointer;
|
||||
font-family: fontAwesome;
|
||||
font-weight: 300;
|
||||
font-size: 12px;
|
||||
content: "\a0";
|
||||
background-color: transparent;
|
||||
border: 1px solid #ccc;
|
||||
color: $color-primary;
|
||||
border-radius: 0;
|
||||
display: inline-block;
|
||||
text-align: center;
|
||||
height: 16px;
|
||||
line-height: 14px;
|
||||
min-width: 16px;
|
||||
margin-right: 6px;
|
||||
position: relative;
|
||||
top: 0;
|
||||
margin-left: -22px;
|
||||
float: left;
|
||||
}
|
||||
&:hover {
|
||||
&:before {
|
||||
border-color: tint(#00abff, 20%);
|
||||
}
|
||||
}
|
||||
}
|
||||
& > input {
|
||||
&:checked {
|
||||
& + span {
|
||||
&:before {
|
||||
content: "\f111";
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
& > span {
|
||||
&:before {
|
||||
border-radius: 16px;
|
||||
font-size: 9px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
label.custom-checkbox {
|
||||
padding-right: 0;
|
||||
padding-left: 0;
|
||||
margin-bottom: 0;
|
||||
& > input {
|
||||
height: 0;
|
||||
z-index: -100 !important;
|
||||
opacity: 0;
|
||||
position: absolute;
|
||||
&:checked {
|
||||
& + span {
|
||||
&:before {
|
||||
content: "\f00c";
|
||||
font-weight: 300;
|
||||
}
|
||||
}
|
||||
}
|
||||
&:disabled {
|
||||
& + span {
|
||||
color: rgba(255, 255, 255, 0.4);
|
||||
cursor: not-allowed;
|
||||
&:before {
|
||||
border-color: rgba(255, 255, 255, 0.4) !important;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
& > span {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
margin: 0;
|
||||
line-height: 16px;
|
||||
font-weight: 300;
|
||||
cursor: pointer;
|
||||
padding-left: 22px;
|
||||
width: 100%;
|
||||
&:before {
|
||||
cursor: pointer;
|
||||
font-family: fontAwesome;
|
||||
font-weight: 300;
|
||||
font-size: 12px;
|
||||
content: "\a0";
|
||||
background-color: transparent;
|
||||
border: 1px solid #ccc;
|
||||
color: $color-primary;
|
||||
border-radius: 0;
|
||||
display: inline-block;
|
||||
text-align: center;
|
||||
height: 16px;
|
||||
line-height: 14px;
|
||||
min-width: 16px;
|
||||
margin-right: 6px;
|
||||
position: relative;
|
||||
top: 0;
|
||||
margin-left: -22px;
|
||||
float: left;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,101 @@
|
||||
@media screen and (min-width: 1420px) {
|
||||
.col-mlg-1 {
|
||||
max-width: 8.33333333%;
|
||||
flex: 0 0 8.33333333%;
|
||||
}
|
||||
.col-mlg-2 {
|
||||
max-width: 16.66666667%;
|
||||
flex: 0 0 16.66666667%;
|
||||
}
|
||||
.col-mlg-3 {
|
||||
max-width: 25%;
|
||||
flex: 0 0 25%;
|
||||
}
|
||||
.col-mlg-4 {
|
||||
max-width: 33.33333333%;
|
||||
flex: 0 0 33.33333333%;
|
||||
}
|
||||
.col-mlg-5 {
|
||||
max-width: 41.66666667%;
|
||||
flex: 0 0 41.66666667%;
|
||||
}
|
||||
.col-mlg-6 {
|
||||
max-width: 50%;
|
||||
flex: 0 0 50%;
|
||||
}
|
||||
.col-mlg-7 {
|
||||
max-width: 58.33333333%;
|
||||
flex: 0 0 58.33333333%;
|
||||
}
|
||||
.col-mlg-8 {
|
||||
max-width: 66.66666667%;
|
||||
flex: 0 0 66.66666667%;
|
||||
}
|
||||
.col-mlg-9 {
|
||||
max-width: 75%;
|
||||
flex: 0 0 75%;
|
||||
}
|
||||
.col-mlg-10 {
|
||||
max-width: 83.33333333%;
|
||||
flex: 0 0 83.33333333%;
|
||||
}
|
||||
.col-mlg-11 {
|
||||
max-width: 91.66666667%;
|
||||
flex: 0 0 91.66666667%;
|
||||
}
|
||||
.col-mlg-12 {
|
||||
max-width: 100%;
|
||||
flex: 0 0 100%;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 1620px) {
|
||||
.col-xlg-1 {
|
||||
max-width: 8.33333333%;
|
||||
flex: 0 0 8.33333333%;
|
||||
}
|
||||
.col-xlg-2 {
|
||||
max-width: 16.66666667%;
|
||||
flex: 0 0 16.66666667%;
|
||||
}
|
||||
.col-xlg-3 {
|
||||
max-width: 25%;
|
||||
flex: 0 0 25%;
|
||||
}
|
||||
.col-xlg-4 {
|
||||
max-width: 33.33333333%;
|
||||
flex: 0 0 33.33333333%;
|
||||
}
|
||||
.col-xlg-5 {
|
||||
max-width: 41.66666667%;
|
||||
flex: 0 0 41.66666667%;
|
||||
}
|
||||
.col-xlg-6 {
|
||||
max-width: 50%;
|
||||
flex: 0 0 50%;
|
||||
}
|
||||
.col-xlg-7 {
|
||||
max-width: 58.33333333%;
|
||||
flex: 0 0 58.33333333%;
|
||||
}
|
||||
.col-xlg-8 {
|
||||
max-width: 66.66666667%;
|
||||
flex: 0 0 66.66666667%;
|
||||
}
|
||||
.col-xlg-9 {
|
||||
max-width: 75%;
|
||||
flex: 0 0 75%;
|
||||
}
|
||||
.col-xlg-10 {
|
||||
max-width: 83.33333333%;
|
||||
flex: 0 0 83.33333333%;
|
||||
}
|
||||
.col-xlg-11 {
|
||||
max-width: 91.66666667%;
|
||||
flex: 0 0 91.66666667%;
|
||||
}
|
||||
.col-xlg-12 {
|
||||
max-width: 100%;
|
||||
flex: 0 0 100%;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,69 @@
|
||||
/* 颜色变量 */
|
||||
$white: #fff !default;
|
||||
$gray-100: #f8f9fa !default;
|
||||
$gray-200: #e9ecef !default;
|
||||
$gray-300: #dee2e6 !default;
|
||||
$gray-400: #ced4da !default;
|
||||
$gray-500: #adb5bd !default;
|
||||
$gray-600: #868e96 !default;
|
||||
$gray-700: #495057 !default;
|
||||
$gray-800: #343a40 !default;
|
||||
$gray-900: #212529 !default;
|
||||
|
||||
$black: #000 !default;
|
||||
$blue: #20a8d8 !default;
|
||||
$indigo: #6610f2 !default;
|
||||
$purple: #6f42c1 !default;
|
||||
$pink: #e83e8c !default;
|
||||
$red: #f86c6b !default;
|
||||
$orange: #fd7e14 !default;
|
||||
$yellow: #f0bd0a !default;
|
||||
$green: #4dbd74 !default;
|
||||
$teal: #20c997 !default;
|
||||
$cyan: #6acae6 !default;
|
||||
|
||||
$color-primary: #1190d6 !default;
|
||||
$color-secondary: #10a2e9 !default;
|
||||
$color-deep: #0a7bb9 !default;
|
||||
$color-light: #5bc0de !default;
|
||||
$color-black-primary: #333333 !default;
|
||||
$color-black-secondary: #555555 !default;
|
||||
$color-black-deep: #000000 !default;
|
||||
$color-black-light: #888888 !default;
|
||||
$color-gray-primary: #f2f2f2 !default;
|
||||
$color-gray-secondary: #fafafa !default;
|
||||
$color-gray-deep: #eeeeee !default;
|
||||
$color-gray-light: #fefefe !default;
|
||||
$color-white: #ffffff !default;
|
||||
$color-gary: #dddddd !default;
|
||||
$color-white-gray: #f6f7f8 !default;
|
||||
$color-white-gray-deep: #f5f5f5 !default;
|
||||
|
||||
$box-shadow: 1px 2px 6px rgba(0, 0, 0, 0.03) !default;
|
||||
$header-shadow: 1px 2px 6px rgba(0, 0, 0, 0.03) !default;
|
||||
$img-shadow: 1px 2px 6px rgba(0, 0, 0, 0.05) !default;
|
||||
$hierarchy-box: 1px 1px 3px rgba(100, 100, 100, 0.6) !default;
|
||||
$toast-box: 1px 1px 3px rgba(100, 100, 100, 0.3) !default;
|
||||
$switch-small: 0 1px 3px rgba(0, 0, 0, 0.3) !default;
|
||||
$btn-shadow: 1px 2px 5px rgba(0, 0, 0, 0.05) !default;
|
||||
|
||||
$spin-color-red: #f95372;
|
||||
$spin-color-blue: #00abff;
|
||||
$spin-color-yellow: #e7ba08;
|
||||
$bootstrap-light: #ffffff;
|
||||
$bootstrap-light-deep: #e6e6e6;
|
||||
$bootstrap-primary: #20a8d8;
|
||||
$bootstrap-primary-deep: #1985ac;
|
||||
$bootstrap-success: #4dbd74;
|
||||
$bootstrap-success-deep: #369759;
|
||||
$bootstrap-info: #6acae6;
|
||||
$bootstrap-info-deep: #32add3;
|
||||
$bootstrap-warning: #f0bd0a;
|
||||
$bootstrap-warning-deep: #bf9608;
|
||||
$bootstrap-danger: #f86c6b;
|
||||
$bootstrap-danger-deep: #e23533;
|
||||
$bootstrap-secondary: #868e96;
|
||||
$bootstrap-secondary-deep: #66696d;
|
||||
$bootstrap-dark: #343a40;
|
||||
$bootstrap-dark-deep: #111111;
|
||||
|
||||
Reference in New Issue
Block a user