Merge remote-tracking branch 'Inkception/main' into main

src/assets/i18n/de-DE.json

@@ -37,6 +37,20 @@
     "weapons": "Verfügbare Waffen",
     "bigrun": "Big Run"
   },
+  "festival": {
+    "upcoming": "Bevorstehendes Splatfest",
+    "active": "Splatfest",
+    "past": "Letztes Splatfest",
+    "results": {
+      "title": "Ergebnisse!",
+      "conchshells": "Tritonshörner",
+      "votes": "Votes",
+      "open": "Offen",
+      "pro": "Pro",
+      "tricolor": "Dreifarb-Kampf",
+      "won": "Team {team} hat gewonnen!"
+    }
+  },
   "gear": {
     "title": "Ausrüstung",
     "sale": "Jetzt im Angebot",
@@ -47,6 +61,7 @@
     "title": "Über!",
     "subtitle-1": "Was ist das?",
     "text-1": "Diese Seite ist eine von Fans erstellte, unoffizielle Quelle für Informationen über Nintendo's Splatoon 3. Du erinnerst dich vielleicht noch an {0}!",
+    "text-special-thanks": "Besonderer Dank an alle {0}, welche dabei geholfen haben, die Seite zu verbessern, sowie {1} und {2} für ihre Arbeit, automatisierte Nintendo Switch Online Logins möglich zu machen.",
     "subtitle-2": "Wie wurde diese Seite erstellt?",
     "text-2": "Das Frontend wurde mit {0}, {1}, und {2} erstellt. Statische Assets wurden mit {3} kompiliert.",
     "text-3": "Das Backend, der Daten-Updater und der Twitter-Bot wurden mit {0} geschrieben.",

src/assets/i18n/en-US.json

@@ -37,6 +37,20 @@
     "weapons": "Supplied Weapons",
     "bigrun": "Big Run"
   },
+  "festival": {
+    "upcoming": "Upcoming Splatfest",
+    "active": "Splatfest",
+    "past": "Recent Splatfest",
+    "results": {
+      "title": "Results!",
+      "conchshells": "Conch Shells",
+      "votes": "Votes",
+      "open": "Open",
+      "pro": "Pro",
+      "tricolor": "Tricolor Battle",
+      "won": "Team {team} wins!"
+    }
+  },
   "gear": {
     "title": "Gear",
     "sale": "Gear on Sale Now",

src/components/SplatfestBox.vue

@@ -1,8 +1,8 @@
 <template>
   <ProductContainer class="pt-10 pb-4" bg="bg-zinc-500 bg-camo-purple">
     <div class="space-y-2">
-      <div class="font-splatoon1 text-3xl mx-2">
-        {{ title }}
+      <div class="font-splatoon1 text-3xl text-shadow mx-2">
+        {{ $t(title) }}
       </div>
 
       <div class="flex justify-center mx-2">
@@ -27,7 +27,7 @@
         </div>
       </div>
 
-      <div class="font-splatoon2 text-splatoon-yellow text-center mx-2 ss:hidden">
+      <div class="font-splatoon2 text-splatoon-yellow text-center text-shadow mx-2 ss:hidden">
         {{ $d(festival.startTime, 'dateTimeShortWeekday') }}
         &ndash;
         {{ $d(festival.endTime, 'dateTimeShortWeekday') }}
@@ -49,12 +49,12 @@ const props = defineProps({
 const title = computed(() => {
   switch (props.festival.status) {
     case STATUS_PAST:
-      return 'Recent Splatfest';
+      return 'festival.past';
     case STATUS_UPCOMING:
-      return 'Upcoming Splatfest';
+      return 'festival.upcoming';
     case STATUS_ACTIVE:
     default:
-      return 'Splatfest';
+      return 'festival.active';
   }
 });
 

src/components/SplatfestResultsBox.vue

@@ -1,8 +1,8 @@
 <template>
   <ProductContainer class="pt-10 pb-4" bg="bg-camo-purple" :bgStyle="`background-color: ${toRgba(winner.color)};`">
     <div class="space-y-2">
-      <div class="font-splatoon1 text-3xl mx-2">
-        Results!
+      <div class="font-splatoon1 text-3xl text-shadow mx-2">
+        {{ $t('festival.results.title') }}
       </div>
 
       <div class="mx-2 px-1 bg-zinc-700 bg-opacity-50 backdrop-blur-sm rounded-lg">
@@ -17,7 +17,7 @@
         <template v-for="row in resultRows" :key="row.title">
           <div class="flex font-splatoon2 text-shadow text-center py-1 items-center">
             <div class="w-36 mx-2">
-              {{ row.title }}
+              {{ $t(row.title) }}
             </div>
 
             <div class="flex bg-zinc-700 bg-opacity-70 rounded-full py-1">
@@ -31,8 +31,8 @@
         </template>
       </div>
 
-      <div class="font-splatoon2 text-splatoon-yellow text-center mx-2 ss:hidden">
-        Team {{ winner.teamName }} Wins!
+      <div class="font-splatoon2 text-splatoon-yellow text-center text-shadow mx-2 ss:hidden">
+        {{ $t('festival.results.won', { team: $t(`splatnet.festivals.${ festival.__splatoon3ink_id }.teams.${i}.teamName`, winner.teamName) }) }}
       </div>
     </div>
   </ProductContainer>
@@ -60,26 +60,26 @@ function results(ratioKey, topKey) {
 const resultRows = computed(() => {
   const rows = [
     {
-      title: 'Conch Shells',
+      title: 'festival.results.conchshells',
       results: results('horagaiRatio', 'isHoragaiRatioTop'),
     },
     {
-      title: 'Votes',
+      title: 'festival.results.votes',
       results: results('voteRatio', 'isVoteRatioTop'),
     },
     {
-      title: 'Open',
+      title: 'festival.results.open',
       results: results('regularContributionRatio', 'isRegularContributionRatioTop'),
     },
     {
-      title: 'Pro',
+      title: 'festival.results.pro',
       results: results('challengeContributionRatio', 'isChallengeContributionRatioTop'),
     },
   ];
 
   if (props.festival.teams.find(t => t.result.tricolorContributionRatio !== null)) {
     rows.push({
-      title: 'Tricolor Battle',
+      title: 'festival.results.tricolor',
       results: results('tricolorContributionRatio', 'isTricolorContributionRatioTop'),
     });
   }

src/views/HomeView.vue

@@ -15,7 +15,7 @@
             <ScheduleBox type="anarchyOpen" class="flex-1 md:-rotate-1" />
           </div>
           <div class="flex flex-col justify-center space-y-6 md:flex-row md:space-x-6 md:space-y-0">
-            <ScheduleBox type="xMatch" class="flex-1 md:-rotate-1 max-w-lg" />
+            <ScheduleBox type="xMatch" class="flex-1 md:-rotate-1 md:max-w-lg" />
           </div>
         </template>
         <div class="flex justify-center" v-if="usSplatfests.upcomingFestival">
@@ -25,7 +25,7 @@
             />
         </div>
 
-        <div class="flex items-center justify-center flex-col space-y-6 md:flex-row md:space-x-6 md:space-y-0" v-if="usSplatfests.recentFestival">
+        <div class="flex flex-wrap items-center justify-center gap-y-6 md:gap-x-6" v-if="usSplatfests.recentFestival">
           <SplatfestBox
             :festival="usSplatfests.recentFestival"
             class="max-w-md md:-rotate-1"
@@ -34,7 +34,7 @@
           <SplatfestResultsBox
             v-if="usSplatfests.recentFestival.hasResults"
             :festival="usSplatfests.recentFestival"
-            class="max-w-md md:rotate-1"
+            class="max-w-sm md:max-w-md md:rotate-1"
             />
         </div>
       </div>