Update screenshot view for Splatfests

This commit is contained in:
Matt Isenhower
2022-09-23 09:20:42 -04:00
parent 2f451ab6e3
commit 29ea70bd82
3 changed files with 23 additions and 3 deletions

View File

@@ -27,7 +27,7 @@
</div>
</div>
<div class="font-splatoon2 text-splatoon-yellow text-center mx-2">
<div class="font-splatoon2 text-splatoon-yellow text-center mx-2 ss:hidden">
{{ formatDateTime(festival.startTime) }}
&ndash;
{{ formatDateTime(festival.endTime) }}

View File

@@ -46,7 +46,7 @@
<script setup>
import { computed } from '@vue/reactivity';
import { useAnarchyOpenSchedulesStore, useAnarchySeriesSchedulesStore, useRegularSchedulesStore } from '@/stores/schedules';
import { useAnarchyOpenSchedulesStore, useAnarchySeriesSchedulesStore, useRegularSchedulesStore, useSplatfestSchedulesStore } from '@/stores/schedules';
import ProductContainer from '../ProductContainer.vue';
import StageImage from '../StageImage.vue';
@@ -83,6 +83,13 @@ const types = {
img: battleBankaraSvg,
bg: 'bg-splatoon-battle-ranked bg-tapes',
},
splatfest: {
name: 'Splatfest Battle',
badge: null,
store: useSplatfestSchedulesStore(),
img: battleRegularSvg,
bg: 'bg-splatoon-battle-regular bg-tapes',
},
};
const type = computed(() => types[props.type]);

View File

@@ -1,7 +1,16 @@
<template>
<ScreenshotLayout header="Map Schedules">
<div class="grow flex items-center justify-center">
<div class="flex space-x-6 mx-6">
<div class="flex space-x-12 items-center mx-6" v-if="usSplatfests.activeFestival">
<div class="mx-10">
<SplatfestBox
:festival="usSplatfests.activeFestival"
class="flex-1 max-w-md md:-rotate-1 scale-[1.2]"
/>
</div>
<ScreenshotScheduleBox type="splatfest" class="flex-1 rotate-1" />
</div>
<div class="flex space-x-6 mx-6" v-else>
<ScreenshotScheduleBox type="regular" class="flex-1 -rotate-1" />
<ScreenshotScheduleBox type="anarchySeries" class="flex-1 rotate-1" />
<ScreenshotScheduleBox type="anarchyOpen" class="flex-1 -rotate-1" />
@@ -13,4 +22,8 @@
<script setup>
import ScreenshotLayout from '../../layouts/ScreenshotLayout.vue';
import ScreenshotScheduleBox from '../../components/screenshots/ScreenshotScheduleBox.vue';
import { useUSSplatfestsStore } from '@/stores/splatfests';
import SplatfestBox from '@/components/SplatfestBox.vue';
const usSplatfests = useUSSplatfestsStore();
</script>