move stock mouvements validation text&button

stock/static/css/stock_movements.css

-.main, .barcode_search_area {
+.main {
   margin-top: 40px;
 }
 
+.top_content {
+  margin-top: 40px;
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: space-between;
+  align-items: center;
+}
+
+.top_content_item {
+  flex: 1 0 33%;
+}
+
 #sm_barcode_selector {
   border: 1px solid #555;
   border-radius:10px;
@@ -11,10 +23,6 @@
   max-width: 60px;
 }
 
-#movement_validation_button {
-  margin-top: 20px;
-}
-
 .notifyjs-test1-base {
   background: #5CB85C !important;
 }

stock/static/js/stock_movements.js

@@ -185,7 +185,7 @@ function init_datatable() {
         });
 
         // Show validation button
-        $('.footer').show();
+        $('.movement_validation_area').show();
     }
 }
 
@@ -333,7 +333,7 @@ var add_product = function(product) {
         }
 
         update_total_value();
-        $('.footer').show(); // if is a second or more access, footer is hidden (init_datatable is not fired)
+        $('.movement_validation_area').show(); // if is a second or more access, movement_validation_area is hidden (init_datatable is not fired)
     } catch (e) {
         err = {msg: e.name + ' : ' + e.message, ctx: 'add_product'};
         console.error(err);
@@ -702,7 +702,7 @@ function do_stock_movement() {
 
                 products = [];
                 products_table.clear().draw();
-                $('.footer').hide();
+                $('.movement_validation_area').hide();
 
 
             },

templates/stock/stock_movements.html

@@ -48,22 +48,28 @@
       <p><i>Vous pouvez également taper le codebarre, puis appuyer sur la touche Entrée.</i></p>
     </div>
 
-    <div class="barcode_search_area txtcenter">
-      <input type="text" id="sm_barcode_selector" placeholder="Codebarre">
-      <div id="icon_product_not_found" class="tooltip" style="display:none;">
-        <span class="tooltiptext tooltip-lg tt_twolines">Aucun produit trouvé avec ce code-barre.</span>
-        <span style="color: #d9534f;"> <i class="fas fa-ban"></i>
+    <div class="top_content">
+      <div class="top_content_item top_content_left">
+        <div class="movement_validation_area txtcenter" style="display:none">
+          <h4>Total (H.T.) : <span class="total_value">0</span> €</h4>
+          <button type="button" class="btn--primary" id="movement_validation_button" name="button">Validation du total des produits saisis</button>
         </div>
+      </div>
+      <div class="barcode_search_area txtcenter top_content_item top_content_left">
+        <input type="text" id="sm_barcode_selector" placeholder="Codebarre">
+        <div id="icon_product_not_found" class="tooltip" style="display:none;">
+          <span class="tooltiptext tooltip-lg tt_twolines">Aucun produit trouvé avec ce code-barre.</span>
+          <span style="color: #d9534f;"> <i class="fas fa-ban"></i>
+          </div>
+      </div>
+      <div class="top_content_item top_content_left"></div>
     </div>
 
     <div class="main">
       <table id="products_table" class="display" cellspacing="0" ></table>
     </div>
 
-    <div class="footer txtcenter" style="display:none">
-      <h4>Total (H.T.) : <span class="total_value">0</span> €</h4>
-      <button type="button" class="btn--primary" id="movement_validation_button" name="button">Validation du total des produits saisis</button>
-    </div>
+    
     <input type="hidden" name="barcode"/>
   </div>