industrial-alliance-website/public/template/001/styles/index.scss

@import './variables.scss';
// @import './mixin.scss';
// @import './transition.scss';
@import './element-ui.scss';
@import './sidebar.scss';
// @import './button.scss';
// @import './header.scss';
// @import './reset-el';//覆盖element 表单和表格样式
html,
body,
h1,
h2,
h3,
h4,
h5,
h6,
div,
dl,
dt,
dd,
ul,
ol,
li,
p,
blockquote,
pre,
hr,
figure,
table,
caption,
th,
td,
form,
fieldset,
legend,
input,
button,
textarea,
menu {
    margin: 0;
    padding: 0;
}

body {
    height: 100%;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    font-family: Helvetica Neue, Helvetica, Arial, Microsoft Yahei, Hiragino Sans GB, Heiti SC, WenQuanYi Micro Hei, sans-serif;
}

label {
    font-weight: 700;
}

html {
    height: 100%;
    box-sizing: border-box;
}

#app {
    // height: 100%;
    // background: #203673f7;    //临时
}
*,
*:before,
*:after {
    box-sizing: inherit;
}

a,
a:focus,
a:hover {
    cursor: pointer;
    color: inherit;
    outline: none;
    text-decoration: none;
}

div:focus {
    outline: none;
}

a:focus,
a:active {
    outline: none;
}

a,
a:focus,
a:hover {
    cursor: pointer;
    color: inherit;
    text-decoration: none;
}

.clearfix {
    &:after {
        visibility: hidden;
        display: block;
        font-size: 0;
        content: " ";
        clear: both;
        height: 0;
    }
}

.flex-box {
    display: -webkit-box;
    display: -webkit-flex;
    /* Safari */
    display: flex;
    justify-content: center;
    align-items: center;
}

.flex-box-space-between {
    display: -webkit-box;
    display: -webkit-flex;
    /* Safari */
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.flex-box-column {
    display: -webkit-box;
    display: -webkit-flex;
    /* Safari */
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.flex-box-column-reverse {
    display: -webkit-box;
    display: -webkit-flex;
    /* Safari */
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column-reverse;
}

.font-size-21 {
    font-size: 21px;
}

.font-size-13 {
    font-size: 13px;
}

.font-size-16 {
    font-size: 16px;
}
.font-size-18 {
    font-size: 18px;
}
.font-weight-bold {
    font-weight: bold;
}

.line-height-2em {
    line-height: 2em;
}

.text-center {
    text-align: center;
}

.flex-1 {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    flex: 1;
}
.color-white {
    color: #fff;
}
.color-black {
    color: #000000;
}
.color-success {
    color: #5CB959;
}

.color-error {
    color: #EA6356;
}

.color-wait {
    color: #FFBF00;
}

.float-left {
    float: left;
}

.float-right {
    float: right;
}

// ul,ol,li{
//     list-style: none;
// }
//main-container全局样式
.app-main {
    position: relative;
    width: 100%;
    min-height: 100%;
}

.app-container {
    padding: 20px;
    background-color: #fff;
    .input-suffix {
        line-height: 60px;
        display: inline;
        margin: 0 1em;
    }
    .filter-container {
        line-height: 50px;
        text-align: right;
    }
}

//处理浏览器输入框记住账号密码后的背景色
input:-webkit-autofill,
textarea:-webkit-autofill,
select:-webkit-autofill {
    -webkit-text-fill-color: #333 !important;
    -webkit-box-shadow: 0 0 0px 1000px transparent inset !important;
    background-color: transparent;
    background-image: none;
    transition: background-color 50000s ease-in-out 0s; //背景色透明  生效时长  过渡效果  启用时延迟的时间
}

input {
    background-color: transparent;
}

// .container-box{
//     .query-box{
//         background: #fff;
//         margin-bottom:20px;
//         border-radius: 5px;
//         .title{
//             padding: 20px;
//             font-size:18px;
//             font-family:Microsoft YaHei;
//             font-weight:400;
//             color:rgba(52,123,229,1);
//             border-bottom:1px solid #DEDEDE;
//         }
//     }
//     .table-box{
//         background: #fff;
//         border-radius: 5px;
//         padding-bottom: 50px;
//         .title-box{
//             .title{
//                 padding: 21px 0 21px 21px;
//                 p{
//                     font-size:18px;
//                     font-family:Microsoft YaHei;
//                     font-weight:400;
//                     color:rgba(68,138,231,1);
//                     border-left:3px solid #448AE7;
//                     padding-left: 8px;
//                 }
//             }
//             .btn{
//                 padding: 11px 54px 11px 0;
//             }
//         }
//     }
// }
// input:-webkit-autofill {
//     -webkit-box-shadow: 0 0 0 1000px white inset !important;
// }
.header-banner {
    position: relative;
    height: 600px;
    width: 100%;
    padding-left: 20%;
    padding-top: 100px;
    margin-bottom: -84px;
    .header-bg1 {
        top: -84px;
        left: 0;
        // margin-left: -952px;
        // right: 0;
        position: absolute;
        width: 100%;
        height: 100%;
        z-index: -1;
    }
    .header-title-cn {
        font-size: 64px;
        line-height: 100px;
        font-family: Source Han Sans CN;
        font-weight: bold;
        color: #fff;
    }
    .header-title-en {
        font-size: 24px;
        line-height: 50px;
        font-family: Microsoft YaHei UI;
        font-weight: 400;
        color: #fff;
        font-style: italic;
    }
    .header-download {
        position: absolute;
        bottom: 207px;
        width: 74px;
        height: 74px;
    }
}