From 0a55dec94953b2dd257ef1df69493851d119f62a Mon Sep 17 00:00:00 2001
From: ssongliu <73214554+ssongliu@users.noreply.github.com>
Date: Tue, 4 Jul 2023 10:42:11 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E8=AE=A1=E5=88=92=E4=BB=BB=E5=8A=A1?=
 =?UTF-8?q?=E3=80=81=E5=AE=B9=E5=99=A8=E5=88=9B=E5=BB=BA=E6=A0=B7=E5=BC=8F?=
 =?UTF-8?q?=E7=A7=BB=E5=8A=A8=E7=AB=AF=E9=80=82=E9=85=8D=20(#1519)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/src/styles/common.scss               |  4 ++++
 frontend/src/styles/moblie.scss               |  4 ++++
 .../container/container/operate/index.vue     |  6 +++---
 frontend/src/views/cronjob/operate/index.vue  | 19 +++++++++++++++++--
 4 files changed, 28 insertions(+), 5 deletions(-)

diff --git a/frontend/src/styles/common.scss b/frontend/src/styles/common.scss
index 205790846..378c2db24 100644
--- a/frontend/src/styles/common.scss
+++ b/frontend/src/styles/common.scss
@@ -338,3 +338,7 @@
 .common-prompt {
     margin-bottom: 20px !important;
 }
+
+.mini-form-item {
+    width: 40% !important;
+}
diff --git a/frontend/src/styles/moblie.scss b/frontend/src/styles/moblie.scss
index e1d8131ba..1fece76f3 100644
--- a/frontend/src/styles/moblie.scss
+++ b/frontend/src/styles/moblie.scss
@@ -65,6 +65,10 @@
             }
         }
     }
+    
+    .mini-form-item {
+        width: 100% !important;
+    }
 
     .database-status {
         .title {
diff --git a/frontend/src/views/container/container/operate/index.vue b/frontend/src/views/container/container/operate/index.vue
index 0850253e8..dea6eb8aa 100644
--- a/frontend/src/views/container/container/operate/index.vue
+++ b/frontend/src/views/container/container/operate/index.vue
@@ -91,7 +91,7 @@
                         </el-checkbox>
                     </el-form-item>
                     <el-form-item :label="$t('container.cpuShare')" prop="cpuShares">
-                        <el-input style="width: 40%" v-model.number="dialogData.rowData!.cpuShares" />
+                        <el-input class="mini-form-item" v-model.number="dialogData.rowData!.cpuShares" />
                         <span class="input-help">{{ $t('container.cpuShareHelper') }}</span>
                     </el-form-item>
                     <el-form-item
@@ -99,7 +99,7 @@
                         prop="nanoCPUs"
                         :rules="checkNumberRange(0, limits.cpu)"
                     >
-                        <el-input style="width: 40%" v-model.number="dialogData.rowData!.nanoCPUs">
+                        <el-input class="mini-form-item" v-model.number="dialogData.rowData!.nanoCPUs">
                             <template #append>
                                 <div style="width: 35px">{{ $t('commons.units.core') }}</div>
                             </template>
@@ -113,7 +113,7 @@
                         prop="memoryItem"
                         :rules="checkNumberRange(0, limits.memory)"
                     >
-                        <el-input style="width: 40%" v-model.number="dialogData.rowData!.memoryItem">
+                        <el-input class="mini-form-item" v-model.number="dialogData.rowData!.memoryItem">
                             <template #append><div style="width: 35px">MB</div></template>
                         </el-input>
                         <span class="input-help">{{ $t('container.limitHelper', [limits.memory]) }}MB</span>
diff --git a/frontend/src/views/cronjob/operate/index.vue b/frontend/src/views/cronjob/operate/index.vue
index a8da8c150..699cc7890 100644
--- a/frontend/src/views/cronjob/operate/index.vue
+++ b/frontend/src/views/cronjob/operate/index.vue
@@ -33,7 +33,7 @@
                     </el-form-item>
 
                     <el-form-item :label="$t('cronjob.cronSpec')" prop="spec">
-                        <el-select style="width: 20%" v-model="dialogData.rowData!.specType">
+                        <el-select class="specTypeClass" v-model="dialogData.rowData!.specType">
                             <el-option
                                 v-for="item in specOptions"
                                 :key="item.label"
@@ -539,9 +539,24 @@ defineExpose({
 </script>
 <style scoped lang="scss">
 .specClass {
-    width: 20%;
+    width: 20% !important;
     margin-left: 20px;
 }
+@media only screen and (max-width: 1000px) {
+    .specClass {
+        width: 100% !important;
+        margin-top: 20px;
+        margin-left: 0;
+    }
+}
+.specTypeClass {
+    width: 20% !important;
+}
+@media only screen and (max-width: 1000px) {
+    .specTypeClass {
+        width: 100% !important;
+    }
+}
 .selectClass {
     width: 100%;
 }