Commit 5215e1c410185bc052521af1c2ca6bbb94dea930

Authored by Leonardo Merlin
1 parent b3bcc701

sync

src/app/components/a11y-bar/a11y-bar.html
1   -<div class="a11y-bar">
  1 +<div class="a11y-bar hidden-xs">
2 2 <div class="container">
3 3 <div class="row">
4 4 <div class="col-sm-6">
... ... @@ -21,12 +21,12 @@
21 21 <span class="color-theme-common-bg">3</span>
22 22 </a>
23 23 </li>
24   - <li>
  24 + <!-- <li>
25 25 <a class="color-theme-common-fg" accesskey="4" href="#footer" id="skip-to-footer" ng-click="focusOn('#footer', $event)">
26 26 Ir para o rodapé
27 27 <span class="color-theme-common-bg">4</span>
28 28 </a>
29   - </li>
  29 + </li> -->
30 30 </ul>
31 31 </div>
32 32  
... ...
src/app/components/a11y-bar/a11y-bar.scss
1 1 .a11y-bar {
2 2 font-size: 12px;
3 3 padding: 5px 0;
  4 +
  5 + @media (max-width: $screen-md) {
  6 + font-size: 11px;
  7 + }
  8 +
4 9 span {
5 10 color: #fff;
6 11 padding: 0 5px;
... ...
src/app/components/breadcrumb/breadcrumb.scss
... ... @@ -3,7 +3,7 @@
3 3 .breadcrumb {
4 4 background: none;
5 5 padding: 0;
6   - margin: 0;
  6 + margin: 10px 0;
7 7 }
8 8  
9 9 .glyphicon {
... ...
src/app/components/navbar/navbar.html
... ... @@ -20,8 +20,7 @@
20 20 <li ui-sref-active="active"><a ui-sref="propostas">Propostas</a></li>
21 21 <li ui-sref-active="active"><a ui-sref="ranking">Ranking</a></li>
22 22 <li ui-sref-active="active"><a ui-sref="duvidas">Dúvidas</a></li>
23   - <!-- <li ui-sref-active="active"><a ui-sref="respostas">Respostas</a></li> -->
24   - <li role="separator" class="divider"><span>|</span></li>
  23 + <li role="separator" class="divider hidden-xs hidden-sm"><span>|</span></li>
25 24 <li class="dropdown">
26 25 <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Compartilhar <span class="icon icon-social-share-small"></span></a>
27 26 <ul class="dropdown-menu">
... ... @@ -43,12 +42,6 @@
43 42 <span class="sr-only">Compartilhar no Google Plus</span>
44 43 </a>
45 44 </li>
46   - <!-- <li>
47   - <a href="whatsapp://send?text=http%3A%2F%2Fdialoga.gov.br" target="_blank" title="Compartilhar no WhatsApp">
48   - <span class="icon-circle icon-small icon-circle-social-whatsapp"><span class="icon icon-social-whatsapp"></span></span>
49   - <span class="sr-only">Compartilhar no WhatsApp</span>
50   - </a>
51   - </li> -->
52 45 <li>
53 46 <a href="mailto:contato@dialoga.gov.br?subject=Conheça o Dialoga Brasil" title="Enviar por email">
54 47 <span class="icon-circle icon-small icon-circle-social-whatsapp"><span class="icon icon-social-whatsapp"></span></span>
... ...
src/app/components/navbar/navbar.scss
1 1 .app-navbar {
2 2  
3 3 border-bottom: 2px solid #f1f1f1;
4   - margin-bottom: 20px;
5 4  
6 5 .navbar {
7 6 margin-bottom: 0;
... ... @@ -12,13 +11,26 @@
12 11 height: auto;
13 12 padding-bottom: 0;
14 13 padding-left: 0;
  14 +
  15 + @media screen and (max-width: $screen-md) {
  16 + padding: 20px 0;
  17 + margin: 20px 0;
  18 + }
15 19 }
16 20  
17 21 .navbar-toggle {
  22 + padding: 12px 10px;
18 23 margin-top: 20px;
  24 + border-radius: 100%;
  25 + background-color: #5e749d;
19 26  
20 27 .icon-bar {
21 28 height: 3px;
  29 + background-color: #fff;
  30 + }
  31 +
  32 + @media screen and (max-width: $screen-md) {
  33 + margin-top: 45px;
22 34 }
23 35 }
24 36  
... ... @@ -27,7 +39,7 @@
27 39 margin: 53px 10px 0 10px;
28 40 display: block;
29 41  
30   - @media screen and (max-width: 768px) {
  42 + @media screen and (max-width: $screen-md) {
31 43 display: none;
32 44 }
33 45 }
... ... @@ -49,12 +61,16 @@
49 61 .contraste & {
50 62 color: #fff;
51 63 }
  64 +
  65 + @media screen and (max-width: $screen-md) {
  66 + margin-top: 5px;
  67 + }
52 68 }
53 69  
54 70 &.active > a {
55 71 border-bottom: 3px solid #77BB34;
56 72  
57   - @media screen and (max-width: 768px) {
  73 + @media screen and (max-width: $screen-md) {
58 74 border: none;
59 75 background-color: #eee;
60 76 padding: 10px 0 10px 0px;
... ... @@ -63,12 +79,21 @@
63 79  
64 80 .dropdown-toggle {
65 81 margin-top: 50px;
  82 +
  83 + @media screen and (max-width: $screen-md) {
  84 + margin-top: 0px;
  85 + }
66 86 }
67 87  
68 88 .dropdown-menu {
69 89 min-width: 200px;
70 90 background-color: #eee;
71 91 padding: 5px;
  92 + height: 47px;
  93 +
  94 + &:after {
  95 + clear: both;
  96 + }
72 97  
73 98 li {
74 99 float: left;
... ... @@ -95,10 +120,6 @@
95 120 }
96 121 }
97 122  
98   - .navbar-toggle .icon-bar {
99   - background-color: #333;
100   - }
101   -
102 123 .contraste & {
103 124 .nav > li > a:hover,
104 125 .nav > li > a:focus {
... ...
src/app/components/proposal-carousel/proposal-carousel.html
1 1 <div class="proposal-carousel">
2 2 <div ng-if="vm.proposals">
3   - <div class="proposal-carousel-top color-theme-bg">
  3 + <div class="proposal-carousel-top color-theme-bg-darker">
4 4 <div class="proposal-carousel-position" ng-repeat="proposal in vm.proposals">
5 5 <span ng-show="vm.activeIndex === $index">{{::($index+1)}}º</span>
6 6 <span ng-show="vm.activeIndex === $index">Lugar</span>
... ...
src/app/components/proposal-related/proposal-related.html
1   -<div class="proposal-related">
2   - Proposta
  1 +<div class="proposal-related" ng-class="{'focus':vm.isFocused}">
  2 + <div class="proposal-related--top">
  3 + <div class="proposal-related--theme color-theme-bg-darker">[Nome do Tema]</div>
  4 + <div class="proposal-related--program color-theme-bg">[Nome do Programa]</div>
  5 + </div>
  6 + <div class="proposal-related--middle">
  7 + <div class="proposal-related--content">[Conteúdo ad proposta enviada]</div>
  8 + <div class="proposal-related--actions">
  9 + <div class="row">
  10 + <div class="col-sm-4">
  11 + <div class="action vote_for" title="Apoiar">
  12 + <div class="icon-circle">
  13 + <span class="glyphicon glyphicon-ok" aria-hidden="true"></span>
  14 + </div>
  15 + <div class="sr-only">Apoiar proposta</div>
  16 + </div>
  17 + </div>
  18 + <div class="col-sm-4">
  19 + <div class="action next" title="Pular proposta">
  20 + <div class="icon-circle">
  21 + <span class="glyphicon glyphicon-share-alt" aria-hidden="true"></span>
  22 + </div>
  23 + <div class="sr-only">Pular proposta</div>
  24 + </div>
  25 + </div>
  26 + <div class="col-sm-4">
  27 + <div class="action vote_against" title="Não apoiar">
  28 + <div class="icon-circle">
  29 + <span class="glyphicon glyphicon-remove" aria-hidden="true"></span>
  30 + </div>
  31 + <div class="sr-only">Não apoiar</div>
  32 + </div>
  33 + </div>
  34 + </div>
  35 + </div>
  36 + </div>
  37 + <div class="proposal-related--bottom">
  38 + <div class="proposal-related--share">[SHARE]</div>
  39 + <div class="proposal-related--ranking">[RANKING]</div>
  40 + </div>
3 41 </div>
... ...
src/app/components/proposal-related/proposal-related.scss
... ... @@ -0,0 +1,47 @@
  1 +.proposal-related {
  2 + background-color: #f1f1f1;
  3 + border-radius: 5px;
  4 + overflow: hidden;
  5 +
  6 + &.focus {
  7 + border: 7px solid #000;
  8 + border-radius: 12px;
  9 + border-color: #5E769C;
  10 + }
  11 +
  12 + &--top {
  13 + color: #fff;
  14 + font-weight: bold;
  15 +
  16 + border-top-left-radius: 5px;
  17 + border-top-right-radius: 5px;
  18 + overflow: hidden;
  19 + }
  20 +
  21 + // &--middle {}
  22 +
  23 + &--bottom {
  24 + border-bottom-left-radius: 5px;
  25 + border-bottom-right-radius: 5px;
  26 + overflow: hidden;
  27 + }
  28 +
  29 + &--theme {
  30 + padding: 10px 15px 5px 15px;
  31 + }
  32 +
  33 + &--program {
  34 + padding: 20px 15px;
  35 + }
  36 +
  37 + .glyphicon {
  38 + color: #fff;
  39 + }
  40 + .icon-circle {
  41 + cursor: pointer;
  42 +
  43 + -webkit-box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.3);
  44 + -moz-box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.3);
  45 + box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.3);
  46 + }
  47 +}
0 48 \ No newline at end of file
... ...
src/app/index.scss
... ... @@ -178,7 +178,7 @@ body {
178 178 .icon-circle-social-facebook {background-color: #537ab5; }
179 179 .icon-circle-social-twitter {background-color: #77cbef; }
180 180 .icon-circle-social-googleplus {background-color: #d23b00; }
181   -.icon-circle-social-whatsapp {background-color: #77cbef; }
  181 +.icon-circle-social-whatsapp {background-color: #10ad08; }
182 182 .icon-circle-social-youtube {background-color: #c63635; }
183 183 .icon-circle-social-flickr {background-color: #eaeaea; }
184 184 .icon-circle-mail {background-color: #ecb24e; }
... ...
src/app/pages/header/header.html
1 1 <header id="header" class="container">
2 2  
3   - <div class="row">
  3 + <div class="row hidden-xs">
4 4 <div class="col-sm-12">
5 5 <auth-user></auth-user>
6 6 </div>
... ...
src/app/pages/header/header.scss
1   -.accessibility-wrapper {
2   - .icon-user {
3   - display: inline-block;
4   - vertical-align: middle;
5   - width: 26px;
6   - height: 26px;
7   - border: 1px solid #ccc;
8   - border-radius: 100%;
9   - background-position: 1px 0px;
  1 +#header {
10 2  
11   - .contraste & {
12   - // XXX: chage for dinamic handler
13   - background-position: -0px -24px;
14   - }
  3 + @media (max-width: $screen-md) {
  4 +
15 5 }
16 6 -}
  7 +}
17 8 \ No newline at end of file
... ...
src/app/pages/inicio/inicio.html
... ... @@ -90,8 +90,8 @@
90 90 </div>
91 91 <div class="row">
92 92 <div class="col-xs-6 col-sm-7 col-md-9">
93   - <label for="articleQueryFilter" class="control-label sr-only">Filtrar programas:</label>
94   - <input id="articleQueryFilter" type="search" class="form-control" ng-model="pageInicio.query" placeholder="Filtrar programas" aria-label="Filtrar programas" >
  93 + <label for="articleQueryFilter" class="control-label sr-only">Buscar programas:</label>
  94 + <input id="articleQueryFilter" type="search" class="form-control" ng-model="pageInicio.query" placeholder="Buscar programas" aria-label="Buscar programas" >
95 95 </div>
96 96 </div>
97 97  
... ...
src/app/pages/inicio/inicio.scss
1 1 .page--inicio {
2   - margin-top: 20px;
  2 +
  3 + .section-video {
  4 + padding: 20px 0;
  5 + // background-color: #919191;
  6 + }
3 7  
4 8 .section--articles {
5 9  
... ...