aa

src/views/drive/index.vue

@@ -36,7 +36,9 @@
       </section>
     </main>
 
-    <Footer />
+    <div style="margin-top: 300px">
+      <Footer />
+    </div>
   </div>
 </template>
 
@@ -136,7 +138,7 @@ const openDrive = async (option: DriveCard) => {
   max-width: 1200px;
   margin: 0 auto;
   padding: 132px 24px 72px;
-  height: 93vh;
+  height: 100vh;
 }
 
 .drive-hero {

src/views/index.vue

@@ -78,7 +78,7 @@
 
             <div
               v-if="section.apps?.length"
-              class="grid grid-cols-2 gap-4 p-6 md:grid-cols-4"
+              class="grid grid-cols-[repeat(2,minmax(0,1fr))] gap-2 p-6 md:grid-cols-[repeat(4,minmax(0,1fr))]"
             >
               <button
                 v-for="(app, appIndex) in section.apps"
@@ -105,7 +105,10 @@
                     class="text-[24px]"
                   />
                 </span>
-                <span class="text-[#004098] text-sm">{{ app.label }}</span>
+                <span
+                  class="platform-app__label text-[#004098] md:text-sm text-[12px] text-left"
+                  >{{ app.label }}</span
+                >
               </button>
             </div>
           </article>
@@ -1124,12 +1127,17 @@ onUnmounted(() => {
   display: flex;
   align-items: baseline;
   gap: 28px;
+  min-width: 0;
 }
 
 .platform-block__title {
   color: #fff;
   font-size: 18px;
-
+  min-width: 0;
+  flex: 0 1 auto;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
   letter-spacing: 0.03em;
 }
 
@@ -1137,6 +1145,8 @@ onUnmounted(() => {
   color: rgba(255, 255, 255, 0.95);
   font-size: 13px;
   font-weight: 600;
+  flex: 0 0 auto;
+  white-space: nowrap;
 }
 
 .platform-block__watermark {
@@ -1149,12 +1159,14 @@ onUnmounted(() => {
 
 .platform-app {
   display: flex;
+  width: 100%;
+  min-width: 0;
   min-height: 34px;
   align-items: center;
   justify-content: flex-start;
-  gap: 12px;
+  gap: 5px;
   border-radius: 8px;
-  padding: 0 10px;
+  padding: 0 5px;
 
   font-size: 14px;
   cursor: pointer;
@@ -1186,6 +1198,14 @@ onUnmounted(() => {
   color: currentColor;
 }
 
+.platform-app__label {
+  min-width: 0;
+  flex: 1;
+  white-space: nowrap;
+  /* overflow: hidden;
+  text-overflow: ellipsis; */
+}
+
 .side-card {
   overflow: hidden;
   background: #e8f1f8;