natty
/
calckey
1
0
Fork 0
Code Issues 1 Pull Requests Packages Projects Releases Wiki Activity

use v-bind for bg img

This commit is contained in:
ThatOneCalculator 2022-11-21 20:30:17 -08:00
parent e7b914bea3
commit dfba51fbef
2 changed files with 8 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
package.json
View File

@ -1,6 +1,6 @@
{
"name": "calckey",
"version": "12.119.0-calc.16.8",
"version": "12.119.0-calc.16.9",
"codename": "aqua",
"repository": {
"type": "git",

12
packages/client/src/pages/page.vue
View File

@ -10,7 +10,7 @@
</div>
<div class="_block main">
<div class="banner">
<div class="banner-image" :style="{ 'background-image': bgImg }">
<div class="banner-image">
<div class="header">
<h1>{{ page.title }}</h1>
</div>
@ -87,6 +87,8 @@ const props = defineProps<{
username: string;
}>();
let bgImg = 'linear-gradient(to bottom right, #31748f, #9ccfd8)';
let page = $ref(null);
let error = $ref(null);
const otherPostsPagination = {
@ -98,8 +100,6 @@ const otherPostsPagination = {
};
const path = $computed(() => props.username + '/' + props.pageName);
let bgImg = $ref('linear-gradient(to bottom right, #31748f, #9ccfd8)');
function fetchPage() {
page = null;
os.api('pages/show', {
@ -107,6 +107,9 @@ function fetchPage() {
username: props.username,
}).then(_page => {
page = _page;
if (_page.eyeCatchingImage != null) {
bgImg = `url(${_page.eyeCatchingImage.url})`;
}
}).catch(err => {
error = err;
});
@ -161,8 +164,6 @@ const headerActions = $computed(() => []);
const headerTabs = $computed(() => []);
if (page.eyeCatchingImage.url != null) { bgImg = `url(${page.eyeCatchingImage.url})`; }
definePageMetadata(computed(() => page ? {
title: computed(() => page.title || page.name),
avatar: page.user,
@ -201,6 +202,7 @@ definePageMetadata(computed(() => page ? {
height: 150px;
background-position: center;
background-size: cover;
background-image: v-bind('bgImg');
> .header {
padding: 16px;