Bladeren bron

样式修改

tanxue 2 maanden geleden
bovenliggende
commit
f14caedb58

+ 20 - 9
common/styles/global/components.scss

@@ -112,7 +112,7 @@ view{box-sizing: border-box;}
 	width: 100%;height: 140rpx;@include dljt-no-repeat-cover();
 	display: flex;align-items: center;justify-content: space-between;
 	background-image: url("@/static/images/common/dljt-navBar-bj.png");
-	position: fixed;top: 0;
+	position: fixed;top: 0;z-index: 3;
 	.uni-navbar--shadow{box-shadow: none;border-bottom: 0;}
 	.uni-navbar__header-btns{display: none;}
 	.uni-navbar__header-container{justify-content: space-between;align-items: center;width: 100%;}
@@ -147,10 +147,15 @@ view{box-sizing: border-box;}
 	
 // 底部footer
 .dljt-footer-box{
+	width: 100%;height: 140rpx;background-color: #01356e;
+}
+
+// 底部tab-bar
+.dljt-tab-bar-box{
 	width: 100%;height: 100rpx;background: #fff;z-index: 99999;
 	position: fixed;bottom: 0;left: 0;right: 0;font-size: 0;
 	display: flex;align-items: center;border-top: 1rpx solid #89b0db;background-color: #fff;
-	.footer-item{
+	.bar-item{
 		width: 25%;font-size: 28rpx;color: #333;text-align: center;
 		display: flex;flex-direction: column;align-items: center;}
 	icon{width: 48rpx;height: 48rpx;@include dljt-no-repeat-cover();margin-bottom: 2rpx;}
@@ -183,18 +188,24 @@ view{box-sizing: border-box;}
 
 /* 导航 */
 .dljt-breadcrumb-box{
-	
+	display: flex;align-items: center;padding: 12rpx 6rpx;box-sizing: border-box;border-bottom: 1rpx solid #ccc;margin-bottom: 16rpx;
+	.breadcrumb-text,.breadcrumb-active{font-size: 26rpx;color: #333;}
+	.breadcrumb-active{color: #1752a0;}
+	.breadcrumb-jt{
+		width: 25rpx;height: 25rpx;transform: rotate(270deg);
+		@include dljt-no-repeat-cover;background-image: url("@/static/images/common/nav-bar-jt-bottom.svg");}
 }
 
 /* container */
 .dljt-container-box{width: 100%;position: relative;z-index: 2;}
-.dljt-page-content-box{width: 92%;margin: 0 auto;background-color: #fff;box-shadow: 0 1rpx 3rpx 0 #227ECE;}
+.dljt-page-content-box{width: 92%;margin: 0 auto 60rpx;background-color: #fff;
+box-shadow: 0 1rpx 3rpx 0 #227ECE;box-sizing: border-box;padding: 4rpx 10rpx 0;}
 
 
 /*左侧图片右侧内容列表区域*/
 .list-item-box{
-  display: flex;margin-bottom: 32rpx;cursor: pointer;position: relative;
-  .list-img{width: 360rpx;height: 240rpx;}
+  display: flex;margin:0 6rpx 32rpx;cursor: pointer;position: relative;
+  .list-img{width: 320rpx;height: 220rpx;}
   .list-time-box{
     width: 90rpx;height: 90rpx;background-color: rgba(0,64,194,0.7);
     color: #fff;position: absolute;top: 0;left: 0;text-align: center;
@@ -207,8 +218,8 @@ view{box-sizing: border-box;}
   }
   .list-right-box{
     margin-left: 20rpx;flex: 1;border-bottom: 1rpx dashed #999;
-    .list-name{color: #000;font-size: 32rpx;@include single-line-ellipsis;}
-    .list-line{width: 50rpx;height: 6rpx;background-color: #1460b6;margin: 24rpx 0;}
-    .list-content{font-size: 28rpx;line-height: 28rpx;@include multi-line-ellipsis(4); }
+    .list-name{color: #000;font-size: 28rpx;@include multi-line-ellipsis(2);line-height: 1.5;}
+    .list-line{width: 50rpx;height: 6rpx;background-color: #1460b6;margin: 20rpx 0;}
+    .list-content{font-size: 24rpx;@include multi-line-ellipsis(2);color: #666;line-height: 1.5;}
   }
 }

+ 1 - 1
components/MtaFooter.vue

@@ -1,5 +1,5 @@
 <template>
-	<view class="">
+	<view class="dljt-footer-box">
 		
 	</view>
 </template>

+ 2 - 2
components/MtaTabBar/MtaTabBar.vue

@@ -1,7 +1,7 @@
 <template>
-  <view class="dljt-footer-box">
+  <view class="dljt-tab-bar-box">
 	  <!-- active -->
-    <view class="footer-item" v-for="(item, index) in tabList" :key="index" 
+    <view class="bar-item" v-for="(item, index) in tabList" :key="index" 
 	@click="switchTab(item)" :class="{active: activeIndex === index}">
       <icon :class="item.icon"></icon>
       <text>{{ item.text }}</text>

+ 2 - 2
pages/dqgzDangjiangongzuo/dqgzDangjiangongzuo.vue

@@ -5,9 +5,9 @@
 			<view class="dljt-page-title">校园动态</view>
 			<view class="dljt-page-content-box">
 				<view class="dljt-breadcrumb-box">
-					<view class="breadcrumb-text"></view>
+					<view class="breadcrumb-text">首页</view>
 					<icon class="breadcrumb-jt"></icon>
-					<view class="breadcrumb-active"></view>
+					<view class="breadcrumb-active">学院新闻</view>
 				</view>
 			
 				<MtaScrollViewVue :refreshFn="getList">