Adiciona botao 'sobre'

Atualiza design

diff --git a/css/forms.css b/css/forms.css
index 0ceb0f18e128300c49c711fb5269999667191832..0b68c02e4dc7d11fbdc54c94ea56852b41f62c04 100644 (file)
--- a/css/forms.css
+++ b/css/forms.css
@@ -62,6 +62,9 @@ h1 {
 }
 
 .button-container {
+  display: flex;
+  justify-content: space-around;
+  flex-wrap: wrap;
   text-align: center;
 }
 
@@ -247,8 +250,8 @@ fieldset {
   border: 1px solid currentColor;
   font-size: 1.1rem;
   color: #4f93ce;
-  margin: 3rem 0;
-  padding: 0.75rem 3rem;
+  margin: 3% 0;
+  padding: 1% 3%;
   cursor: pointer;
   -webkit-transition: background-color 0.28s ease, color 0.28s ease,
     box-shadow 0.28s ease;

diff --git a/css/styles.css b/css/styles.css
index 19838df1c4f03e3dba4d7f6ca1e27146232f80b1..6276a32bcf405ed2d5f1d9ceb8c326c80d1ecf2a 100644 (file)
--- a/css/styles.css
+++ b/css/styles.css
@@ -1,5 +1,10 @@
+body {
+  background-color: #eee;
+}
+
 #logo {
   display: flex;
   padding: 2%;
   display: none;
+  width: 100%;
 }

diff --git a/index.html b/index.html
index 71ff4c1b5e4ff615937ce9007e9ce3b0b06e92ff..64ddb9764d61411d16bcb06983a8b42d1a89cc86 100644 (file)
--- a/index.html
+++ b/index.html
@@ -17,7 +17,7 @@
             <h1>Antifa Generator</h1>
             <div class="form-group">
                 <input id="antifa-group" type="text" required="required" />
-                <label for="input" class="control-label">Digite o grupo a qual você pertence</label><i class="bar"></i>
+                <label for="input" class="control-label">Grupo</label><i class="bar"></i>
             </div>
             <div class="form-group">
                 <select id='antifa-label'>
@@ -27,11 +27,12 @@
                 <label for="select" class="control-label"></label><i class="bar"></i>
             </div>
         </form>
-
-
         <div class="button-container">
             <button type="button" class="button" onClick="generateImage()"><span>Gerar imagem</span></button>
             <button type="button" class="button" onClick="downloadImage()"><span>Baixar</span></button>
+            <button type="button" class="button"
+                onclick="window.open('https://medium.com/@matheusMmota/antifascismo-n%C3%A3o-%C3%A9-moldura-para-o-seu-perfil-d648c1b3caa8')"><span>Antifacista?</span></button>
+
         </div>
 
 
@@ -46,10 +47,7 @@
         function generateImage() {
             antifaGroup = document.getElementById('antifa-group')
             antifaLabel = document.getElementById('antifa-label')
-            console.log('antifaGropup.value :>> ', antifaGroup.value);
-            console.log('antifaLabel.value :>> ', antifaLabel.value);
 
-            // const logoCanvas = document.getElementById('logo')
             ctx = logoCanvas.getContext("2d");
             const background = new Image();
             background.src = 'img/antifascist-action.png';