Merge pull request #30 from FleyX/dev

fix:修复背景图片填充不完全
This commit is contained in:
FleyX 2022-03-31 13:49:28 +08:00 committed by GitHub
commit c128cba5f6
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -1,5 +1,5 @@
<template> <template>
<div class="main" :style="{ background: backgroundImg }"> <div class="main" :style="{ backgroundImage: backgroundImg }">
<top /> <top />
<div class="content"> <div class="content">
<search :style="{ width: isPhone ? '100%' : '60%' }" /> <search :style="{ width: isPhone ? '100%' : '60%' }" />
@ -31,7 +31,7 @@ export default {
...mapState(GLOBAL_CONFIG, [IS_PHONE, SERVER_CONFIG]), ...mapState(GLOBAL_CONFIG, [IS_PHONE, SERVER_CONFIG]),
backgroundImg() { backgroundImg() {
let url = this.serverConfig.bingImgSrc ? this.serverConfig.bingImgSrc : "/static/img/homeBg.jpg"; let url = this.serverConfig.bingImgSrc ? this.serverConfig.bingImgSrc : "/static/img/homeBg.jpg";
return `url("${url}") no-repeat center center`; return `url("${url}")`;
}, },
}, },
methods: {}, methods: {},
@ -42,8 +42,8 @@ export default {
.main { .main {
width: 100%; width: 100%;
height: 100vh; height: 100vh;
background-repeat: no-repeat;
background-size: cover; background-size: cover;
background-attachment: fixed;
.content { .content {
height: calc(~"100vh" - 1.21rem); height: calc(~"100vh" - 1.21rem);