|
9 | 9 | overflow: hidden; |
10 | 10 | flex: 1; |
11 | 11 | /* #endif */ |
12 | | - |
| 12 | + |
13 | 13 | /* #ifndef APP-NVUE */ |
14 | 14 | // vue下,单行和多行显示省略号需要单独处理 |
15 | | - @if $i == 1 { |
16 | | - display: inline-block !important; |
| 15 | + @if $i == '1' { |
17 | 16 | overflow: hidden; |
18 | 17 | white-space: nowrap; |
19 | 18 | text-overflow: ellipsis; |
20 | 19 | } @else { |
21 | | - display: -webkit-box !important; |
| 20 | + display: -webkit-box!important; |
22 | 21 | overflow: hidden; |
23 | 22 | text-overflow: ellipsis; |
24 | 23 | word-break: break-all; |
25 | 24 | -webkit-line-clamp: $i; |
26 | | - -webkit-box-orient: vertical !important; |
| 25 | + -webkit-box-orient: vertical!important; |
27 | 26 | } |
28 | 27 | /* #endif */ |
29 | 28 | } |
30 | 29 | } |
31 | | - |
32 | | - |
| 30 | + |
| 31 | + |
33 | 32 | // 此处加上!important并非随意乱用,而是因为目前*.nvue页面编译到H5时, |
34 | 33 | // App.vue的样式会被uni-app的view元素的自带border属性覆盖,导致无效 |
35 | 34 | // 综上,这是uni-app的缺陷导致我们为了多端兼容,而必须要加上!important |
36 | 35 | // 移动端兼容性较好,直接使用0.5px去实现细边框,不使用伪元素形式实现 |
37 | 36 | .u-border { |
38 | 37 | border-width: 0.5px!important; |
39 | | - border-color: $u-border-color!important; |
| 38 | + border-color: $u-border-color!important; |
40 | 39 | border-style: solid; |
41 | 40 | } |
42 | | - |
| 41 | + |
43 | 42 | .u-border-top { |
44 | | - border-top-width: 0.5px!important; |
45 | | - border-color: $u-border-color!important; |
| 43 | + border-top-width: 0.5px!important; |
| 44 | + border-color: $u-border-color!important; |
46 | 45 | border-top-style: solid; |
47 | 46 | } |
48 | 47 |
|
49 | 48 | .u-border-left { |
50 | | - border-left-width: 0.5px!important; |
51 | | - border-color: $u-border-color!important; |
| 49 | + border-left-width: 0.5px!important; |
| 50 | + border-color: $u-border-color!important; |
52 | 51 | border-left-style: solid; |
53 | 52 | } |
54 | 53 |
|
55 | 54 | .u-border-right { |
56 | | - border-right-width: 0.5px!important; |
57 | | - border-color: $u-border-color!important; |
| 55 | + border-right-width: 0.5px!important; |
| 56 | + border-color: $u-border-color!important; |
58 | 57 | border-right-style: solid; |
59 | 58 | } |
60 | | - |
| 59 | + |
61 | 60 | .u-border-bottom { |
62 | | - border-bottom-width: 0.5px!important; |
63 | | - border-color: $u-border-color!important; |
| 61 | + border-bottom-width: 0.5px!important; |
| 62 | + border-color: $u-border-color!important; |
64 | 63 | border-bottom-style: solid; |
65 | 64 | } |
66 | 65 |
|
67 | 66 | .u-border-top-bottom { |
68 | | - border-top-width: 0.5px!important; |
69 | | - border-bottom-width: 0.5px!important; |
70 | | - border-color: $u-border-color!important; |
| 67 | + border-top-width: 0.5px!important; |
| 68 | + border-bottom-width: 0.5px!important; |
| 69 | + border-color: $u-border-color!important; |
71 | 70 | border-top-style: solid; |
72 | 71 | border-bottom-style: solid; |
73 | 72 | } |
|
0 commit comments