navbar添加背景色

main
sunshine 2 years ago
parent 8d11f83d70
commit d3fc4183f0

@ -48,7 +48,7 @@
{ {
"path": "pages/common/textview/index", "path": "pages/common/textview/index",
"style": { "style": {
"navigationBarTitleText": "浏览文本" "navigationStyle": "custom"
} }
}, },
{ {
@ -137,7 +137,7 @@
{ {
"path": "setting/index", "path": "setting/index",
"style": { "style": {
"navigationBarTitleText": "应用设置" "navigationStyle": "custom"
} }
}, },
{ {
@ -149,7 +149,7 @@
{ {
"path": "about/index", "path": "about/index",
"style": { "style": {
"navigationBarTitleText": "关于我们" "navigationStyle": "custom"
} }
} }
] ]

@ -1,5 +1,18 @@
<template> <template>
<view> <view>
<u-sticky
class="sticky"
:custom-nav-height="0"
>
<u-navbar
:title="title"
bg-color="transparent"
:auto-back="true"
:title-style="{ fontWeight: 'bold' }"
safe-area-inset-top
placeholder
/>
</u-sticky>
<uni-card class="view-title" :title="title"> <uni-card class="view-title" :title="title">
<text class="uni-body view-content">{{ content }}</text> <text class="uni-body view-content">{{ content }}</text>
</uni-card> </uni-card>
@ -24,11 +37,16 @@
} }
</script> </script>
<style scoped> <style scoped lang="scss">
page { page {
background-color: #ffffff; background-color: #ffffff;
} }
.sticky {
background: linear-gradient(180deg, #d4e9ff 0%, #f3f9ff 100%);
backdrop-filter: blur(27.18px);
box-shadow: 0 1px 1px 0 rgba(0, 72, 145, 0.1),
0 0.5px 0 0 rgba(0, 0, 0, 0.1);
}
.view-title { .view-title {
font-weight: bold; font-weight: bold;
} }

@ -8,6 +8,7 @@
title="生产计划" title="生产计划"
bg-color="transparent" bg-color="transparent"
:auto-back="false" :auto-back="false"
:title-style="{ fontWeight: 'bold' }"
left-icon="" left-icon=""
safe-area-inset-top safe-area-inset-top
placeholder placeholder

@ -7,6 +7,7 @@
<u-navbar <u-navbar
title="登录" title="登录"
bg-color="transparent" bg-color="transparent"
:title-style="{ fontWeight: 'bold' }"
:auto-back="false" :auto-back="false"
left-icon="" left-icon=""
safe-area-inset-top safe-area-inset-top

@ -8,7 +8,8 @@
title="个人中心" title="个人中心"
bg-color="transparent" bg-color="transparent"
:auto-back="false" :auto-back="false"
left-icon="" :left-icon="''"
:title-style="{ fontWeight: 'bold' }"
safe-area-inset-top safe-area-inset-top
placeholder placeholder
/> />
@ -180,8 +181,8 @@ function handleBuilding() {
</script> </script>
<style lang="scss"> <style lang="scss" scoped>
page { .page {
background-color: #f5f6f7; background-color: #f5f6f7;
} }
.sticky { .sticky {
@ -194,7 +195,6 @@ page {
width: 100%; width: 100%;
height: 100%; height: 100%;
.header-section { .header-section {
margin: 10rpx; margin: 10rpx;
padding: 40rpx 10rpx 80rpx 0; padding: 40rpx 10rpx 80rpx 0;
@ -235,7 +235,7 @@ page {
.mine-actions { .mine-actions {
margin: 15px 15px; margin: 15px 15px;
padding: 20px 0px; padding: 20px 0;
border-radius: 8px; border-radius: 8px;
background-color: white; background-color: white;
@ -247,7 +247,7 @@ page {
.text { .text {
display: block; display: block;
font-size: 13px; font-size: 13px;
margin: 8px 0px; margin: 8px 0;
} }
} }
} }

@ -7,6 +7,7 @@
<u-navbar <u-navbar
title="生产报工" title="生产报工"
bg-color="transparent" bg-color="transparent"
:title-style="{ fontWeight: 'bold' }"
:auto-back="false" :auto-back="false"
left-icon="" left-icon=""
safe-area-inset-top safe-area-inset-top

@ -7,6 +7,7 @@
<u-navbar <u-navbar
title="近三天投料" title="近三天投料"
bg-color="transparent" bg-color="transparent"
:title-style="{ fontWeight: 'bold' }"
:auto-back="false" :auto-back="false"
left-icon="" left-icon=""
safe-area-inset-top safe-area-inset-top

@ -1,5 +1,18 @@
<template> <template>
<view class="about-container"> <view>
<u-sticky
class="sticky"
:custom-nav-height="0"
>
<u-navbar
title="关于我们"
bg-color="transparent"
:auto-back="true"
:title-style="{ fontWeight: 'bold' }"
safe-area-inset-top
placeholder
/>
</u-sticky>
<view class="header-section text-center"> <view class="header-section text-center">
<image style="width: 150rpx;height: 150rpx;" src="/static/logo.png" mode="widthFix"> <image style="width: 150rpx;height: 150rpx;" src="/static/logo.png" mode="widthFix">
</image> </image>
@ -50,22 +63,29 @@
</script> </script>
<style lang="scss"> <style lang="scss" scoped>
page { .page {
background-color: #f8f8f8; background-color: #f8f8f8;
} }
.copyright { .sticky {
background: linear-gradient(180deg, #d4e9ff 0%, #f3f9ff 100%);
backdrop-filter: blur(27.18px);
box-shadow: 0 1px 1px 0 rgba(0, 72, 145, 0.1),
0 0.5px 0 0 rgba(0, 0, 0, 0.1);
}
.copyright {
margin-top: 50rpx; margin-top: 50rpx;
text-align: center; text-align: center;
line-height: 60rpx; line-height: 60rpx;
color: #999; color: #999;
} }
.header-section { .header-section {
display: flex; display: flex;
padding: 30rpx 0 0; padding: 30rpx 0 0;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
} }
</style> </style>

@ -8,7 +8,7 @@
title="常见问题" title="常见问题"
bg-color="transparent" bg-color="transparent"
:auto-back="true" :auto-back="true"
left-icon="" :title-style="{ fontWeight: 'bold' }"
safe-area-inset-top safe-area-inset-top
placeholder placeholder
/> />

@ -7,8 +7,8 @@
<u-navbar <u-navbar
title="编辑资料" title="编辑资料"
bg-color="transparent" bg-color="transparent"
:auto-back="false" :auto-back="true"
left-icon="" :title-style="{ fontWeight: 'bold' }"
safe-area-inset-top safe-area-inset-top
placeholder placeholder
/> />

@ -8,7 +8,7 @@
title="个人信息" title="个人信息"
bg-color="transparent" bg-color="transparent"
:auto-back="true" :auto-back="true"
left-icon="" :title-style="{ fontWeight: 'bold' }"
safe-area-inset-top safe-area-inset-top
placeholder placeholder
/> />

@ -7,8 +7,8 @@
<u-navbar <u-navbar
title="修改密码" title="修改密码"
bg-color="transparent" bg-color="transparent"
:auto-back="false" :auto-back="true"
left-icon="" :title-style="{ fontWeight: 'bold' }"
safe-area-inset-top safe-area-inset-top
placeholder placeholder
/> />

@ -1,5 +1,18 @@
<template> <template>
<view class="setting-container" :style="{ height: `${windowHeight}px` }"> <view class="setting-container" :style="{ height: `${windowHeight}px` }">
<u-sticky
class="sticky"
:custom-nav-height="0"
>
<u-navbar
title="应用设置"
bg-color="transparent"
:auto-back="true"
:title-style="{ fontWeight: 'bold' }"
safe-area-inset-top
placeholder
/>
</u-sticky>
<view class="menu-list"> <view class="menu-list">
<view class="list-cell list-cell-arrow" @click="handleToPwd"> <view class="list-cell list-cell-arrow" @click="handleToPwd">
<view class="menu-item-box"> <view class="menu-item-box">
@ -89,6 +102,13 @@ function dialogClose() {
background-color: #f8f8f8; background-color: #f8f8f8;
} }
.sticky {
background: linear-gradient(180deg, #d4e9ff 0%, #f3f9ff 100%);
backdrop-filter: blur(27.18px);
box-shadow: 0 1px 1px 0 rgba(0, 72, 145, 0.1),
0 0.5px 0 0 rgba(0, 0, 0, 0.1);
}
.item-box { .item-box {
background-color: #FFFFFF; background-color: #FFFFFF;
margin: 30rpx; margin: 30rpx;

Loading…
Cancel
Save