From 33413c6be7f338ba1ee92b3218e5c078364675dc Mon Sep 17 00:00:00 2001
From: 马宇豪 <978517621@qq.com>
Date: 星期三, 24 七月 2024 17:29:07 +0800
Subject: [PATCH] 提交
---
pages/tabBar/tabBarIndex.vue | 35 ++++++++++++++++++++++++++---------
1 files changed, 26 insertions(+), 9 deletions(-)
diff --git a/pages/tabBar/tabBarIndex.vue b/pages/tabBar/tabBarIndex.vue
index 74a1343..41b04ae 100644
--- a/pages/tabBar/tabBarIndex.vue
+++ b/pages/tabBar/tabBarIndex.vue
@@ -6,14 +6,14 @@
:fixed="false"
:placeholder="false"
:safeAreaInsetBottom="false"
- activeColor="#48bff4"
+ activeColor="#0f7ff9"
>
<u-tabbar-item v-for="(item, index) in tabBarList"
:key="index"
:text="item.text"
:name="item.pagePath"
@click="click_page"
- >
+ :class="{active: currentPagePath == item.pagePath}">
<image class="u-page__item__slot-icon" slot="inactive-icon" :src="item.iconPath"></image>
<image class="u-page__item__slot-icon" slot="active-icon" :src="item.selectedIconPath"></image>
</u-tabbar-item>
@@ -54,17 +54,34 @@
}
</script>
-<style>
+<style lang="scss">
.tabBar_css{
position: fixed;
- bottom: 0;
- background-color: red;
+ bottom: 10px;
+ left: 50%;
+ transform: translateX(-50%);
z-index: 9999;
- width: 100%;
- box-shadow: 0 -3px 12px rgba(0,0,0,0.05);
+ width: calc(100vw - 20px);
+ border-radius: 99px;
+ overflow: hidden;
+ box-shadow: 0 -6px 10px rgba(150, 150, 150, 0.1), 0 6px 10px rgba(150, 150, 150, 0.1);
+
+ /deep/ .u-tabbar .u-border-top{
+ border-color: rgba(0,0,0,0) !important;
+ }
}
.u-page__item__slot-icon{
- width: 22px;
- height: 22px;
+ width: 20px;
+ height: 20px;
+}
+/deep/ .u-tabbar-item__text{
+ margin-top: 0 !important;
+ line-height: 20px !important;
+}
+
+.active{
+ /deep/ .u-tabbar-item__text{
+
+ }
}
</style>
\ No newline at end of file
--
Gitblit v1.9.2