From e20ec4c49f9a4818655e791132cbdfb3cd8bef33 Mon Sep 17 00:00:00 2001
From: Caue Queiroz <cauenqueiroz@gmail.com>
Date: Sat, 30 Jul 2016 21:44:05 -0300
Subject: [PATCH] =?UTF-8?q?Formul=C3=A1rio=20"Indique=20um=20Centro=20Poke?=
 =?UTF-8?q?mon"=20(#16)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* Remove google form iframe

* Add basic html form

* Add some css rules to basic html form

* Change inputs name/label based on google form fields

* Make contact form responsive

* Change send button color
---
 assets/css/main.css         | 23 ++++++++++++++++-
 indicar-centro-pokemon.html | 51 +++++++++++++++++++++++++++++--------
 2 files changed, 63 insertions(+), 11 deletions(-)

diff --git a/assets/css/main.css b/assets/css/main.css
index f2b22f0..e4f893d 100644
--- a/assets/css/main.css
+++ b/assets/css/main.css
@@ -3813,4 +3813,25 @@
 
 	body.is-mobile.landing #footer {
 		background-color: #1d242a;
-	}
\ No newline at end of file
+	}
+
+/* Contact Form */
+	.input-1-3 {
+		float: left;
+		width: 33.33%;
+		padding: 0 1em 0 0;
+	}
+	.input-np {
+		padding-right: 0;
+	}
+	@media screen and (max-width: 736px) {
+		.input-1-3 {
+			float: none;
+			width: 100%;
+			padding: 0;
+		}
+		.register-form .special {
+			float: none;
+			width: 100%;		
+		}
+	}
diff --git a/indicar-centro-pokemon.html b/indicar-centro-pokemon.html
index 7562557..ca8a50c 100644
--- a/indicar-centro-pokemon.html
+++ b/indicar-centro-pokemon.html
@@ -67,16 +67,47 @@ <h2>Indique um centro Pokemon</h2>
         </header>
         <section class="wrapper style5">
           <div class="inner">
-
-            <!--
-            @todo fazer esse iframe responsivo na lagura e possivelmente na altura
-            -->
-            <div style="text-align: center">
-              <iframe src="https://docs.google.com/forms/d/e/1FAIpQLSd6OsZvFzZK-u2ZGMykeGJla50ZJfjGF-qnDZc2AZuY0jFTQw/viewform?embedded=true" 
-                      width="700" height="1600" frameborder="0" marginheight="0" marginwidth="0">
-                Carregando…
-              </iframe>
-            </div>
+            <form action="https://formspree.io/cauenqueiroz@gmail.com" method="POST" class="register-form">
+              <label for="">
+                Nome do local ou pessoa de referência
+                <input type="text" name="nome" required>
+              </label>
+              <label class="input-1-3">
+                Estado
+                <input type="text" name="estado" required>
+              </label>
+              <label class="input-1-3">
+                Cidade
+                <input type="text" name="cidade" required>
+              </label>
+              <label class="input-1-3 input-np">
+                Endereço
+                <input type="text" name="endereco">
+              </label>
+              </label>
+              <label class="input-1-3">
+                Telefone
+                <input type="text" name="telefone">
+              </label>
+              <label class="input-1-3">
+                Email
+                <input type="email" name="email">
+              </label>
+              <label class="input-1-3 input-np">
+                Site/Facebook/etc
+                <input type="text" name="site">
+              </label>
+              <label>
+                Dê uma descrição curta sobre porque esta é uma boa referência. Quais animais têm para adoção?
+                <textarea name="desc" id="" cols="30" rows="5"></textarea>
+              </label>  
+              
+              <label>
+                Seu e-mail de contato (opcional)
+                <input type="email" name="email-contrib">
+              </label>              
+              <input type="submit" class="special">           
+            </form>
           </div>
         </section>
       </article>