feat: NationBasicCard

hwe/ts/PageFront.vue

@@ -14,7 +14,7 @@
       </nav>
       <!-- eslint-disable-next-line vue/max-attributes-per-line -->
       <BContainer v-if="asyncReady" id="container" :position="'position-relative'" :toast="{ root: true }" class="bg0">
-        <main>
+        <main class="row gx-0">
           <div class="commonToolbar">툴바?</div>
           <div class="gameInfo">시나리오</div>
           <div class="gameInfo">토너먼트/설문</div>
@@ -26,10 +26,10 @@
           <div class="mapView">지도</div>
           <div class="reservedCommandZone">예턴</div>
           <div class="cityInfo">도시 정보</div>
-          <div v-if="frontInfo" class="nationInfo">
-            <NationBasicCard />
+          <div v-if="frontInfo" class="nationInfo col-12 col-md-6">
+            <NationBasicCard :nation="frontInfo.nation" :global="frontInfo.global" />
           </div>
-          <div v-if="frontInfo && generalInfo && nationStaticInfo" class="generalInfo">
+          <div v-if="frontInfo && generalInfo && nationStaticInfo" class="generalInfo col-12 col-md-6">
             <GeneralBasicCard
               :general="generalInfo"
               :nation="nationStaticInfo"
@@ -284,7 +284,7 @@ watch(refreshCounter, async () => {
     generalInfo.value = response.general;
 
     const newLastExecuted = parseTime(response.global.lastExecuted);
-    if(newLastExecuted.getTime() > lastExecuted.value.getTime()){
+    if (newLastExecuted.getTime() > lastExecuted.value.getTime()) {
       lastExecuted.value = newLastExecuted;
     }
 
@@ -322,6 +322,10 @@ watch(refreshCounter, async () => {
   justify-content: space-between;
 }
 
+.generalInfo {
+  width: 500px;
+}
+
 @include media-500px {
   #outBlock {
     position: absolute;