update

src/components/Navbar.vue

@@ -38,7 +38,8 @@ const currentLanguage = locale.value;
   box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.15);
 
   .logo {
-    width: 110px;
+    width: 95px;
+    object-fit: contain;
   }
 
   h1 {

src/components/Photo.vue

@@ -446,15 +446,17 @@ function validateAndSubmit() {
 
 <style lang="scss" scoped>
 .captured-img {
-  max-width: 100%;
+  width: 65vw;
+  max-height: 220px;
   margin: 1rem auto;
+  object-fit: contain;
 }
 
 video {
   width: 100%;
-  max-width: 750px;
   height: auto;
   margin: 1rem auto;
+  object-fit: cover;
 }
 
 button {

src/components/Photo101.vue

@@ -210,8 +210,8 @@ async function upload() {
         {{ t("remove_mask_result") }}
       </p>
 
-      <div class="d-flex flex-column mt-10">
-        <v-btn variant="tonal" @click="reshoot()" class="mb-5">
+      <div class="d-flex mt-10">
+        <v-btn variant="tonal" @click="reshoot()" class="me-5">
           {{ t("retake") }}
         </v-btn>
         <v-btn
@@ -269,15 +269,17 @@ async function upload() {
 
 <style lang="scss" scoped>
 .captured-img {
-  max-width: 100%;
+  width: 65vw;
+  max-height: 220px;
   margin: 1rem auto;
+  object-fit: contain;
 }
 
 video {
   width: 100%;
-  max-width: 750px;
   height: auto;
   margin: 1rem auto;
+  object-fit: cover;
 }
 
 button {

src/views/HomeView.vue

@@ -4659,7 +4659,7 @@ function checkBgImg() {
           "
         >
           <div v-if="!showBg" class="menu-content">
-            <p class="my-5">{{ t("select_character") }}</p>
+            <p class="mb-5">{{ t("select_character") }}</p>
 
             <div class="slider-btn">
               <button class="prev" @click="prevRace">
@@ -4728,7 +4728,7 @@ function checkBgImg() {
             </div>
 
             <div v-else class="menu-content bg-list">
-              <p class="my-3">{{ t("select_background") }}</p>
+              <p class="mb-3">{{ t("select_background") }}</p>
 
               <div class="slider-btn">
                 <button class="prev" @click="prevBg">