diff --git a/src/client/components/date-separated-list.vue b/src/client/components/date-separated-list.vue index 9636ee053cda8ea75f528f7fedffbab02c9a91d8..34085cc0709867bb7e71acdbf2c72f3392c1253c 100644 --- a/src/client/components/date-separated-list.vue +++ b/src/client/components/date-separated-list.vue @@ -92,7 +92,7 @@ export default defineComponent({ return [h(MkAd, { class: 'a', // advertiseã®æ„(ブãƒãƒƒã‚«ãƒ¼å¯¾ç–) key: item.id + ':ad', - prefer: 'horizontal', + prefer: ['horizontal', 'horizontal-big'], }), el]; } else { return el; diff --git a/src/client/components/global/ad.vue b/src/client/components/global/ad.vue index ee2a7ebe92b3c32ca08fffcdc878fe1870fa37e3..f88a1d202693f27b289f0574d705b7e2f99025a5 100644 --- a/src/client/components/global/ad.vue +++ b/src/client/components/global/ad.vue @@ -30,7 +30,7 @@ export default defineComponent({ props: { prefer: { - type: String, + type: Array, required: true }, specify: { @@ -50,7 +50,7 @@ export default defineComponent({ if (props.specify) { ad = props.specify; } 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) { 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 { > a , > a > img { diff --git a/src/client/pages/gallery/post.vue b/src/client/pages/gallery/post.vue index 50f81376ec301c471f5c02105f983644e014d2a2..dbac003e38db75c4b16612e31a5c82bbb4622ec1 100644 --- a/src/client/pages/gallery/post.vue +++ b/src/client/pages/gallery/post.vue @@ -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"/> </div> </div> - <MkAd prefer="horizontal"/> + <MkAd :prefer="['horizontal', 'horizontal-big']"/> <MkContainer :max-height="300" :foldable="true" class="other"> <template #header><i class="fas fa-clock"></i> {{ $ts.recentPosts }}</template> <MkPagination :pagination="otherPostsPagination" #default="{items}"> diff --git a/src/client/pages/instance/ads.vue b/src/client/pages/instance/ads.vue index ee7114f91c78ff7826141faa67f201b5e0d80abd..20747d6f9c0711372eb273e808a11ce785fbd6c1 100644 --- a/src/client/pages/instance/ads.vue +++ b/src/client/pages/instance/ads.vue @@ -13,6 +13,7 @@ <div style="margin: 32px 0;"> <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-big">horizontal-big</MkRadio> </div> <div style="margin: 32px 0;"> {{ $ts.priority }} diff --git a/src/client/pages/page.vue b/src/client/pages/page.vue index 4e237c21863f5e8ec44514b4b4ba541d600c92e5..47a458df9c4cd3c125ac0895b17f2e6aec46bb7a 100644 --- a/src/client/pages/page.vue +++ b/src/client/pages/page.vue @@ -45,7 +45,7 @@ <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> - <MkAd prefer="horizontal"/> + <MkAd :prefer="['horizontal', 'horizontal-big']"/> <MkContainer :max-height="300" :foldable="true" class="other"> <template #header><i class="fas fa-clock"></i> {{ $ts.recentPosts }}</template> <MkPagination :pagination="otherPostsPagination" #default="{items}"> diff --git a/src/client/ui/default.widgets.vue b/src/client/ui/default.widgets.vue index c475e4272cc70d004ca2a24da773d5f78bb5869a..cf5d1e07ce1df6504581243f155984afc4d04bbd 100644 --- a/src/client/ui/default.widgets.vue +++ b/src/client/ui/default.widgets.vue @@ -1,7 +1,7 @@ <template> <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"/> - <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-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; > .widgets, - > .ad { + > .a { width: 300px; }