bge-ui 1.3.6 → 1.3.7
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/dist/index.js +2 -2
- package/dist/style.css +27 -5
- package/package.json +1 -1
- package/src/tabs/index.vue +30 -3
- package/src/tabs/tab-pane.vue +17 -4
package/dist/index.js
CHANGED
|
@@ -6280,7 +6280,7 @@ const _sfc_main$r = /* @__PURE__ */ defineComponent({
|
|
|
6280
6280
|
props: {
|
|
6281
6281
|
type: {
|
|
6282
6282
|
default: "bordered",
|
|
6283
|
-
value: ["bordered", "pills"]
|
|
6283
|
+
value: ["bordered", "pills", "pills-elevated"]
|
|
6284
6284
|
},
|
|
6285
6285
|
modelValue: {
|
|
6286
6286
|
type: String,
|
|
@@ -6288,7 +6288,7 @@ const _sfc_main$r = /* @__PURE__ */ defineComponent({
|
|
|
6288
6288
|
},
|
|
6289
6289
|
size: {
|
|
6290
6290
|
default: "default",
|
|
6291
|
-
value: ["default", "large"]
|
|
6291
|
+
value: ["default", "large", "mini"]
|
|
6292
6292
|
}
|
|
6293
6293
|
},
|
|
6294
6294
|
emits: ["update:modelValue"],
|
package/dist/style.css
CHANGED
|
@@ -902,10 +902,24 @@ to {
|
|
|
902
902
|
}
|
|
903
903
|
.bge-input .bge-input__prefix .bge-input__prefix-inner {
|
|
904
904
|
padding-right: 8px;
|
|
905
|
-
}.bge-tabs.bge-tabs__bordered .bge-tabs__panes, .bge-tabs.bge-tabs__pills .bge-tabs__panes {
|
|
905
|
+
}.bge-tabs.bge-tabs__bordered .bge-tabs__panes, .bge-tabs.bge-tabs__pills .bge-tabs__panes, .bge-tabs.bge-tabs__pills-elevated .bge-tabs__panes {
|
|
906
906
|
display: flex;
|
|
907
907
|
align-items: flex-start;
|
|
908
908
|
position: relative;
|
|
909
|
+
background: var(--bg-opacity);
|
|
910
|
+
border-radius: var(--radius-small, 4px);
|
|
911
|
+
}
|
|
912
|
+
.bge-tabs.bge-tabs__pills-elevated .bge-tabs__panes .bge-tab__pane {
|
|
913
|
+
padding: 6px 12px;
|
|
914
|
+
font-size: 14px;
|
|
915
|
+
font-weight: 500;
|
|
916
|
+
line-height: 24px;
|
|
917
|
+
}
|
|
918
|
+
.bge-tabs.bge-tabs__pills-elevated.bge-tabs__mini .bge-tabs__panes .bge-tab__pane {
|
|
919
|
+
padding: 2px 12px;
|
|
920
|
+
font-size: 12px;
|
|
921
|
+
font-weight: 500;
|
|
922
|
+
line-height: 20px;
|
|
909
923
|
}
|
|
910
924
|
.bge-tabs.bge-tabs__default .bge-tabs__panes {
|
|
911
925
|
font-size: 14px;
|
|
@@ -951,10 +965,6 @@ to {
|
|
|
951
965
|
color: var(--tc-tertiary, #53677A);
|
|
952
966
|
cursor: pointer;
|
|
953
967
|
text-align: center;
|
|
954
|
-
font-size: 14px;
|
|
955
|
-
font-style: normal;
|
|
956
|
-
font-weight: 500;
|
|
957
|
-
line-height: 24px;
|
|
958
968
|
}
|
|
959
969
|
.bge-tabs__pills .bge-tab__pane:last-child {
|
|
960
970
|
margin-right: 0;
|
|
@@ -967,6 +977,18 @@ to {
|
|
|
967
977
|
color: var(--persistent-black, #000);
|
|
968
978
|
background: var(--btn-primary, #FFFF38);
|
|
969
979
|
}
|
|
980
|
+
.bge-tabs__pills-elevated .bge-tab__pane {
|
|
981
|
+
color: var(--tc-tertiary);
|
|
982
|
+
cursor: pointer;
|
|
983
|
+
}
|
|
984
|
+
.bge-tabs__pills-elevated .bge-tab__pane:hover {
|
|
985
|
+
color: var(--tc-title);
|
|
986
|
+
}
|
|
987
|
+
.bge-tabs__pills-elevated .bge-tab__pane.active {
|
|
988
|
+
color: var(--tc-title);
|
|
989
|
+
background: var(--bg-fusion);
|
|
990
|
+
border-radius: var(--radius-small, 4px);
|
|
991
|
+
}
|
|
970
992
|
.bge-tabs__bordered {
|
|
971
993
|
position: relative;
|
|
972
994
|
}
|
package/package.json
CHANGED
package/src/tabs/index.vue
CHANGED
|
@@ -15,7 +15,7 @@ defineOptions({
|
|
|
15
15
|
const props = defineProps({
|
|
16
16
|
type: {
|
|
17
17
|
default: 'bordered',
|
|
18
|
-
value: ['bordered', 'pills']
|
|
18
|
+
value: ['bordered', 'pills', 'pills-elevated']
|
|
19
19
|
},
|
|
20
20
|
modelValue: {
|
|
21
21
|
type: String,
|
|
@@ -23,7 +23,7 @@ const props = defineProps({
|
|
|
23
23
|
},
|
|
24
24
|
size: {
|
|
25
25
|
default: 'default',
|
|
26
|
-
value: ['default', 'large']
|
|
26
|
+
value: ['default', 'large', 'mini']
|
|
27
27
|
}
|
|
28
28
|
})
|
|
29
29
|
|
|
@@ -92,13 +92,40 @@ onMounted(() => {
|
|
|
92
92
|
.bge-tabs {
|
|
93
93
|
|
|
94
94
|
&.bge-tabs__bordered,
|
|
95
|
-
&.bge-tabs__pills
|
|
95
|
+
&.bge-tabs__pills,
|
|
96
|
+
&.bge-tabs__pills-elevated {
|
|
96
97
|
.bge-tabs__panes {
|
|
97
98
|
display: flex;
|
|
98
99
|
align-items: flex-start;
|
|
99
100
|
position: relative;
|
|
101
|
+
background: var(--bg-opacity);
|
|
102
|
+
border-radius: var(--radius-small, 4px);
|
|
103
|
+
}
|
|
104
|
+
}
|
|
105
|
+
&.bge-tabs__pills-elevated {
|
|
106
|
+
.bge-tabs__panes {
|
|
107
|
+
.bge-tab__pane {
|
|
108
|
+
padding: 6px 12px;
|
|
109
|
+
font-size: 14px;
|
|
110
|
+
font-weight: 500;
|
|
111
|
+
line-height: 24px;
|
|
112
|
+
}
|
|
113
|
+
}
|
|
114
|
+
|
|
115
|
+
|
|
116
|
+
&.bge-tabs__mini {
|
|
117
|
+
.bge-tabs__panes {
|
|
118
|
+
.bge-tab__pane {
|
|
119
|
+
padding: 2px 12px;
|
|
120
|
+
font-size: 12px;
|
|
121
|
+
font-weight: 500;
|
|
122
|
+
line-height: 20px;
|
|
123
|
+
}
|
|
124
|
+
}
|
|
100
125
|
}
|
|
101
126
|
}
|
|
127
|
+
|
|
128
|
+
|
|
102
129
|
|
|
103
130
|
|
|
104
131
|
|
package/src/tabs/tab-pane.vue
CHANGED
|
@@ -46,10 +46,6 @@ onMounted(() => {
|
|
|
46
46
|
color: var(--tc-tertiary, #53677A);
|
|
47
47
|
cursor: pointer;
|
|
48
48
|
text-align: center;
|
|
49
|
-
font-size: 14px;
|
|
50
|
-
font-style: normal;
|
|
51
|
-
font-weight: 500;
|
|
52
|
-
line-height: 24px;
|
|
53
49
|
|
|
54
50
|
&:last-child {
|
|
55
51
|
margin-right: 0;
|
|
@@ -67,6 +63,23 @@ onMounted(() => {
|
|
|
67
63
|
}
|
|
68
64
|
}
|
|
69
65
|
|
|
66
|
+
.bge-tabs__pills-elevated {
|
|
67
|
+
.bge-tab__pane {
|
|
68
|
+
color: var(--tc-tertiary);
|
|
69
|
+
cursor: pointer;
|
|
70
|
+
|
|
71
|
+
&:hover {
|
|
72
|
+
color: var(--tc-title);
|
|
73
|
+
}
|
|
74
|
+
|
|
75
|
+
&.active {
|
|
76
|
+
color: var(--tc-title);
|
|
77
|
+
background: var(--bg-fusion);
|
|
78
|
+
border-radius: var(--radius-small, 4px);
|
|
79
|
+
}
|
|
80
|
+
}
|
|
81
|
+
}
|
|
82
|
+
|
|
70
83
|
.bge-tabs__bordered {
|
|
71
84
|
position: relative;
|
|
72
85
|
|