Skip to content
This repository has been archived by the owner on Apr 6, 2023. It is now read-only.

Commit

Permalink
feat: Adjust margins to see the create account button on a 650px high…
Browse files Browse the repository at this point in the history 
… screen.

Eliminate unnecessary classes link - green
Place the final contents of signup
  • Loading branch information
@GusBaamonde
GusBaamonde committed Apr 5, 2019
1 parent 497549c commit a5fe175
Show file tree
Hide file tree
Showing 4 changed files with 23 additions and 28 deletions.
6 changes: 3 additions & 3 deletions assets/scss/core/_base.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -114,11 +114,11 @@ textarea {
text-align: left;
float: left;
width: 100%;
margin-bottom: $dp-spaces--lv5;
margin-bottom: $dp-spaces--lv3;

&__checkbox {
cursor: pointer;
margin-bottom: $dp-spaces--lv3;
margin-bottom: $dp-spaces--lv2;

label {
font-weight: normal;
Expand All @@ -127,7 +127,7 @@ textarea {
}

&:nth-last-child(1) {
margin-bottom: $dp-spaces--lv4;
margin-bottom: $dp-spaces--lv3;
}
}/* Field checkbox */

Expand Down
2 changes: 1 addition & 1 deletion assets/scss/modules/_forms.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -58,7 +58,7 @@
/* signup form */

.signup-form {
margin-top: $dp-spaces--lv6;
margin-top: $dp-spaces--lv3;
}

/* login form */
Expand Down
8 changes: 3 additions & 5 deletions assets/scss/templates/_signup.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@
.main-panel {
width: 525px;
height: 100vh;
padding: $dp-spaces--lv7 $dp-spaces--lv6;
padding: $dp-spaces--lv6 $dp-spaces--lv8;
background-color: $dp-color-white;
overflow-y: auto;

Expand All @@ -35,7 +35,7 @@
}

h5 {
margin: $dp-spaces--lv10 $dp-spaces--lv0 $dp-spaces--lv2;
margin: $dp-spaces--lv5 $dp-spaces--lv0 $dp-spaces--lv1;
font-family: $dp-font-family-proximanova;
color: $dp-color-brown;
font-weight: $dp-font-weight-bold;
Expand All @@ -61,16 +61,14 @@

.content-legal {
margin-top: $dp-spaces--lv4;
margin-bottom: $dp-spaces--lv7;

p {
font-size: $dp-font-size-rpgd;
line-height: $dp-line-height-rpgd;
}
}

footer {
padding-top: $dp-spaces--lv3;
}
}

.feature-panel {
Expand Down
35 changes: 16 additions & 19 deletions assets/templates/signup.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -57,25 +57,24 @@ <h1 class="logo-doppler-new">Doppler</h1>
</div>
</div>
</header><!-- header -->
<h5>Regístrate</h5>
<p class="content-subtitle">Crea una cuenta GRATIS hasta 500 Suscriptores.</p><!-- Title -->
<p class="content-subtitle">¿Ya tienes una cuenta? <a href="#" class="link--title" target="_blank">INGRESA</a></p>
<h5>EMAIL, AUTOMATION & DATA MARKETING</h5>
<p class="content-subtitle">Atrae, Convierte y Fideliza. Envíos ilimitados y gratis hasta 500 Suscriptores. ¿Ya tienes una cuenta? <a href="#" class="link--title" target="_blank">INGRESA</a></p><!-- Title -->
<form class="signup-form">
<fieldset>
<legend>Datos personales</legend>
<ul class="field-group">
<li>
<ul class="field-group">
<li class="field-item field-item--50 error">
<li class="field-item field-item--50">
<label for="name">Nombre:</label>
<input type="text" name="name" id="name" placeholder="Nombre">
<input type="text" name="name" id="name">
<div class="wrapper-errors">
<p class="error-message">¡Ouch! Este campo está vacío</p>
</div>
</li>
<li class="field-item field-item--50 error">
<li class="field-item field-item--50">
<label for="lastname">Apellido:</label>
<input type="text" name="lastname" id="lastname" placeholder="Apellido">
<input type="text" name="lastname" id="lastname">
<div class="wrapper-errors">
<p class="error-message">¡Ouch! Este campo está vacío</p>
</div>
Expand All @@ -94,7 +93,7 @@ <h5>Regístrate</h5>
<fieldset>
<ul class="field-group">
<legend>Usuario y contraseña</legend>
<li class="field-item error">
<li class="field-item">
<label for="email">Email:</label>
<input type="email" name="email" id="email" placeholder="Tu Email será tu nombre de usuario">
<div class="wrapper-errors">
Expand All @@ -106,43 +105,41 @@ <h5>Regístrate</h5>
<input type="password" name="password" id="password-field" placeholder="Escribe tu clave secreta">
<div class="wrapper-password">
<p class="password-message"><span class="waiting-message">8 caracteres como mínimo</span><span class="waiting-message">Un dígito</span></p>
<p class="password-message"><span class="lack-message">8 caracteres como mínimo</span><span class="lack-message">Un dígito</span></p>
<!-- <p class="password-message"><span class="lack-message">8 caracteres como mínimo</span><span class="lack-message">Un dígito</span></p>
<p class="password-message"><span class="complete-message">8 caracteres como mínimo</span><span class="complete-message">Un dígito</span></p>
<p class="password-message"><span class="secure-message">¡Tu contraseña es segura!</span></p>
<p class="password-message"><span class="secure-message">¡Tu contraseña es segura!</span></p> -->
</div><!-- the final container of message validations -->
</li>
</ul>
</fieldset><!-- user and password -->
<fieldset>
<legend>Politica de privacidad y promociones</legend>
<ul class="field-group">
<li class="field-item field-item__checkbox error">
<li class="field-item field-item__checkbox">
<input type="checkbox" name="acepto_politicas">
<span class="checkmark"></span><label for="acepto_politicas"> Acepto la <a class="link-green" href="#">Política de Privacidad</a> de Doppler.</label>
<span class="checkmark"></span><label for="acepto_politicas"> Acepto la <a href="#">Política de Privacidad</a> de Doppler.</label>
<div class="wrapper-errors">
<p class="error-message">¡Ouch! Este campo está vacío</p>
</div>
</li>
<li class="field-item field-item__checkbox">
<input type="checkbox" name="acepto_promociones">
<span class="checkmark"></span>
<label for="acepto_promociones"> Acepto recibir las promociones de Doppler y sus aliados.</label>
<label for="acepto_promociones">Quiero recibir promociones de Doppler y sus aliados.</label>
</li>
</ul>
<button type="button" class="dp-button button--round button-medium primary-green">Crear cuenta</button>
<button type="button" class="dp-button button--round button-medium primary-green">CREA TU CUENTA GRATIS</button>
</fieldset><!-- privacy policy and promotion -->
</form><!-- form -->
<div class="content-legal">
<p>Doppler te informa que los datos de carácter personal que nos proporciones al rellenar el presente formulario serán tratados por Making Sense LLC (Doppler) como responsable de esta web.</p>
<p>Doppler te informa que los datos de carácter personal que nos proporciones al rellenar el presente formulario serán tratados por Doppler LLC como responsable de esta web.</p>
<p><strong>Finalidad:</strong> Darte de alta en nuestra plataforma y brindarte los servicios que nos requieras.</p>
<p><strong>Legitimación:</strong> Consentimiento del interesado.</p>
<p><strong>Destinatarios:</strong> Tus datos serán guardados por Doppler, Zoho como CRM, Digital Ocean, Cogeco Peer1 y Rackspace como empresas de hosting.</p>
<p><strong>Información adicional:</strong> En la <a href="#" class="link-green" target="_blank">Política de Privacidad</a> de Doppler encontrarás información adicional sobre la recopilación y el uso de su información personal por parte de
Doppler, incluida información sobre acceso, conservación, rectificación, eliminación, seguridad, transferencias transfronterizas y otros temas.</p>
<p><strong>Información adicional:</strong> En la <a href="#" target="_blank">Política de Privacidad</a> de Doppler encontrarás información adicional sobre la recopilación y el uso de su información personal por parte de Doppler, incluida información sobre acceso, conservación, rectificación, eliminación, seguridad, transferencias transfronterizas y otros temas.</p>
</div><!-- legal content-->
<p class="content-promotion">Pst! si tienes un código promocional podrás ingresarlo al confirmar tu cuenta. <a href="#" class="link-green" target="_blank">HELP</a></p>
<footer>
<small>© 2019 Doppler LLC. Todos los derechos reservados.</small>
<small>© 2019 Doppler LLC. Todos los derechos reservados. <a href="#" target="_blank">Política de Privacidad y Legales.</a></small>
</footer><!-- footer -->
</article>
<section class="feature-panel">
Expand Down

0 comments on commit a5fe175

Please sign in to comment.