Commit 94c677452a1699279a0de496dee7c82920ac3b72
Exists in
master
and in
6 other branches
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
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
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
src/assets/images/icons/tema-cidades.png
src/assets/images/icons/tema-cultura.png
src/assets/images/icons/tema-desenvolvimento-produtivo.png
src/assets/images/icons/tema-educacao.png
src/assets/images/icons/tema-esporte.png
src/assets/images/icons/tema-gestao-publica.png
src/assets/images/icons/tema-igualdade.png
src/assets/images/icons/tema-infraestrutura.png
src/assets/images/icons/tema-meio-ambiente.png
src/assets/images/icons/tema-reducao-da-pobreza.png
src/assets/images/icons/tema-saude.png
src/assets/images/icons/tema-seguranca-publica.png
src/assets/images/icons/tema-trabalho-emprego-e-renda.png