fix

src/features/admin/terms/pages/TermFormPage.vue

@@ -14,16 +14,6 @@
 
     <form class="term-form__form" @submit.prevent="onSubmit">
       <div class="term-form__grid">
-        <div class="term-form__image-col">
-          <ImageCropper
-            v-model="image"
-            name="image"
-            bg-color="#eeeeee"
-            @crop="onImageCropped"
-            @error="onImageError"
-          />
-        </div>
-
         <div class="term-form__main-col">
           <LineTitleBlock title="اطلاعات ترم" title-en="Term Details" />
           <div class="term-form__row">
@@ -91,6 +81,16 @@
             </div>
           </div>
         </div>
+
+        <div class="term-form__image-col">
+          <ImageCropper
+            v-model="image"
+            name="image"
+            bg-color="#eeeeee"
+            @crop="onImageCropped"
+            @error="onImageError"
+          />
+        </div>
       </div>
 
       <div class="term-form__divider" />
@@ -249,29 +249,23 @@ const onCancel = () => router.push({ name: 'admin-terms' })
     gap: 1rem;
 
     @media (min-width: 1024px) {
-      grid-template-columns: 4fr 8fr;
+      grid-template-columns: 8fr 4fr;
     }
 
     @media (min-width: 1280px) {
-      grid-template-columns: 3fr 9fr;
+      grid-template-columns: 9fr 3fr;
     }
   }
 
   &__image-col {
-    order: 2;
-
     @media (min-width: 1024px) {
-      order: 1;
       padding: 0.5rem;
     }
   }
 
   &__main-col {
-    order: 1;
-
     @media (min-width: 1024px) {
-      order: 2;
-      padding-inline-start: 1.25rem;
+      padding-inline-end: 1.25rem;
     }
   }
 
@@ -312,7 +306,7 @@ const onCancel = () => router.push({ name: 'admin-terms' })
 
   &__actions {
     display: flex;
-    justify-content: flex-end;
+    justify-content: space-between;
     gap: 0.625rem;
   }