From 177ee5645e0d861085a2ac82ed40d25d6e82d2ac Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E3=81=93=E3=81=91=E3=81=A3=E3=81=A1?= <kokt@sim1222.com>
Date: Fri, 16 Sep 2022 19:37:13 +0900
Subject: [PATCH] fix: player fill window

---
 .../client/src/components/MkPageWindow.vue    |  3 +++
 packages/client/src/pages/ytplayer.vue        | 26 ++++++++++---------
 2 files changed, 17 insertions(+), 12 deletions(-)

diff --git a/packages/client/src/components/MkPageWindow.vue b/packages/client/src/components/MkPageWindow.vue
index d58b91403..dfd198d96 100644
--- a/packages/client/src/components/MkPageWindow.vue
+++ b/packages/client/src/components/MkPageWindow.vue
@@ -141,4 +141,7 @@ defineExpose({
 	min-height: 100%;
 	background: var(--bg);
 }
+.yrolvcoq:has(.fill) {
+	height: 100%;
+}
 </style>
diff --git a/packages/client/src/pages/ytplayer.vue b/packages/client/src/pages/ytplayer.vue
index d3f6531da..aa8bd75e2 100644
--- a/packages/client/src/pages/ytplayer.vue
+++ b/packages/client/src/pages/ytplayer.vue
@@ -1,15 +1,13 @@
 <template>
-<MkStickyContainer>
-    <div class="poamfof">
-        <transition :name="$store.state.animation ? 'fade' : ''" mode="out-in">
-            <div v-if="player.url" class="player">
-	            <iframe v-if="!fetching" :src="player.url + (player.url.match(/\?/) ? '&autoplay=1&auto_play=1' : '?autoplay=1&auto_play=1')" :width="'100%'" :heigth="player.height || 500" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen/>
-            </div>
-        </transition>
-				<MkLoading v-if="fetching" />
-        <MkError v-else-if="!player.url" @retry="fetch()" />
-    </div>
-</MkStickyContainer>
+  <div class="poamfof fill">
+      <transition :name="$store.state.animation ? 'fade' : ''" mode="out-in">
+          <div v-if="player.url" class="player">
+	          <iframe v-if="!fetching" :src="player.url + (player.url.match(/\?/) ? '&autoplay=1&auto_play=1' : '?autoplay=1&auto_play=1')" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen/>
+          </div>
+      </transition>
+			<MkLoading v-if="fetching" />
+      <MkError v-else-if="!player.url" @retry="fetch()" />
+  </div>
 </template>
 
 <script lang="ts" setup>
@@ -62,11 +60,15 @@ console.log(await player.url);
 </script>
 
 <style lang="scss">
+.fill {
+	height: 100%;
+}
 .player {
 	position: relative;
 	width: 100%;
+	height: 100%;
 	>iframe {
-		height: 500px;
+		height: 100%;
 		left: 0;
 		position: absolute;
 		top: 0;