@nutui/nutui 3.1.12-beta.0 → 3.1.13
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/CHANGELOG.md +54 -0
- package/README.md +139 -37
- package/dist/nutui.d.ts +12 -2
- package/dist/nutui.es.js +6704 -5011
- package/dist/nutui.umd.js +6720 -5017
- package/dist/packages/_es/ActionSheet.js +1 -1
- package/dist/packages/_es/Address.js +18 -17
- package/dist/packages/_es/Avatar.js +1 -1
- package/dist/packages/_es/BackTop.js +1 -1
- package/dist/packages/_es/Badge.js +1 -1
- package/dist/packages/_es/Barrage.js +1 -1
- package/dist/packages/_es/Button.js +1 -1
- package/dist/packages/_es/Calendar.js +1 -1
- package/dist/packages/_es/Card.js +105 -0
- package/dist/packages/_es/Cascader.js +547 -0
- package/dist/packages/_es/Cell.js +1 -1
- package/dist/packages/_es/CellGroup.js +10 -4
- package/dist/packages/_es/Checkbox.js +1 -1
- package/dist/packages/_es/CheckboxGroup.js +2 -2
- package/dist/packages/_es/CircleProgress.js +1 -1
- package/dist/packages/_es/Col.js +1 -1
- package/dist/packages/_es/Collapse.js +1 -1
- package/dist/packages/_es/CollapseItem.js +1 -1
- package/dist/packages/_es/CountDown.js +3 -4
- package/dist/packages/_es/CountUp.js +3 -1
- package/dist/packages/_es/DatePicker.js +2 -2
- package/dist/packages/_es/Dialog.js +10 -23
- package/dist/packages/_es/Divider.js +1 -1
- package/dist/packages/_es/Drag.js +1 -1
- package/dist/packages/_es/Elevator.js +3 -2
- package/dist/packages/_es/Empty.js +74 -0
- package/dist/packages/_es/FixedNav.js +1 -1
- package/dist/packages/_es/Form.js +151 -0
- package/dist/packages/_es/FormItem.js +110 -0
- package/dist/packages/_es/Grid.js +12 -0
- package/dist/packages/_es/GridItem.js +149 -0
- package/dist/packages/_es/Icon.js +1 -1
- package/dist/packages/_es/ImagePreview.js +148 -32
- package/dist/packages/_es/Indicator.js +66 -0
- package/dist/packages/_es/InfiniteLoading.js +1 -1
- package/dist/packages/_es/Input.js +1 -1
- package/dist/packages/_es/InputNumber.js +1 -1
- package/dist/packages/_es/Layout.js +1 -1
- package/dist/packages/_es/Menu.js +2 -2
- package/dist/packages/_es/MenuItem.js +1 -1
- package/dist/packages/_es/Navbar.js +1 -1
- package/dist/packages/_es/NoticeBar.js +6 -8
- package/dist/packages/_es/Notify.js +1 -1
- package/dist/packages/_es/NumberKeyboard.js +9 -7
- package/dist/packages/_es/OverLay.js +1 -1
- package/dist/packages/_es/Pagination.js +1 -1
- package/dist/packages/_es/Picker.js +2 -2
- package/dist/packages/_es/Popover.js +11 -17
- package/dist/packages/_es/Popup.js +1 -1
- package/dist/packages/_es/Price.js +1 -1
- package/dist/packages/_es/Progress.js +1 -1
- package/dist/packages/_es/Radio.js +1 -1
- package/dist/packages/_es/RadioGroup.js +1 -1
- package/dist/packages/_es/Range.js +3 -3
- package/dist/packages/_es/Rate.js +19 -5
- package/dist/packages/_es/Row.js +1 -1
- package/dist/packages/_es/SearchBar.js +1 -1
- package/dist/packages/_es/ShortPassword.js +1 -1
- package/dist/packages/_es/Signature.js +1 -1
- package/dist/packages/_es/Skeleton.js +138 -0
- package/dist/packages/_es/Sku.js +2 -37
- package/dist/packages/_es/Step.js +1 -1
- package/dist/packages/_es/Steps.js +1 -1
- package/dist/packages/_es/Swipe.js +2 -2
- package/dist/packages/_es/Swiper.js +11 -11
- package/dist/packages/_es/SwiperItem.js +3 -3
- package/dist/packages/_es/Switch.js +43 -13
- package/dist/packages/_es/TabPane.js +1 -1
- package/dist/packages/_es/Tabbar.js +1 -1
- package/dist/packages/_es/TabbarItem.js +1 -1
- package/dist/packages/_es/Table.js +191 -0
- package/dist/packages/_es/Tabs.js +6 -2
- package/dist/packages/_es/Tag.js +1 -1
- package/dist/packages/_es/TextArea.js +1 -1
- package/dist/packages/_es/TimeDetail.js +1 -1
- package/dist/packages/_es/TimePannel.js +1 -1
- package/dist/packages/_es/TimeSelect.js +1 -1
- package/dist/packages/_es/Toast.js +18 -8
- package/dist/packages/_es/Uploader.js +1 -1
- package/dist/packages/_es/Video.js +3 -3
- package/dist/packages/_es/common.js +136 -0
- package/dist/packages/_es/component.js +1 -1
- package/dist/packages/_es/index.js +7 -58
- package/dist/packages/_es/index2.js +56 -28
- package/dist/packages/_es/index3.js +31 -8
- package/dist/packages/_es/plugin-vue_export-helper.js +1 -1
- package/dist/packages/_es/pxCheck.js +1 -1
- package/dist/packages/_es/raf.js +1 -1
- package/dist/packages/_es/util.js +47 -0
- package/dist/packages/button/index.scss +6 -0
- package/dist/packages/card/index.scss +97 -0
- package/dist/packages/cascader/index.scss +81 -0
- package/dist/packages/cellgroup/index.scss +9 -0
- package/dist/packages/checkbox/index.scss +1 -1
- package/dist/packages/dialog/index.scss +17 -0
- package/dist/packages/drag/index.scss +4 -0
- package/dist/packages/empty/index.scss +33 -0
- package/dist/packages/fixednav/index.scss +6 -1
- package/dist/packages/form/index.scss +2 -0
- package/dist/packages/formitem/index.scss +63 -0
- package/dist/packages/grid/index.scss +10 -0
- package/dist/packages/griditem/index.scss +92 -0
- package/dist/packages/icon/index.scss +2 -1
- package/dist/packages/indicator/index.scss +48 -0
- package/dist/packages/numberkeyboard/index.scss +1 -1
- package/dist/packages/popover/index.scss +2 -2
- package/dist/packages/rate/index.scss +1 -0
- package/dist/packages/skeleton/index.scss +57 -0
- package/dist/packages/switch/index.scss +1 -1
- package/dist/packages/table/index.scss +81 -0
- package/dist/packages/tabs/index.scss +16 -0
- package/dist/packages/textarea/index.scss +1 -0
- package/dist/packages/timedetail/index.scss +1 -2
- package/dist/packages/timeselect/index.scss +3 -0
- package/dist/packages/toast/index.scss +6 -0
- package/dist/style.css +1 -1
- package/dist/styles/.DS_Store +0 -0
- package/dist/styles/font/config.json +2 -1
- package/dist/styles/font/demo_index.html +26 -3
- package/dist/styles/font/iconfont.css +7 -3
- package/dist/styles/font/iconfont.js +31 -32
- package/dist/styles/font/iconfont.json +7 -0
- package/dist/styles/font/iconfont.ttf +0 -0
- package/dist/styles/font/iconfont.woff +0 -0
- package/dist/styles/font/iconfont.woff2 +0 -0
- package/dist/styles/themes/default.scss +44 -34
- package/dist/styles/variables.scss +64 -1
- package/package.json +3 -4
|
@@ -1,13 +1,36 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* @nutui/nutui v3.1.
|
|
2
|
+
* @nutui/nutui v3.1.13 Wed Dec 22 2021 20:42:09 GMT+0800 (GMT+08:00)
|
|
3
3
|
* (c) 2021 @jdf2e.
|
|
4
4
|
* Released under the MIT License.
|
|
5
5
|
*/
|
|
6
|
-
import {
|
|
7
|
-
function
|
|
8
|
-
|
|
9
|
-
if (instance) {
|
|
10
|
-
Object.assign(instance.proxy, apis);
|
|
11
|
-
}
|
|
6
|
+
import { unref } from "vue";
|
|
7
|
+
function isWindow(val) {
|
|
8
|
+
return val === window;
|
|
12
9
|
}
|
|
13
|
-
|
|
10
|
+
const useRect = (elementRef) => {
|
|
11
|
+
const element = unref(elementRef);
|
|
12
|
+
if (isWindow(element)) {
|
|
13
|
+
const width = element.innerWidth;
|
|
14
|
+
const height = element.innerHeight;
|
|
15
|
+
return {
|
|
16
|
+
top: 0,
|
|
17
|
+
left: 0,
|
|
18
|
+
right: width,
|
|
19
|
+
bottom: height,
|
|
20
|
+
width,
|
|
21
|
+
height
|
|
22
|
+
};
|
|
23
|
+
}
|
|
24
|
+
if (element && element.getBoundingClientRect) {
|
|
25
|
+
return element.getBoundingClientRect();
|
|
26
|
+
}
|
|
27
|
+
return {
|
|
28
|
+
top: 0,
|
|
29
|
+
left: 0,
|
|
30
|
+
right: 0,
|
|
31
|
+
bottom: 0,
|
|
32
|
+
width: 0,
|
|
33
|
+
height: 0
|
|
34
|
+
};
|
|
35
|
+
};
|
|
36
|
+
export { useRect as u };
|
package/dist/packages/_es/raf.js
CHANGED
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
/*!
|
|
2
|
+
* @nutui/nutui v3.1.13 Wed Dec 22 2021 20:42:09 GMT+0800 (GMT+08:00)
|
|
3
|
+
* (c) 2021 @jdf2e.
|
|
4
|
+
* Released under the MIT License.
|
|
5
|
+
*/
|
|
6
|
+
const TypeOfFun = (value) => {
|
|
7
|
+
if (value === null) {
|
|
8
|
+
return "null";
|
|
9
|
+
}
|
|
10
|
+
const type = typeof value;
|
|
11
|
+
if (type === "undefined" || type === "string") {
|
|
12
|
+
return type;
|
|
13
|
+
}
|
|
14
|
+
const typeString = toString.call(value);
|
|
15
|
+
switch (typeString) {
|
|
16
|
+
case "[object Array]":
|
|
17
|
+
return "array";
|
|
18
|
+
case "[object Date]":
|
|
19
|
+
return "date";
|
|
20
|
+
case "[object Boolean]":
|
|
21
|
+
return "boolean";
|
|
22
|
+
case "[object Number]":
|
|
23
|
+
return "number";
|
|
24
|
+
case "[object Function]":
|
|
25
|
+
return "function";
|
|
26
|
+
case "[object RegExp]":
|
|
27
|
+
return "regexp";
|
|
28
|
+
case "[object Object]":
|
|
29
|
+
if (value.nodeType !== void 0) {
|
|
30
|
+
if (value.nodeType == 3) {
|
|
31
|
+
return /\S/.test(value.nodeValue) ? "textnode" : "whitespace";
|
|
32
|
+
} else {
|
|
33
|
+
return "element";
|
|
34
|
+
}
|
|
35
|
+
} else {
|
|
36
|
+
return "object";
|
|
37
|
+
}
|
|
38
|
+
default:
|
|
39
|
+
return "unknow";
|
|
40
|
+
}
|
|
41
|
+
};
|
|
42
|
+
const isFunction = (val) => typeof val === "function";
|
|
43
|
+
const isObject = (val) => val !== null && typeof val === "object";
|
|
44
|
+
const isPromise = (val) => {
|
|
45
|
+
return isObject(val) && isFunction(val.then) && isFunction(val.catch);
|
|
46
|
+
};
|
|
47
|
+
export { TypeOfFun as T, isPromise as i };
|
|
@@ -0,0 +1,97 @@
|
|
|
1
|
+
.nut-card {
|
|
2
|
+
width: 100%;
|
|
3
|
+
display: flex;
|
|
4
|
+
|
|
5
|
+
.nut-card__left {
|
|
6
|
+
width: 120px;
|
|
7
|
+
height: 120px;
|
|
8
|
+
flex-shrink: 0;
|
|
9
|
+
|
|
10
|
+
> img {
|
|
11
|
+
display: block;
|
|
12
|
+
width: 100%;
|
|
13
|
+
height: 100%;
|
|
14
|
+
}
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
.nut-card__right {
|
|
18
|
+
flex: 1;
|
|
19
|
+
padding: 0 10px 8px;
|
|
20
|
+
|
|
21
|
+
.nut-card__right__title {
|
|
22
|
+
display: -webkit-box;
|
|
23
|
+
-webkit-box-orient: vertical;
|
|
24
|
+
-webkit-line-clamp: 2;
|
|
25
|
+
overflow: hidden;
|
|
26
|
+
word-break: break-all;
|
|
27
|
+
line-height: 1.5;
|
|
28
|
+
font-size: 14px;
|
|
29
|
+
}
|
|
30
|
+
|
|
31
|
+
.nut-card__right__price {
|
|
32
|
+
display: flex;
|
|
33
|
+
align-items: center;
|
|
34
|
+
height: 18px;
|
|
35
|
+
line-height: 18px;
|
|
36
|
+
margin-top: 9px;
|
|
37
|
+
|
|
38
|
+
.nut-price {
|
|
39
|
+
.nut-price--symbol-large {
|
|
40
|
+
font-size: 12px;
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
.nut-price--large {
|
|
44
|
+
font-size: 18px;
|
|
45
|
+
}
|
|
46
|
+
|
|
47
|
+
.nut-price--decimal-large {
|
|
48
|
+
font-size: 12px;
|
|
49
|
+
}
|
|
50
|
+
}
|
|
51
|
+
|
|
52
|
+
.nut-card__right__price__origin {
|
|
53
|
+
&.nut-price {
|
|
54
|
+
margin-left: 2px;
|
|
55
|
+
color: #d2a448;
|
|
56
|
+
|
|
57
|
+
.nut-price--symbol-large {
|
|
58
|
+
font-size: 12px;
|
|
59
|
+
}
|
|
60
|
+
|
|
61
|
+
.nut-price--large {
|
|
62
|
+
font-size: 12px;
|
|
63
|
+
}
|
|
64
|
+
|
|
65
|
+
.nut-price--decimal-large {
|
|
66
|
+
font-size: 12px;
|
|
67
|
+
}
|
|
68
|
+
}
|
|
69
|
+
}
|
|
70
|
+
}
|
|
71
|
+
|
|
72
|
+
.nut-card__right__other {
|
|
73
|
+
display: flex;
|
|
74
|
+
align-items: center;
|
|
75
|
+
padding: 5px 0 2px;
|
|
76
|
+
.nut-tag {
|
|
77
|
+
border: none;
|
|
78
|
+
padding: 0 2px;
|
|
79
|
+
margin-right: 5px;
|
|
80
|
+
font-size: $card-font-size-0;
|
|
81
|
+
}
|
|
82
|
+
}
|
|
83
|
+
|
|
84
|
+
.nut-card__right__shop {
|
|
85
|
+
display: flex;
|
|
86
|
+
justify-content: space-between;
|
|
87
|
+
align-items: center;
|
|
88
|
+
|
|
89
|
+
.nut-card__right__shop__name {
|
|
90
|
+
line-height: 1.5;
|
|
91
|
+
color: #999;
|
|
92
|
+
font-size: 12px;
|
|
93
|
+
padding-top: 4px;
|
|
94
|
+
}
|
|
95
|
+
}
|
|
96
|
+
}
|
|
97
|
+
}
|
|
@@ -0,0 +1,81 @@
|
|
|
1
|
+
.nut-cascader {
|
|
2
|
+
width: 100%;
|
|
3
|
+
font-size: $nut-cascader-font-size;
|
|
4
|
+
line-height: $nut-cascader-line-height;
|
|
5
|
+
|
|
6
|
+
.nut-tabpane {
|
|
7
|
+
padding: 0;
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
.nut-tabs__titles-item {
|
|
11
|
+
flex: initial;
|
|
12
|
+
min-width: auto;
|
|
13
|
+
padding: $nut-cascader-tabs-item-padding;
|
|
14
|
+
white-space: nowrap;
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
.nut-tabs__titles {
|
|
18
|
+
padding: $nut-cascader-tabs-item-padding;
|
|
19
|
+
background: #fff;
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
&__bar {
|
|
23
|
+
display: flex;
|
|
24
|
+
justify-content: center;
|
|
25
|
+
align-items: center;
|
|
26
|
+
padding: $nut-cascader-bar-padding;
|
|
27
|
+
text-align: center;
|
|
28
|
+
font-weight: bold;
|
|
29
|
+
line-height: $nut-cascader-bar-line-height;
|
|
30
|
+
color: $nut-cascader-bar-color;
|
|
31
|
+
font-size: $nut-cascader-bar-font-size;
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
&-pane {
|
|
35
|
+
display: block;
|
|
36
|
+
padding: 0;
|
|
37
|
+
margin: 0;
|
|
38
|
+
width: 100%;
|
|
39
|
+
padding-top: 10px;
|
|
40
|
+
height: 342px;
|
|
41
|
+
overflow-y: auto;
|
|
42
|
+
-webkit-overflow-scrolling: touch;
|
|
43
|
+
}
|
|
44
|
+
|
|
45
|
+
&-item {
|
|
46
|
+
display: flex;
|
|
47
|
+
align-items: center;
|
|
48
|
+
padding: $nut-cascader-item-padding;
|
|
49
|
+
margin: 0;
|
|
50
|
+
cursor: pointer;
|
|
51
|
+
font-size: $nut-cascader-item-font-size;
|
|
52
|
+
color: $nut-cascader-item-color;
|
|
53
|
+
|
|
54
|
+
&__title {
|
|
55
|
+
flex: 1;
|
|
56
|
+
}
|
|
57
|
+
|
|
58
|
+
&__icon-check {
|
|
59
|
+
margin-left: 10px;
|
|
60
|
+
visibility: hidden;
|
|
61
|
+
}
|
|
62
|
+
|
|
63
|
+
&__icon-loading {
|
|
64
|
+
margin-left: 10px;
|
|
65
|
+
}
|
|
66
|
+
|
|
67
|
+
&.active:not(.disabled) {
|
|
68
|
+
color: $nut-cascader-item-active-color;
|
|
69
|
+
}
|
|
70
|
+
|
|
71
|
+
&.active &__icon-check {
|
|
72
|
+
visibility: visible;
|
|
73
|
+
color: $nut-cascader-item-active-color;
|
|
74
|
+
}
|
|
75
|
+
|
|
76
|
+
&.disabled {
|
|
77
|
+
opacity: 0.6;
|
|
78
|
+
cursor: not-allowed;
|
|
79
|
+
}
|
|
80
|
+
}
|
|
81
|
+
}
|
|
@@ -9,6 +9,15 @@
|
|
|
9
9
|
margin-top: 30px;
|
|
10
10
|
margin-bottom: 10px;
|
|
11
11
|
}
|
|
12
|
+
&__desc {
|
|
13
|
+
display: inherit;
|
|
14
|
+
padding: $cell-group-desc-padding;
|
|
15
|
+
color: $cell-group-desc-color;
|
|
16
|
+
font-size: $cell-group-desc-font-size;
|
|
17
|
+
line-height: $cell-group-desc-line-height;
|
|
18
|
+
margin-top: 10px;
|
|
19
|
+
margin-bottom: 10px;
|
|
20
|
+
}
|
|
12
21
|
&__warp {
|
|
13
22
|
display: inherit;
|
|
14
23
|
border-radius: $cell-border-radius;
|
|
@@ -34,6 +34,23 @@
|
|
|
34
34
|
width: 100%;
|
|
35
35
|
justify-content: space-around;
|
|
36
36
|
|
|
37
|
+
&.horizontal {
|
|
38
|
+
}
|
|
39
|
+
&.vertical {
|
|
40
|
+
flex-direction: column;
|
|
41
|
+
|
|
42
|
+
.nut-button {
|
|
43
|
+
min-width: 100%;
|
|
44
|
+
margin: 0;
|
|
45
|
+
&.nut-dialog__footer-cancel {
|
|
46
|
+
border: 0;
|
|
47
|
+
}
|
|
48
|
+
&.nut-dialog__footer-ok {
|
|
49
|
+
margin-top: 10px;
|
|
50
|
+
}
|
|
51
|
+
}
|
|
52
|
+
}
|
|
53
|
+
|
|
37
54
|
.nut-button {
|
|
38
55
|
min-width: 100px;
|
|
39
56
|
}
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
.nut-empty {
|
|
2
|
+
box-sizing: border-box;
|
|
3
|
+
display: flex;
|
|
4
|
+
align-items: center;
|
|
5
|
+
flex-direction: column;
|
|
6
|
+
justify-content: center;
|
|
7
|
+
padding: $empty-padding;
|
|
8
|
+
|
|
9
|
+
&-image {
|
|
10
|
+
width: $empty-image-size;
|
|
11
|
+
height: $empty-image-size;
|
|
12
|
+
|
|
13
|
+
.img {
|
|
14
|
+
width: 100%;
|
|
15
|
+
height: 100%;
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
// 兼容小程序标签和img-slot
|
|
19
|
+
img,
|
|
20
|
+
image {
|
|
21
|
+
width: 100%;
|
|
22
|
+
height: 100%;
|
|
23
|
+
}
|
|
24
|
+
}
|
|
25
|
+
|
|
26
|
+
&-description {
|
|
27
|
+
margin-top: $empty-description-margin-top;
|
|
28
|
+
padding: $empty-description-padding;
|
|
29
|
+
color: $empty-description-color;
|
|
30
|
+
font-size: $empty-description-font-size;
|
|
31
|
+
line-height: $empty-description-line-height;
|
|
32
|
+
}
|
|
33
|
+
}
|
|
@@ -55,7 +55,9 @@
|
|
|
55
55
|
right: 0;
|
|
56
56
|
transform: translateX(100%);
|
|
57
57
|
transition: all 0.5s;
|
|
58
|
-
|
|
58
|
+
box-sizing: border-box;
|
|
59
|
+
padding: 0;
|
|
60
|
+
margin: 0;
|
|
59
61
|
z-index: $fixednav-index;
|
|
60
62
|
flex-shrink: 0;
|
|
61
63
|
height: 100%;
|
|
@@ -69,6 +71,9 @@
|
|
|
69
71
|
right: 80px;
|
|
70
72
|
}
|
|
71
73
|
&-item {
|
|
74
|
+
box-sizing: border-box;
|
|
75
|
+
padding: 0;
|
|
76
|
+
margin: 0;
|
|
72
77
|
position: relative;
|
|
73
78
|
flex: 1;
|
|
74
79
|
height: 100%;
|
|
@@ -0,0 +1,63 @@
|
|
|
1
|
+
.nut-form-item {
|
|
2
|
+
display: flex;
|
|
3
|
+
&::before {
|
|
4
|
+
position: absolute;
|
|
5
|
+
box-sizing: border-box;
|
|
6
|
+
content: ' ';
|
|
7
|
+
pointer-events: none;
|
|
8
|
+
right: 16px;
|
|
9
|
+
bottom: 0;
|
|
10
|
+
left: 16px;
|
|
11
|
+
transform: scaleX(0);
|
|
12
|
+
}
|
|
13
|
+
&.error {
|
|
14
|
+
&.line {
|
|
15
|
+
&::before {
|
|
16
|
+
border-bottom: 1px solid $form-item-error-line-color;
|
|
17
|
+
transform: scaleX(1);
|
|
18
|
+
transition: transform 200ms cubic-bezier(0, 0, 0.2, 1) 0ms;
|
|
19
|
+
}
|
|
20
|
+
}
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
&__label {
|
|
24
|
+
font-size: 14px;
|
|
25
|
+
font-weight: normal;
|
|
26
|
+
width: 90px;
|
|
27
|
+
margin-right: 10px;
|
|
28
|
+
flex: none !important;
|
|
29
|
+
display: inline-block;
|
|
30
|
+
word-wrap: break-word;
|
|
31
|
+
&.required {
|
|
32
|
+
&::before {
|
|
33
|
+
content: '*';
|
|
34
|
+
color: $form-item-required-color;
|
|
35
|
+
margin-right: 4px;
|
|
36
|
+
}
|
|
37
|
+
}
|
|
38
|
+
}
|
|
39
|
+
&__body {
|
|
40
|
+
flex: 1;
|
|
41
|
+
display: flex;
|
|
42
|
+
flex-direction: column;
|
|
43
|
+
&__slots {
|
|
44
|
+
.nut-input-text {
|
|
45
|
+
font-size: 14px;
|
|
46
|
+
width: 100%;
|
|
47
|
+
outline: 0 none;
|
|
48
|
+
border: 0;
|
|
49
|
+
text-decoration: none;
|
|
50
|
+
}
|
|
51
|
+
.nut-range-container {
|
|
52
|
+
min-height: 24px;
|
|
53
|
+
}
|
|
54
|
+
.nut-textarea {
|
|
55
|
+
padding: 0 !important;
|
|
56
|
+
}
|
|
57
|
+
}
|
|
58
|
+
&__tips {
|
|
59
|
+
font-size: 10px;
|
|
60
|
+
color: $form-item-error-message-color;
|
|
61
|
+
}
|
|
62
|
+
}
|
|
63
|
+
}
|
|
@@ -0,0 +1,92 @@
|
|
|
1
|
+
.nut-grid-item {
|
|
2
|
+
position: relative;
|
|
3
|
+
box-sizing: border-box;
|
|
4
|
+
|
|
5
|
+
$block: &;
|
|
6
|
+
|
|
7
|
+
&__text {
|
|
8
|
+
color: $grid-item-text-color;
|
|
9
|
+
font-size: $grid-item-text-font-size;
|
|
10
|
+
line-height: 1.5;
|
|
11
|
+
word-break: break-all;
|
|
12
|
+
margin: $grid-item-text-margin 0 0 0;
|
|
13
|
+
}
|
|
14
|
+
|
|
15
|
+
&__content {
|
|
16
|
+
display: flex;
|
|
17
|
+
flex-direction: column;
|
|
18
|
+
box-sizing: border-box;
|
|
19
|
+
height: 100%;
|
|
20
|
+
padding: $grid-item-content-padding;
|
|
21
|
+
background: $grid-item-content-bg-color;
|
|
22
|
+
border: 0 solid $grid-border-color;
|
|
23
|
+
|
|
24
|
+
&--border {
|
|
25
|
+
border-right-width: 1px;
|
|
26
|
+
border-bottom-width: 1px;
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
&--surround {
|
|
30
|
+
border-top-width: 1px;
|
|
31
|
+
border-left-width: 1px;
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
&--center {
|
|
35
|
+
align-items: center;
|
|
36
|
+
justify-content: center;
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
&--square {
|
|
40
|
+
position: absolute;
|
|
41
|
+
top: 0;
|
|
42
|
+
right: 0;
|
|
43
|
+
left: 0;
|
|
44
|
+
}
|
|
45
|
+
|
|
46
|
+
&--reverse {
|
|
47
|
+
flex-direction: column-reverse;
|
|
48
|
+
|
|
49
|
+
#{$block}__text {
|
|
50
|
+
margin: 0 0 $grid-item-text-margin;
|
|
51
|
+
}
|
|
52
|
+
}
|
|
53
|
+
|
|
54
|
+
&--horizontal {
|
|
55
|
+
flex-direction: row;
|
|
56
|
+
|
|
57
|
+
#{$block}__text {
|
|
58
|
+
margin: 0 0 0 $grid-item-text-margin;
|
|
59
|
+
}
|
|
60
|
+
}
|
|
61
|
+
|
|
62
|
+
&--horizontal#{&}--reverse {
|
|
63
|
+
flex-direction: row-reverse;
|
|
64
|
+
#{$block}__text {
|
|
65
|
+
margin: 0 $grid-item-text-margin 0 0;
|
|
66
|
+
}
|
|
67
|
+
}
|
|
68
|
+
|
|
69
|
+
&--clickable {
|
|
70
|
+
cursor: pointer;
|
|
71
|
+
|
|
72
|
+
&::before {
|
|
73
|
+
position: absolute;
|
|
74
|
+
top: 50%;
|
|
75
|
+
left: 50%;
|
|
76
|
+
width: 100%;
|
|
77
|
+
height: 100%;
|
|
78
|
+
background-color: $black;
|
|
79
|
+
border: inherit;
|
|
80
|
+
border-color: $black;
|
|
81
|
+
border-radius: inherit;
|
|
82
|
+
transform: translate(-50%, -50%);
|
|
83
|
+
opacity: 0;
|
|
84
|
+
content: ' ';
|
|
85
|
+
}
|
|
86
|
+
|
|
87
|
+
&:active::before {
|
|
88
|
+
opacity: 0.1;
|
|
89
|
+
}
|
|
90
|
+
}
|
|
91
|
+
}
|
|
92
|
+
}
|
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
.nut-indicator {
|
|
2
|
+
&--block {
|
|
3
|
+
display: block;
|
|
4
|
+
width: 100%;
|
|
5
|
+
}
|
|
6
|
+
&--align__left {
|
|
7
|
+
text-align: left;
|
|
8
|
+
}
|
|
9
|
+
&--align__right {
|
|
10
|
+
text-align: right;
|
|
11
|
+
}
|
|
12
|
+
&--align__center {
|
|
13
|
+
text-align: center;
|
|
14
|
+
}
|
|
15
|
+
&--dot,
|
|
16
|
+
&--number {
|
|
17
|
+
margin: 0 4px;
|
|
18
|
+
&:first-child {
|
|
19
|
+
margin-left: 0;
|
|
20
|
+
}
|
|
21
|
+
&:last-child {
|
|
22
|
+
margin-right: 0;
|
|
23
|
+
}
|
|
24
|
+
}
|
|
25
|
+
&--dot {
|
|
26
|
+
display: inline-block;
|
|
27
|
+
vertical-align: middle;
|
|
28
|
+
width: $indicator-dot-size;
|
|
29
|
+
height: $indicator-dot-size;
|
|
30
|
+
border-radius: 50%;
|
|
31
|
+
background-color: $indicator-dot-color;
|
|
32
|
+
}
|
|
33
|
+
&--number {
|
|
34
|
+
display: inline-block;
|
|
35
|
+
position: relative;
|
|
36
|
+
width: $indicator-size;
|
|
37
|
+
height: $indicator-size;
|
|
38
|
+
text-align: center;
|
|
39
|
+
font-size: 10px;
|
|
40
|
+
line-height: $indicator-size;
|
|
41
|
+
color: $indicator-white;
|
|
42
|
+
vertical-align: middle;
|
|
43
|
+
border: 1px solid $indicator-white;
|
|
44
|
+
border-radius: 50%;
|
|
45
|
+
background-color: $indicator-color;
|
|
46
|
+
box-shadow: 0 0 1px 1px $indicator-color;
|
|
47
|
+
}
|
|
48
|
+
}
|
|
@@ -4,13 +4,13 @@
|
|
|
4
4
|
display: inline-block;
|
|
5
5
|
margin-right: 20px;
|
|
6
6
|
.more-background {
|
|
7
|
-
background: $popover-white-background-color;
|
|
8
7
|
opacity: 0;
|
|
9
8
|
position: fixed;
|
|
10
9
|
width: 100%;
|
|
11
|
-
height:
|
|
10
|
+
height: 100%;
|
|
12
11
|
z-index: 10;
|
|
13
12
|
left: 0;
|
|
13
|
+
top: 0;
|
|
14
14
|
}
|
|
15
15
|
.popoverContent--left,
|
|
16
16
|
.popoverContent--right,
|