You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 

89 lines
1.4 KiB

<template>
<view class="pageTitle-box" :class="isFixed ? 'showPageTitle' : ''"
:style="{'padding-top':menuTop + 'px',height: menuHeight+ 'px'}">
<view class="top-logo acea-row row-center"
:style="'height:' + menuHeight + 'px;line-height: ' + menuHeight + 'px;'">
{{title}}
</view>
</view>
</template>
<script>
const app = getApp();
export default {
props: {
isFixed: {
type: Boolean,
default: false
},
title: {
type: String ,
default: ''
}
},
data() {
return {
menuHeight: app.globalData.menuHeight,
menuTop: app.globalData.menuTop,
};
},
methods:{
}
}
</script>
<style lang="less">
.pageTitle-box {
width: 100%;
position: fixed;
top: 0;
z-index: 99;
color: #fff;
transition: all .5s;
}
.showPageTitle {
background: #fff;
color: #000000 !important;
opacity: 1;
font-weight: normal;
.top-logo {
color: #000;
background-color: #fff;
}
}
.page-top-box {
width: 100%;
position: fixed;
top: 0;
left: 0;
z-index: 99;
background: #fff;
padding: 0 30rpx 20rpx;
box-shadow: 0px -6px 20px rgba(0, 0, 0, 0.11);
.top-box {
.top-box-l {
font-size: 32rpx;
color: #000;
font-weight: 500;
image {
width: 26rpx;
height: 30rpx;
display: block;
margin-right: 10rpx;
}
}
}
}
.top-logo {
position: absolute;
width: 100%;
color: #fff;
font-weight: 600;
font-size: 32rpx;
transition: all .5s cubic-bezier(.25, .5, .5, .9);
}
</style>