123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481 |
- $WinWitdh:1200px;
- $BaseC:#555;
- $LinkC:#06f;
- $HoverC:#f60;
- $FontSize:13px;
- $fontFamily: "Spurce Han Sans,Wah Kang font,Microsoft YaHei";
- $allColor: #333; //正文#333
- $color1: #666; //辅助文字#666
- $color2: #999; //#999
- $color3: #ccc; //失效文字#ccc
- $color4: #00A0E8; //链接文字
- $color5: #8E9CC1; //表头文字加粗
- $colorList: ( 1:$color1, 2:$color2, 3:$color3, 4:$color4, 5:$color5);
- $theme1: #5BA7FF;
- $theme2: #FFF;
- $theme3: #8E9CC1;
- $themeList: (1:$theme1, 2:$theme2, 3:$theme3);
- $auxiliary1: #548FF0; //辅助色彩
- $auxiliary2: #FF4121;
- $auxiliary3: #7ED321;
- $auxiliary4: #F5A623;
- $auxiliaryList: ( 1:$auxiliary1, 2:$auxiliary2, 3:$auxiliary3, 4:$auxiliary4);
- $borderColor1: #C2CEDB; //线条色彩
- $borderColor2: #DDD;
- $borderColorList: (1:$borderColor1, 2:$borderColor2);
- $bg1: #FFF;
- $bg2: #F2FBFF;
- $bg3: #EEFAFF;
- $bg4: #FFF5E4;
- $bg5: #E5F6D3;
- $bgList: ( 1:$bg1, 2:$bg2, 3:$bg3, 4:$bg4, 5:$bg5);
- $allSize: 14px; //正常文字大小
- $size1: 12px; //辅助文字大小
- // mixins
- @mixin dz($time:0.25s) {
- -webkit-transition: all $time ease-in-out;
- -moz-transition: all $time ease-in-out;
- -o-transition: all $time ease-in-out;
- transition: all $time ease-in-out;
- }
- // .el-dialog__headerbtn {
- // top: -24px;
- // right: -24px;
- // width: 24px;
- // height: 24px;
- // border-radius: 50%;
- // color: #8E9CC1;
- // background-color: #fff;
- // }
- .el-dialog__header {
- border-bottom: 1px solid #C2CEDB;
- box-sizing: border-box;
- .el-dialog__title {
- height: 20px;
- line-height: 20px;
- font-size: 14px;
- }
- }
- // .el-button--mini,
- // .el-button--mini.is-round {
- // padding: 5px 20px;
- // }
- // .el-button {
- // box-sizing: border-box;
- // border-color: $auxiliary1;
- // }
- // .el-button span {
- // color: $color4;
- // }
- // .el-button:focus,
- // .el-button:hover {
- // background-color: $bg1;
- // border-color: $auxiliary1;
- // }
- // .el-button span {
- // display: inline-block;
- // line-height: 20px;
- // height: 20px;
- // }
- // * {
- // font-family: $fontFamily;
- // font-size: $allSize;
- // color: $allColor;
- // }
- // .color {
- // color: $allColor;
- // }
- // .el-input__inner:hover{
- // border-color:
- // }
- //文字色
- @each $i,
- $color in $colorList {
- .color#{$i} {
- color: $color;
- }
- }
- //主题色
- @each $i,
- $theme in $themeList {
- .theme#{$i} {
- background-color: $theme;
- }
- }
- //辅助背景色
- @each $i,
- $auxiliary in $auxiliaryList {
- .auxiliary#{$i} {
- background-color: $auxiliary;
- }
- }
- //辅助色
- @each $i,
- $auxiliary in $auxiliaryList {
- .auxiliary-color#{$i} {
- color: $auxiliary;
- }
- }
- //线条色
- @each $i,
- $borderColor in $borderColorList {
- .border-color#{$i} {
- border-color: $borderColor;
- }
- }
- //背景色
- @each $i,
- $bg in $bgList {
- .bg#{$i} {
- background-color: $bg;
- }
- }
- @for $i from 1 to 51 {
- .border-radius#{$i} {
- border-radius: #{$i}px;
- }
- }
- @for $i from 1 to 11 {
- .border#{$i} {
- border-width: #{$i}px;
- border-style: solid;
- }
- }
- // .color2 {
- // color: $color2;
- // }
- // .color3 {
- // color: $color3;
- // }
- // .color4 {
- // color: $color4;
- // }
- // .color5 {
- // color: $color5
- // }
- // @charset "UTF-8";
- body,
- ul,
- ol,
- dl,
- dd,
- h1,
- h2,
- h3,
- h4,
- h5,
- h6,
- pre,
- form,
- fieldset,
- legend,
- input,
- button,
- textarea,
- p,
- blockquote,
- table,
- th,
- td,
- menu {
- margin: 0;
- padding: 0
- }
- html,
- body,
- #app {
- height: 100%;
- width: 100%;
- }
- table {
- border-collapse: collapse;
- border-spacing: 0;
- table-layout: fixed
- }
- ul,
- ol,
- menu {
- list-style: none
- }
- fieldset,
- img {
- border: none
- }
- img,
- object,
- select,
- input,
- textarea,
- button {
- vertical-align: middle
- }
- input,
- textarea,
- select,
- address,
- caption,
- cite,
- code,
- dfn,
- em,
- i,
- b,
- strong,
- small,
- th,
- var,
- abbr {
- font-size: 100%;
- font-style: normal
- }
- caption,
- th {
- text-align: left;
- }
- article,
- aside,
- footer,
- header,
- hgroup,
- nav,
- section,
- figure,
- figcaption {
- display: block;
- }
- code,
- kbd,
- pre,
- samp,
- tt {
- font-family: Consolas, "Courier New", Courier, monospace;
- }
- address,
- cite,
- dfn,
- em,
- var,
- i {
- font-style: normal;
- }
- blockquote,
- q {
- quotes: none;
- }
- blockquote:before,
- blockquote:after,
- q:before,
- q:after {
- content: "";
- content: none;
- }
- a {
- color: $LinkC;
- text-decoration: none;
- cursor: pointer;
- &:link,
- &:visited,
- &:active {
- color: $LinkC;
- }
- &:hover,
- &:focus {
- color: $HoverC;
- text-decoration: underline;
- outline: none;
- }
- &,
- span,
- i,
- em,
- u,
- strong,
- b,
- p,
- img,
- ul,
- li,
- div,
- dd,
- dt,
- dl,
- ol,
- table,
- th,
- td,
- h1,
- h2,
- h3,
- h4,
- h5,
- h6,
- input,
- textarea,
- button,
- small,
- select {
- cursor: pointer;
- @include dz;
- }
- }
- abbr[title],
- acronym[title] {
- border-bottom: 1px dotted;
- cursor: help;
- }
- // base by fungleo
- html {
- min-width: $WinWitdh;
- // overflow-y: scroll;
- }
- body {
- font-size: $FontSize;
- color: $BaseC;
- line-height: 2;
- }
- body,
- button,
- input,
- select,
- textarea {
- font-family: tahoma, Helvetica, Arial, "\5FAE\8F6F\96C5\9ED1";
- *font-family: "\5FAE\8F6F\96C5\9ED1";
- }
- h1 {
- font-size: $FontSize+10;
- }
- h2 {
- font-size: $FontSize+8;
- }
- h3 {
- font-size: $FontSize+6;
- }
- h4 {
- font-size: $FontSize+4;
- }
- h5 {
- font-size: $FontSize+2;
- }
- h6 {
- font-size: $FontSize;
- }
- hr {
- border: none;
- height: 1px;
- background: lighten($BaseC, 50%);
- }
- .fl {
- float: left;
- }
- .fr {
- float: right;
- }
- .tl {
- text-align: left;
- }
- .tr {
- text-align: right;
- }
- .tc {
- text-align: center;
- }
- .cf:before,
- .cf:after,
- .web:before,
- .web:after,
- .web_:before,
- .web_:after {
- content: "";
- display: table;
- }
- .cf:after,
- .web:after,
- .web_:after {
- clear: both;
- }
- .cf {
- zoom: 1;
- }
- .web {
- width: $WinWitdh;
- margin-left: auto;
- margin-right: auto;
- zoom: 1;
- }
- .web_ {
- min-width: $WinWitdh;
- width: 100%;
- zoom: 1;
- }
- .block {
- display: block;
- }
- .none {
- display: none
- }
- .clear {
- clear: both;
- }
- .fl {
- float: left;
- }
- .disIne {
- display: inline-block;
- }
- input::-webkit-outer-spin-button,
- input::-webkit-inner-spin-button {
- -webkit-appearance: none;
- }
- input[type="number"]{
- -moz-appearance: textfield;
- }
|