Commit 5215e1c410185bc052521af1c2ca6bbb94dea930
1 parent
b3bcc701
Exists in
master
and in
8 other branches
sync
Showing
13 changed files
with
139 additions
and
41 deletions
Show diff stats
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
src/app/components/breadcrumb/breadcrumb.scss
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
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 | ... | ... |