Commit befdd539c91e3816eb58d28db0fa5ae2d8721978
1 parent
1c55b2cd
Exists in
master
and in
6 other branches
Fix #109.
Showing
7 changed files
with
101 additions
and
41 deletions
Show diff stats
images/icons/icon-facebook-contrast.png
images/icons/icon-gplus-contrast.png
images/icons/icon-twitter-contrast.png
images/icons/icon-whatsapp-contrast.png
index.html
| ... | ... | @@ -343,6 +343,12 @@ |
| 343 | 343 | <div class="loading">Carregando...</div> |
| 344 | 344 | <form id="login-form" class="login"> |
| 345 | 345 | <div class="message hide"></div> |
| 346 | + <div class="row"> | |
| 347 | + <div class="col-sm-4"> | |
| 348 | + <a href="#" class="new-user button">Cadastre-se</a> | |
| 349 | + </div> | |
| 350 | + </div> | |
| 351 | + <p class="box-subtitle">Ou acesse:</p> | |
| 346 | 352 | <div class="username"> |
| 347 | 353 | <label for="user_name" class="label">Nome de Usuário / E-mail:</label> |
| 348 | 354 | <input id="user_name" name="login" type="text" placeholder="Nome do usuário / E-mail"> |
| ... | ... | @@ -351,18 +357,21 @@ |
| 351 | 357 | <label for="user_password" class="label">Senha:</label> |
| 352 | 358 | <input id="user_password" name="password" type="password" placeholder="Senha"> |
| 353 | 359 | </div> |
| 354 | - <div class="actions"> | |
| 355 | - <input type="submit" class="login-action" value="Acessar"/> | |
| 356 | - <a href="http://www.participa.br/account/forgot_password" target="_blank" class="forgot-password">Esqueci minha senha</a> | |
| 357 | - </div> | |
| 358 | - <div class="oauth"> | |
| 359 | - <div class="label">Acessar com:</div> | |
| 360 | - <a href="http://www.participa.br/plugin/oauth_client/facebook?oauth_client_popup=true&id=1" target="_blank" class="facebook oauth-login">Facebook</a> | |
| 361 | - <a href="http://www.participa.br/plugin/oauth_client/google_oauth2?oauth_client_popup=true&id=2" target="_blank" class="google oauth-login">Google +</a> | |
| 362 | - <a href="#" class="new-user">Cadastrar</a> | |
| 360 | + <div class="row"> | |
| 361 | + <div class="actions col-sm-4"> | |
| 362 | + <input type="submit" class="login-action button col-sm-12" value="Acessar"/> | |
| 363 | + <a href="http://www.participa.br/account/forgot_password" target="_blank" class="forgot-password">Esqueci minha senha</a> | |
| 364 | + </div> | |
| 365 | + <div class="oauth col-sm-8"> | |
| 366 | + <span class="label">Ou acesse usando <i>»</i></span> | |
| 367 | + <a href="http://www.participa.br/plugin/oauth_client/facebook?oauth_client_popup=true&id=1" target="_blank" class="facebook oauth-login icon icon-facebook">Facebook</a> | |
| 368 | + <a href="http://www.participa.br/plugin/oauth_client/google_oauth2?oauth_client_popup=true&id=2" target="_blank" class="google oauth-login icon icon-gplus">Google +</a> | |
| 369 | + </div> | |
| 363 | 370 | </div> |
| 364 | 371 | </form> |
| 365 | 372 | <form id="signup-form" class="signup hide" autocomplete="off"> |
| 373 | + <div class="message hide"></div> | |
| 374 | + <p class="box-subtitle">Cadastre-se</p> | |
| 366 | 375 | <div class="email"> |
| 367 | 376 | <label for="user_email" class="label">E-mail:</label> |
| 368 | 377 | <input id="user_email" name="email" type="text" placeholder="E-mail"> |
| ... | ... | @@ -371,18 +380,25 @@ |
| 371 | 380 | <label for="user_name" class="label">Nome de Usuário</label> |
| 372 | 381 | <input id="user_name" name="login" type="text" placeholder="Nome do usuário"> |
| 373 | 382 | </div> |
| 374 | - <div class="password"> | |
| 375 | - <label for="user_password" class="label">Senha:</label> | |
| 376 | - <input id="user_password" name="password" type="password" placeholder="Senha"> | |
| 377 | - </div> | |
| 378 | - <div class="password-confirmation"> | |
| 379 | - <label for="user_password_confirmation" class="label">Confirme a senha:</label> | |
| 380 | - <input id="user_password_confirmation" name="password_confirmation" type="password" placeholder="Confirme a senha"> | |
| 383 | + <div class="row"> | |
| 384 | + <div class="password col-sm-6"> | |
| 385 | + <label for="user_password" class="label">Senha:</label> | |
| 386 | + <input id="user_password" name="password" type="password" placeholder="Senha"> | |
| 387 | + </div> | |
| 388 | + <div class="password-confirmation col-sm-6"> | |
| 389 | + <label for="user_password_confirmation" class="label">Confirme a senha:</label> | |
| 390 | + <input id="user_password_confirmation" name="password_confirmation" type="password" placeholder="Confirme a senha"> | |
| 391 | + </div> | |
| 381 | 392 | </div> |
| 382 | 393 | <div class="actions"> |
| 383 | - <div class="message hide"></div> | |
| 384 | - <a href="#" class="confirm-signup">Confirmar</a> | |
| 385 | - <a href="#" class="cancel-signup">Cancelar</a> | |
| 394 | + <div class="row"> | |
| 395 | + <div class="col-sm-4"> | |
| 396 | + <a href="#" class="confirm-signup button">Confirmar</a> | |
| 397 | + </div> | |
| 398 | + <div class="col-sm-4"> | |
| 399 | + <a href="#" class="cancel-signup button button-cancela">Cancelar</a> | |
| 400 | + </div> | |
| 401 | + </div> | |
| 386 | 402 | </div> |
| 387 | 403 | <div class="captcha"> |
| 388 | 404 | <div class="g-recaptcha" data-sitekey="6LcLPAcTAAAAAKsd0bxY_TArhD_A7OL19SRCW7_i"></div> | ... | ... |
sass/_proposal_detail.scss
| 1 | +.login .row input, | |
| 2 | +.signup .row input { | |
| 3 | + margin-bottom: 0; | |
| 4 | +} | |
| 5 | + | |
| 6 | +@each $category, $color in $categories { | |
| 7 | + .#{$category} { | |
| 8 | + .button { | |
| 9 | + background-color: $color; | |
| 10 | + border-radius: 6px; | |
| 11 | + border-bottom: 3px solid darken($color, 15%); | |
| 12 | + color: #fff; | |
| 13 | + font-weight: 400; | |
| 14 | + font-size: 16px; | |
| 15 | + padding: 20px 0; | |
| 16 | + display: block; | |
| 17 | + margin: 0; | |
| 18 | + text-align: center; | |
| 19 | + transition: all 200ms; | |
| 20 | + &:hover { | |
| 21 | + background-color: darken($color, 15%); | |
| 22 | + text-decoration: none; | |
| 23 | + } | |
| 24 | + } | |
| 25 | + input.button { | |
| 26 | + @extend .button; | |
| 27 | + margin: 0 !important; | |
| 28 | + padding: 20px 0 !important; | |
| 29 | + width: 100% !important; | |
| 30 | + } | |
| 31 | + } | |
| 32 | +} | |
| 33 | +.box-subtitle { | |
| 34 | + color: #18376c; | |
| 35 | + font-size: 24px; | |
| 36 | + font-weight: bold; | |
| 37 | +} | |
| 38 | + | |
| 1 | 39 | .proposal-detail { |
| 2 | 40 | .login-container { |
| 41 | + margin: 0 20px; | |
| 42 | + text-align: left; | |
| 3 | 43 | .loading { |
| 4 | 44 | text-align: center; |
| 5 | 45 | } |
| ... | ... | @@ -299,8 +339,8 @@ |
| 299 | 339 | text-align: left; |
| 300 | 340 | } |
| 301 | 341 | .message { |
| 302 | - margin: 10px 35px; | |
| 303 | - padding: 10px 25px; | |
| 342 | + margin: 10px 0; | |
| 343 | + padding: 10px 20px; | |
| 304 | 344 | font-size: 12px; |
| 305 | 345 | background-color: #f2dede; |
| 306 | 346 | border-color: #ebccd1; |
| ... | ... | @@ -378,6 +418,7 @@ |
| 378 | 418 | border: 1px solid $color; |
| 379 | 419 | height: $container-height; |
| 380 | 420 | min-height: $container-height; |
| 421 | + overflow: auto; | |
| 381 | 422 | margin: 0 10px 20px 0; |
| 382 | 423 | } |
| 383 | 424 | .make-proposal-button{ |
| ... | ... | @@ -399,7 +440,7 @@ |
| 399 | 440 | height: 15%; |
| 400 | 441 | } |
| 401 | 442 | label { |
| 402 | - color: gray; | |
| 443 | + color: #333; | |
| 403 | 444 | } |
| 404 | 445 | } |
| 405 | 446 | .support-proposal-container{ |
| ... | ... | @@ -599,23 +640,24 @@ |
| 599 | 640 | } |
| 600 | 641 | /*------------------ formulario ---------------- */ |
| 601 | 642 | form .oauth { |
| 602 | - margin-top: 10px; | |
| 603 | - float: left; | |
| 604 | - width: 50%; | |
| 643 | + margin-top: 15px; | |
| 644 | + // float: left; | |
| 645 | + // width: 50%; | |
| 605 | 646 | } |
| 606 | 647 | |
| 607 | 648 | form .actions { |
| 608 | - float: right; | |
| 609 | - width: 50%; | |
| 649 | + // float: right; | |
| 650 | + // width: 50%; | |
| 610 | 651 | } |
| 611 | 652 | |
| 612 | 653 | form.signup { |
| 654 | + text-align: left; | |
| 613 | 655 | .password, .password-confirmation { |
| 614 | - width: 47%; | |
| 656 | + // width: 47%; | |
| 615 | 657 | display: inline-block; |
| 616 | 658 | } |
| 617 | 659 | .password { |
| 618 | - margin-left: 15px; | |
| 660 | + // margin-left: 15px; | |
| 619 | 661 | } |
| 620 | 662 | .actions { |
| 621 | 663 | margin: 20px 0 0 0; |
| ... | ... | @@ -626,7 +668,7 @@ |
| 626 | 668 | border-radius: 7px; |
| 627 | 669 | color: #fff; |
| 628 | 670 | padding: 10px 15px; |
| 629 | - margin: 0 0 0 8px; | |
| 671 | + // margin: 0 0 0 8px; | |
| 630 | 672 | } |
| 631 | 673 | .cancel-signup { |
| 632 | 674 | @extend .confirm-signup; |
| ... | ... | @@ -702,13 +744,13 @@ |
| 702 | 744 | |
| 703 | 745 | .support-proposal .abstract{ |
| 704 | 746 | overflow-y: auto; |
| 705 | - max-height: 190px; | |
| 747 | + // max-height: 190px; | |
| 706 | 748 | margin-bottom: 10px; |
| 707 | 749 | word-break: break-word; |
| 708 | 750 | word-wrap: break-word; |
| 709 | 751 | |
| 710 | 752 | @media only screen and (max-width: 1048px) { |
| 711 | - max-height: 140px; | |
| 753 | + // max-height: 140px; | |
| 712 | 754 | font-size: 20px; |
| 713 | 755 | } |
| 714 | 756 | } |
| ... | ... | @@ -735,7 +777,7 @@ |
| 735 | 777 | |
| 736 | 778 | .info { |
| 737 | 779 | margin: 0 20px !important; |
| 738 | - max-height: 40px !important; | |
| 780 | + // max-height: 40px !important; | |
| 739 | 781 | } |
| 740 | 782 | } |
| 741 | 783 | ... | ... |
sass/style.scss
| ... | ... | @@ -79,8 +79,8 @@ h1 { |
| 79 | 79 | } |
| 80 | 80 | |
| 81 | 81 | form { |
| 82 | - label, input, div.label, textarea { | |
| 83 | - width: 90%; | |
| 82 | + input, div.label, textarea { | |
| 83 | + // width: 90%; | |
| 84 | 84 | margin: 0 auto; |
| 85 | 85 | font-size: 14px; |
| 86 | 86 | display: block; |
| ... | ... | @@ -90,6 +90,8 @@ form { |
| 90 | 90 | input, textarea { |
| 91 | 91 | color: #000; |
| 92 | 92 | border: 1px solid #18376C; |
| 93 | + width: 100%; | |
| 94 | + margin-bottom: 20px; | |
| 93 | 95 | } |
| 94 | 96 | |
| 95 | 97 | textarea { |
| ... | ... | @@ -102,13 +104,13 @@ form { |
| 102 | 104 | color: #000; |
| 103 | 105 | font-weight: bold; |
| 104 | 106 | text-decoration: none; |
| 105 | - margin: 10px 20px; | |
| 107 | + // margin: 10px 20px; | |
| 106 | 108 | } |
| 107 | 109 | |
| 108 | 110 | .actions, .oauth { |
| 109 | - text-align: center; | |
| 110 | - font-size: 12px; | |
| 111 | - margin-top: 10px; | |
| 111 | + // text-align: center; | |
| 112 | + // font-size: 12px; | |
| 113 | + // margin-top: 10px; | |
| 112 | 114 | } |
| 113 | 115 | } |
| 114 | 116 | |
| ... | ... | @@ -154,8 +156,8 @@ form { |
| 154 | 156 | } |
| 155 | 157 | |
| 156 | 158 | .captcha{ |
| 157 | - padding-left: 25px; | |
| 158 | - padding-top: 20px; | |
| 159 | + // padding-left: 25px; | |
| 160 | + // padding-top: 20px; | |
| 159 | 161 | } |
| 160 | 162 | |
| 161 | 163 | @media (max-width: 480px) { | ... | ... |