Blame view

static/sass/layout/_header.scss 3.61 KB
xuqi authored
1 2 3 4 5 6
.yoho-header {
    position: relative;
    background-color: #000;
    color: #fff;
    width: 100%;
    overflow: hidden;
ccbikai authored
7 8
    height: 90rem / $pxConvertRem;
    line-height: 90rem / $pxConvertRem;
xuqi authored
9
    z-index: 1;
xuqi authored
10
xuqi authored
11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26
    &.boys {
        @include background-image(linear-gradient(#323232, #414141));
    }

    &.girls {
        background: #ff88ae;
    }

    &.kids {
        background: #7ad9f9;
    }

    &.life-style {
        background: #4f4138;
    }
27 28 29 30 31 32
    a.highlight {
        background: rgba(200,200,200,.1);
    }

    %nav {
        display: block;
xuqi authored
33
        position: absolute;
34 35 36
        top: 0;
        width: 90rem / $pxConvertRem;
        height: 90rem / $pxConvertRem;
ccbikai authored
37
        font-size: 20px;
38 39 40
        line-height: 90rem / $pxConvertRem;
        color: #fff;
        text-align: center;
xuqi authored
41 42 43
        outline: none;
    }
44 45
    .nav-back {
        @extend %nav;
46
        left: 10rem / $pxConvertRem;
47 48
    }
xuqi authored
49
    .nav-home {
50
        @extend %nav;
ccbikai authored
51
        right: 10rem / $pxConvertRem;
xuqi authored
52 53
    }
54 55 56 57 58 59
    .nav-btn {
        @extend %nav;
        right: 10rem / $pxConvertRem;
        font-size: 14px;
    }
xuqi authored
60 61
    .nav-title {
        position: absolute;
62 63
        margin-left: 100rem / $pxConvertRem;
        margin-right: 100rem / $pxConvertRem;
xuqi authored
64
        height: 100%;
ccbikai authored
65
        font-size: 36rem / $pxConvertRem;
xuqi authored
66 67 68 69 70 71 72 73 74 75
        color: #fff;
        font-weight: bold;
        top: 0;
        right: 0;
        left: 0;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        text-align: center;
    }
lore-w authored
76
uedxwg authored
77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103
}
.systemUpdate{
    width: 100%;
    height: 90rem / $pxConvertRem;
    overflow: hidden;
    line-height: 90rem / $pxConvertRem;
    display: none;
    @include background-image(linear-gradient(#323232, #414141));
    .systemHeader{
        width: 85%;
        height: 100%;
        overflow: hidden;
        font-size: 60em / $pxConvertRem;
        color:#fff;
        float: left;
        text-align: center;
    }
    span{
        width: 14%;
        height: 100%;
        overflow: hidden;
        float: left;
        text-align: center;
        font-size: 80em / $pxConvertRem;
        font-weight: bold;
        color: #fff;
    }
uedxwg authored
104 105 106 107 108 109 110 111 112 113 114 115
}
.systemMain{
    width: 92%;
    height: 100%;
    overflow: hidden;
    background-color:#444;
    color: #fff;
    padding:0 4%;
    position: absolute;
    top: 0;
    left: 0;
    p{
116
        font-size: 52em / $pxConvertRem;
uedxwg authored
117 118 119 120 121
        line-height: 60rem / $pxConvertRem;
        &:first-of-type{
            padding-top: 90rem / $pxConvertRem;
        }
    }
122 123 124 125 126 127
}

.homebuttom{
    width: 100%;
    height: 90rem / $pxConvertRem;
    overflow: hidden;
梁志锋 authored
128
    border-top: 1px solid rgba(255,255,255,0.5);
129
    color: #fff;
梁志锋 authored
130 131
    z-index: 2;
    position: relative;
梁志锋 authored
132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148

    &.boys {
        @include background-image(linear-gradient(#323232, #414141));
    }

    &.girls {
        background: #ff88ae;
    }

    &.kids {
        background: #7ad9f9;
    }

    &.life-style {
        background: #4f4138;
    }
149 150 151 152 153 154 155 156 157 158 159 160 161 162 163
    ul{
        width: 100%;
        height: 90%;
        overflow: hidden;
        padding-top: 12rem / $pxConvertRem;
        li{
            width: 25%;
            height: 100%;
            overflow: hidden;
            float: left;
            text-align: center;
            i{
                width: 100%;
                height: 40%;
                display: block;
164
                color: #fff;
165
                margin-bottom: 8rem / $pxConvertRem;
166 167 168 169 170 171 172
            }
            span{
                width: 100%;
                height: auto;
                overflow: hidden;
                display: block;
                line-height: 40rem / $pxConvertRem;
梁志锋 authored
173
                color: #fff;
174 175 176
            }
        }
    }
uedxwg authored
177
}
梁志锋 authored
178