@atooyu/uxto-ui 1.1.7 → 1.1.9

package/dist/style.css

@@ -544,44 +544,51 @@ to {
 }
 .u-divider__text[data-v-7f88d163] {
   padding: 0 12px;
-}.u-notice-bar[data-v-89a44cf8] {
+}.u-notice-bar[data-v-f80a744d] {
   display: flex;
   align-items: center;
   padding: 12px 16px;
   font-size: 12px;
   line-height: 24px;
 }
-.u-notice-bar--wrapable[data-v-89a44cf8] {
+.u-notice-bar--wrapable[data-v-f80a744d] {
   flex-wrap: wrap;
   padding: 12px 16px;
 }
-.u-notice-bar__content[data-v-89a44cf8] {
+.u-notice-bar__content[data-v-f80a744d] {
   flex: 1;
   overflow: hidden;
   position: relative;
 }
-.u-notice-bar__content--scrollable[data-v-89a44cf8] {
+.u-notice-bar__content--scrollable[data-v-f80a744d] {
   overflow: hidden;
   white-space: nowrap;
 }
-.u-notice-bar__text[data-v-89a44cf8] {
+.u-notice-bar__text[data-v-f80a744d] {
   display: inline-block;
+  white-space: nowrap;
+}
+.u-notice-bar__content--scrollable .u-notice-bar__text[data-v-f80a744d] {
+  display: flex;
+  animation: u-notice-bar-scroll-f80a744d linear infinite;
 }
-.u-notice-bar__content--scrollable .u-notice-bar__text[data-v-89a44cf8] {
-  animation: u-notice-bar-scroll-89a44cf8 linear infinite;
+.u-notice-bar__text-item[data-v-f80a744d] {
+  display: inline-block;
+  white-space: nowrap;
+  padding-right: 40px;
 }
-.u-notice-bar__left-icon[data-v-89a44cf8] {
+.u-notice-bar__left-icon[data-v-f80a744d] {
   margin-right: 8px;
 }
-.u-notice-bar__right-icon[data-v-89a44cf8] {
+.u-notice-bar__right-icon[data-v-f80a744d] {
   margin-left: 8px;
 }
-@keyframes u-notice-bar-scroll-89a44cf8 {
+@keyframes u-notice-bar-scroll-f80a744d {
 0% {
-    transform: translateX(100%);
+    transform: translateX(0);
 }
 100% {
-    transform: translateX(-100%);
+    transform: translateX(-50%);
 }
 }.u-layout[data-v-1682e77a] {
   display: flex;
@@ -2414,7 +2421,7 @@ to {
 .u-read-more__toggle-icon[data-v-b31720eb] {
   font-size: 12px;
 }
-.u-tabbar[data-v-5998a8d0] {
+.u-tabbar[data-v-69811cb8] {
   position: fixed;
   left: 0;
   right: 0;
@@ -2423,7 +2430,7 @@ to {
   width: 100%;
   pointer-events: none;
 }
-.u-tabbar__nav-wrap[data-v-5998a8d0] {
+.u-tabbar__nav-wrap[data-v-69811cb8] {
   pointer-events: auto;
   position: absolute;
   left: 14px;
@@ -2442,7 +2449,7 @@ to {
   padding: 0 8px;
   box-sizing: border-box;
 }
-.u-tabbar__tab-btn[data-v-5998a8d0] {
+.u-tabbar__tab-btn[data-v-69811cb8] {
   height: 40px;
   border-radius: 20px;
   background: transparent;
@@ -2457,23 +2464,23 @@ to {
   padding: 0 16px;
   margin: 0 20px;
 }
-.u-tabbar__tab-btn--active[data-v-5998a8d0] {
+.u-tabbar__tab-btn--active[data-v-69811cb8] {
   background: #ffffff;
   box-shadow: inset 0 0 0 1px rgba(17, 135, 128, 0.14);
 }
-.u-tabbar__tab-text[data-v-5998a8d0] {
+.u-tabbar__tab-text[data-v-69811cb8] {
   font-weight: 600;
   font-size: 14px;
   overflow: hidden;
   text-overflow: ellipsis;
 }
-.u-tabbar__center[data-v-5998a8d0] {
+.u-tabbar__center[data-v-69811cb8] {
   position: relative;
   width: 72px;
   height: 56px;
   flex-shrink: 0;
 }
-.u-tabbar__center-btn[data-v-5998a8d0] {
+.u-tabbar__center-btn[data-v-69811cb8] {
   position: absolute;
   left: 50%;
   top: -22px;
@@ -2491,21 +2498,29 @@ to {
   box-shadow: 0 8px 20px rgba(8, 112, 106, 0.25);
   transition: all 200ms ease;
 }
-.u-tabbar__center-btn[data-v-5998a8d0]:active {
+.u-tabbar__center-btn[data-v-69811cb8]:active {
   transform: translateX(-50%) scale(0.95);
 }
-.u-tabbar__center-btn--active[data-v-5998a8d0] {
+.u-tabbar__center-btn--active[data-v-69811cb8] {
   border-color: #12b6af;
   box-shadow: 0 8px 24px rgba(8, 112, 106, 0.35);
 }
-.u-tabbar__center-brand[data-v-5998a8d0] {
+.u-tabbar__center-btn--left-active[data-v-69811cb8] {
+  background: linear-gradient(135deg, #12b6af 0%, #65d8d1 100%);
+  border-color: #9fe4dd;
+}
+.u-tabbar__center-btn--left-active .u-tabbar__center-brand[data-v-69811cb8],
+.u-tabbar__center-btn--left-active .u-tabbar__center-text[data-v-69811cb8] {
+  color: #ffffff;
+}
+.u-tabbar__center-brand[data-v-69811cb8] {
   font-size: 22px;
   line-height: 1;
   font-weight: 700;
   color: #12b6af;
   letter-spacing: 1px;
 }
-.u-tabbar__center-text[data-v-5998a8d0] {
+.u-tabbar__center-text[data-v-69811cb8] {
   font-size: 12px;
   letter-spacing: 0.5px;
   color: #12b6af;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atooyu/uxto-ui",
-  "version": "1.1.7",
+  "version": "1.1.9",
   "description": "跨平台 UI 组件库 - 支持 Android、iOS、鸿蒙",
   "keywords": [
     "uxto-ui",

package/src/components/u-notice-bar/u-notice-bar.vue

@@ -11,7 +11,8 @@
         class="u-notice-bar__text"
         :style="{ animationDuration: speed + 's' }"
       >
-        {{ text }}
+        <text class="u-notice-bar__text-item">{{ text }}</text>
+        <text class="u-notice-bar__text-item">{{ text }}</text>
       </view>
       <text v-else class="u-notice-bar__text">{{ text }}</text>
     </view>
@@ -87,12 +88,20 @@ export default {
 
   &__text {
     display: inline-block;
+    white-space: nowrap;
 
     .u-notice-bar__content--scrollable & {
+      display: flex;
       animation: u-notice-bar-scroll linear infinite;
     }
   }
 
+  &__text-item {
+    display: inline-block;
+    white-space: nowrap;
+    padding-right: 40px;
+  }
+
   &__left-icon {
     margin-right: $--spacing-sm;
   }
@@ -104,10 +113,10 @@ export default {
 
 @keyframes u-notice-bar-scroll {
   0% {
-    transform: translateX(100%);
+    transform: translateX(0);
   }
   100% {
-    transform: translateX(-100%);
+    transform: translateX(-50%);
   }
 }
 </style>

package/src/components/u-tabbar/u-tabbar.vue

@@ -26,7 +26,10 @@
       <view class="u-tabbar__center">
         <view
           class="u-tabbar__center-btn"
-          :class="{ 'u-tabbar__center-btn--active': modelValue === centerTab.value }"
+          :class="{
+            'u-tabbar__center-btn--active': modelValue === centerTab.value,
+            'u-tabbar__center-btn--left-active': modelValue === leftTab.value
+          }"
           @click="switchTab(centerTab.value)"
         >
           <text class="u-tabbar__center-brand">
@@ -228,6 +231,17 @@ $--paper: #ffffff;
       border-color: $--mint-1;
       box-shadow: 0 8px 24px rgba(8, 112, 106, 0.35);
     }
+
+    // 左侧tab选中时的样式（首页选中）
+    &--left-active {
+      background: linear-gradient(135deg, $--mint-1 0%, $--mint-3 100%);
+      border-color: $--mint-2;
+
+      .u-tabbar__center-brand,
+      .u-tabbar__center-text {
+        color: $--paper;
+      }
+    }
   }
 
   &__center-brand {