ciclos

commit d9124417caa146f3bf349e798ac79c3a8af91771

Author: Pedro Lucas Porcellis <pedrolucasporcellis@gmail.com>

Update to conform with new form structures

 core/templates/login.html | 55 +++++++-----
 core/templates/new_cycle.html | 104 ++++++++++++------------
 core/templates/new_group.html | 54 ++++++++----
 core/templates/new_product.html | 109 +++++++++++++++----------
 core/templates/new_product_category.html | 53 +++++++-----
 core/templates/sign_up.html | 67 ++++++++-------


diff --git a/core/templates/login.html b/core/templates/login.html
index e44cddf9b6aa7c9d85a728b93a9c8410a99612c5..ebf53870cac985d6b6422994deb65a78be3824be 100644
--- a/core/templates/login.html
+++ b/core/templates/login.html
@@ -1,32 +1,39 @@
 {% extends 'layout.html' %}
 
 {% block body %}
-  {% with messages = get_flashed_messages() %}
-  {% if messages %}
-    <section>
-      {{ messages[0] }}
-    </section>
-  {% endif %}
-  {% endwith %}
-  <section>
-    <h2> Entrar na sua conta </h2>
-    <p> Use suas credenciais para entrar na sua conta </p>
-  </section>
+{% with messages = get_flashed_messages() %}
+{% if messages %}
+<section class="mt-5 mb-5">
+	{{ messages[0] }}
+</section>
+{% endif %}
+{% endwith %}
+
+<form method="POST" action="/auth/login">
+	<fieldset class="umbo-fieldset">
+		<legend class="legend-xl umbo-fieldset-legend">
+			<h1>Entrar na sua conta</h1>
+			<span class="hint">
+				Use suas credenciais para entrar na sua conta
+			</span>
+		</legend>
+
+
+		<div class='umbo-form-group'>
+			<label class="umbo-label" for="email">Email</label>
+			<input class="umbo-input" type="email" placeholder="seu@email.com" name="email" />
+		</div>
 
-  <form method="POST" action="/auth/login">
-    <div class='form-section'>
-      <label for="email">Email</label>
-      <input type="email" placeholder="seu@email.com" name="email" />
-    </div>
+		<div class='umbo-form-group'>
+			<label for="password" class="umbo-label">Senha</label>
+			<input class="umbo-input" type="password" placeholder="******" name="password" />
+		</div>
 
-    <div class='form-section'>
-      <label for="password">Senha</label>
-      <input type="password" placeholder="******" name="password" />
-    </div>
+		<div class='umbo-form-actions'>
+			<button type="submit" rel="button"> Entrar </button>
+		</div>
 
-    <div class='form-action'>
-      <button type="submit" rel="button"> Entrar </button>
-    </div>
-  </form>
+	</fieldset>
+</form>
 {% endblock %}
 




diff --git a/core/templates/new_cycle.html b/core/templates/new_cycle.html
index cc97f9bc9700589f3affee8766671b1990b85dfb..6cb6024c5f368f3d24e07e7d0d63b1bf4bb3a2ae 100644
--- a/core/templates/new_cycle.html
+++ b/core/templates/new_cycle.html
@@ -1,18 +1,32 @@
 {% extends 'layout.html' %}
 
 {% block body %}
-  <form action="/cycles/" method="POST">
+  <form action="/cycles/" method="POST" class="mt-5">
 	<div class="form-section">
-	  <label for="">Título desse ciclo</label>
-	  <input type="text" name="name">
+	  <label class="umbo-label" for="">Título desse ciclo</label>
+	  <input class="umbo-input" type="text" name="name">
 	</div>
 	<div class="form-section">
-	  <label for="">Descrição</label>
-	  <textarea rows="10" columns="10" name="description"></textarea>
+	  <label class="umbo-label" for="">Descrição</label>
+	  <textarea class="umbo-input" rows="10" cols="72" name="description"></textarea>
 	</div>
 
-	<fieldset>
-		<legend class="legend-xl">
+	<div class="form-section">
+		<label class="umbo-label" for="">Margem sobre o valor dos produtos nesse ciclo</label>
+		<input name="price_margin" type="number" step="0.1" class="umbo-input" />
+	</div>
+
+	<div class="form-section">
+	  <label class="umbo-label" for="">Estado inicial desse ciclo</label>
+	  <select class="umbo-input" name="status">
+		{% for cycle in cycles %}
+		  <option value="{{cycle[0]}}">{{cycle[1]}}</option>
+		{% endfor %}
+	  </select>
+	</div>
+
+	<fieldset class="umbo-fieldset">
+		<legend class="legend-xl umbo-fieldset-legend">
 			<h1> Quando esse ciclo se inicia? </h1>
 		</legend>
 
@@ -23,28 +37,28 @@
 		<div class="form-date-group">
 			<div class="date-group-item">
 				<div class="form-section">
-					<label for="">Dia</label>
-					<input class="form-input-width-2" name="start_at_day" type="text">
+					<label class="umbo-label" for="">Dia</label>
+					<input class="umbo-input" name="start_at_day" type="text">
 				</div>
 			</div>
 			<div class="date-group-item">
 				<div class="form-section">
-					<label for="">Mês</label>
-					<input class="form-input-width-2" name="start_at_month" type="text">
+					<label class="umbo-label" for="">Mês</label>
+					<input class="umbo-input" name="start_at_month" type="text">
 				</div>
 			</div>
 			<div class="date-group-item">
 				<div class="form-section">
-					<label for="">Ano</label>
-					<input class="form-input-width-4" name="start_at_year" type="text" readonly value="2020">
+					<label class="umbo-label" for="">Ano</label>
+					<input class="umbo-input" name="start_at_year" type="text" readonly value="2020">
 				</div>
 			</div>
 		</div>
 	</fieldset>
 
 
-	<fieldset>
-		<legend class="legend-xl">
+	<fieldset class="umbo-fieldset">
+		<legend class="legend-xl umbo-fieldset-legend">
 			<h1> Quando esse ciclo se encerra? </h1>
 		</legend>
 
@@ -55,28 +69,28 @@
 		<div class="form-date-group">
 			<div class="date-group-item">
 				<div class="form-section">
-					<label for="">Dia</label>
-					<input class="form-input-width-2" name="end_at_day" type="text">
+					<label class="umbo-label" for="">Dia</label>
+					<input class="umbo-input" name="end_at_day" type="text">
 				</div>
 			</div>
 			<div class="date-group-item">
 				<div class="form-section">
-					<label for="">Mês</label>
-					<input class="form-input-width-2" name="end_at_month" type="text">
+					<label class="umbo-label" for="">Mês</label>
+					<input class="umbo-input" name="end_at_month" type="text">
 				</div>
 			</div>
 			<div class="date-group-item">
 				<div class="form-section">
-					<label for="">Ano</label>
-					<input class="form-input-width-4" name="end_at_year" type="text" readonly value="2020">
+					<label class="umbo-label" for="">Ano</label>
+					<input class="umbo-input" name="end_at_year" type="text" readonly value="2020">
 				</div>
 			</div>
 		</div>
 	</fieldset>
 
 
-	<fieldset>
-		<legend class="legend-xl">
+	<fieldset class="umbo-fieldset">
+		<legend class="legend-xl umbo-fieldset-legend">
 			<h1> Quando começa o período de entrega? </h1>
 		</legend>
 
@@ -87,28 +101,28 @@
 		<div class="form-date-group">
 			<div class="date-group-item">
 				<div class="form-section">
-					<label for="">Dia</label>
-					<input class="form-input-width-2" name="delivery_start_at_day" type="text">
+					<label class="umbo-label" for="">Dia</label>
+					<input class="umbo-input" name="delivery_start_at_day" type="text">
 				</div>
 			</div>
 			<div class="date-group-item">
 				<div class="form-section">
-					<label for="">Mês</label>
-					<input class="form-input-width-2" name="delivery_start_at_month" type="text">
+					<label class="umbo-label" for="">Mês</label>
+					<input class="umbo-input" name="delivery_start_at_month" type="text">
 				</div>
 			</div>
 			<div class="date-group-item">
 				<div class="form-section">
-					<label for="">Ano</label>
-					<input class="form-input-width-4" name="delivery_start_at_year" type="text" readonly value="2020">
+					<label class="umbo-label" for="">Ano</label>
+					<input class="umbo-input" name="delivery_start_at_year" type="text" readonly value="2020">
 				</div>
 			</div>
 		</div>
 	</fieldset>
 
 
-	<fieldset>
-		<legend class="legend-xl">
+	<fieldset class="umbo-fieldset">
+		<legend class="legend-xl umbo-fieldset-legend">
 			<h1> Quando se encerra o período de entrega? </h1>
 		</legend>
 
@@ -119,40 +133,26 @@
 		<div class="form-date-group">
 			<div class="date-group-item">
 				<div class="form-section">
-					<label for="">Dia</label>
-					<input class="form-input-width-2" name="delivery_end_at_day" type="text">
+					<label class="umbo-label" for="">Dia</label>
+					<input class="umbo-input" name="delivery_end_at_day" type="text">
 				</div>
 			</div>
 			<div class="date-group-item">
 				<div class="form-section">
-					<label for="">Mês</label>
-					<input class="form-input-width-2" name="delivery_end_at_month" type="text">
+					<label class="umbo-label" for="">Mês</label>
+					<input class="umbo-input" name="delivery_end_at_month" type="text">
 				</div>
 			</div>
 			<div class="date-group-item">
 				<div class="form-section">
-					<label for="">Ano</label>
-					<input class="form-input-width-4" name="delivery_end_at_year" type="text" readonly value="2020">
+					<label class="umbo-label" for="">Ano</label>
+					<input class="umbo-input" name="delivery_end_at_year" type="text" readonly value="2020">
 				</div>
 			</div>
 		</div>
 	</fieldset>
 
-	<div class="form-section">
-		<label for="">Margem sobre o valor dos produtos nesse ciclo</label>
-		<input name="price_margin" type="number" step="0.1" class="form-input-width-4" />
-	</div>
-
-	<div class="form-section">
-	  <label for="">Estado inicial desse ciclo</label>
-	  <select name="status">
-		{% for cycle in cycles %}
-		  <option value="{{cycle[0]}}">{{cycle[1]}}</option>
-		{% endfor %}
-	  </select>
-	</div>
-
-	<div class="form-action">
+	<div class="umbo-form-actions mt-5 mb-5">
 	  <button class="btn btn-primary" type="submit">Criar Ciclo</button>
 	</div>
   </form>




diff --git a/core/templates/new_group.html b/core/templates/new_group.html
index 7b654c6b845bce228168dde80df45c3fbe5c5001..36b6c3305ca41d410a191f3a62da0f5b3aa1c740 100644
--- a/core/templates/new_group.html
+++ b/core/templates/new_group.html
@@ -13,27 +13,47 @@   
 
   <form action='{{ url_for('groups.index') }}' method="POST">
 
-    <div class="form-section">
-      <label for="name">Name</label>
-      <input type="text" placeholder="Name" name="name">
-    </div>
+	<fieldset class="umbo-fieldset">
+		<legend class="legend-xl umbo-fieldset-legend">
+			<h1> Quais as informações básicas desse fornecedor? </h1>
+		</legend>
 
-    <div class="form-section">
-      <label for="location">Location</label>
-      <input type="text" placeholder="Location" name="location">
-    </div>
+		<span class="hint">
+			Nome, onde eles se localizam
+		</span>
 
-    <div class="form-section">
-      <label for="lat">Lat</label>
-      <input type="text" placeholder="Lat" name="lat">
-    </div>
+		<div class="umbo-form-group">
+		  <label class="umbo-label" for="name">Nome do Fornecedor</label>
+		  <input class="umbo-input" type="text" placeholder="Gonçalo" name="name">
+		</div>
 
-    <div class="form-section">
-      <label for="lng">Lng</label>
-      <input type="text" placeholder="Lng" name="lng">
-    </div>
+		<div class="umbo-form-group">
+		  <label class="umbo-label" for="location">Localização</label>
+		  <input class="umbo-input" type="text" placeholder="Pelotas, RS" name="location">
+		</div>
+	</fieldset>
+
+	<fieldset class="umbo-fieldset">
+		<legend class="legend-xl umbo-fieldset-legend">
+			<h1>Informações adicionais sobre a Localização</h1>
+		</legend>
+
+		<span class="hint">
+			Essas informações são opcionais, mas nos ajudarão a marcar com precisão
+		</span>
 
-    <div class="form-action">
+		<div class="umbo-form-group">
+		  <label class="umbo-label" for="lat">Latitude Geográfica</label>
+		  <input class="umbo-input" type="text" placeholder="-33.513" name="lat">
+		</div>
+
+		<div class="umbo-form-group">
+		  <label class="umbo-label" for="lng">Longitude Geográfica</label>
+		  <input class="umbo-input" type="text" placeholder="-54.122" name="lng">
+		</div>
+	</fieldset>
+
+    <div class="umbo-form-actions">
       <button type="submit" rel="button">Criar Grupo </button>
     </div>
 




diff --git a/core/templates/new_product.html b/core/templates/new_product.html
index 6e66fa9dcc96847e377a41226af0f929467f1fdb..f67883b14372231f601eaf4c4b46cd89512e976b 100644
--- a/core/templates/new_product.html
+++ b/core/templates/new_product.html
@@ -1,56 +1,81 @@
 {% extends 'layout.html' %}
 
 {% block body %}
-  <section class="messages">
-    {% with messages = get_flashed_messages() %}
-    {% if messages %}
-      <section>
-        {{ messages[0] }}
-      </section>
-    {% endif %}
-    {% endwith %}
-  </section>
+<section class="messages">
+	{% with messages = get_flashed_messages() %}
+	{% if messages %}
+	<section>
+		{{ messages[0] }}
+	</section>
+	{% endif %}
+	{% endwith %}
+</section>
+
+<form action='{{ url_for('products.index') }}' method="POST">
+
+	<fieldset class="umbo-fieldset">
+		<legend class="legend-xl umbo-fieldset-legend">
+			<h1>Informações básicas sobre esse produto</h1>
+		</legend>
+
+		<div class="umbo-form-group">
+			<label class="umbo-label" for="title">Título do Produto</label>
+			<input class="umbo-input" type="text" placeholder="Mucilon Agroecologico" name="title">
+		</div>
+
+		<div class="umbo-form-group">
+			<label class="umbo-label" for="description">Descreva o produto</label>
+			<textarea class="umbo-input" rows="10" cols="72" placeholder="Description" name="description"></textarea>
+		</div>
+	</fieldset>
 
-  <form action='{{ url_for('products.index') }}' method="POST">
+	<fieldset class="umbo-fieldset">
+		<legend class="legend-xl umbo-fieldset-legend">
+			<h1>Categoria e de quem pertence esse produto?</h1>
+			<span class="hint">
+				Se não estiver na lista, cadastre primeiro <a href="{{ url_for('product_categories.new') }}">aqui</a>
+			</span>
+		</legend>
 
-    <div class="form-section">
-      <label for="title">Title</label>
-      <input type="text" placeholder="Title" name="title">
-    </div>
+		<div class="umbo-form-group">
+			<label class="umbo-label" for="group_id">Fornecedor</label>
+			<select class="umbo-input" id="" name="group_id">
+				{% for group in groups %}
+				<option value="{{group.id}}">{{group.name}}</option>
+				{% endfor %}
+			</select>
+		</div>
 
-    <div class="form-section">
-      <label for="description">Description</label>
-      <textarea rows="10" columns="50" placeholder="Description" name="description"></textarea>
-    </div>
+		<div class="umbo-form-group">
+			<label class="umbo-label" for="category_id">Categoria</label>
+			<select class="umbo-input" id="" name="category_id">
+				{% for category in categories %}
+				<option value="{{ category.id }}">{{ category.name }}</option>
+				{% endfor %}
+			</select>
+		</div>
+	</fieldset>
 
-    <div class="form-section">
-      <label for="group_id">Group</label>
-      <select id="" name="group_id">
-        {% for group in groups %}
-          <option value="{{group.id}}">{{group.name}}</option>
-        {% endfor %}
-      </select>
-    </div>
+	<fieldset class="umbo-fieldset">
+		<legend class="legend-xl umbo-fieldset-legend">
+			<h1>Valor do produto</h1>
 
-    <div class="form-section">
-      <label for="category_id">Category</label>
-      <select id="" name="category_id">
-        {% for category in categories %}
-          <option value="{{ category.id }}">{{ category.name }}</option>
-        {% endfor %}
-      </select>
-    </div>
+			<span class="hint">
+				Esse é o valor sem a margem, que será adicionada a cada ciclo
+			</span>
+		</legend>
 
-    <div class="form-section">
-      <label for="price">Price</label>
-      <input type="text" placeholder="14.20" name="price" />
-    </div>
+		<div class="umbo-form-group">
+			<label class="umbo-label" for="price">Price</label>
+			<input class="umbo-input" type="text" placeholder="14.20" name="price" />
+		</div>
+	</fieldset>
 
-    <div class="form-action">
-      <button type="submit" rel="button">Criar Produto</button>
-    </div>
+	<div class="umbo-form-actions">
+		<button type="submit" rel="button">Criar Produto</button>
+	</div>
 
-  </form>
+</form>
 {% endblock %}
 
 




diff --git a/core/templates/new_product_category.html b/core/templates/new_product_category.html
index a9fa5af3c7b61e4e08b73eeadf02b8be735a3c63..6bf438412418ca4330a18f00176db08cf73b3e13 100644
--- a/core/templates/new_product_category.html
+++ b/core/templates/new_product_category.html
@@ -1,33 +1,42 @@
 {% extends 'layout.html' %}
 
 {% block body %}
-  <section class="messages">
-    {% with messages = get_flashed_messages() %}
-    {% if messages %}
-      <section>
-        {{ messages[0] }}
-      </section>
-    {% endif %}
-    {% endwith %}
-  </section>
+<section class="messages">
+	{% with messages = get_flashed_messages() %}
+	{% if messages %}
+	<section>
+		{{ messages[0] }}
+	</section>
+	{% endif %}
+	{% endwith %}
+</section>
+
+<form action='{{ url_for('product_categories.index') }}' method="POST">
+	<fieldset class="umbo-fieldset">
+		<legend class="legend-xl">
+			<h1>Informações básicas</h1>
 
-  <form action='{{ url_for('product_categories.index') }}' method="POST">
+			<span class="hint">
+				Descreva qual tipo de produtos entram nessa categoria
+			</span>
+		</legend>
 
-    <div class="form-section">
-      <label for="name">Name</label>
-      <input type="text" placeholder="Name" name="name">
-    </div>
+		<div class="umbo-form-group">
+			<label class="umbo-label" for="name">Name</label>
+			<input class="umbo-input" type="text" placeholder="Name" name="name">
+		</div>
 
-    <div class="form-section">
-      <label for="description">Description</label>
-      <textarea rows="10" columns="50" placeholder="Description" name="description"></textarea>
-    </div>
+		<div class="umbo-form-group">
+			<label class="umbo-label" for="description">Description</label>
+			<textarea class="umbo-input" rows="10" cols="72" placeholder="Description" name="description"></textarea>
+		</div>
+	</fieldset>
 
-    <div class="form-action">
-      <button type="submit" rel="button">Criar Categoria</button>
-    </div>
+	<div class="umbo-form-actions">
+		<button type="submit" rel="button">Criar Categoria</button>
+	</div>
 
-  </form>
+</form>
 {% endblock %}
 
 




diff --git a/core/templates/sign_up.html b/core/templates/sign_up.html
index 0c8a2e85392e4d7da7484a503ac6225478dc40bf..34ac256d1510013ae134e5bd36795fab169a4f35 100644
--- a/core/templates/sign_up.html
+++ b/core/templates/sign_up.html
@@ -1,45 +1,48 @@
 {% extends 'layout.html' %}
 
 {% block body %}
-  <form method="POST" action="/auth/sign_up">
-    <section>
-      <h2> Comece a consumir responsávelmente </h2>
-      <p>
-        Ao se cadastrar você poderá <mark>fazer pedidos</mark> na feira, acompanhar os ciclos
-        e contribuir para uma alimentação <mark>saudável</mark>, <mark>responsável</mark> e <mark>consciente</mark>.
-      </p>
-    </section>
+<form method="POST" action="/auth/sign_up">
+	<fieldset class="umbo-fieldset">
+		<legend class="legend-xl umbo-fieldset-legend">
+			<h1>Comece a consumir responsávelmente</h1>
+			<span class="hint">
+				Ao se cadastrar você poderá <mark>fazer pedidos</mark> na feira, acompanhar os ciclos
+				e contribuir para uma alimentação <mark>saudável</mark>, <mark>responsável</mark> e <mark>consciente</mark>.
+			</span>
+		</legend>
 
-    <div class='form-section'>
-      <label for="username">Username</label>
-      <input type="text" placeholder="Username" name="username" />
-    </div>
+		<div class='form-section'>
+			<label class="umbo-label" for="username">Username</label>
+			<input class="umbo-input" type="text" placeholder="Username" name="username" />
+		</div>
+
+		<div class='form-section'>
+			<label class="umbo-label" for="email">Email</label>
+			<input class="umbo-input" type="email" placeholder="email@host.com" name="email" />
+		</div>
 
-    <div class='form-section'>
-      <label for="email">Email</label>
-      <input type="email" placeholder="email@host.com" name="email" />
-    </div>
+		<div class='form-section'>
+			<label class="umbo-label" for="password">Password</label>
+			<input class="umbo-input" type="password" placeholder="********" name="password" />
+		</div>
 
-    <div class='form-section'>
-      <label for="password">Password</label>
-      <input type="password" placeholder="********" name="password" />
-    </div>
+		<div class='form-section'>
+			<label class="umbo-label" for="first_name">First Name</label>
+			<input class="umbo-input" type="text" placeholder="John Doe" name="first_name" />
+		</div>
 
-    <div class='form-section'>
-      <label for="first_name">First Name</label>
-      <input type="text" placeholder="John Doe" name="first_name" />
-    </div>
+		<div class='form-section'>
+			<label class="umbo-label" for="last_name"> Last Name </label>
+			<input class="umbo-input" type="text" placeholder="Doe" name="last_name" />
+		</div>
 
-    <div class='form-section'>
-      <label for="last_name"> Last Name </label>
-      <input type="text" placeholder="Doe" name="last_name" />
-    </div>
+	</fieldset>
 
-    <div class='form-action'>
-      <button type="submit"> Sign Up </button>
-    </div>
+	<div class='umbo-form-actions'>
+		<button class="umbo-button"  type="submit"> Sign Up </button>
+	</div>
 
-  </form>
+</form>
 
 {% endblock %}