n20-common-lib 3.1.9 → 3.1.11
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/package.json +1 -1
- package/src/assets/css/element-variables.scss +2 -2
- package/src/assets/css/expandable-pane.scss +12 -9
- package/src/assets/css/expandable.scss +15 -6
- package/src/assets/css/plain-text.scss +11 -15
- package/src/assets/css/table.scss +2 -1
- package/src/components/Expandable/main.vue +14 -6
- package/style/index.css +1 -1
- package/theme/blue.css +1 -1
- package/theme/cctcRed.css +1 -1
- package/theme/green.css +1 -1
- package/theme/lightBlue.css +1 -1
- package/theme/orange.css +1 -1
- package/theme/purple.css +1 -1
- package/theme/red.css +1 -1
- package/theme/yellow.css +1 -1
package/package.json
CHANGED
|
@@ -991,8 +991,8 @@ $--empty-bottom-margin-top: 20px !default;
|
|
|
991
991
|
-------------------------- */
|
|
992
992
|
$--descriptions-header-margin-bottom: 20px !default;
|
|
993
993
|
$--descriptions-title-font-size: 16px !default;
|
|
994
|
-
$--descriptions-table-border: 1px solid
|
|
995
|
-
$--descriptions-item-bordered-label-background: #
|
|
994
|
+
$--descriptions-table-border: 1px solid #e5e6eb !default;
|
|
995
|
+
$--descriptions-item-bordered-label-background: #f7f8fa !default;
|
|
996
996
|
|
|
997
997
|
/* Skeleton
|
|
998
998
|
--------------------------*/
|
|
@@ -1,24 +1,25 @@
|
|
|
1
|
-
$--expandable-pane-height: 28px;
|
|
2
1
|
.n20-form-expandable-pane {
|
|
3
2
|
padding-bottom: 8px;
|
|
4
3
|
.n20-title {
|
|
5
|
-
height:
|
|
6
|
-
line-height:
|
|
7
|
-
|
|
8
|
-
color: $--color-text-primary;
|
|
4
|
+
height: auto;
|
|
5
|
+
line-height: 24px;
|
|
6
|
+
color: #1d2129;
|
|
9
7
|
padding: 0 12px;
|
|
10
|
-
margin-bottom:
|
|
8
|
+
margin-bottom: 12px;
|
|
11
9
|
margin-top: 8px;
|
|
10
|
+
font-size: 16px;
|
|
11
|
+
font-weight: 500;
|
|
12
12
|
&__algin_l {
|
|
13
13
|
margin-left: 20px;
|
|
14
14
|
}
|
|
15
15
|
}
|
|
16
16
|
|
|
17
17
|
.n20-tips {
|
|
18
|
-
font-size:
|
|
18
|
+
font-size: 16px;
|
|
19
19
|
cursor: pointer;
|
|
20
20
|
display: flex;
|
|
21
21
|
align-items: center;
|
|
22
|
+
gap: 4px;
|
|
22
23
|
|
|
23
24
|
&:hover {
|
|
24
25
|
color: $--link-hover-color;
|
|
@@ -40,7 +41,9 @@ $--expandable-pane-height: 28px;
|
|
|
40
41
|
}
|
|
41
42
|
}
|
|
42
43
|
|
|
43
|
-
|
|
44
|
-
|
|
44
|
+
// 折叠图标样式
|
|
45
|
+
.n20-expand-icon {
|
|
46
|
+
font-size: 14px;
|
|
47
|
+
color: #4e5969;
|
|
45
48
|
}
|
|
46
49
|
}
|
|
@@ -1,16 +1,20 @@
|
|
|
1
1
|
.n20-form-expandable {
|
|
2
2
|
.n20-title {
|
|
3
|
-
height:
|
|
4
|
-
line-height:
|
|
5
|
-
|
|
6
|
-
color: $--color-text-primary;
|
|
3
|
+
height: auto;
|
|
4
|
+
line-height: 24px;
|
|
5
|
+
color: #1d2129;
|
|
7
6
|
padding: 0 12px;
|
|
8
|
-
margin-bottom:
|
|
7
|
+
margin-bottom: 12px;
|
|
8
|
+
font-size: 16px;
|
|
9
|
+
font-weight: 500;
|
|
9
10
|
}
|
|
10
11
|
|
|
11
12
|
.n20-tips {
|
|
12
|
-
font-size:
|
|
13
|
+
font-size: 16px;
|
|
13
14
|
cursor: pointer;
|
|
15
|
+
display: flex;
|
|
16
|
+
align-items: center;
|
|
17
|
+
gap: 4px;
|
|
14
18
|
|
|
15
19
|
&:hover {
|
|
16
20
|
color: $--link-hover-color;
|
|
@@ -24,4 +28,9 @@
|
|
|
24
28
|
transform: rotate(90deg);
|
|
25
29
|
}
|
|
26
30
|
}
|
|
31
|
+
|
|
32
|
+
.n20-expand-icon {
|
|
33
|
+
font-size: 14px;
|
|
34
|
+
color: #4e5969;
|
|
35
|
+
}
|
|
27
36
|
}
|
|
@@ -1,24 +1,20 @@
|
|
|
1
1
|
.n20-descriptions {
|
|
2
2
|
.el-descriptions__table {
|
|
3
3
|
table-layout: fixed;
|
|
4
|
-
border: 1px solid #
|
|
5
|
-
}
|
|
6
|
-
.el-descriptions-item__cell {
|
|
7
|
-
width: 70px;
|
|
8
|
-
border-top: none !important;
|
|
9
|
-
border-left: none !important;
|
|
10
|
-
border-bottom: none !important;
|
|
11
|
-
color: $--color-text-primary;
|
|
4
|
+
border: 1px solid #e5e6eb;
|
|
12
5
|
}
|
|
6
|
+
// 标签单元格（带边框标题）
|
|
13
7
|
.el-descriptions-item__label {
|
|
14
|
-
width:
|
|
15
|
-
background:
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
color:
|
|
8
|
+
width: 160px;
|
|
9
|
+
background: #f7f8fa !important;
|
|
10
|
+
text-align: left !important;
|
|
11
|
+
padding: 7px 16px !important;
|
|
12
|
+
color: #4e5969;
|
|
19
13
|
}
|
|
20
|
-
|
|
21
|
-
|
|
14
|
+
// 内容单元格（带边框内容）
|
|
15
|
+
.el-descriptions-item__cell {
|
|
16
|
+
padding: 7px 16px !important;
|
|
17
|
+
color: #1d2129;
|
|
22
18
|
}
|
|
23
19
|
|
|
24
20
|
.after-color {
|
|
@@ -255,6 +255,7 @@ th.vxe-header--column {
|
|
|
255
255
|
}
|
|
256
256
|
}
|
|
257
257
|
|
|
258
|
-
|
|
258
|
+
/* 修复vxe-table-pro的样式问题 溢出样式问题，v3版本不用处理 */
|
|
259
|
+
.vxe-table--render-default:not(.v3-n20-table-pro) .vxe-body--column > .vxe-cell {
|
|
259
260
|
display: inline-block !important;
|
|
260
261
|
}
|
|
@@ -1,10 +1,14 @@
|
|
|
1
1
|
<template>
|
|
2
2
|
<div class="n20-form-expandable-pane">
|
|
3
|
-
<div
|
|
3
|
+
<div
|
|
4
|
+
v-if="position === 'top'"
|
|
5
|
+
class="n20-title flex-box flex-lr flex-v"
|
|
6
|
+
:class="{ 'n20-title__top': expand, titleClass }"
|
|
7
|
+
>
|
|
4
8
|
<span class="n20-tips flex-item" @click="getExpand">
|
|
5
|
-
<i v-if="icon" class="
|
|
9
|
+
<i v-if="icon" class="v3-icon-right1 n20-expand-icon" :class="{ expand: expand }"></i>
|
|
6
10
|
<slot name="title">
|
|
7
|
-
<span :class="{'n20-title__algin_l'
|
|
11
|
+
<span :class="{ 'n20-title__algin_l': !icon }">{{ title }}</span>
|
|
8
12
|
</slot>
|
|
9
13
|
</span>
|
|
10
14
|
<div>
|
|
@@ -16,9 +20,13 @@
|
|
|
16
20
|
<slot></slot>
|
|
17
21
|
</div>
|
|
18
22
|
</el-collapse-transition>
|
|
19
|
-
<div
|
|
20
|
-
|
|
21
|
-
|
|
23
|
+
<div
|
|
24
|
+
v-if="position === 'bottom'"
|
|
25
|
+
class="n20-title flex-box flex-lr flex-v"
|
|
26
|
+
:class="{ 'n20-title__bottom': expand, titleClass }"
|
|
27
|
+
>
|
|
28
|
+
<span class="n20-tips flex-item" @click="getExpand">
|
|
29
|
+
<i v-if="icon" class="v3-icon-right1 n20-expand-icon" :class="{ topExpand: expand }"></i>
|
|
22
30
|
<slot name="title">
|
|
23
31
|
<span>{{ title }}</span>
|
|
24
32
|
</slot>
|