Commit 94c677452a1699279a0de496dee7c82920ac3b72

Authored by Leonardo Merlin
2 parents be324d0d 43faa497

Merge branch 'merlin' into staging

Showing 35 changed files with 383 additions and 250 deletions   Show diff stats
src/app/components/event-list/event-list.html
... ... @@ -13,7 +13,7 @@
13 13 </div>
14 14 <div class="col-sm-6 text-right">
15 15 <h2 class="event-bar--trigger-toggle text-right">
16   - <span><b>18</b> bate papos <b>agendados</b></span>
  16 + <span><b>{{vm.events.length}}</b> bate papos <b>agendados</b></span>
17 17 <span ng-if="vm.isCollapsed" class="glyphicon glyphicon-menu-down" aria-hidden="true"></span>
18 18 <span ng-if="!vm.isCollapsed" class="glyphicon glyphicon-menu-up" aria-hidden="true"></span>
19 19 </h2>
... ...
src/app/components/navbar/navbar.html
... ... @@ -9,7 +9,6 @@
9 9 </button>
10 10 <a class="navbar-brand" ui-sref="inicio">
11 11 <img src="/assets/images/logo.png" alt="Dialoga Brasil | O país fica melhor quando você participa" />
12   - <!-- <span class="glyphicon glyphicon-home"></span> Início -->
13 12 </a>
14 13 </div>
15 14  
... ... @@ -24,53 +23,40 @@
24 23 <li class="dropdown">
25 24 <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Compartilhar <span aria-hidden="true" class="icon icon-social-share-small"></span></a>
26 25 <social-share class="dropdown-menu dropdown-menu-right" arrow-class="social-share--arrow"></social-share>
27   - <!-- <ul class="dropdown-menu dropdown-menu-right dropdown-menu-social">
28   - <li>
29   - <a socialshare
30   - socialshare-provider="facebook"
31   - socialshare-url="http://dialoga.gov.br"
32   - socialshare-text="Conheça o Dialoga Brasil. Dialoga Brasil | O País fica melhor quando VOCÊ PARTICIPA."
33   - title="Compartilhar no Facebook">
34   - <span class="icon-circle icon-small icon-circle-social-facebook"><span class="icon icon-social-facebook"></span></span>
35   - <span class="sr-only">Compartilhar no Facebook</span>
36   - </a>
37   - </li>
38   - <li>
39   - <a socialshare
40   - socialshare-provider="twitter"
41   - socialshare-url="http://dialoga.gov.br"
42   - socialshare-text="Conheça o Dialoga Brasil. Dialoga Brasil | O País fica melhor quando VOCÊ PARTICIPA."
43   - socialshare-hastags="dialogabrasil"
44   - title="Compartilhar no Twitter">
45   - <span class="icon-circle icon-small icon-circle-social-twitter"><span class="icon icon-social-twitter"></span></span>
46   - <span class="sr-only">Compartilhar no Twitter</span>
47   - </a>
48   - </li>
49   - <li>
50   - <a socialshare
51   - socialshare-provider="gplus"
52   - socialshare-url="http://dialoga.gov.br"
53   - socialshare-text="Conheça o Dialoga Brasil. Dialoga Brasil | O País fica melhor quando VOCÊ PARTICIPA."
54   - title="Compartilhar no Google Plus">
55   - <span class="icon-circle icon-small icon-circle-social-googleplus"><span class="icon icon-social-googleplus"></span></span>
56   - <span class="sr-only">Compartilhar no Google Plus</span>
57   - </a>
58   - </li>
59   - <li>
60   - <a href="mailto:contato@dialoga.gov.br?subject=Conheça o Dialoga Brasil" title="Enviar por email">
61   - <span class="icon-circle icon-small icon-circle-social-whatsapp"><span class="icon icon-social-whatsapp"></span></span>
62   - <span class="sr-only">Enviar por email</span>
63   - </a>
64   - </li>
65   - </ul> -->
66 26 </li>
67 27 </ul>
68 28 </div>
69 29 </nav>
  30 +
70 31 <div id="dialoga-nas-redes">
71 32 <div class="text text-right">
72   - <p>DIALOGA<br>NAS REDES</p>
  33 + <p>DIALOGA<br><b>NAS REDES</b></p>
73 34 </div>
74   - <social-share></social-share>
  35 + <ul class="social-share list-inline">
  36 + <li>
  37 + <a href="https://www.facebook.com/DialogaBrasil" target="_blank">
  38 + <span aria-hidden="true" class="icon-circle icon-small icon-circle-social-facebook"><span class="icon icon-social-facebook"></span></span>
  39 + <span class="sr-only">Visitar perfil no Facebook</span>
  40 + </a>
  41 + </li>
  42 + <li>
  43 + <a href="https://twitter.com/dialogabrasil" target="_blank">
  44 + <span aria-hidden="true" class="icon-circle icon-small icon-circle-social-twitter"><span class="icon icon-social-twitter"></span></span>
  45 + <span class="sr-only">Visitar perfil no Twitter</span>
  46 + </a>
  47 + </li>
  48 + <li>
  49 + <a href="https://www.youtube.com/channel/UCtjaJwOWwGu2legqFVAzhIA" target="_blank">
  50 + <span aria-hidden="true" class="icon-circle icon-small icon-circle-social-youtube"><span class="icon icon-social-youtube"></span></span>
  51 + <span class="sr-only">Visitar canal no Youtube</span>
  52 + </a>
  53 + </li>
  54 + <li>
  55 + <a href="https://www.flickr.com/photos/dialogabrasil" target="_blank">
  56 + <span aria-hidden="true" class="icon-circle icon-small icon-circle-social-flickr"><span class="icon icon-social-flickr"></span></span>
  57 + <span class="sr-only">Visitar canal no Flickr</span>
  58 + </a>
  59 + </li>
  60 + </ul>
75 61 </div>
76 62 </div>
... ...
src/app/components/proposal-box/proposal-box.html
... ... @@ -148,7 +148,7 @@
148 148 </div>
149 149 <div class="proposal-box--bottom text-center">
150 150 <div class="proposal-box--share">
151   - <span>COMPARTILHE ESSA <b>PROPOSTA</b></span>
  151 + <span>COMPARTILHE ESTA <b>PROPOSTA</b></span>
152 152 <div class="dropdown">
153 153 <button id="dropdown-share-btn" class="btn btn-link dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" aria-label="Mostrar ou esconder a lista redes sociais para compartilhamento"><span class="icon icon-social-share-small" aria-hidden="true"></span></button>
154 154 <social-share class="dropdown-menu dropdown-menu-right"></social-share>
... ...
src/app/components/proposal-stats/proposal-stats.html
1 1 <div class="proposal-stats">
2 2 <ul class="list-inline">
3   - <li class="proposal-stats-views">
4   - <span class="glyphicon glyphicon-eye-open" aria-hidden="true"></span>
5   - <span>{{proposal.hits}}</span>
  3 + <li class="proposal-stats-up">
  4 + <span class="glyphicon glyphicon-ok" aria-hidden="true"></span>
  5 + <span>{{proposal.votes_for}}</span>
6 6 </li>
7 7 <li class="proposal-stats-down">
8 8 <span class="glyphicon glyphicon-remove" aria-hidden="true"></span>
9 9 <span>{{proposal.votes_against}}</span>
10 10 </li>
11   - <li class="proposal-stats-up">
12   - <span class="glyphicon glyphicon-ok" aria-hidden="true"></span>
13   - <span>{{proposal.votes_for}}</span>
  11 + <li class="proposal-stats-views">
  12 + <span class="glyphicon glyphicon-eye-open" aria-hidden="true"></span>
  13 + <span>{{proposal.hits}}</span>
14 14 </li>
15 15 </ul>
16 16 </div>
... ...
src/app/components/social-share/social-share.scss
... ... @@ -16,6 +16,7 @@
16 16 margin: 0;
17 17 width: 45px;
18 18 text-align: center;
  19 + transform: scale(0.9);
19 20  
20 21 & > a {
21 22 padding: 0;
... ...
src/app/layout.scss
... ... @@ -29,21 +29,21 @@
29 29 table-layout: fixed;
30 30 height: 100%;
31 31 width: 100%;
32   -}
33   -.col-xs-height {
  32 + }
  33 + .col-xs-height {
34 34 display: table-cell;
35 35 float: none;
36 36 height: 100%;
37   -}
38   -.col-xs-top {
  37 + }
  38 + .col-xs-top {
39 39 vertical-align: top;
40   -}
41   -.col-xs-middle {
  40 + }
  41 + .col-xs-middle {
42 42 vertical-align: middle;
43   -}
44   -.col-xs-bottom {
  43 + }
  44 + .col-xs-bottom {
45 45 vertical-align: bottom;
46   -}
  46 + }
47 47 }
48 48  
49 49 @media (min-width: 768px) {
... ... @@ -52,21 +52,21 @@
52 52 table-layout: fixed;
53 53 height: 100%;
54 54 width: 100%;
55   -}
56   -.col-sm-height {
  55 + }
  56 + .col-sm-height {
57 57 display: table-cell;
58 58 float: none;
59 59 height: 100%;
60   -}
61   -.col-sm-top {
  60 + }
  61 + .col-sm-top {
62 62 vertical-align: top;
63   -}
64   -.col-sm-middle {
  63 + }
  64 + .col-sm-middle {
65 65 vertical-align: middle;
66   -}
67   -.col-sm-bottom {
  66 + }
  67 + .col-sm-bottom {
68 68 vertical-align: bottom;
69   -}
  69 + }
70 70 }
71 71  
72 72 @media (min-width: 992px) {
... ... @@ -75,21 +75,21 @@
75 75 table-layout: fixed;
76 76 height: 100%;
77 77 width: 100%;
78   -}
79   -.col-md-height {
  78 + }
  79 + .col-md-height {
80 80 display: table-cell;
81 81 float: none;
82 82 height: 100%;
83   -}
84   -.col-md-top {
  83 + }
  84 + .col-md-top {
85 85 vertical-align: top;
86   -}
87   -.col-md-middle {
  86 + }
  87 + .col-md-middle {
88 88 vertical-align: middle;
89   -}
90   -.col-md-bottom {
  89 + }
  90 + .col-md-bottom {
91 91 vertical-align: bottom;
92   -}
  92 + }
93 93 }
94 94  
95 95 @media (min-width: 1200px) {
... ... @@ -98,29 +98,29 @@
98 98 table-layout: fixed;
99 99 height: 100%;
100 100 width: 100%;
101   -}
102   -.col-lg-height {
  101 + }
  102 + .col-lg-height {
103 103 display: table-cell;
104 104 float: none;
105 105 height: 100%;
106   -}
107   -.col-lg-top {
  106 + }
  107 + .col-lg-top {
108 108 vertical-align: top;
109   -}
110   -.col-lg-middle {
  109 + }
  110 + .col-lg-middle {
111 111 vertical-align: middle;
112   -}
113   -.col-lg-bottom {
  112 + }
  113 + .col-lg-bottom {
114 114 vertical-align: bottom;
115   -}
  115 + }
116 116 }
117 117  
118 118 .vcenter {
119   - display: inline-block;
120   - vertical-align: middle;
121   - float: none;
122   - margin-right: -2px;
123   - margin-left: -2px;
  119 + display: inline-block;
  120 + vertical-align: middle;
  121 + float: none;
  122 + margin-right: -2px;
  123 + margin-left: -2px;
124 124 }
125 125  
126 126 .vertical-padding {
... ... @@ -132,9 +132,9 @@
132 132 .no-space-right { margin-right: 0; padding-right: 0;}
133 133  
134 134 .text-center-sm {
135   - @media screen and (max-width: $screen-sm) {
136   - text-align: center;
137   - }
  135 + @media screen and (max-width: $screen-sm) {
  136 + text-align: center;
  137 + }
138 138 }
139 139  
140 140 .btn-submit {
... ... @@ -162,9 +162,9 @@
162 162 position: relative;
163 163 top: -30px;
164 164 right: 0px;
165   -}
  165 + }
166 166  
167   -&-body {
  167 + &-body {
168 168 padding: 25px 35px;
169 169 height: 500px;
170 170  
... ... @@ -173,9 +173,9 @@
173 173 overflow-y: auto;
174 174 padding: 15px;
175 175 height: 440px;
  176 + }
176 177 }
177 178 }
178   -}
179 179  
180 180 .modal-fechar-pequeno {
181 181 font-size: 15px;
... ... @@ -185,13 +185,6 @@
185 185 font-size: 24px;
186 186 }
187 187  
188   -// Sobreescreve a classe do bootstrap
189   -.close {
190   - color: white;
191   - opacity: 1;
192   - font-weight: normal;
193   -}
194   -
195 188 .btn-question {
196 189 color: #484848;
197 190 background-color: #fff;
... ... @@ -204,24 +197,6 @@
204 197 border-radius: 100%;
205 198 }
206 199  
207   -.destaque-cinza {
208   - background-color: #F1F1F1;
209   - padding: 30px;
210   -}
211   -
212   -.destaque-cinza-claro {
213   - background-color: #F8F8F8;
214   - padding: 30px;
215   -}
216   -
217   -.left-border-gray {
218   - border-left: 3px solid #eeeeee;
219   -
220   - @media (max-width: 768px) {
221   - border: none;
222   -}
223   -}
224   -
225 200 ul.list-color {
226 201 list-style: none;
227 202 padding: 0;
... ... @@ -233,11 +208,10 @@ ul.list-color li:before {
233 208 @each $category, $color in $categories {
234 209 .#{$category} & {
235 210 color: $color;
  211 + }
236 212 }
237 213 }
238 214  
239   -}
240   -
241 215 ul.list-color li:before {
242 216 content: "• ";
243 217 font-weight: bold;
... ... @@ -248,18 +222,135 @@ ul.list-color li:before {
248 222  
249 223 ul.list-color li {
250 224 padding-left: 2em;
251   - padding-bottom: 20px;
  225 + padding-bottom: 10px;
252 226 text-indent: -0.7em;
253 227 }
254 228  
255   -.right-block {
256   - float: right;
  229 +.destaque-bg-cinza {
  230 + background-color: #F1F1F1;
  231 +}
  232 +
  233 +.destaque-padding {
  234 + padding: 20px;
  235 +}
  236 +
  237 +.destaque-font {
  238 + font-size: 130%;
  239 +}
  240 +
  241 +.font-140 {
  242 + font-size: 140%;
  243 +}
  244 +
  245 +.font-115 {
  246 + font-size: 115%;
  247 +}
  248 +
  249 +.font-180 {
  250 + font-size: 180%;
  251 +}
  252 +
  253 +.destaque-bg-lightgray {
  254 + background-color: #F8F8F8;
  255 +}
  256 +
  257 +.margin-15 {
  258 + margin-left: 15px;
  259 + margin-right: 15px;
  260 +}
  261 +
  262 +.left-border-gray {
  263 + border-left: 4px solid #d1d6d9;
  264 + margin-bottom: 10px;
  265 + ul.list-color li:last-child { padding-bottom: 0; }
  266 + @media (max-width: 768px) {
  267 + border: none;
  268 + }
  269 +}
  270 +
  271 +.bottom-border-gray {
  272 + border-bottom: 1px lightgray;
  273 + border-bottom-style: solid;
  274 + margin: 0px!important;
  275 + padding: 30px;
  276 +}
  277 +
  278 +.padding-30 {
  279 + padding: 30px;
257 280 }
258 281  
259 282 a.link-black {
260 283 color: black;
261 284 }
262 285  
  286 +article.program-content {
  287 + margin-top: 40px;
  288 +}
  289 +
  290 +article.program-content div.ng-binding div.container div.row {
  291 + margin-bottom: 40px;
  292 +}
  293 +
  294 +article.program-content h3 {
  295 + margin-bottom: 15px;
  296 +}
  297 +
263 298 .inline-block {
264   - display: inline-block;
  299 + display: inline-block;
  300 +}
  301 +
  302 +blockquote {
  303 + border-left: medium none;
  304 + font-size: 140%;
  305 + padding: 50px 0 0 50px;
  306 + position: relative;
  307 +
  308 + &:before {
  309 + content: "⌜";
  310 + font-size: 200px;
  311 + left: -2px;
  312 + position: absolute;
  313 + top: -50px;
  314 + font-weight: bolder;
  315 + left: -17px;
  316 + top: -68px;
  317 + @each $category, $color in $categories {
  318 + .#{$category} & {
  319 + color: $color;
  320 + }
  321 + }
  322 + }
  323 +
  324 +}
  325 +
  326 +// .cultura blockquote::before {
  327 +// color: #cd999b;
  328 +// }
  329 +
  330 +// Sobreescreve a classe do bootstrap
  331 +.close {
  332 + color: white;
  333 + opacity: 1;
  334 + font-weight: normal;
  335 +}
  336 +
  337 +// .img-responsive {
  338 +// width: 100%;
  339 +// }
  340 +
  341 +strong {
  342 + @each $category, $color in $categories {
  343 + .#{$category} & {
  344 + color: $color;
  345 + }
  346 + }
  347 +}
  348 +
  349 +.top-border-theme {
  350 + @each $category, $color in $categories {
  351 + .#{$category} & {
  352 + border-color: $color;
  353 + }
  354 + }
  355 + border-top: 20px solid;
265 356 }
... ...
src/app/pages/auth/signin.html
... ... @@ -21,6 +21,8 @@
21 21 <div class="row">
22 22 <div class="col-sm-4"></div>
23 23 <div class="col-sm-8 text-center-sm">
  24 + <!-- <div ng-if="pageSignin.redirect > 0">
  25 + </div> -->
24 26 <div ng-if="pageSignin.countdown > 0">
25 27 <p>
26 28 Você será redirecionado em menos de <b>{{pageSignin.countdown}} segundos</b>...
... ...
src/app/pages/inicio/inicio.controller.js
... ... @@ -160,6 +160,10 @@
160 160 vm.article.videoIsLoaded = true;
161 161 };
162 162  
  163 + InicioPageController.prototype.submitSearch = function() {
  164 + vm.$log.warn('No implemented yet.');
  165 + };
  166 +
163 167 InicioPageController.prototype.filter = function() {
164 168 var vm = this;
165 169  
... ...
src/app/pages/inicio/inicio.html
... ... @@ -88,7 +88,7 @@
88 88 <label for="articleQueryFilter1" class="control-label sr-only">Buscar programas:</label>
89 89 <input id="articleQueryFilter1" type="search" class="form-control input-search" ng-model="pageInicio.query" placeholder="Buscar programas" aria-label="Buscar programas" >
90 90 <span class="input-group-btn">
91   - <button type="button" class="btn btn-default" ng-click="pageInicio.search()">
  91 + <button type="button" class="btn btn-default" ng-click="pageInicio.submitSearch()">
92 92 <span class="icon-circle icon-small color-theme-common-bg">
93 93 <span class="glyphicon glyphicon-search"></span>
94 94 </span>
... ... @@ -120,7 +120,7 @@
120 120 <label for="articleQueryFilter2" class="control-label sr-only">Buscar programas:</label>
121 121 <input id="articleQueryFilter2" type="search" class="form-control input-search" ng-model="pageInicio.query" placeholder="Buscar programas" aria-label="Buscar programas" >
122 122 <span class="input-group-btn">
123   - <button type="button" class="btn btn-default" ng-click="pageInicio.search()">
  123 + <button type="button" class="btn btn-default" ng-click="pageInicio.submitSearch()">
124 124 <span class="icon-circle icon-small color-theme-common-bg">
125 125 <span class="glyphicon glyphicon-search"></span>
126 126 </span>
... ...
src/app/pages/programas/programa.html
... ... @@ -23,89 +23,98 @@
23 23 <div class="container">
24 24 <div class="row">
25 25 <article class="program-preview">
26   - <!-- Preview > Titulo -->
27   - <div class="col-md-12">
28   - <h1 class="program-preview--title color-theme-fg">{{::pagePrograma.article.title}}</h1>
29   - </div>
30   - <!-- Preview > coluna da esquerda -->
31   - <div class="col-md-8">
32   - <div class="program-preview--box contraste-box">
33   - <div class="program-preview--banner" ng-style="{'background-image':'url( {{::pagePrograma.banner.src}} )'}"></div>
34   - <div class="program-preview--box--content-wrapper">
35   - <div class="program-preview--icon icon-wrapper-rounded color-theme-bg" ng-class="pagePrograma.category.slug">
36   - <span class="icon" ng-class="'icon-tema-' + pagePrograma.category.slug"></span>
37   - </div>
38   - <div class="program-preview--abstract color-theme-fg">
39   - <h2>{{::stripHtml(pagePrograma.article.abstract)}}</h2>
40   - </div>
41   - <div class="program-preview--abstract-details">
42   - <p>Lorem ipsum dolor sit amet, ea veniam mucius ocurreret vix, ius ex nisl vidisse partiendo. Blandit nominavi cum ei, paulo quaestio his ei, eum minim salutandi in. Civibus albucius in quo, et eam posse facilisis. Debet suavitate sea ut, his ei feugiat fastidii eleifend. Quo ex quando maiestatis voluptatum, mel te perpetua maiestatis, sit ceteros legendos deserunt ea. Enim dolores moderatius eu pro, ad quo ignota aliquid meliore.</p>
43   - </div>
44   - <div class="program-preview--share">
45   - <div class="program-preview--share-label">Compartilhe este programa:</div>
46   - <social-share class="program-preview--share-directive"></social-share>
  26 + <!-- Preview > Titulo -->
  27 + <div class="col-md-12">
  28 + <h1 class="program-preview--title color-theme-fg">{{::pagePrograma.article.title}}</h1>
  29 + </div>
  30 + <!-- Preview > coluna da esquerda -->
  31 + <div class="col-md-8">
  32 + <div class="program-preview--box contraste-box">
  33 + <div class="program-preview--banner" ng-style="{'background-image':'url( {{::pagePrograma.banner.src}} )'}"></div>
  34 + <div class="program-preview--box--content-wrapper">
  35 + <div class="program-preview--icon icon-wrapper-rounded color-theme-bg" ng-class="pagePrograma.category.slug">
  36 + <span class="icon" ng-class="'icon-tema-' + pagePrograma.category.slug"></span>
  37 + </div>
  38 + <div class="program-preview--abstract color-theme-fg">
  39 + <h2>{{::stripHtml(pagePrograma.article.abstract)}}</h2>
  40 + </div>
  41 + <div class="program-preview--abstract-details">
  42 + <p>Lorem ipsum dolor sit amet, ea veniam mucius ocurreret vix, ius ex nisl vidisse partiendo. Blandit nominavi cum ei, paulo quaestio his ei, eum minim salutandi in. Civibus albucius in quo, et eam posse facilisis. Debet suavitate sea ut, his ei feugiat fastidii eleifend. Quo ex quando maiestatis voluptatum, mel te perpetua maiestatis, sit ceteros legendos deserunt ea. Enim dolores moderatius eu pro, ad quo ignota aliquid meliore.</p>
  43 + </div>
  44 + <div class="program-preview--share">
  45 + <div class="program-preview--share-label">COMPARTILHE ESTE <b>PROGRAMA</b></div>
  46 + <div class="dropdown">
  47 + <button id="dropdown-share-btn" class="btn btn-link dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" aria-label="Mostrar ou esconder a lista redes sociais para compartilhamento"><span class="icon icon-social-share-small" aria-hidden="true"></span></button>
  48 + <social-share
  49 + url=""
  50 + text=""
  51 + image=""
  52 + arrow-class="social-share--arrow"
  53 + class="dropdown-menu dropdown-menu-right"
  54 + ></social-share>
47 55 </div>
48   - <div class="program-preview--make-proposal">
49   - <div class="row">
50   - <div class="col-sm-6">
51   - <div class="button--themed">
52   - <button type="button" class="btn btn-block" ng-click="pagePrograma.showProposalForm()">Faça uma proposta</button>
53   - </div>
  56 + </div>
  57 + <div class="program-preview--make-proposal">
  58 + <div class="row">
  59 + <div class="col-sm-6">
  60 + <div class="button--themed">
  61 + <button type="button" class="btn btn-block" ng-click="pagePrograma.showProposalForm()">Faça uma proposta</button>
54 62 </div>
55 63 </div>
56 64 </div>
57 65 </div>
58 66 </div>
59 67 </div>
60   - <!-- Preview > coluna da direita -->
61   - <div class="col-md-4">
62   - <div class="row">
  68 + </div>
  69 + <!-- Preview > coluna da direita -->
  70 + <div class="col-md-4">
  71 + <div class="row">
63 72  
64   - <!-- Top Proposals -->
65   - <div>
66   - <!-- Loading Top Proposals -->
67   - <div ng-if="pagePrograma.loadingTopProposals">
68   - <div class="alert alert-info" role="alert">
69   - Carregando propostas mais votadas...
70   - </div>
  73 + <!-- Top Proposals -->
  74 + <div>
  75 + <!-- Loading Top Proposals -->
  76 + <div ng-if="pagePrograma.loadingTopProposals">
  77 + <div class="alert alert-info" role="alert">
  78 + Carregando propostas mais votadas...
71 79 </div>
  80 + </div>
72 81  
73   - <!-- Top Proposals > Carousel -->
74   - <div class="col-xs-12" ng-if="!pagePrograma.loadingTopProposals && pagePrograma.proposalsTopRated && pagePrograma.proposalsTopRated.length > 0">
75   - <h3 class="color-theme-fg">Propostas mais votadas</h3>
76   - <proposal-carousel proposals="pagePrograma.proposalsTopRated"></proposal-carousel>
77   - </div>
  82 + <!-- Top Proposals > Carousel -->
  83 + <div class="col-xs-12" ng-if="!pagePrograma.loadingTopProposals && pagePrograma.proposalsTopRated && pagePrograma.proposalsTopRated.length > 0">
  84 + <h3 class="color-theme-fg">Propostas mais votadas</h3>
  85 + <proposal-carousel proposals="pagePrograma.proposalsTopRated"></proposal-carousel>
78 86 </div>
  87 + </div>
79 88  
80   - <!-- Proposal Box -->
81   - <div>
82   - <div class="col-xs-12" ng-if="!pagePrograma.loadingProposalBox && pagePrograma.randomProposal" ng-class="{'focused-proposal': !!pagePrograma.search.proposal_id}">
83   - <h3 class="color-theme-fg">Propostas nesse programa</h3>
84   - <proposal-box proposal="pagePrograma.randomProposal" topic="pagePrograma.article" category="pagePrograma.category" can-vote="true" focus="{{pagePrograma.search.proposal_id}}" ></proposal-box>
85   - </div>
  89 + <!-- Proposal Box -->
  90 + <div>
  91 + <div class="col-xs-12" ng-if="!pagePrograma.loadingProposalBox && pagePrograma.randomProposal" ng-class="{'focused-proposal': !!pagePrograma.search.proposal_id}">
  92 + <h3 class="color-theme-fg">Apoie outras propostas</h3>
  93 + <proposal-box proposal="pagePrograma.randomProposal" topic="pagePrograma.article" category="pagePrograma.category" can-vote="true" focus="{{pagePrograma.search.proposal_id}}" ></proposal-box>
  94 + </div>
86 95  
87   - <!-- Loading Proposal Box -->
88   - <div ng-if="pagePrograma.loadingProposalBox">
89   - <div class="alert alert-info" role="alert">
90   - Carregando propostas nesse programa...
91   - </div>
  96 + <!-- Loading Proposal Box -->
  97 + <div ng-if="pagePrograma.loadingProposalBox">
  98 + <div class="alert alert-info" role="alert">
  99 + Carregando propostas nesse programa...
92 100 </div>
93 101 </div>
  102 + </div>
94 103  
95   - <!-- No Proposals? okay! -->
96   - <div ng-if="!pagePrograma.loadingTopProposals && !pagePrograma.loadingProposalBox">
97   - <div class="col-xs-12" ng-if="!pagePrograma.randomProposal && !(pagePrograma.proposalsTopRated && pagePrograma.proposalsTopRated.length > 0)">
98   - <h3>Programas sem propostas</h3>
99   - <p>
100   - Este programa ainda não possui nenhuma proposta.
101   - <div class="button--themed">
102   - <button type="button" class="btn btn-block" ng-click="pagePrograma.showProposalForm()">Faça uma proposta</button>
103   - </div>
104   - </p>
105   - </div>
  104 + <!-- No Proposals? okay! -->
  105 + <div ng-if="!pagePrograma.loadingTopProposals && !pagePrograma.loadingProposalBox">
  106 + <div class="col-xs-12" ng-if="!pagePrograma.randomProposal && !(pagePrograma.proposalsTopRated && pagePrograma.proposalsTopRated.length > 0)">
  107 + <h3>Programas sem propostas</h3>
  108 + <p>
  109 + Este programa ainda não possui nenhuma proposta.
  110 + <div class="button--themed">
  111 + <button type="button" class="btn btn-block" ng-click="pagePrograma.showProposalForm()">Faça uma proposta</button>
  112 + </div>
  113 + </p>
106 114 </div>
107 115 </div>
108 116 </div>
  117 + </div>
109 118 </article>
110 119 </div>
111 120 </div>
... ...
src/app/pages/programas/programas.html
... ... @@ -11,7 +11,7 @@
11 11 <div class="container">
12 12 <div class="row">
13 13 <div class="col-sm-12">
14   - <h1>Programas de governo</h1>
  14 + <h1>Programas</h1>
15 15 </div>
16 16 </div>
17 17 </div>
... ...
src/app/pages/programas/programas.scss
... ... @@ -7,81 +7,121 @@
7 7 }
8 8 }
9 9  
10   -.program-preview {
  10 +.page--program {
11 11  
12   - .program-preview--box {
13   - position: relative;
14   - background-color: #f1f1f1;
15   - }
  12 + .program-preview {
16 13  
17   - .program-preview--banner {
18   - width: 100%;
19   - height: 400px;
  14 + .program-preview--box {
  15 + position: relative;
  16 + background-color: #f1f1f1;
  17 + }
20 18  
21   - background-position: center;
22   - background-size: cover;
23   - background-repeat: no-repeat;
  19 + .program-preview--banner {
  20 + width: 100%;
  21 + height: 400px;
24 22  
  23 + background-position: center;
  24 + background-size: cover;
  25 + background-repeat: no-repeat;
25 26  
26 27  
27   - @media screen and (max-width: $screen-xs) {
28   - // height: 15px;
29 28  
30   - // .video {
31   - // height: 290px;
32   - // }
33   - }
34   - }
  29 + @media screen and (max-width: $screen-xs) {
  30 + // height: 15px;
35 31  
36   - .program-preview--icon {
37   - $icon-size: 98px;
38   - $icon-scale: 0.7;
39   - position: absolute;
40   - top: (-1) * ($icon-size / 2);
41   - left: 40px;
  32 + // .video {
  33 + // height: 290px;
  34 + // }
  35 + }
  36 + }
42 37  
43   - width: $icon-size * $icon-scale + 20px;
44   - height: $icon-size * $icon-scale + 20px;
  38 + .program-preview--icon {
  39 + $icon-size: 80px;
  40 + $icon-scale: 0.7;
  41 + position: absolute;
  42 + top: (-1) * ($icon-size / 2);
  43 + left: 40px;
  44 +
  45 + width: $icon-size * $icon-scale + 25px;
  46 + height: $icon-size * $icon-scale + 25px;
  47 +
  48 + .icon {
  49 + display: block;
  50 + position: relative;
  51 + top: -2px;
  52 + left: -2px;
  53 + }
  54 +
  55 + .contraste & {
  56 + border: 1px solid #fff;
  57 + }
  58 + }
45 59  
46   - .icon {
47   - display: block;
  60 + .program-preview--box--content-wrapper {
  61 + padding: 48px;
48 62 position: relative;
49   - top: -8px;
50   - left: -8px;
51   - // transform: scale($icon-scale);
52 63 }
53 64  
54   - .contraste & {
55   - border: 1px solid #fff;
  65 + .program-preview--abstract {
  66 + h2 {
  67 + margin-top: 22px; // parent.margin + this.margin = 48 + 22 = 72px;
  68 + margin-bottom: 32px;
  69 + }
56 70 }
57   - }
58 71  
59   - .program-preview--box--content-wrapper {
60   - padding: 40px;
61   - position: relative;
62   - }
  72 + .program-preview--abstract-details {
  73 + p {
  74 + color: #484848;
  75 + font-size: 14px;
  76 + line-height: 18px;
  77 + margin-bottom: 25px;
  78 + }
  79 + }
63 80  
64   - .program-preview--share-label,
65   - .program-preview--share-directive {
66   - display: inline-block;
67   - vertical-align: middle;
68   - }
  81 + .program-preview--share {
  82 + margin-bottom: 20px;
  83 + position: relative;
  84 + .dropdown {
  85 + display: inline-block;
  86 + position: relative;
  87 + }
  88 +
  89 + .dropdown-menu {
  90 + padding: 0;
  91 + margin: 0;
  92 + }
  93 +
  94 + .social-share {
  95 + background-color: #fff;
  96 + }
  97 +
  98 + .social-share--arrow {
  99 + border-bottom-color: #fff;
  100 + }
  101 + }
69 102  
70   - .program-preview--abstract h2 {
71   - font-size: 40px;
72   - }
  103 + .program-preview--share-label,
  104 + .program-preview--share-directive {
  105 + display: inline-block;
  106 + vertical-align: middle;
  107 + }
73 108  
74   - h2,
75   - h3{
76   - font-weight: bold;
77   - }
  109 + h1 {
  110 + font-size: 38px;
  111 + line-height: 40px;
  112 + font-weight: 900;
  113 + }
78 114  
79   - h3 {
80   - margin-top: 0;
81   - }
82   -}
  115 + h2 {
  116 + font-size: 32px;
  117 + line-height: 36px;
  118 + font-weight: bold;
  119 + }
83 120  
84   -.page--program {
  121 + h3 {
  122 + margin-top: 0;
  123 + }
  124 + }
85 125  
86 126 .btn-close {
87 127 position: absolute;
... ...
src/assets/images/icons/feedback-login-success-blue.png

4.29 KB

src/assets/images/icons/feedback-login-success-green.png

4.4 KB

src/assets/images/icons/feedback-login-success-red.png

4.33 KB

src/assets/images/icons/feedback-login-success-yellow.png

3.86 KB

src/assets/images/icons/feedback-proposal-sent-blue.png

3.53 KB

src/assets/images/icons/feedback-proposal-sent-green.png

3.63 KB

src/assets/images/icons/feedback-proposal-sent-red.png

3.53 KB

src/assets/images/icons/feedback-proposal-sent-yellow.png

3.15 KB

src/assets/images/icons/feedback-user-created.png

3.2 KB

src/assets/images/icons/tema-agricultura.png

3.1 KB | W: | H:

2.83 KB | W: | H:

  • 2-up
  • Swipe
  • Onion skin
src/assets/images/icons/tema-cidades.png

2.45 KB | W: | H:

2.16 KB | W: | H:

  • 2-up
  • Swipe
  • Onion skin
src/assets/images/icons/tema-cultura.png

2.24 KB | W: | H:

2.26 KB | W: | H:

  • 2-up
  • Swipe
  • Onion skin
src/assets/images/icons/tema-desenvolvimento-produtivo.png

2.88 KB | W: | H:

2.57 KB | W: | H:

  • 2-up
  • Swipe
  • Onion skin
src/assets/images/icons/tema-educacao.png

2.74 KB | W: | H:

2.48 KB | W: | H:

  • 2-up
  • Swipe
  • Onion skin
src/assets/images/icons/tema-esporte.png

2.21 KB | W: | H:

2.2 KB | W: | H:

  • 2-up
  • Swipe
  • Onion skin
src/assets/images/icons/tema-gestao-publica.png

2.1 KB | W: | H:

2.04 KB | W: | H:

  • 2-up
  • Swipe
  • Onion skin
src/assets/images/icons/tema-igualdade.png

2.73 KB | W: | H:

2.37 KB | W: | H:

  • 2-up
  • Swipe
  • Onion skin
src/assets/images/icons/tema-infraestrutura.png

2.99 KB | W: | H:

2.75 KB | W: | H:

  • 2-up
  • Swipe
  • Onion skin
src/assets/images/icons/tema-meio-ambiente.png

1.9 KB | W: | H:

1.88 KB | W: | H:

  • 2-up
  • Swipe
  • Onion skin
src/assets/images/icons/tema-reducao-da-pobreza.png

2.55 KB | W: | H:

2.36 KB | W: | H:

  • 2-up
  • Swipe
  • Onion skin
src/assets/images/icons/tema-saude.png

2.07 KB | W: | H:

1.95 KB | W: | H:

  • 2-up
  • Swipe
  • Onion skin
src/assets/images/icons/tema-seguranca-publica.png

2.47 KB | W: | H:

2.29 KB | W: | H:

  • 2-up
  • Swipe
  • Onion skin
src/assets/images/icons/tema-trabalho-emprego-e-renda.png

2.38 KB | W: | H:

2.15 KB | W: | H:

  • 2-up
  • Swipe
  • Onion skin