From f11d089b617353cb268077b933400238f5125737 Mon Sep 17 00:00:00 2001
From: Victor Quiroz Castro <victorhqc@gmail.com>
Date: Sat, 10 Aug 2019 11:34:22 +0200
Subject: [PATCH] Clean form DOM

---
 resources/views/add_product.blade.php | 174 ++++++++++++++++----------
 1 file changed, 105 insertions(+), 69 deletions(-)

diff --git a/resources/views/add_product.blade.php b/resources/views/add_product.blade.php
index 32f4b8e..9eda0be 100644
--- a/resources/views/add_product.blade.php
+++ b/resources/views/add_product.blade.php
@@ -15,75 +15,111 @@
 
 @section('content')
     <div class="container">
-        <div class="d-flex justify-content-center">
-            <form
-                method="post"
-                action="{{ action('ProductsController@submitProduct') }}"
-                enctype="multipart/form-data"
-            >
-                @csrf
-                <h1>Agregar Productos</h1>
-                <ul class="list-group list-group-flush">
-                    <li class="list-group-item">
-                        <strong>Nombre:</strong>
-                        <input
-                            class="form-control"
-                            type="text"
-                            name="product_name"
-                            required
-                        />
-                    </li>
-                    <li class="list-group-item">
-                        <strong>Descripción:</strong>
-                        <input
-                            class="form-control"
-                            type="text"
-                            name="product_description"
-                            required
-                        />
-                    </li>
-                    <li class="list-group-item">
-                        <strong>Tipo de producto:</strong>
-                        <select name="product_type" class="form-control" required>
-                            <option value="">Seleccione una opción</option>
-                            @foreach($productsTypes as $type)
-                                <option value="{{$type['id']}}">
-                                    {{$type['name']}}
-                                </option>
-                            @endforeach
-                        </select>
-                    </li>
-                    <li class="list-group-item">
-                        <strong>Marca de producto:</strong>
-                        <select name="product_brand" class="form-control" required>
-                            <option value="">Seleccione una opción</option>
-                            @foreach($brands as $brand)
-                                <option value="{{$brand['id']}}">
-                                    {{$brand['name']}}
-                                </option>
-                            @endforeach
-                        </select>
-                    </li>
-                    <li class="list-group-item">
-                        <strong>Selecciona una imagen:</strong><br>
-                        <input
-                            type="file"
-                            class="upload_file btn btn-warning"
-                            name="upload_file"
-                            required
-                        >
-                    </li>
-                    <li class="list-group-item">
-                        <button
-                            type="submit"
-                            class="btn btn-success"
-                        >
+        <h1 class="mt-sm-3 mb-sm-5">Agregar Producto</h1>
+        <form
+            method="post"
+            action="{{ action('ProductsController@submitProduct') }}"
+            enctype="multipart/form-data"
+        >
+            @csrf
+            <div class="form-group row">
+                <label
+                    for="product_name"
+                    class="col-sm-2 col-form-label">
+                    Nombre
+                </label>
+                <div class="col-sm-6">
+                    <input
+                        type="text"
+                        name="product_name"
+                        class="form-control"
+                        id="product_name"
+                        required
+                    />
+                </div>
+            </div>
+            <div class="form-group row">
+                <label
+                    for="product_description"
+                    class="col-sm-2 col-form-label">
+                    Descripción
+                </label>
+                <div class="col-sm-6">
+                    <input
+                        type="text"
+                        name="product_description"
+                        id="product_description"
+                        class="form-control"
+                        required
+                    />
+                </div>
+            </div>
+            <div class="form-group row">
+                <label
+                    for="product_type"
+                    class="col-sm-2 col-form-label">
+                    Tipo de producto
+                </label>
+                <div class="col-sm-6">
+                    <select
+                        name="product_type"
+                        id="product_type"
+                        class="form-control"
+                        required>
+                        <option value="">Seleccione una opción</option>
+                        @foreach($productsTypes as $type)
+                            <option value="{{$type['id']}}">
+                                {{$type['name']}}
+                            </option>
+                        @endforeach
+                    </select>
+                </div>
+            </div>
+            <div class="form-group row">
+                <label
+                    for="product_brand"
+                    class="col-sm-2 col-form-label">
+                    Marca
+                </label>
+                <div class="col-sm-6">
+                    <select
+                        name="product_brand"
+                        id="product_brand"
+                        class="form-control"
+                        required>
+                        <option value="">Seleccione una opción</option>
+                        @foreach($brands as $brand)
+                            <option value="{{$brand['id']}}">
+                                {{$brand['name']}}
+                            </option>
+                        @endforeach
+                    </select>
+                </div>
+            </div>
+            <div class="form-group row">
+                <label
+                    for="upload_file"
+                    class="col-sm-2 col-form-label">
+                    Subir imagen
+                </label>
+                <div class="col-sm-6">
+                    <input
+                        type="file"
+                        class="upload_file"
+                        name="upload_file"
+                        id="upload_file"
+                        required
+                    />
+                </div>
+            </div>
+            <div class="row">
+                <div class="col-sm-8">
+                    <button type="submit" class="btn btn-success pull-right">
                         <i class="fa fa-plus-square" aria-hidden="true"></i>
-                            Agregar
-                        </button>
-                    </li>                    
-                </ul>
-            </form>
-        </div>
+                        Crear producto
+                    </button>
+                </div>
+            </div>
+        </form>
     </div>
 @endsection