Improve ad
This commit is contained in:
parent
80f8c2de78
commit
6cec662ec4
|
@ -92,7 +92,7 @@ export default defineComponent({
|
||||||
return [h(MkAd, {
|
return [h(MkAd, {
|
||||||
class: 'a', // advertiseの意(ブロッカー対策)
|
class: 'a', // advertiseの意(ブロッカー対策)
|
||||||
key: item.id + ':ad',
|
key: item.id + ':ad',
|
||||||
prefer: 'horizontal',
|
prefer: ['horizontal', 'horizontal-big'],
|
||||||
}), el];
|
}), el];
|
||||||
} else {
|
} else {
|
||||||
return el;
|
return el;
|
||||||
|
|
|
@ -30,7 +30,7 @@ export default defineComponent({
|
||||||
|
|
||||||
props: {
|
props: {
|
||||||
prefer: {
|
prefer: {
|
||||||
type: String,
|
type: Array,
|
||||||
required: true
|
required: true
|
||||||
},
|
},
|
||||||
specify: {
|
specify: {
|
||||||
|
@ -50,7 +50,7 @@ export default defineComponent({
|
||||||
if (props.specify) {
|
if (props.specify) {
|
||||||
ad = props.specify;
|
ad = props.specify;
|
||||||
} else {
|
} else {
|
||||||
let ads = instance.ads.filter(ad => ad.place === props.prefer);
|
let ads = instance.ads.filter(ad => props.prefer.includes(ad.place));
|
||||||
|
|
||||||
if (ads.length === 0) {
|
if (ads.length === 0) {
|
||||||
ads = instance.ads.filter(ad => ad.place === 'square');
|
ads = instance.ads.filter(ad => ad.place === 'square');
|
||||||
|
@ -130,6 +130,16 @@ export default defineComponent({
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
&.horizontal-big {
|
||||||
|
padding: 8px;
|
||||||
|
|
||||||
|
> a ,
|
||||||
|
> a > img {
|
||||||
|
max-width: min(600px, 100%);
|
||||||
|
max-height: 250px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
&.vertical {
|
&.vertical {
|
||||||
> a ,
|
> a ,
|
||||||
> a > img {
|
> a > img {
|
||||||
|
|
|
@ -33,7 +33,7 @@
|
||||||
<MkFollowButton v-if="!$i || $i.id != post.user.id" :user="post.user" :inline="true" :transparent="false" :full="true" large class="koudoku"/>
|
<MkFollowButton v-if="!$i || $i.id != post.user.id" :user="post.user" :inline="true" :transparent="false" :full="true" large class="koudoku"/>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<MkAd prefer="horizontal"/>
|
<MkAd :prefer="['horizontal', 'horizontal-big']"/>
|
||||||
<MkContainer :max-height="300" :foldable="true" class="other">
|
<MkContainer :max-height="300" :foldable="true" class="other">
|
||||||
<template #header><i class="fas fa-clock"></i> {{ $ts.recentPosts }}</template>
|
<template #header><i class="fas fa-clock"></i> {{ $ts.recentPosts }}</template>
|
||||||
<MkPagination :pagination="otherPostsPagination" #default="{items}">
|
<MkPagination :pagination="otherPostsPagination" #default="{items}">
|
||||||
|
|
|
@ -13,6 +13,7 @@
|
||||||
<div style="margin: 32px 0;">
|
<div style="margin: 32px 0;">
|
||||||
<MkRadio v-model="ad.place" value="square">square</MkRadio>
|
<MkRadio v-model="ad.place" value="square">square</MkRadio>
|
||||||
<MkRadio v-model="ad.place" value="horizontal">horizontal</MkRadio>
|
<MkRadio v-model="ad.place" value="horizontal">horizontal</MkRadio>
|
||||||
|
<MkRadio v-model="ad.place" value="horizontal-big">horizontal-big</MkRadio>
|
||||||
</div>
|
</div>
|
||||||
<div style="margin: 32px 0;">
|
<div style="margin: 32px 0;">
|
||||||
{{ $ts.priority }}
|
{{ $ts.priority }}
|
||||||
|
|
|
@ -45,7 +45,7 @@
|
||||||
<div><i class="far fa-clock"></i> {{ $ts.createdAt }}: <MkTime :time="page.createdAt" mode="detail"/></div>
|
<div><i class="far fa-clock"></i> {{ $ts.createdAt }}: <MkTime :time="page.createdAt" mode="detail"/></div>
|
||||||
<div v-if="page.createdAt != page.updatedAt"><i class="far fa-clock"></i> {{ $ts.updatedAt }}: <MkTime :time="page.updatedAt" mode="detail"/></div>
|
<div v-if="page.createdAt != page.updatedAt"><i class="far fa-clock"></i> {{ $ts.updatedAt }}: <MkTime :time="page.updatedAt" mode="detail"/></div>
|
||||||
</div>
|
</div>
|
||||||
<MkAd prefer="horizontal"/>
|
<MkAd :prefer="['horizontal', 'horizontal-big']"/>
|
||||||
<MkContainer :max-height="300" :foldable="true" class="other">
|
<MkContainer :max-height="300" :foldable="true" class="other">
|
||||||
<template #header><i class="fas fa-clock"></i> {{ $ts.recentPosts }}</template>
|
<template #header><i class="fas fa-clock"></i> {{ $ts.recentPosts }}</template>
|
||||||
<MkPagination :pagination="otherPostsPagination" #default="{items}">
|
<MkPagination :pagination="otherPostsPagination" #default="{items}">
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
<template>
|
<template>
|
||||||
<div class="ddiqwdnk">
|
<div class="ddiqwdnk">
|
||||||
<XWidgets class="widgets" :edit="editMode" :widgets="$store.reactiveState.widgets.value" @add-widget="addWidget" @remove-widget="removeWidget" @update-widget="updateWidget" @update-widgets="updateWidgets" @exit="editMode = false"/>
|
<XWidgets class="widgets" :edit="editMode" :widgets="$store.reactiveState.widgets.value" @add-widget="addWidget" @remove-widget="removeWidget" @update-widget="updateWidget" @update-widgets="updateWidgets" @exit="editMode = false"/>
|
||||||
<MkAd class="ad" prefer="square"/>
|
<MkAd class="a" prefer="square"/>
|
||||||
|
|
||||||
<button v-if="editMode" @click="editMode = false" class="_textButton edit" style="font-size: 0.9em;"><i class="fas fa-check"></i> {{ $ts.editWidgetsExit }}</button>
|
<button v-if="editMode" @click="editMode = false" class="_textButton edit" style="font-size: 0.9em;"><i class="fas fa-check"></i> {{ $ts.editWidgetsExit }}</button>
|
||||||
<button v-else @click="editMode = true" class="_textButton edit" style="font-size: 0.9em;"><i class="fas fa-pencil-alt"></i> {{ $ts.editWidgets }}</button>
|
<button v-else @click="editMode = true" class="_textButton edit" style="font-size: 0.9em;"><i class="fas fa-pencil-alt"></i> {{ $ts.editWidgets }}</button>
|
||||||
|
@ -64,7 +64,7 @@ export default defineComponent({
|
||||||
padding-bottom: 8px;
|
padding-bottom: 8px;
|
||||||
|
|
||||||
> .widgets,
|
> .widgets,
|
||||||
> .ad {
|
> .a {
|
||||||
width: 300px;
|
width: 300px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue