@liujitcn/kratos-uni-app-core 0.0.56 → 0.0.58
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/components/KratosTabBar.vue +16 -13
package/package.json
CHANGED
|
@@ -54,6 +54,9 @@ const messageBadge = useAppMenuBadge('MESSAGE_INBOX')
|
|
|
54
54
|
|
|
55
55
|
<style scoped>
|
|
56
56
|
.kratos-tab-bar {
|
|
57
|
+
--kratos-tab-bar-color: #333;
|
|
58
|
+
--kratos-tab-bar-active-color: #27ba9b;
|
|
59
|
+
|
|
57
60
|
position: fixed;
|
|
58
61
|
right: 0;
|
|
59
62
|
bottom: 0;
|
|
@@ -74,7 +77,7 @@ const messageBadge = useAppMenuBadge('MESSAGE_INBOX')
|
|
|
74
77
|
justify-content: center;
|
|
75
78
|
flex-direction: column;
|
|
76
79
|
transform: translateY(clamp(1px, env(safe-area-inset-bottom), 7px));
|
|
77
|
-
color:
|
|
80
|
+
color: var(--kratos-tab-bar-color);
|
|
78
81
|
font-size: 10px;
|
|
79
82
|
line-height: 12px;
|
|
80
83
|
}
|
|
@@ -88,7 +91,7 @@ const messageBadge = useAppMenuBadge('MESSAGE_INBOX')
|
|
|
88
91
|
width: 22px;
|
|
89
92
|
height: 18px;
|
|
90
93
|
margin-bottom: 6px;
|
|
91
|
-
border: 2px solid
|
|
94
|
+
border: 2px solid var(--kratos-tab-bar-color);
|
|
92
95
|
border-radius: 6px;
|
|
93
96
|
box-sizing: border-box;
|
|
94
97
|
}
|
|
@@ -99,10 +102,10 @@ const messageBadge = useAppMenuBadge('MESSAGE_INBOX')
|
|
|
99
102
|
width: 3px;
|
|
100
103
|
height: 3px;
|
|
101
104
|
border-radius: 50%;
|
|
102
|
-
background:
|
|
105
|
+
background: var(--kratos-tab-bar-color);
|
|
103
106
|
box-shadow:
|
|
104
|
-
5px 0
|
|
105
|
-
10px 0
|
|
107
|
+
5px 0 var(--kratos-tab-bar-color),
|
|
108
|
+
10px 0 var(--kratos-tab-bar-color);
|
|
106
109
|
content: '';
|
|
107
110
|
}
|
|
108
111
|
.kratos-tab-bar__message-icon::after {
|
|
@@ -111,26 +114,26 @@ const messageBadge = useAppMenuBadge('MESSAGE_INBOX')
|
|
|
111
114
|
left: 3px;
|
|
112
115
|
width: 7px;
|
|
113
116
|
height: 7px;
|
|
114
|
-
border-right: 2px solid
|
|
115
|
-
border-bottom: 2px solid
|
|
117
|
+
border-right: 2px solid var(--kratos-tab-bar-color);
|
|
118
|
+
border-bottom: 2px solid var(--kratos-tab-bar-color);
|
|
116
119
|
background: #fff;
|
|
117
120
|
content: '';
|
|
118
121
|
transform: rotate(45deg);
|
|
119
122
|
}
|
|
120
123
|
.kratos-tab-bar__message-icon--active {
|
|
121
|
-
border-color:
|
|
124
|
+
border-color: var(--kratos-tab-bar-active-color);
|
|
122
125
|
}
|
|
123
126
|
.kratos-tab-bar__message-icon--active::before {
|
|
124
|
-
background:
|
|
127
|
+
background: var(--kratos-tab-bar-active-color);
|
|
125
128
|
box-shadow:
|
|
126
|
-
5px 0
|
|
127
|
-
10px 0
|
|
129
|
+
5px 0 var(--kratos-tab-bar-active-color),
|
|
130
|
+
10px 0 var(--kratos-tab-bar-active-color);
|
|
128
131
|
}
|
|
129
132
|
.kratos-tab-bar__message-icon--active::after {
|
|
130
|
-
border-color:
|
|
133
|
+
border-color: var(--kratos-tab-bar-active-color);
|
|
131
134
|
}
|
|
132
135
|
.kratos-tab-bar__text--active {
|
|
133
|
-
color:
|
|
136
|
+
color: var(--kratos-tab-bar-active-color);
|
|
134
137
|
}
|
|
135
138
|
.kratos-tab-bar__badge {
|
|
136
139
|
position: absolute;
|