ソースを参照

修复tap事件的回调问题,更新列表的背景色处理

guohh 8 年 前
コミット
2f37cd1d90
共有4 個のファイルを変更した58 個の追加40 個の削除を含む
  1. 1 1
      src/js/tab.js
  2. 38 36
      src/sass/ipu/base/mixin.scss
  3. 15 1
      src/sass/ipu/layout/list.scss
  4. 4 2
      src/sass/ui.scss

+ 1 - 1
src/js/tab.js

@ -38,7 +38,7 @@
38 38
        this.currentIndex = this.index;
39 39
40 40
        if (this.options.callBack) {
41
            this.option.callBack(index, this.lastIndex);
41
            this.options.callBack(index, this.lastIndex);
42 42
        }
43 43
    };
44 44

+ 38 - 36
src/sass/ipu/base/mixin.scss

@ -115,45 +115,47 @@
115 115
}
116 116
117 117
@mixin borderline($position, $color) {
118
    &:before {
119
        content: '';
120
        position: absolute;
121
122
        @if $position == top {
123
            left: 0;
124
            top: 0;
125
            bottom: auto;
126
            right: auto;
127
        } @else if $position == bottom {
128
            left: 0;
129
            top: auto;
130
            bottom: 0;
131
            right: auto;
132
        } @else if $position == left {
133
            left: 0;
134
            top: 0;
135
            bottom: auto;
136
            right: auto;
137
        } @else {
138
            left: auto;
139
            top: 0;
140
            bottom: auto;
141
            right: 0;
142
        }
118
    content: '';
119
    position: absolute;
143 120
144
        display: block;
121
    @if $position == top {
122
        left: 0;
123
        right: 0;
124
        top: 0;
125
        bottom: auto;
126
        height: 1px;
127
    } @else if $position == bottom {
128
        left: 0;
129
        right: 0;
130
        bottom: 0;
131
        top: auto;
132
        height: 1px;
133
    } @else if $position == left {
134
        left: 0;
135
        top: 0;
136
        bottom: 0;
137
        right: auto;
145 138
        width: 1px;
146
        height: 100%;
147
        background-color: $color;
148
        z-index: 15;
149
        transform-origin: 0% 50%;
150
        @media only screen and (-webkit-min-device-pixel-ratio: 2) {
151
            transform: scaleY(0.5);
152
        }
153
        @media only screen and (-webkit-min-device-pixel-ratio: 3) {
154
            transform: scaleY(0.33);
155
        }
139
    } @else {
140
        left: auto;
141
        top: 0;
142
        bottom: 0;
143
        right: 0;
144
        width: 1px;
145
    }
146
147
    background-color: $color;
148
    z-index: 1;
149
    transform-origin: 0% 50%;
150
    @media only screen and (-webkit-min-device-pixel-ratio: 2) {
151
        transform: scaleY(0.5);
156 152
    }
153
    @media only screen and (-webkit-min-device-pixel-ratio: 3) {
154
        transform: scaleY(0.33);
155
    }
156
}
157
@mixin remove-borderline() {
158
    content: none ;
157 159
}
158 160
159 161
// 兼容最box和flex两种旧新两种flex布局规范

+ 15 - 1
src/sass/ipu/layout/list.scss

@ -2,7 +2,6 @@
2 2
    margin-top: .1rem;
3 3
}
4 4
.ui-list>ul{
5
    background-color: $c-component-bg;
6 5
    position: relative;
7 6
}
8 7
.ui-list>ul:before,
@ -20,6 +19,7 @@
20 19
.ui-list>ul>li{
21 20
    position: relative;
22 21
    box-sizing: border-box;
22
    background-color: $c-component-bg;
23 23
}
24 24
.ui-list>ul>li:not(:last-child) .ui-list-item-inner:after{
25 25
    content: '';
@ -120,3 +120,17 @@
120 120
        }
121 121
    }
122 122
}
123
.ui-list-card .ui-list-item{
124
    margin:.1rem 0;
125
}
126
.ui-list-card>ul:after,
127
.ui-list-card>ul:before,
128
.ui-list-card>ul>li:not(:last-child) .ui-list-item-inner:after{
129
    @include remove-borderline();
130
}
131
.ui-list-card>ul>li:before{
132
    @include borderline(top, $c-list-bd);
133
}
134
.ui-list-card>ul>li:after{
135
    @include borderline(bottom, $c-list-bd);
136
}

+ 4 - 2
src/sass/ui.scss

@ -11,7 +11,6 @@
11 11
    "ipu/base/reset",
12 12
    "ipu/base/type",
13 13
    "ipu/base/text",
14
    "ipu/base/function",
15 14
    "ipu/base/animation",
16 15
    "ipu/base/icon",
17 16
    "ipu/awesome-adapter",
@ -48,7 +47,10 @@
48 47
    "ipu/carousel",
49 48
    "ipu/modal",             // 待完善
50 49
    "ipu/refresh",
51
    "ipu/tab";
50
    "ipu/tab",
51
52
53
    "ipu/base/function"; //  功能类放后面
52 54
53 55
54 56