@autobest-ui/components 1.1.4 → 1.1.10
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +10 -10
- package/esm/affix/style/index.scss +34 -34
- package/esm/base.scss +42 -42
- package/esm/carousel/style/index.scss +37 -37
- package/esm/checkbox/style/index.scss +117 -117
- package/esm/collapse/style/index.scss +42 -42
- package/esm/confirm/style/index.scss +44 -44
- package/esm/date-picker/calendar/grid/index.scss +85 -85
- package/esm/date-picker/calendar/index.d.ts +4 -0
- package/esm/date-picker/calendar/index.js +1 -1
- package/esm/date-picker/calendar/index.scss +57 -57
- package/esm/date-picker/index.d.ts +17 -6
- package/esm/date-picker/index.js +49 -8
- package/esm/date-picker/style/index.css +1 -1
- package/esm/date-picker/style/index.scss +23 -19
- package/esm/drawer/style/index.scss +44 -44
- package/esm/ellipsis/style/index.scss +35 -35
- package/esm/guide/style/index.scss +17 -17
- package/esm/icon/style/index.scss +6 -6
- package/esm/index.d.ts +2 -1
- package/esm/input-number/index.d.ts +30 -17
- package/esm/input-number/index.js +116 -36
- package/esm/input-number/style/index.scss +86 -86
- package/esm/lazy-image/style/index.scss +24 -24
- package/esm/link-list/style/index.scss +125 -125
- package/esm/loading/style/index.scss +30 -30
- package/esm/loading-bar/style/index.scss +62 -62
- package/esm/loading-container/style/index.scss +27 -27
- package/esm/loading-icon/style/index.scss +23 -23
- package/esm/mask/style/index.scss +34 -34
- package/esm/message/style/index.scss +70 -70
- package/esm/modal/style/index.scss +112 -112
- package/esm/move/style/index.scss +7 -7
- package/esm/popover/style/index.scss +59 -59
- package/esm/select/style/index.scss +126 -126
- package/esm/show-more/style/index.scss +22 -22
- package/esm/skeleton/style/index.scss +26 -26
- package/esm/style.css +5 -19
- package/esm/table/body/BodyRow.d.ts +9 -3
- package/esm/table/body/BodyRow.js +6 -2
- package/esm/table/body/index.d.ts +2 -2
- package/esm/table/body/index.js +8 -7
- package/esm/table/header/HeaderCell.d.ts +2 -2
- package/esm/table/header/HeaderRow.d.ts +2 -2
- package/esm/table/index.d.ts +4 -4
- package/esm/table/index.js +3 -3
- package/esm/table/interface.d.ts +9 -3
- package/esm/table/style/index.scss +51 -51
- package/esm/tabs/style/index.scss +62 -62
- package/esm/tooltip/style/index.scss +61 -61
- package/esm/trigger/style/index.scss +79 -79
- package/lib/affix/style/index.scss +34 -34
- package/lib/base.scss +42 -42
- package/lib/carousel/style/index.scss +37 -37
- package/lib/checkbox/style/index.scss +117 -117
- package/lib/collapse/style/index.scss +42 -42
- package/lib/confirm/style/index.scss +44 -44
- package/lib/date-picker/calendar/grid/index.scss +85 -85
- package/lib/date-picker/calendar/index.d.ts +4 -0
- package/lib/date-picker/calendar/index.js +1 -1
- package/lib/date-picker/calendar/index.scss +57 -57
- package/lib/date-picker/index.d.ts +17 -6
- package/lib/date-picker/index.js +49 -8
- package/lib/date-picker/style/index.css +1 -1
- package/lib/date-picker/style/index.scss +23 -19
- package/lib/drawer/style/index.scss +44 -44
- package/lib/ellipsis/style/index.scss +35 -35
- package/lib/guide/style/index.scss +17 -17
- package/lib/icon/style/index.scss +6 -6
- package/lib/index.d.ts +2 -1
- package/lib/input-number/index.d.ts +30 -17
- package/lib/input-number/index.js +116 -36
- package/lib/input-number/style/index.scss +86 -86
- package/lib/lazy-image/style/index.scss +24 -24
- package/lib/link-list/style/index.scss +125 -125
- package/lib/loading/style/index.scss +30 -30
- package/lib/loading-bar/style/index.scss +62 -62
- package/lib/loading-container/style/index.scss +27 -27
- package/lib/loading-icon/style/index.scss +23 -23
- package/lib/mask/style/index.scss +34 -34
- package/lib/message/style/index.scss +70 -70
- package/lib/modal/style/index.scss +112 -112
- package/lib/move/style/index.scss +7 -7
- package/lib/popover/style/index.scss +59 -59
- package/lib/select/style/index.scss +126 -126
- package/lib/show-more/style/index.scss +22 -22
- package/lib/skeleton/style/index.scss +26 -26
- package/lib/style.css +5 -19
- package/lib/table/body/BodyRow.d.ts +9 -3
- package/lib/table/body/BodyRow.js +6 -2
- package/lib/table/body/index.d.ts +2 -2
- package/lib/table/body/index.js +8 -7
- package/lib/table/header/HeaderCell.d.ts +2 -2
- package/lib/table/header/HeaderRow.d.ts +2 -2
- package/lib/table/index.d.ts +4 -4
- package/lib/table/index.js +3 -3
- package/lib/table/interface.d.ts +9 -3
- package/lib/table/style/index.scss +51 -51
- package/lib/tabs/style/index.scss +62 -62
- package/lib/tooltip/style/index.scss +61 -61
- package/lib/trigger/style/index.scss +79 -79
- package/package.json +2 -2
- package/esm/accordion/__stories__/style.css +0 -1
- package/esm/accordion/__stories__/style.scss +0 -59
- package/esm/affix/__stories__/style.css +0 -1
- package/esm/affix/__stories__/style.scss +0 -13
- package/esm/carousel/__stories__/style.css +0 -1
- package/esm/carousel/__stories__/style.scss +0 -41
- package/esm/collapse/__stories__/style.css +0 -1
- package/esm/collapse/__stories__/style.scss +0 -19
- package/esm/guide/__stories__/style.css +0 -1
- package/esm/guide/__stories__/style.scss +0 -14
- package/esm/icon/__stories__/iconNames.d.ts +0 -2
- package/esm/icon/__stories__/iconNames.js +0 -1
- package/esm/icon/__stories__/style.css +0 -1
- package/esm/icon/__stories__/style.scss +0 -40
- package/esm/lazy-image/__stories__/style.css +0 -1
- package/esm/lazy-image/__stories__/style.scss +0 -9
- package/esm/loading-container/__stories__/style.css +0 -1
- package/esm/loading-container/__stories__/style.scss +0 -6
- package/esm/move/__stories__/style.css +0 -1
- package/esm/move/__stories__/style.scss +0 -6
- package/esm/popover/__stories__/style.css +0 -1
- package/esm/popover/__stories__/style.scss +0 -16
- package/esm/select/__stories__/style.css +0 -1
- package/esm/select/__stories__/style.scss +0 -8
- package/esm/skeleton/__stories__/style.css +0 -1
- package/esm/skeleton/__stories__/style.scss +0 -3
- package/esm/table/__stories__/style.css +0 -1
- package/esm/table/__stories__/style.scss +0 -34
- package/esm/tabs/__stories__/style.css +0 -1
- package/esm/tabs/__stories__/style.scss +0 -8
- package/lib/accordion/__stories__/style.css +0 -1
- package/lib/accordion/__stories__/style.scss +0 -59
- package/lib/affix/__stories__/style.css +0 -1
- package/lib/affix/__stories__/style.scss +0 -13
- package/lib/carousel/__stories__/style.css +0 -1
- package/lib/carousel/__stories__/style.scss +0 -41
- package/lib/collapse/__stories__/style.css +0 -1
- package/lib/collapse/__stories__/style.scss +0 -19
- package/lib/guide/__stories__/style.css +0 -1
- package/lib/guide/__stories__/style.scss +0 -14
- package/lib/icon/__stories__/iconNames.d.ts +0 -2
- package/lib/icon/__stories__/iconNames.js +0 -8
- package/lib/icon/__stories__/style.css +0 -1
- package/lib/icon/__stories__/style.scss +0 -40
- package/lib/lazy-image/__stories__/style.css +0 -1
- package/lib/lazy-image/__stories__/style.scss +0 -9
- package/lib/loading-container/__stories__/style.css +0 -1
- package/lib/loading-container/__stories__/style.scss +0 -6
- package/lib/move/__stories__/style.css +0 -1
- package/lib/move/__stories__/style.scss +0 -6
- package/lib/popover/__stories__/style.css +0 -1
- package/lib/popover/__stories__/style.scss +0 -16
- package/lib/select/__stories__/style.css +0 -1
- package/lib/select/__stories__/style.scss +0 -8
- package/lib/skeleton/__stories__/style.css +0 -1
- package/lib/skeleton/__stories__/style.scss +0 -3
- package/lib/table/__stories__/style.css +0 -1
- package/lib/table/__stories__/style.scss +0 -34
- package/lib/tabs/__stories__/style.css +0 -1
- package/lib/tabs/__stories__/style.scss +0 -8
|
@@ -1,52 +1,52 @@
|
|
|
1
|
-
$namespace: ab-table;
|
|
2
|
-
|
|
3
|
-
.#{$namespace} {
|
|
4
|
-
overflow-x: auto;
|
|
5
|
-
|
|
6
|
-
table {
|
|
7
|
-
border-spacing: 0;
|
|
8
|
-
width: 100%;
|
|
9
|
-
table-layout: fixed;
|
|
10
|
-
}
|
|
11
|
-
|
|
12
|
-
&-header {
|
|
13
|
-
overflow: hidden;
|
|
14
|
-
|
|
15
|
-
table {
|
|
16
|
-
width: calc(100% - .17rem);
|
|
17
|
-
}
|
|
18
|
-
}
|
|
19
|
-
|
|
20
|
-
&-body {
|
|
21
|
-
overflow: auto scroll;
|
|
22
|
-
}
|
|
23
|
-
|
|
24
|
-
&-checkbox {
|
|
25
|
-
width: .32rem;
|
|
26
|
-
text-align: center;
|
|
27
|
-
}
|
|
28
|
-
|
|
29
|
-
&-title {
|
|
30
|
-
display: flex;
|
|
31
|
-
align-items: center;
|
|
32
|
-
text-align: left;
|
|
33
|
-
|
|
34
|
-
&.#{$namespace}-point {
|
|
35
|
-
cursor: pointer;
|
|
36
|
-
}
|
|
37
|
-
}
|
|
38
|
-
|
|
39
|
-
&-arrow {
|
|
40
|
-
padding: 0 .05rem;
|
|
41
|
-
}
|
|
42
|
-
}
|
|
43
|
-
|
|
44
|
-
@media only screen and (max-width: 767px) {
|
|
45
|
-
.#{$namespace} {
|
|
46
|
-
&-header {
|
|
47
|
-
table {
|
|
48
|
-
width: 100%;
|
|
49
|
-
}
|
|
50
|
-
}
|
|
51
|
-
}
|
|
1
|
+
$namespace: ab-table;
|
|
2
|
+
|
|
3
|
+
.#{$namespace} {
|
|
4
|
+
overflow-x: auto;
|
|
5
|
+
|
|
6
|
+
table {
|
|
7
|
+
border-spacing: 0;
|
|
8
|
+
width: 100%;
|
|
9
|
+
table-layout: fixed;
|
|
10
|
+
}
|
|
11
|
+
|
|
12
|
+
&-header {
|
|
13
|
+
overflow: hidden;
|
|
14
|
+
|
|
15
|
+
table {
|
|
16
|
+
width: calc(100% - .17rem);
|
|
17
|
+
}
|
|
18
|
+
}
|
|
19
|
+
|
|
20
|
+
&-body {
|
|
21
|
+
overflow: auto scroll;
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
&-checkbox {
|
|
25
|
+
width: .32rem;
|
|
26
|
+
text-align: center;
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
&-title {
|
|
30
|
+
display: flex;
|
|
31
|
+
align-items: center;
|
|
32
|
+
text-align: left;
|
|
33
|
+
|
|
34
|
+
&.#{$namespace}-point {
|
|
35
|
+
cursor: pointer;
|
|
36
|
+
}
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
&-arrow {
|
|
40
|
+
padding: 0 .05rem;
|
|
41
|
+
}
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
@media only screen and (max-width: 767px) {
|
|
45
|
+
.#{$namespace} {
|
|
46
|
+
&-header {
|
|
47
|
+
table {
|
|
48
|
+
width: 100%;
|
|
49
|
+
}
|
|
50
|
+
}
|
|
51
|
+
}
|
|
52
52
|
}
|
|
@@ -1,62 +1,62 @@
|
|
|
1
|
-
$namespace: ab-tabs;
|
|
2
|
-
|
|
3
|
-
.#{$namespace} {
|
|
4
|
-
position: relative;
|
|
5
|
-
display: flex;
|
|
6
|
-
|
|
7
|
-
&-item {
|
|
8
|
-
cursor: pointer;
|
|
9
|
-
|
|
10
|
-
&.#{$namespace}-active {
|
|
11
|
-
font-weight: bold;
|
|
12
|
-
}
|
|
13
|
-
|
|
14
|
-
&.#{$namespace}-disabled {
|
|
15
|
-
cursor: not-allowed;
|
|
16
|
-
opacity: 0.7;
|
|
17
|
-
}
|
|
18
|
-
}
|
|
19
|
-
|
|
20
|
-
&-bar {
|
|
21
|
-
position: absolute;
|
|
22
|
-
background-color: #b22222;
|
|
23
|
-
transition: all .25s;
|
|
24
|
-
width: 0;
|
|
25
|
-
height: 0;
|
|
26
|
-
overflow: hidden;
|
|
27
|
-
margin: 0;
|
|
28
|
-
padding: 0;
|
|
29
|
-
}
|
|
30
|
-
|
|
31
|
-
&-top, &-bottom {
|
|
32
|
-
flex-direction: row;
|
|
33
|
-
|
|
34
|
-
> .#{$namespace}-bar {
|
|
35
|
-
left: 0;
|
|
36
|
-
}
|
|
37
|
-
}
|
|
38
|
-
|
|
39
|
-
&-left, &-right {
|
|
40
|
-
flex-direction: column;
|
|
41
|
-
|
|
42
|
-
> .#{$namespace}-bar {
|
|
43
|
-
top: 0;
|
|
44
|
-
}
|
|
45
|
-
}
|
|
46
|
-
|
|
47
|
-
&-top > &-bar {
|
|
48
|
-
bottom: 0;
|
|
49
|
-
}
|
|
50
|
-
|
|
51
|
-
&-bottom > &-bar {
|
|
52
|
-
top: 0;
|
|
53
|
-
}
|
|
54
|
-
|
|
55
|
-
&-left > &-bar {
|
|
56
|
-
right: 0;
|
|
57
|
-
}
|
|
58
|
-
|
|
59
|
-
&-right > &-bar {
|
|
60
|
-
left: 0;
|
|
61
|
-
}
|
|
62
|
-
}
|
|
1
|
+
$namespace: ab-tabs;
|
|
2
|
+
|
|
3
|
+
.#{$namespace} {
|
|
4
|
+
position: relative;
|
|
5
|
+
display: flex;
|
|
6
|
+
|
|
7
|
+
&-item {
|
|
8
|
+
cursor: pointer;
|
|
9
|
+
|
|
10
|
+
&.#{$namespace}-active {
|
|
11
|
+
font-weight: bold;
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
&.#{$namespace}-disabled {
|
|
15
|
+
cursor: not-allowed;
|
|
16
|
+
opacity: 0.7;
|
|
17
|
+
}
|
|
18
|
+
}
|
|
19
|
+
|
|
20
|
+
&-bar {
|
|
21
|
+
position: absolute;
|
|
22
|
+
background-color: #b22222;
|
|
23
|
+
transition: all .25s;
|
|
24
|
+
width: 0;
|
|
25
|
+
height: 0;
|
|
26
|
+
overflow: hidden;
|
|
27
|
+
margin: 0;
|
|
28
|
+
padding: 0;
|
|
29
|
+
}
|
|
30
|
+
|
|
31
|
+
&-top, &-bottom {
|
|
32
|
+
flex-direction: row;
|
|
33
|
+
|
|
34
|
+
> .#{$namespace}-bar {
|
|
35
|
+
left: 0;
|
|
36
|
+
}
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
&-left, &-right {
|
|
40
|
+
flex-direction: column;
|
|
41
|
+
|
|
42
|
+
> .#{$namespace}-bar {
|
|
43
|
+
top: 0;
|
|
44
|
+
}
|
|
45
|
+
}
|
|
46
|
+
|
|
47
|
+
&-top > &-bar {
|
|
48
|
+
bottom: 0;
|
|
49
|
+
}
|
|
50
|
+
|
|
51
|
+
&-bottom > &-bar {
|
|
52
|
+
top: 0;
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
&-left > &-bar {
|
|
56
|
+
right: 0;
|
|
57
|
+
}
|
|
58
|
+
|
|
59
|
+
&-right > &-bar {
|
|
60
|
+
left: 0;
|
|
61
|
+
}
|
|
62
|
+
}
|
|
@@ -1,62 +1,62 @@
|
|
|
1
|
-
$namespace: ab-tooltip;
|
|
2
|
-
|
|
3
|
-
.#{$namespace} {
|
|
4
|
-
&-wrap {
|
|
5
|
-
background-clip: padding-box;
|
|
6
|
-
padding: .08rem .11rem .05rem;
|
|
7
|
-
min-width: 210px;
|
|
8
|
-
border-radius: 4px;
|
|
9
|
-
line-height: 1.4;
|
|
10
|
-
border: 1px solid #906C00;
|
|
11
|
-
box-shadow: 1px 1px 5px -1px #000;
|
|
12
|
-
background-color: #FFFAEC;
|
|
13
|
-
}
|
|
14
|
-
|
|
15
|
-
&-inner {
|
|
16
|
-
position: relative;
|
|
17
|
-
width: 100%;
|
|
18
|
-
overflow: hidden;
|
|
19
|
-
font-size: .12rem;
|
|
20
|
-
|
|
21
|
-
&-expand {
|
|
22
|
-
padding-right: .1rem;
|
|
23
|
-
}
|
|
24
|
-
}
|
|
25
|
-
|
|
26
|
-
&-arrow {
|
|
27
|
-
position: absolute;
|
|
28
|
-
display: block;
|
|
29
|
-
width: 8px;
|
|
30
|
-
height: 8px;
|
|
31
|
-
border-top-color: transparent;
|
|
32
|
-
border-left-color: transparent;
|
|
33
|
-
border-style: solid;
|
|
34
|
-
box-shadow: 3px 3px 7px rgba(0, 0, 0, 0.07);
|
|
35
|
-
background-color: #FFFAEC;
|
|
36
|
-
border-right-color: #906C00;
|
|
37
|
-
border-bottom-color: #906C00;
|
|
38
|
-
border-width: 1px;
|
|
39
|
-
}
|
|
40
|
-
|
|
41
|
-
&-close {
|
|
42
|
-
position: absolute;
|
|
43
|
-
right: .02rem;
|
|
44
|
-
top: .05rem;
|
|
45
|
-
cursor: pointer;
|
|
46
|
-
padding: 0 .05rem;
|
|
47
|
-
color: #bfbfbf;
|
|
48
|
-
font-size: 0.2rem;
|
|
49
|
-
line-height: 1;
|
|
50
|
-
z-index: 2;
|
|
51
|
-
|
|
52
|
-
&:hover {
|
|
53
|
-
color: #4A4A4A;
|
|
54
|
-
}
|
|
55
|
-
}
|
|
56
|
-
}
|
|
57
|
-
|
|
58
|
-
@media only screen and (max-width: 767px) {
|
|
59
|
-
.#{$namespace}-wrap {
|
|
60
|
-
width: calc(100% - .3rem);
|
|
61
|
-
}
|
|
1
|
+
$namespace: ab-tooltip;
|
|
2
|
+
|
|
3
|
+
.#{$namespace} {
|
|
4
|
+
&-wrap {
|
|
5
|
+
background-clip: padding-box;
|
|
6
|
+
padding: .08rem .11rem .05rem;
|
|
7
|
+
min-width: 210px;
|
|
8
|
+
border-radius: 4px;
|
|
9
|
+
line-height: 1.4;
|
|
10
|
+
border: 1px solid #906C00;
|
|
11
|
+
box-shadow: 1px 1px 5px -1px #000;
|
|
12
|
+
background-color: #FFFAEC;
|
|
13
|
+
}
|
|
14
|
+
|
|
15
|
+
&-inner {
|
|
16
|
+
position: relative;
|
|
17
|
+
width: 100%;
|
|
18
|
+
overflow: hidden;
|
|
19
|
+
font-size: .12rem;
|
|
20
|
+
|
|
21
|
+
&-expand {
|
|
22
|
+
padding-right: .1rem;
|
|
23
|
+
}
|
|
24
|
+
}
|
|
25
|
+
|
|
26
|
+
&-arrow {
|
|
27
|
+
position: absolute;
|
|
28
|
+
display: block;
|
|
29
|
+
width: 8px;
|
|
30
|
+
height: 8px;
|
|
31
|
+
border-top-color: transparent;
|
|
32
|
+
border-left-color: transparent;
|
|
33
|
+
border-style: solid;
|
|
34
|
+
box-shadow: 3px 3px 7px rgba(0, 0, 0, 0.07);
|
|
35
|
+
background-color: #FFFAEC;
|
|
36
|
+
border-right-color: #906C00;
|
|
37
|
+
border-bottom-color: #906C00;
|
|
38
|
+
border-width: 1px;
|
|
39
|
+
}
|
|
40
|
+
|
|
41
|
+
&-close {
|
|
42
|
+
position: absolute;
|
|
43
|
+
right: .02rem;
|
|
44
|
+
top: .05rem;
|
|
45
|
+
cursor: pointer;
|
|
46
|
+
padding: 0 .05rem;
|
|
47
|
+
color: #bfbfbf;
|
|
48
|
+
font-size: 0.2rem;
|
|
49
|
+
line-height: 1;
|
|
50
|
+
z-index: 2;
|
|
51
|
+
|
|
52
|
+
&:hover {
|
|
53
|
+
color: #4A4A4A;
|
|
54
|
+
}
|
|
55
|
+
}
|
|
56
|
+
}
|
|
57
|
+
|
|
58
|
+
@media only screen and (max-width: 767px) {
|
|
59
|
+
.#{$namespace}-wrap {
|
|
60
|
+
width: calc(100% - .3rem);
|
|
61
|
+
}
|
|
62
62
|
}
|
|
@@ -1,79 +1,79 @@
|
|
|
1
|
-
$namespace: ab-trigger;
|
|
2
|
-
$popupFade: #{$namespace}-fade;
|
|
3
|
-
|
|
4
|
-
.#{$namespace} {
|
|
5
|
-
&-wrap {
|
|
6
|
-
position: absolute;
|
|
7
|
-
top: 0;
|
|
8
|
-
left: 0;
|
|
9
|
-
z-index: 101;
|
|
10
|
-
}
|
|
11
|
-
|
|
12
|
-
&-wrap.#{$namespace}-hidden {
|
|
13
|
-
display: none;
|
|
14
|
-
}
|
|
15
|
-
|
|
16
|
-
&-mask {
|
|
17
|
-
position: fixed;
|
|
18
|
-
top: 0;
|
|
19
|
-
left: 0;
|
|
20
|
-
bottom: 0;
|
|
21
|
-
right: 0;
|
|
22
|
-
z-index: 101;
|
|
23
|
-
background-color: transparent;
|
|
24
|
-
display: none;
|
|
25
|
-
|
|
26
|
-
&.#{$namespace}-mask-show {
|
|
27
|
-
display: block;
|
|
28
|
-
}
|
|
29
|
-
}
|
|
30
|
-
}
|
|
31
|
-
|
|
32
|
-
.#{$popupFade} {
|
|
33
|
-
&-enter, &-hr-enter, &-appear, &-hr-appear {
|
|
34
|
-
opacity: 0;
|
|
35
|
-
}
|
|
36
|
-
|
|
37
|
-
&-enter, &-appear {
|
|
38
|
-
transform: scale(0.7);
|
|
39
|
-
}
|
|
40
|
-
|
|
41
|
-
&-hr-enter, &-hr-appear {
|
|
42
|
-
opacity: 0;
|
|
43
|
-
transform: scaleY(0.7);
|
|
44
|
-
}
|
|
45
|
-
|
|
46
|
-
&-enter-active, &-hr-enter-active, &-appear-active, &-hr-appear-active {
|
|
47
|
-
opacity: 1;
|
|
48
|
-
transition: opacity 200ms, transform 200ms;
|
|
49
|
-
}
|
|
50
|
-
|
|
51
|
-
&-enter-active, &-appear-active {
|
|
52
|
-
transform: scale(1);
|
|
53
|
-
}
|
|
54
|
-
|
|
55
|
-
&-hr-enter-active, &-hr-appear-active {
|
|
56
|
-
transform: scaleY(1);
|
|
57
|
-
}
|
|
58
|
-
|
|
59
|
-
&-exit, &-hr-exit {
|
|
60
|
-
opacity: 1;
|
|
61
|
-
}
|
|
62
|
-
|
|
63
|
-
&-exit-active, &-hr-exit-active {
|
|
64
|
-
opacity: 0;
|
|
65
|
-
transition: opacity 200ms, transform 200ms;
|
|
66
|
-
}
|
|
67
|
-
|
|
68
|
-
&-exit-active {
|
|
69
|
-
transform: scale(0.7);
|
|
70
|
-
}
|
|
71
|
-
|
|
72
|
-
&-hr-exit-active {
|
|
73
|
-
transform: scaleY(0.7);
|
|
74
|
-
}
|
|
75
|
-
|
|
76
|
-
&-exit-done, &-hr-exit-done {
|
|
77
|
-
display: none;
|
|
78
|
-
}
|
|
79
|
-
}
|
|
1
|
+
$namespace: ab-trigger;
|
|
2
|
+
$popupFade: #{$namespace}-fade;
|
|
3
|
+
|
|
4
|
+
.#{$namespace} {
|
|
5
|
+
&-wrap {
|
|
6
|
+
position: absolute;
|
|
7
|
+
top: 0;
|
|
8
|
+
left: 0;
|
|
9
|
+
z-index: 101;
|
|
10
|
+
}
|
|
11
|
+
|
|
12
|
+
&-wrap.#{$namespace}-hidden {
|
|
13
|
+
display: none;
|
|
14
|
+
}
|
|
15
|
+
|
|
16
|
+
&-mask {
|
|
17
|
+
position: fixed;
|
|
18
|
+
top: 0;
|
|
19
|
+
left: 0;
|
|
20
|
+
bottom: 0;
|
|
21
|
+
right: 0;
|
|
22
|
+
z-index: 101;
|
|
23
|
+
background-color: transparent;
|
|
24
|
+
display: none;
|
|
25
|
+
|
|
26
|
+
&.#{$namespace}-mask-show {
|
|
27
|
+
display: block;
|
|
28
|
+
}
|
|
29
|
+
}
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
.#{$popupFade} {
|
|
33
|
+
&-enter, &-hr-enter, &-appear, &-hr-appear {
|
|
34
|
+
opacity: 0;
|
|
35
|
+
}
|
|
36
|
+
|
|
37
|
+
&-enter, &-appear {
|
|
38
|
+
transform: scale(0.7);
|
|
39
|
+
}
|
|
40
|
+
|
|
41
|
+
&-hr-enter, &-hr-appear {
|
|
42
|
+
opacity: 0;
|
|
43
|
+
transform: scaleY(0.7);
|
|
44
|
+
}
|
|
45
|
+
|
|
46
|
+
&-enter-active, &-hr-enter-active, &-appear-active, &-hr-appear-active {
|
|
47
|
+
opacity: 1;
|
|
48
|
+
transition: opacity 200ms, transform 200ms;
|
|
49
|
+
}
|
|
50
|
+
|
|
51
|
+
&-enter-active, &-appear-active {
|
|
52
|
+
transform: scale(1);
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
&-hr-enter-active, &-hr-appear-active {
|
|
56
|
+
transform: scaleY(1);
|
|
57
|
+
}
|
|
58
|
+
|
|
59
|
+
&-exit, &-hr-exit {
|
|
60
|
+
opacity: 1;
|
|
61
|
+
}
|
|
62
|
+
|
|
63
|
+
&-exit-active, &-hr-exit-active {
|
|
64
|
+
opacity: 0;
|
|
65
|
+
transition: opacity 200ms, transform 200ms;
|
|
66
|
+
}
|
|
67
|
+
|
|
68
|
+
&-exit-active {
|
|
69
|
+
transform: scale(0.7);
|
|
70
|
+
}
|
|
71
|
+
|
|
72
|
+
&-hr-exit-active {
|
|
73
|
+
transform: scaleY(0.7);
|
|
74
|
+
}
|
|
75
|
+
|
|
76
|
+
&-exit-done, &-hr-exit-done {
|
|
77
|
+
display: none;
|
|
78
|
+
}
|
|
79
|
+
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@autobest-ui/components",
|
|
3
|
-
"version": "1.1.
|
|
3
|
+
"version": "1.1.10",
|
|
4
4
|
"private": false,
|
|
5
5
|
"description": "components common ui for React",
|
|
6
6
|
"main": "lib/index.js",
|
|
@@ -46,5 +46,5 @@
|
|
|
46
46
|
"react": ">=16.8.6",
|
|
47
47
|
"react-transition-group": ">=4.2.2"
|
|
48
48
|
},
|
|
49
|
-
"gitHead": "
|
|
49
|
+
"gitHead": "2db2e6482c03e919b6cb24a86187c1410f8240ba"
|
|
50
50
|
}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
.demo-accordion{margin:.5rem auto;width:5rem;display:flex;justify-content:center;flex-direction:column}.accordion-demo-wrap{width:3rem}.accordion-demo-text{height:.3rem}.accordion-demo-title{display:block;padding:.1rem 0;background-color:#b0b0b0;color:#f7f7f7;cursor:pointer}.accordion-demo-a-content>li{padding:.1rem 0;border-top:dotted 1px grey}.accordion-demo-a-content>li:first-child{border:none;cursor:pointer}.accordion-demo-a-content>li>a{color:#333}.accordion-demo-d-content{padding-left:.1rem}.accordion-demo-d-content .ab-collapse{padding-left:.2rem}.accordion-demo-d-title{background-color:grey;display:block;padding:.1rem 0;color:#f7f7f7;cursor:pointer}
|
|
@@ -1,59 +0,0 @@
|
|
|
1
|
-
$namespace: accordion-demo;
|
|
2
|
-
|
|
3
|
-
.demo-accordion {
|
|
4
|
-
margin: .5rem auto;
|
|
5
|
-
width: 5rem;
|
|
6
|
-
display: flex;
|
|
7
|
-
justify-content: center;
|
|
8
|
-
flex-direction: column;
|
|
9
|
-
}
|
|
10
|
-
|
|
11
|
-
.#{$namespace} {
|
|
12
|
-
&-wrap {
|
|
13
|
-
width: 3rem;
|
|
14
|
-
}
|
|
15
|
-
|
|
16
|
-
&-text {
|
|
17
|
-
height: .3rem;
|
|
18
|
-
}
|
|
19
|
-
|
|
20
|
-
&-title {
|
|
21
|
-
display: block;
|
|
22
|
-
padding: .1rem 0;
|
|
23
|
-
background-color: #b0b0b0;
|
|
24
|
-
color: #f7f7f7;
|
|
25
|
-
cursor: pointer;
|
|
26
|
-
}
|
|
27
|
-
|
|
28
|
-
&-a-content {
|
|
29
|
-
> li {
|
|
30
|
-
padding: .1rem 0;
|
|
31
|
-
border-top: dotted 1px #808080;
|
|
32
|
-
|
|
33
|
-
&:first-child {
|
|
34
|
-
border: none;
|
|
35
|
-
cursor: pointer;
|
|
36
|
-
}
|
|
37
|
-
|
|
38
|
-
> a {
|
|
39
|
-
color: #333;
|
|
40
|
-
}
|
|
41
|
-
}
|
|
42
|
-
}
|
|
43
|
-
|
|
44
|
-
&-d-content {
|
|
45
|
-
padding-left: .1rem;
|
|
46
|
-
|
|
47
|
-
.ab-collapse {
|
|
48
|
-
padding-left: .2rem;
|
|
49
|
-
}
|
|
50
|
-
}
|
|
51
|
-
|
|
52
|
-
&-d-title {
|
|
53
|
-
background-color: #808080;
|
|
54
|
-
display: block;
|
|
55
|
-
padding: .1rem 0;
|
|
56
|
-
color: #f7f7f7;
|
|
57
|
-
cursor: pointer;
|
|
58
|
-
}
|
|
59
|
-
}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
.affix-demo{height:200vh;overflow:auto;width:1000px;max-width:100%;margin:auto}.affix-demo .affix-wrap{height:500px;width:100%;background-color:#d1d5db}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
.demo-carousel{margin:auto;position:relative}.demo-carousel p{display:flex;align-items:center;justify-content:center;font-size:32px;margin:0;color:#f3f4f6;height:225px;border-radius:3px}.ab-carousel{position:relative}.button-next,.button-prev{position:absolute;box-sizing:border-box;cursor:pointer;font-size:32px;top:50%;margin-top:-15px;width:30px;height:30px;color:#f3f4f6}.button-prev{left:5px;top:50%}.button-next{right:5px;top:50%}
|
|
@@ -1,41 +0,0 @@
|
|
|
1
|
-
.demo-carousel {
|
|
2
|
-
margin: auto;
|
|
3
|
-
position: relative;
|
|
4
|
-
|
|
5
|
-
p {
|
|
6
|
-
display: flex;
|
|
7
|
-
align-items: center;
|
|
8
|
-
justify-content: center;
|
|
9
|
-
font-size: 32px;
|
|
10
|
-
margin: 0;
|
|
11
|
-
color: #F3F4F6;
|
|
12
|
-
height: 225px;
|
|
13
|
-
border-radius: 3px;
|
|
14
|
-
}
|
|
15
|
-
}
|
|
16
|
-
|
|
17
|
-
.ab-carousel {
|
|
18
|
-
position: relative;
|
|
19
|
-
}
|
|
20
|
-
|
|
21
|
-
.button-prev, .button-next {
|
|
22
|
-
position: absolute;
|
|
23
|
-
box-sizing: border-box;
|
|
24
|
-
cursor: pointer;
|
|
25
|
-
font-size: 32px;
|
|
26
|
-
top: 50%;
|
|
27
|
-
margin-top: -15px;
|
|
28
|
-
width: 30px;
|
|
29
|
-
height: 30px;
|
|
30
|
-
color: #F3F4F6;
|
|
31
|
-
}
|
|
32
|
-
|
|
33
|
-
.button-prev {
|
|
34
|
-
left: 5px;
|
|
35
|
-
top: 50%;
|
|
36
|
-
}
|
|
37
|
-
|
|
38
|
-
.button-next {
|
|
39
|
-
right: 5px;
|
|
40
|
-
top: 50%;
|
|
41
|
-
}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
.demo-collapse{min-height:200px;padding:.2rem}.title-wrap{width:1rem;height:.4rem;background-color:#3b82f6;color:#f3f4f6}.title-wrap>strong{display:block;width:1rem;height:.2rem;background-color:#10b981;cursor:pointer}
|
|
@@ -1,19 +0,0 @@
|
|
|
1
|
-
.demo-collapse{
|
|
2
|
-
min-height: 200px;
|
|
3
|
-
padding: 0.2rem;
|
|
4
|
-
}
|
|
5
|
-
|
|
6
|
-
.title-wrap {
|
|
7
|
-
width: 1rem;
|
|
8
|
-
height: .4rem;
|
|
9
|
-
background-color: #3B82F6;
|
|
10
|
-
color: #F3F4F6;
|
|
11
|
-
|
|
12
|
-
> strong {
|
|
13
|
-
display: block;
|
|
14
|
-
width: 1rem;
|
|
15
|
-
height: .2rem;
|
|
16
|
-
background-color: #10B981;
|
|
17
|
-
cursor: pointer;
|
|
18
|
-
}
|
|
19
|
-
}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
.guide-demo .input{width:3rem}.guide-demo .btn{display:block;margin-top:.2rem;width:.8rem;height:.3rem;font-size:.16rem;text-align:center}
|