changeset 2432:851c904416f6

client: import soundingresults: html cleanup
author Markus Kottlaender <markus@intevation.de>
date Fri, 01 Mar 2019 07:58:02 +0100
parents 48495bd3081d
children 64be06696899
files client/src/components/ImportSoundingresults.vue
diffstat 1 files changed, 18 insertions(+), 21 deletions(-) [+]
line wrap: on
line diff
--- a/client/src/components/ImportSoundingresults.vue	Thu Feb 28 19:44:38 2019 +0100
+++ b/client/src/components/ImportSoundingresults.vue	Fri Mar 01 07:58:02 2019 +0100
@@ -2,12 +2,19 @@
   <div class="main d-flex flex-column">
     <div class="d-flex flex-row">
       <Spacer></Spacer>
-      <div class="card shadow-xs mt-3 mr-3 w-100 importsoundingresultscard">
+      <div class="card shadow-xs mt-3 mr-3 w-100 h-100">
         <UIBoxHeader icon="upload" title="Import Soundingresults" />
-        <div v-if="editState" class="ml-auto mr-auto mt-4 w-95">
-          <div class="d-flex flex-column">
-            <div class="d-flex flex-row">
-              <div class="mt-1 text-left w-50 ml-2 mr-4">
+        <div v-if="editState">
+          <div
+            v-for="(message, index) in messages"
+            :key="index"
+            class="alert alert-warning small rounded-0"
+          >
+            {{ message }}
+          </div>
+          <div class="container">
+            <div class="row">
+              <div class="col-5">
                 <small class="text-muted">
                   <translate>Bottleneck</translate>
                 </small>
@@ -24,7 +31,7 @@
                   </small>
                 </span>
               </div>
-              <div class="d-flex flex-column mt-1 text-left w-50 mr-2">
+              <div class="col-2">
                 <small class="text-muted">
                   <translate>Projection</translate>&nbsp;(EPSG)
                 </small>
@@ -41,9 +48,7 @@
                   </small>
                 </span>
               </div>
-            </div>
-            <div class="d-flex flex-row">
-              <div class="mt-1 text-left w-50 ml-2 mr-4">
+              <div class="col-2">
                 <small class="text-muted">
                   <translate>Depthreference</translate>
                 </small>
@@ -64,7 +69,7 @@
                   </small>
                 </span>
               </div>
-              <div class="mt-1 text-left w-50 mr-2">
+              <div class="col-3">
                 <small class="text-muted"> <translate>Date</translate> </small>
                 <input
                   id="importdate"
@@ -82,15 +87,11 @@
                 </span>
               </div>
             </div>
-          </div>
-          <div class="ml-2 mt-2 text-left">
-            <small v-for="(message, index) in messages" :key="index">
-              {{ message }}
-            </small>
+            <div class="row"></div>
           </div>
         </div>
-        <div class="w-95 ml-auto mr-auto mt-4 mb-4">
-          <div v-if="uploadState" class="d-flex flex-row input-group mb-4">
+        <div class="container py-5">
+          <div v-if="uploadState" class="input-group">
             <div class="custom-file">
               <input
                 accept=".zip"
@@ -352,10 +353,6 @@
 </script>
 
 <style lang="scss" scoped>
-.importsoundingresultscard {
-  height: 100%;
-}
-
 .projectionLabel {
   margin-left: $small-offset;
 }