Commit 631b1544c61688b75c6530a247fb6c28f830416d

Authored by augustoalmeida
1 parent 1d9735c7

Changed novo.sass to style.sass

gulpfile.js
... ... @@ -13,7 +13,7 @@ var connect = require('gulp-connect');
13 13 // });
14 14  
15 15 gulp.task('sass', function() {
16   - return sass('./sass/novo.sass')
  16 + return sass('./sass/style.sass')
17 17 .on('error', function (err) {
18 18 console.error('Error', err.message);
19 19 })
... ...
index.html
... ... @@ -52,8 +52,7 @@
52 52 'http://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css',
53 53 'http://fonts.googleapis.com/css?family=Open+Sans:400,300,700',
54 54 'http://fonts.googleapis.com/css?family=Asap:400,700',
55   - // 'style.css'
56   - 'novo.css'
  55 + 'style.css'
57 56 ];
58 57 head = document.getElementsByTagName('head')[0]
59 58 for(i = 0; i < css_files.length; i++){
... ...
sass/novo.sass
... ... @@ -1,940 +0,0 @@
1   -// ------------------------------------
2   -// Organização da folha de estilo:
3   -//
4   -// 1 - Variaveis
5   -// 1.1 - espacamento
6   -// 1.2 - arredondamento
7   -// 1.3 - tamanhos de fontes
8   -// 1.4 - dicionarios
9   -// 1.5 - cores
10   -// 1.6 - escurecer
11   -// 2 - Mixins
12   -// 2.1 - hover
13   -// 3 - Base
14   -// 4 - Grid
15   -// 5 - Elementos reusaveis
16   -// 5.1 - botao padrao
17   -// 5.2 - botao voltar
18   -// 5.3 - icones
19   -// 6 - Blocos de elementos
20   -// 6.1 - compartilhar
21   -// 6.2 - logo
22   -// 6.3 - tabs de temas e programas
23   -// 6.4 - blocos dos temas
24   -// 6.5 - listagem dos programas
25   -// 6.6 - blocos dos programas
26   -// 6.7 - header do programa e select box
27   -// 6.8 - imagem destaque do programa, titulo, descricao e botao de acesso
28   -// 6.9 - login form
29   -// 6.10 - votacao
30   -// 6.11 - lista de resultados
31   -// 6.12 - paginador
32   -// 6.13 - calendario dos ministros
33   -// 6.14 - listas
34   -// 7 - Modificadores
35   -// 8 - Cores do Temas
36   -// 9 - Alto Contraste
37   -// ------------------------------------
38   -
39   -
40   -// ------------------------------------
41   -// 1 - Variaveis
42   -// ------------------------------------
43   -
44   -// 1.1 - espacamento
45   -$gutter: 20px
46   -
47   -// 1.2 - arredondamento
48   -$radius: 3px
49   -
50   -// 1.3 - tamanhos de fontes
51   -$font-size-base: 16px
52   -$font-size-big: $font-size-base + 2
53   -$font-size-small: $font-size-base - 2
54   -$font-size-h1: 28px
55   -$font-size-h2: 38px
56   -$font-size-h3: 28px
57   -$font-size-h4: 34px
58   -$theme-size-header: 24px
59   -$proposal-title: 32px
60   -
61   -// 1.4 - dicionarios
62   -$categories: (saude: #3449b7, seguranca-publica: #ee2a61, educacao: #f39720, reducao-da-pobreza: #3ebb8f)
63   -$categories-descriptions: (saude: "Saúde é direito de todos e dever do Estado. O Sistema Único de Saúde (SUS) é universal, integral e de responsabilidade do Governo Federal, estados e municípios. Atende a todos os brasileiros.", seguranca-publica: "A segurança pública é um direito fundamental dos cidadãos. A proteção da vida, a disseminação da cultura da paz e a integração dos órgãos e instituições municipais, estaduais e federais são os maiores compromissos dessa política pública.", educacao: "Uma pátria educadora se faz com oportunidades para todos. Nos últimos anos, o Brasil criou esse caminho de oportunidades. Ampliamos o acesso à educação em todos os níveis de ensino – da creche à pós-graduação – e para todos os brasileiros, independentemente de sua classe social. E ainda há muito a fazer. O Plano Nacional de Educação (PNE) estabelece novas metas para que o governo federal trabalhe em parceria com a sociedade, com os estados e os municípios na construção de um futuro melhor. Queremos agora um salto na qualidade do ensino.", reducao-da-pobreza: "Com o esforço do Brasil para reduzir a pobreza e a desigualdade, 36 milhões de pessoas superaram a miséria na última década e o país saiu do Mapa da Fome das Nações Unidas.")
64   -
65   -// 1.5 - cores
66   -$header-color: #03316f
67   -$link-color: #335277
68   -
69   -// 1.6 - escurecer
70   -$darken: 15%
71   -
72   -
73   -// ------------------------------------
74   -// 2 - Mixins
75   -// ------------------------------------
76   -
77   -// 2.1 - hover
78   -=hover($color, $amount)
79   - transition: all 400ms
80   - &:hover
81   - background-color: darken($color, $amount)
82   - text-decoration: none
83   -
84   -// ------------------------------------
85   -// 3 - Base
86   -// ------------------------------------
87   -
88   -body
89   - font-family: 'Open Sans', sans-serif
90   - font-size: $font-size-base
91   - font-weight: 400
92   -h1
93   - font-size: $font-size-h1
94   - font-weight: 500
95   - margin: $gutter 0
96   - text-transform: uppercase
97   - a
98   - color: $header-color
99   -h2
100   - border-bottom: 1px solid darken(#eeeff1,$darken)
101   - font-size: $font-size-h2
102   - font-weight: 500
103   - margin-bottom: $gutter * 2
104   - padding-bottom: $gutter
105   - small
106   - display: block
107   - font-size: 16px
108   - padding-top: $gutter * 0.25
109   - text-transform: none
110   -h3
111   - font-size: $font-size-h3
112   - font-weight: 500
113   -h4
114   - font-size: $font-size-h4
115   - font-weight: 500
116   -p,ul,select
117   - color: #000
118   -blockquote
119   - border-bottom: 5px solid
120   - border-left: 0
121   - border-right: 0
122   - border-top: 5px solid
123   - font-size: $font-size-h1
124   - margin: $gutter 0
125   - padding: $gutter 0
126   -
127   -// ------------------------------------
128   -// 4 - Grid
129   -// ------------------------------------
130   -
131   -.container, .row
132   - margin-bottom: $gutter
133   -
134   -
135   -// ------------------------------------
136   -// 5 - Elementos reusaveis
137   -// ------------------------------------
138   -.hide
139   - display: none
140   -
141   -.button
142   - background-color: #387bf9
143   - border-bottom: 3px solid darken(#387bf9, $darken)
144   - border-left: 0
145   - border-right: 0
146   - border-top: 0
147   - border-radius: $radius * 2
148   - color: #fff
149   - cursor: pointer
150   - display: block
151   - font-size: $font-size-small
152   - font-weight: 700
153   - padding-bottom: $gutter * 0.75
154   - padding-left: 0
155   - padding-right: 0
156   - padding-top: $gutter * 0.75
157   - text-align: center
158   - +hover(#387bf9,$darken)
159   - &:hover, &:focus
160   - color: #fff
161   - &-inline
162   - display: inline-block
163   - padding-bottom: $gutter * 0.25 !important
164   - padding-top: $gutter * 0.25 !important
165   - &-cancela
166   - @extend .button
167   - &-send
168   - span
169   - background-image: url(images/airplane.png)
170   - background-position: left center
171   - background-repeat: no-repeat
172   - color: #fff
173   - padding-left: $gutter * 1.5
174   - &-participe
175   - .fa
176   - margin-right: $gutter * 0.5
177   -
178   -.btn
179   - background-color: transparent
180   - border: 0
181   - color: #fff
182   - font-size: $font-size-small
183   - font-weight: 700
184   - padding-bottom: 0
185   - padding-left: $gutter * 0.5
186   - padding-right: $gutter * 0.5
187   - padding-top: 0
188   - vertical-align: middle
189   -
190   -.icon
191   - background-repeat: no-repeat
192   - background-position: 50% !important
193   - background-size: auto !important
194   - border: 0 !important
195   - border-radius: 100%
196   - color: #fff !important
197   - display: inline-block
198   - font-size: 20px
199   - height: 36px
200   - min-width: 0 !important
201   - text-align: center
202   - transform: all 200ms
203   - width: 36px
204   - &-facebook
205   - background-color: #537abb
206   - padding: 8px 0
207   - +hover(#537abb,$darken)
208   - &-twitter
209   - background-color: #78caee
210   - padding: 8px 0
211   - +hover(#78caee,$darken)
212   - &-gplus
213   - background-color: #d54000
214   - padding: 9px 0
215   - +hover(#d54000,$darken)
216   - &-whatsapp
217   - background-color: #56ba62
218   - padding: 7px 0
219   - +hover(#56ba62,$darken)
220   - &-email
221   - background-color: #edb24c
222   - padding: 7px 0
223   - +hover(#edb24c,$darken)
224   - &.disabled
225   - background-color: #fff
226   - color: #000
227   - +hover(#fff,$darken)
228   - &-theme
229   - background-size: 35px !important
230   - height: 48px
231   - width: 48px
232   - vertical-align: middle
233   - margin-right: $gutter * 0.5
234   - &-vote
235   - display: inline-block
236   - font-size: 35px
237   - height: 64px
238   - margin: 0 6%
239   - padding: 3px 0
240   - width: 64px
241   - &.dislike
242   - background-color: #db4127
243   - border-bottom: 3px solid darken(#db4127, $darken) !important
244   - +hover(#db4127, $darken)
245   - &.like
246   - background-color: #32dbb5
247   - border-bottom: 3px solid darken(#32dbb5, $darken) !important
248   - +hover(#32dbb5, $darken)
249   -
250   -
251   -// ------------------------------------
252   -// 6 - Blocos de elementos
253   -// ------------------------------------
254   -
255   -// 6.1 - compartilhar
256   -.social
257   - position: relative
258   - z-index: 1
259   - &.top
260   - float: right
261   - margin-top: $gutter * 2
262   - &.right
263   - padding-top: 10px
264   - > span
265   - color: #000
266   - display: inline-block
267   - font-size: 12px
268   - font-weight: 300
269   - padding-right: 10px
270   - text-align: right
271   - vertical-align: middle
272   - ul
273   - display: inline-block
274   - vertical-align: middle
275   - span
276   - display: block
277   - margin-bottom: 10px
278   - ul
279   - list-style: none
280   - padding-left: 0
281   - li
282   - display: inline-block
283   - padding: 0 2px !important
284   - vertical-align: top
285   -
286   -// 6.2 - logo
287   -h1
288   - float: left
289   - a
290   - background: url(images/logo.png) no-repeat center
291   - display: inline-block
292   - height: 80px
293   - text-indent: -99999px
294   - width: 160px
295   -
296   -// 6.3 - video
297   -#content
298   - margin-bottom: $gutter * 1.5
299   -
300   -// 6.4 - background do conteudo
301   -.content
302   - padding-top: $gutter * 1.5
303   - &.background
304   - background-color: #f1f1f1
305   -
306   -// 6.5 - tabs de temas e programas (pagina antiga)
307   -.tab
308   - margin-top: $gutter
309   - ul
310   - font-size: 0
311   - list-style: none
312   - margin-bottom: 0
313   - padding-left: 0
314   - li
315   - display: inline-block
316   - font-size: $font-size-base
317   - width: 50%
318   - a
319   - background-color: #efefef
320   - border-bottom: 1px solid #000
321   - color: #000
322   - display: block
323   - font-weight: 700
324   - padding-bottom: $gutter
325   - padding-left: $gutter * 0.25
326   - padding-right: $gutter * 0.25
327   - padding-top: $gutter
328   - text-align: center
329   - text-transform: uppercase
330   - .active
331   - background-color: #fff
332   - border-bottom: 1px solid #fff
333   - border-left: 1px solid #000
334   - border-right: 1px solid #000
335   - border-top: 1px solid #000
336   -
337   -// 6.6 - menu dos temas
338   -#proposal
339   - &-categories
340   - ul
341   - list-style: none
342   - padding-left: 0
343   -.themes
344   - li
345   - border-bottom: 1px solid #f1f1f1
346   - display: block
347   - font-size: $font-size-base
348   - a
349   - background-color: #fff
350   - color: #484848
351   - display: block
352   - font-family: asap, sans
353   - font-size: $font-size-small
354   - font-weight: 700
355   - padding-bottom: $gutter * 0.5
356   - padding-left: $gutter
357   - padding-right: $gutter
358   - padding-top: $gutter * 0.5
359   - text-transform: uppercase
360   - &:hover,&:focus
361   - text-decoration: none
362   - .arrow-box
363   - position: relative
364   - top: $gutter
365   - &:after
366   - bottom: 100%
367   - left: 50%
368   - border: solid transparent
369   - content: ""
370   - position: absolute
371   - border-bottom-color: #000
372   - border-width: 8px
373   - margin-left: -8px
374   -
375   -// 6.7 - listagem dos programas aleatorios
376   -.proposal
377   - &-container
378   - border-radius: $radius
379   - margin-bottom: $gutter
380   - &-list
381   - list-style: none
382   - padding-left: 0
383   - &-group
384   - ul
385   - list-style: none
386   - padding-left: 0
387   -
388   -// 6.8 - blocos dos programas
389   -.box
390   - background-color: #fff
391   - border-radius: $radius
392   - color: #000
393   - display: block
394   - margin-top: $gutter * 1.5
395   - overflow: hidden
396   - transition: all 400ms
397   - +hover(#fff,$darken)
398   - &:hover
399   - text-decoration: none
400   - p
401   - padding-bottom: $gutter * 0.75
402   - &-propostas
403   - height: auto
404   - border: 1px solid
405   - margin-bottom: $gutter * 0.5
406   - margin-top: 0
407   - padding: $gutter
408   - position: relative
409   - &:hover
410   - background-color: #fff
411   - p
412   - border-bottom: 0
413   - padding-bottom: inherit
414   - &-apoie
415   - p
416   - @extend .box-subtitle
417   - border-bottom: 0
418   - padding-bottom: inherit
419   - &-header
420   - color: #000
421   - font-size: $font-size-big
422   - font-weight: 700
423   - p
424   - font-size: $font-size-small
425   - font-weight: 500
426   - margin-top: $gutter * 0.5
427   - height: $gutter * 2
428   - &-body
429   - padding: $gutter
430   - img
431   - margin-left: $gutter * (-1)
432   - margin-right: $gutter * (-1)
433   - margin-top: $gutter * (-1)
434   - margin-bottom: $gutter
435   - height: 170px
436   - &-category
437   - font-size: $font-size-small
438   - font-weight: 700
439   - list-style: none
440   - text-transform: uppercase
441   - div
442   - color: #fff
443   - padding-bottom: $gutter * 0.25
444   - padding-left: $gutter
445   - padding-right: $gutter * 0.5
446   - padding-top: $gutter * 0.25
447   - &-title
448   - font-size: $font-size-h2
449   - font-weight: 400
450   - margin-bottom: $gutter
451   - &-subtitle
452   - color: $link-color
453   - font-size: $theme-size-header
454   - font-weight: 700
455   - line-height: 1.2
456   - margin-bottom: $gutter
457   - &-info
458   - margin-bottom: $gutter
459   - &-footer
460   - margin-bottom: $gutter * 0.25
461   - margin-left: auto
462   - margin-right: auto
463   - margin-top: $gutter
464   - width: 40%
465   - &-bottom
466   - @extend .box-footer
467   - bottom: 10px
468   - color: #000
469   - display: inline-block
470   - font-size: $font-size-small
471   - font-weight: 700
472   - margin-bottom: $gutter * 0.75
473   - margin-top: 0
474   - text-align: center
475   - &:hover, &:focus
476   - color: #000
477   - &-center
478   - text-align: center
479   -
480   -// 6.9 - header do programa e select box
481   -.select
482   - background-color: #000
483   - margin-bottom: $gutter * 0.5
484   - padding: $gutter * 0.25
485   - .proposal
486   - &-link
487   - color: #fff
488   - display: inline-block
489   - font-size: $theme-size-header
490   - font-weight: 700
491   - padding-bottom: 0
492   - padding-left: $gutter * 2.25
493   - padding-right: 0
494   - padding-top: 0
495   - vertical-align: middle
496   - &-selection
497   - background-color: #fff
498   - border: 0
499   - border-radius: 3px
500   - float: right
501   - margin: 4px
502   - width: 50%
503   - vertical-align: middle
504   -
505   -// 6.10 - imagem destaque do programa, titulo, descricao e botao de acesso
506   -.proposal-header
507   - position: relative
508   - .title
509   - background-color: #000
510   - bottom: 170px
511   - color: #fff
512   - font-size: $proposal-title
513   - font-weight: 700
514   - margin-bottom: $gutter * 1.25
515   - margin-left: 0
516   - margin-right: 0
517   - margin-top: $gutter * 1.25
518   - padding: $gutter
519   - position: absolute
520   - right: 0
521   - text-align: center
522   - text-transform: uppercase
523   - width: 50%
524   - vertical-align: middle
525   - .show_body
526   - margin-bottom: $gutter
527   - margin-top: $gutter
528   - a
529   - background-color: lighten(#000, 40%)
530   - border-bottom: 5px solid #000
531   - border-left: 0
532   - border-right: 0
533   - border-top: 0
534   - border-radius: $radius * 2
535   - color: #fff
536   - font-size: $font-size-h2
537   - font-weight: 700
538   - padding-bottom: $gutter * 0.5
539   - padding-left: 0
540   - padding-right: 0
541   - padding-top: $gutter * 0.5
542   - text-align: center
543   - +hover(#000,$darken)
544   - img
545   - width: 100%
546   - p
547   - @extend .title
548   - bottom: 140px
549   - font-size: $font-size-small
550   - margin-bottom: $gutter * 0.5
551   - padding-top: $gutter * 0.25
552   - text-transform: none
553   -
554   -// 6.11 - login form
555   -.participar
556   - text-align: right
557   - .participe
558   - background-color: #387bf9
559   - border-color: darken(#387bf9, $darken)
560   - font-size: 14px
561   - padding: 2px 10px
562   - .entrar
563   - background: url(images/icons/icon-user.png) no-repeat 20px 50%
564   - border-left: 1px solid #bcbcbc
565   - margin-left: 20px
566   - padding-left: 40px
567   -.login,.signup
568   - text-align: left
569   - .message
570   - background: #fcc
571   - border: 1px solid #b00
572   - border-radius: $radius
573   - color: #b00
574   - font-weight: 700
575   - padding-bottom: $gutter * 0.25
576   - padding-left: $gutter * 0.5
577   - padding-right: $gutter * 0.5
578   - padding-top: $gutter * 0.25
579   - margin-bottom: $gutter
580   - input
581   - border: 1px solid
582   - display: block
583   - margin-bottom: $gutter
584   - padding-bottom: $gutter * 0.25
585   - padding-left: $gutter * 0.5
586   - padding-right: $gutter * 0.5
587   - padding-top: $gutter * 0.25
588   - width: 100%
589   - &.button
590   - @extend .button
591   - margin-bottom: $gutter * 0.25
592   -
593   - .label
594   - vertical-align: middle
595   - .icon
596   - vertical-align: middle
597   - .oauth
598   - margin-top: $gutter * 0.5
599   - text-align: right
600   - .forgot-password
601   - display: block
602   - font-size: $font-size-small
603   - text-align: center
604   - i
605   - font-style: normal
606   - font-weight: 700
607   - padding-left: $gutter * 0.25
608   - padding-right: $gutter * 0.25
609   - .row
610   - input
611   - margin-bottom: 0
612   -
613   -// 6.12 - votacao
614   -.vote-actions
615   - .like
616   - display: inline-block
617   -
618   -// 6.13 - lista de resultados
619   -.results-content
620   - .total
621   - float: left
622   - .vote-result
623   - float: right
624   - .updated-at
625   - @extend .vote-result
626   - margin-top: $gutter
627   - table
628   - clear: both
629   - font-weight: 300
630   - tr:nth-child(odd)
631   - background: #e5e5e5
632   - td
633   - padding: $gutter * 0.25
634   - .header
635   - font-weight: 700
636   - text-align: center
637   - .abstract-text
638   - width: 80%
639   - p
640   - margin: inherit
641   - .value
642   - text-align: center
643   - width: 10%
644   - .truncate
645   - display: table
646   - table-layout: fixed
647   - width: 100%
648   - .truncated
649   - overflow-x: hidden
650   - text-overflow: ellipsis
651   - white-space: nowrap
652   -
653   -// 6.14 - paginador
654   -.paging
655   - padding: $gutter * 0.25
656   - ul
657   - display: table
658   - list-style: none
659   - margin: auto
660   - padding: 0
661   - li
662   - float: left
663   - span
664   - @extend .page-link
665   - .page-link
666   - padding: 0 7px
667   - font-size: $font-size-small
668   - font-weight: 400
669   - text-align: center
670   - background-color: #000
671   - color: #fff
672   - display: inline-block
673   - line-height: 24px
674   - .current
675   - background-color: lighten(#000, $darken)
676   - .next
677   - border-radius: 0 $radius $radius 0
678   - .prev
679   - border-radius: $radius 0 0 $radius
680   -
681   -// 6.15 - calendario dos ministros
682   -.slick
683   - &-slider
684   - list-style: none
685   - margin-bottom: 0
686   - margin-left: auto
687   - margin-right: auto
688   - margin-top: $gutter * 2
689   - padding: 0
690   - position: relative
691   - width: 80%
692   - li
693   - background-color: #eeeff1
694   - margin-bottom: $gutter * 0.25
695   - padding: $gutter * 0.5
696   - span
697   - display: block
698   - .date, .time
699   - display: inline-block
700   - margin-top: $gutter
701   - width: 45%
702   - &-list
703   - overflow: hidden
704   - &-slide
705   - float: left
706   - &-def
707   - background-color: transparent
708   - border: 0
709   - color: #000
710   - font-size: 0
711   - position: absolute
712   - top: 43%
713   - width: 20px
714   - &:before
715   - font-family: "FontAwesome"
716   - font-size: 20px
717   - &-prev
718   - @extend .slick-def
719   - left: -25px
720   - &:before
721   - content: "\f053"
722   - &-next
723   - @extend .slick-def
724   - right: -25px
725   - &:before
726   - content: "\f054"
727   - &-disabled
728   - opacity: 0.25
729   -
730   -// 6.16 - listas
731   -.list-container-border
732   - border: 3px solid
733   - border-radius: $radius
734   -.list
735   - &-unstyled
736   - li
737   - border-top: 1px solid darken(#eeeff1,$darken)
738   - font-size: $font-size-big
739   - font-weight: 700
740   - padding: $gutter
741   - &:first-child
742   - border-top: 0
743   - &-styled
744   - margin-left: $gutter
745   - padding-left: 0
746   -.no-border
747   - li
748   - border: 0
749   - padding-bottom: $gutter * 0.25
750   - padding-left: 0
751   - padding-right: 0
752   - padding-top: $gutter * 0.25
753   -
754   -
755   -// ------------------------------------
756   -// 7 - Modificadores
757   -// ------------------------------------
758   -h2
759   - &.name
760   - color: #6c6c6c
761   - font-size: $font-size-big
762   - font-weight: 700
763   - margin: 0
764   - padding: 0
765   - text-transform: none
766   - &.menu
767   - background-color: #484848
768   - border: 0
769   - border-top-left-radius: $radius
770   - border-top-right-radius: $radius
771   - color: #fff
772   - font-size: $font-size-base - 1
773   - font-weight: 300
774   - margin: 0
775   - padding-bottom: $gutter
776   - padding-left: $gutter
777   - padding-right: $gutter
778   - padding-top: $gutter
779   -
780   -h3.titulo-destaque
781   - font-size: $font-size-h3 + 10
782   -.bloco-destaque
783   - padding: $gutter * 1.75
784   - border-radius: $radius
785   - h4
786   - margin-bottom: $gutter * 3
787   -
788   -@each $category, $description in $categories-descriptions
789   - section.#{$category}
790   - .description
791   - margin-top: $gutter
792   - &:before
793   - content: "#{$description}"
794   - color: #6c6c6c
795   - font-family: asap, sans
796   - padding-top: $gutter
797   -
798   -
799   -// ------------------------------------
800   -// 8 - Cores do Temas
801   -// ------------------------------------
802   -
803   -@each $category, $color in $categories
804   - .#{$category}
805   - color: $color
806   - a
807   - color: $color
808   - .button,.show_body a
809   - background-color: $color
810   - border-color: darken($color, $darken)
811   - color: #fff
812   - +hover($color,$darken)
813   - .select
814   - background-color: $color
815   - .proposal
816   - &-header
817   - .title,p
818   - background-color: darken($color, $darken)
819   - .box
820   - &-propostas
821   - border-color: $color
822   - &-title,&-bottom
823   - color: $color
824   - &-category
825   - li
826   - background-color: $color
827   - .slick
828   - &-prev,&-next
829   - color: $color
830   - &-slider
831   - .date,.time
832   - color: $color
833   - .login,.signup
834   - input
835   - border-color: $color
836   - &.button
837   - +hover($color,$darken)
838   - i
839   - color: $color
840   - .list
841   - &-unstyled li
842   - color: $color
843   - .bloco-destaque
844   - background-color: $color
845   - background-image: url(http://www.participa.br/articles/public/0009/6039/mais-medicos-foto4.png)
846   - background-repeat: no-repeat
847   - background-position: 100% 100%
848   - color: #fff
849   - p
850   - color: #fff
851   - .select
852   - .proposal-link
853   - background-image: url(images/icons/#{$category}.png)
854   - background-position: 5px 50%
855   - background-repeat: no-repeat
856   - background-size: 32px
857   - .category-#{$category}
858   - background-color: $color
859   - background-position: 5px 50%
860   - background-repeat: no-repeat
861   - background-size: 40px
862   - border-color: darken($color, $darken)
863   - .icon
864   - &-#{$category}
865   - background-color: $color
866   - background-image: url(images/icons/#{$category}.png)
867   -
868   -
869   -// ------------------------------------
870   -// 9 - Alto Contraste
871   -// ------------------------------------
872   -
873   -.contrast
874   - background-color: #000
875   - color: #fff
876   - .container
877   - h2,h3,h4,a,p,li,label,.label,.login i
878   - color: #fff
879   - a
880   - text-decoration: underline
881   - small
882   - color: darken(#fff, 40%)
883   - .button,.show_body a,.login input.button,.box-category li
884   - background-color: #fff
885   - border-color: darken(#fff, 40%)
886   - color: #000
887   - text-decoration: none
888   - +hover(#fff, 40%)
889   - .icon
890   - &-facebook
891   - background-image: url(images/icons/icon-facebook-contrast.png) !important
892   - &-twitter
893   - background-image: url(images/icons/icon-twitter-contrast.png) !important
894   - &-gplus
895   - background-image: url(images/icons/icon-gplus-contrast.png) !important
896   - &-whatsapp
897   - background-image: url(images/icons/icon-whatsapp-contrast.png) !important
898   - .tab
899   - a
900   - background-color: darken(#fff, 85%)
901   - border-bottom-color: #fff
902   - .active
903   - background-color: #000
904   - border-color: #fff
905   - border-bottom-color: #000
906   - #proposal-categories,#proposal-group
907   - border-color: #fff
908   - .proposal-category
909   - a
910   - background-color: darken(#fff, 85%) !important
911   - .arrow-box:after
912   - border-bottom-color: darken(#fff, 85%) !important
913   - .select
914   - background-color: darken(#fff, 85%)
915   - section
916   - background-color: darken(#fff, 85%)
917   - &:hover
918   - background-color: darken(#fff, 85%)
919   - .box
920   - background-color: #000
921   - .proposal-header
922   - .title, p
923   - background-color: darken(#fff, 85%)
924   - .box
925   - background-color: darken(#fff, 85%)
926   - text-decoration: none
927   - &-propostas
928   - border-color: #fff
929   - &-title,&-subtitle,&-info,&-bottom,.social span,&-header
930   - color: #fff
931   - .slick
932   - &-prev,&-next
933   - color: #fff
934   - &-slider
935   - li
936   - background-color: #000
937   - .date,.time
938   - color: #fff
939   - .bloco-destaque
940   - background: darken(#fff, 85%)
941 0 \ No newline at end of file
sass/style.sass 0 → 100644
... ... @@ -0,0 +1,949 @@
  1 +// ------------------------------------
  2 +// Organização da folha de estilo:
  3 +//
  4 +// 1 - Variaveis
  5 +// 1.1 - espacamento
  6 +// 1.2 - arredondamento
  7 +// 1.3 - tamanhos de fontes
  8 +// 1.4 - dicionarios
  9 +// 1.5 - cores
  10 +// 1.6 - escurecer
  11 +// 2 - Mixins
  12 +// 2.1 - hover
  13 +// 3 - Base
  14 +// 4 - Grid
  15 +// 5 - Elementos reusaveis
  16 +// 5.1 - esconder
  17 +// 5.1 - botao padrao
  18 +// 5.2 - botao voltar
  19 +// 5.3 - icones
  20 +// 6 - Blocos de elementos
  21 +// 6.1 - compartilhar
  22 +// 6.2 - logo
  23 +// 6.3 - video
  24 +// 6.4 - background do conteudo
  25 +// 6.5 - tabs de temas e programas (pagina antiga)
  26 +// 6.6 - menu dos temas
  27 +// 6.7 - listagem dos programas aleatorios
  28 +// 6.8 - blocos dos programas
  29 +// 6.9 - header do programa e select box
  30 +// 6.10 - imagem destaque do programa, titulo, descricao e botao de acesso
  31 +// 6.11 - login form
  32 +// 6.12 - votacao
  33 +// 6.13 - lista de resultados
  34 +// 6.14 - paginador
  35 +// 6.15 - calendario dos ministros
  36 +// 6.16 - listas
  37 +// 7 - Modificadores
  38 +// 8 - Cores do Temas
  39 +// 9 - Alto Contraste
  40 +// ------------------------------------
  41 +
  42 +
  43 +// ------------------------------------
  44 +// 1 - Variaveis
  45 +// ------------------------------------
  46 +
  47 +// 1.1 - espacamento
  48 +$gutter: 20px
  49 +
  50 +// 1.2 - arredondamento
  51 +$radius: 3px
  52 +
  53 +// 1.3 - tamanhos de fontes
  54 +$font-size-base: 16px
  55 +$font-size-big: $font-size-base + 2
  56 +$font-size-small: $font-size-base - 2
  57 +$font-size-h1: 28px
  58 +$font-size-h2: 38px
  59 +$font-size-h3: 28px
  60 +$font-size-h4: 34px
  61 +$theme-size-header: 24px
  62 +$proposal-title: 32px
  63 +
  64 +// 1.4 - dicionarios
  65 +$categories: (saude: #3449b7, seguranca-publica: #ee2a61, educacao: #f39720, reducao-da-pobreza: #3ebb8f)
  66 +$categories-descriptions: (saude: "Saúde é direito de todos e dever do Estado. O Sistema Único de Saúde (SUS) é universal, integral e de responsabilidade do Governo Federal, estados e municípios. Atende a todos os brasileiros.", seguranca-publica: "A segurança pública é um direito fundamental dos cidadãos. A proteção da vida, a disseminação da cultura da paz e a integração dos órgãos e instituições municipais, estaduais e federais são os maiores compromissos dessa política pública.", educacao: "Uma pátria educadora se faz com oportunidades para todos. Nos últimos anos, o Brasil criou esse caminho de oportunidades. Ampliamos o acesso à educação em todos os níveis de ensino – da creche à pós-graduação – e para todos os brasileiros, independentemente de sua classe social. E ainda há muito a fazer. O Plano Nacional de Educação (PNE) estabelece novas metas para que o governo federal trabalhe em parceria com a sociedade, com os estados e os municípios na construção de um futuro melhor. Queremos agora um salto na qualidade do ensino.", reducao-da-pobreza: "Com o esforço do Brasil para reduzir a pobreza e a desigualdade, 36 milhões de pessoas superaram a miséria na última década e o país saiu do Mapa da Fome das Nações Unidas.")
  67 +
  68 +// 1.5 - cores
  69 +$header-color: #03316f
  70 +$link-color: #335277
  71 +
  72 +// 1.6 - escurecer
  73 +$darken: 15%
  74 +
  75 +
  76 +// ------------------------------------
  77 +// 2 - Mixins
  78 +// ------------------------------------
  79 +
  80 +// 2.1 - hover
  81 +=hover($color, $amount)
  82 + transition: all 400ms
  83 + &:hover
  84 + background-color: darken($color, $amount)
  85 + text-decoration: none
  86 +
  87 +
  88 +// ------------------------------------
  89 +// 3 - Base
  90 +// ------------------------------------
  91 +
  92 +body
  93 + font-family: 'Open Sans', sans-serif
  94 + font-size: $font-size-base
  95 + font-weight: 400
  96 +h1
  97 + font-size: $font-size-h1
  98 + font-weight: 500
  99 + margin: $gutter 0
  100 + text-transform: uppercase
  101 + a
  102 + color: $header-color
  103 +h2
  104 + border-bottom: 1px solid darken(#eeeff1,$darken)
  105 + font-size: $font-size-h2
  106 + font-weight: 500
  107 + margin-bottom: $gutter * 2
  108 + padding-bottom: $gutter
  109 + small
  110 + display: block
  111 + font-size: 16px
  112 + padding-top: $gutter * 0.25
  113 + text-transform: none
  114 +h3
  115 + font-size: $font-size-h3
  116 + font-weight: 500
  117 +h4
  118 + font-size: $font-size-h4
  119 + font-weight: 500
  120 +p,ul,select
  121 + color: #000
  122 +blockquote
  123 + border-bottom: 5px solid
  124 + border-left: 0
  125 + border-right: 0
  126 + border-top: 5px solid
  127 + font-size: $font-size-h1
  128 + margin: $gutter 0
  129 + padding: $gutter 0
  130 +
  131 +
  132 +// ------------------------------------
  133 +// 4 - Grid
  134 +// ------------------------------------
  135 +
  136 +.container, .row
  137 + margin-bottom: $gutter
  138 +
  139 +
  140 +// ------------------------------------
  141 +// 5 - Elementos reusaveis
  142 +// ------------------------------------
  143 +
  144 +// 5.1 - esconder
  145 +.hide
  146 + display: none
  147 +
  148 +// 5.1 - botao padrao
  149 +.button
  150 + background-color: #387bf9
  151 + border-bottom: 3px solid darken(#387bf9, $darken)
  152 + border-left: 0
  153 + border-right: 0
  154 + border-top: 0
  155 + border-radius: $radius * 2
  156 + color: #fff
  157 + cursor: pointer
  158 + display: block
  159 + font-size: $font-size-small
  160 + font-weight: 700
  161 + padding-bottom: $gutter * 0.75
  162 + padding-left: 0
  163 + padding-right: 0
  164 + padding-top: $gutter * 0.75
  165 + text-align: center
  166 + +hover(#387bf9,$darken)
  167 + &:hover, &:focus
  168 + color: #fff
  169 + &-inline
  170 + display: inline-block
  171 + padding-bottom: $gutter * 0.25 !important
  172 + padding-top: $gutter * 0.25 !important
  173 + &-cancela
  174 + @extend .button
  175 + &-send
  176 + span
  177 + background-image: url(images/airplane.png)
  178 + background-position: left center
  179 + background-repeat: no-repeat
  180 + color: #fff
  181 + padding-left: $gutter * 1.5
  182 + &-participe
  183 + .fa
  184 + margin-right: $gutter * 0.5
  185 +
  186 +// 5.2 - botao voltar
  187 +.btn
  188 + background-color: transparent
  189 + border: 0
  190 + color: #fff
  191 + font-size: $font-size-small
  192 + font-weight: 700
  193 + padding-bottom: 0
  194 + padding-left: $gutter * 0.5
  195 + padding-right: $gutter * 0.5
  196 + padding-top: 0
  197 + vertical-align: middle
  198 +
  199 +// 5.3 - icones
  200 +.icon
  201 + background-repeat: no-repeat
  202 + background-position: 50% !important
  203 + background-size: auto !important
  204 + border: 0 !important
  205 + border-radius: 100%
  206 + color: #fff !important
  207 + display: inline-block
  208 + font-size: 20px
  209 + height: 36px
  210 + min-width: 0 !important
  211 + text-align: center
  212 + transform: all 200ms
  213 + width: 36px
  214 + &-facebook
  215 + background-color: #537abb
  216 + padding: 8px 0
  217 + +hover(#537abb,$darken)
  218 + &-twitter
  219 + background-color: #78caee
  220 + padding: 8px 0
  221 + +hover(#78caee,$darken)
  222 + &-gplus
  223 + background-color: #d54000
  224 + padding: 9px 0
  225 + +hover(#d54000,$darken)
  226 + &-whatsapp
  227 + background-color: #56ba62
  228 + padding: 7px 0
  229 + +hover(#56ba62,$darken)
  230 + &-email
  231 + background-color: #edb24c
  232 + padding: 7px 0
  233 + +hover(#edb24c,$darken)
  234 + &.disabled
  235 + background-color: #fff
  236 + color: #000
  237 + +hover(#fff,$darken)
  238 + &-theme
  239 + background-size: 35px !important
  240 + height: 48px
  241 + width: 48px
  242 + vertical-align: middle
  243 + margin-right: $gutter * 0.5
  244 + &-vote
  245 + display: inline-block
  246 + font-size: 35px
  247 + height: 64px
  248 + margin: 0 6%
  249 + padding: 3px 0
  250 + width: 64px
  251 + &.dislike
  252 + background-color: #db4127
  253 + border-bottom: 3px solid darken(#db4127, $darken) !important
  254 + +hover(#db4127, $darken)
  255 + &.like
  256 + background-color: #32dbb5
  257 + border-bottom: 3px solid darken(#32dbb5, $darken) !important
  258 + +hover(#32dbb5, $darken)
  259 +
  260 +
  261 +// ------------------------------------
  262 +// 6 - Blocos de elementos
  263 +// ------------------------------------
  264 +
  265 +// 6.1 - compartilhar
  266 +.social
  267 + position: relative
  268 + z-index: 1
  269 + &.top
  270 + float: right
  271 + margin-top: $gutter * 2
  272 + &.right
  273 + padding-top: 10px
  274 + > span
  275 + color: #000
  276 + display: inline-block
  277 + font-size: 12px
  278 + font-weight: 300
  279 + padding-right: 10px
  280 + text-align: right
  281 + vertical-align: middle
  282 + ul
  283 + display: inline-block
  284 + vertical-align: middle
  285 + span
  286 + display: block
  287 + margin-bottom: 10px
  288 + ul
  289 + list-style: none
  290 + padding-left: 0
  291 + li
  292 + display: inline-block
  293 + padding: 0 2px !important
  294 + vertical-align: top
  295 +
  296 +// 6.2 - logo
  297 +h1
  298 + float: left
  299 + a
  300 + background: url(images/logo.png) no-repeat center
  301 + display: inline-block
  302 + height: 80px
  303 + text-indent: -99999px
  304 + width: 160px
  305 +
  306 +// 6.3 - video
  307 +#content
  308 + margin-bottom: $gutter * 1.5
  309 +
  310 +// 6.4 - background do conteudo
  311 +.content
  312 + padding-top: $gutter * 1.5
  313 + &.background
  314 + background-color: #f1f1f1
  315 +
  316 +// 6.5 - tabs de temas e programas (pagina antiga)
  317 +.tab
  318 + margin-top: $gutter
  319 + ul
  320 + font-size: 0
  321 + list-style: none
  322 + margin-bottom: 0
  323 + padding-left: 0
  324 + li
  325 + display: inline-block
  326 + font-size: $font-size-base
  327 + width: 50%
  328 + a
  329 + background-color: #efefef
  330 + border-bottom: 1px solid #000
  331 + color: #000
  332 + display: block
  333 + font-weight: 700
  334 + padding-bottom: $gutter
  335 + padding-left: $gutter * 0.25
  336 + padding-right: $gutter * 0.25
  337 + padding-top: $gutter
  338 + text-align: center
  339 + text-transform: uppercase
  340 + .active
  341 + background-color: #fff
  342 + border-bottom: 1px solid #fff
  343 + border-left: 1px solid #000
  344 + border-right: 1px solid #000
  345 + border-top: 1px solid #000
  346 +
  347 +// 6.6 - menu dos temas
  348 +#proposal
  349 + &-categories
  350 + ul
  351 + list-style: none
  352 + padding-left: 0
  353 +.themes
  354 + li
  355 + border-bottom: 1px solid #f1f1f1
  356 + display: block
  357 + font-size: $font-size-base
  358 + a
  359 + background-color: #fff
  360 + color: #484848
  361 + display: block
  362 + font-family: asap, sans
  363 + font-size: $font-size-small
  364 + font-weight: 700
  365 + padding-bottom: $gutter * 0.5
  366 + padding-left: $gutter
  367 + padding-right: $gutter
  368 + padding-top: $gutter * 0.5
  369 + text-transform: uppercase
  370 + &:hover,&:focus
  371 + text-decoration: none
  372 + .arrow-box
  373 + position: relative
  374 + top: $gutter
  375 + &:after
  376 + bottom: 100%
  377 + left: 50%
  378 + border: solid transparent
  379 + content: ""
  380 + position: absolute
  381 + border-bottom-color: #000
  382 + border-width: 8px
  383 + margin-left: -8px
  384 +
  385 +// 6.7 - listagem dos programas aleatorios
  386 +.proposal
  387 + &-container
  388 + border-radius: $radius
  389 + margin-bottom: $gutter
  390 + &-list
  391 + list-style: none
  392 + padding-left: 0
  393 + &-group
  394 + ul
  395 + list-style: none
  396 + padding-left: 0
  397 +
  398 +// 6.8 - blocos dos programas
  399 +.box
  400 + background-color: #fff
  401 + border-radius: $radius
  402 + color: #000
  403 + display: block
  404 + margin-top: $gutter * 1.5
  405 + overflow: hidden
  406 + transition: all 400ms
  407 + +hover(#fff,$darken)
  408 + &:hover
  409 + text-decoration: none
  410 + p
  411 + padding-bottom: $gutter * 0.75
  412 + &-propostas
  413 + height: auto
  414 + border: 1px solid
  415 + margin-bottom: $gutter * 0.5
  416 + margin-top: 0
  417 + padding: $gutter
  418 + position: relative
  419 + &:hover
  420 + background-color: #fff
  421 + p
  422 + border-bottom: 0
  423 + padding-bottom: inherit
  424 + &-apoie
  425 + p
  426 + @extend .box-subtitle
  427 + border-bottom: 0
  428 + padding-bottom: inherit
  429 + &-header
  430 + color: #000
  431 + font-size: $font-size-big
  432 + font-weight: 700
  433 + p
  434 + font-size: $font-size-small
  435 + font-weight: 500
  436 + margin-top: $gutter * 0.5
  437 + height: $gutter * 2
  438 + &-body
  439 + padding: $gutter
  440 + img
  441 + margin-left: $gutter * (-1)
  442 + margin-right: $gutter * (-1)
  443 + margin-top: $gutter * (-1)
  444 + margin-bottom: $gutter
  445 + height: 170px
  446 + &-category
  447 + font-size: $font-size-small
  448 + font-weight: 700
  449 + list-style: none
  450 + text-transform: uppercase
  451 + div
  452 + color: #fff
  453 + padding-bottom: $gutter * 0.25
  454 + padding-left: $gutter
  455 + padding-right: $gutter * 0.5
  456 + padding-top: $gutter * 0.25
  457 + &-title
  458 + font-size: $font-size-h2
  459 + font-weight: 400
  460 + margin-bottom: $gutter
  461 + &-subtitle
  462 + color: $link-color
  463 + font-size: $theme-size-header
  464 + font-weight: 700
  465 + line-height: 1.2
  466 + margin-bottom: $gutter
  467 + &-info
  468 + margin-bottom: $gutter
  469 + &-footer
  470 + margin-bottom: $gutter * 0.25
  471 + margin-left: auto
  472 + margin-right: auto
  473 + margin-top: $gutter
  474 + width: 40%
  475 + &-bottom
  476 + @extend .box-footer
  477 + bottom: 10px
  478 + color: #000
  479 + display: inline-block
  480 + font-size: $font-size-small
  481 + font-weight: 700
  482 + margin-bottom: $gutter * 0.75
  483 + margin-top: 0
  484 + text-align: center
  485 + &:hover, &:focus
  486 + color: #000
  487 + &-center
  488 + text-align: center
  489 +
  490 +// 6.9 - header do programa e select box
  491 +.select
  492 + background-color: #000
  493 + margin-bottom: $gutter * 0.5
  494 + padding: $gutter * 0.25
  495 + .proposal
  496 + &-link
  497 + color: #fff
  498 + display: inline-block
  499 + font-size: $theme-size-header
  500 + font-weight: 700
  501 + padding-bottom: 0
  502 + padding-left: $gutter * 2.25
  503 + padding-right: 0
  504 + padding-top: 0
  505 + vertical-align: middle
  506 + &-selection
  507 + background-color: #fff
  508 + border: 0
  509 + border-radius: 3px
  510 + float: right
  511 + margin: 4px
  512 + width: 50%
  513 + vertical-align: middle
  514 +
  515 +// 6.10 - imagem destaque do programa, titulo, descricao e botao de acesso
  516 +.proposal-header
  517 + position: relative
  518 + .title
  519 + background-color: #000
  520 + bottom: 170px
  521 + color: #fff
  522 + font-size: $proposal-title
  523 + font-weight: 700
  524 + margin-bottom: $gutter * 1.25
  525 + margin-left: 0
  526 + margin-right: 0
  527 + margin-top: $gutter * 1.25
  528 + padding: $gutter
  529 + position: absolute
  530 + right: 0
  531 + text-align: center
  532 + text-transform: uppercase
  533 + width: 50%
  534 + vertical-align: middle
  535 + .show_body
  536 + margin-bottom: $gutter
  537 + margin-top: $gutter
  538 + a
  539 + background-color: lighten(#000, 40%)
  540 + border-bottom: 5px solid #000
  541 + border-left: 0
  542 + border-right: 0
  543 + border-top: 0
  544 + border-radius: $radius * 2
  545 + color: #fff
  546 + font-size: $font-size-h2
  547 + font-weight: 700
  548 + padding-bottom: $gutter * 0.5
  549 + padding-left: 0
  550 + padding-right: 0
  551 + padding-top: $gutter * 0.5
  552 + text-align: center
  553 + +hover(#000,$darken)
  554 + img
  555 + width: 100%
  556 + p
  557 + @extend .title
  558 + bottom: 140px
  559 + font-size: $font-size-small
  560 + margin-bottom: $gutter * 0.5
  561 + padding-top: $gutter * 0.25
  562 + text-transform: none
  563 +
  564 +// 6.11 - login form
  565 +.participar
  566 + text-align: right
  567 + .participe
  568 + background-color: #387bf9
  569 + border-color: darken(#387bf9, $darken)
  570 + font-size: 14px
  571 + padding: 2px 10px
  572 + .entrar
  573 + background: url(images/icons/icon-user.png) no-repeat 20px 50%
  574 + border-left: 1px solid #bcbcbc
  575 + margin-left: 20px
  576 + padding-left: 40px
  577 +.login,.signup
  578 + text-align: left
  579 + .message
  580 + background: #fcc
  581 + border: 1px solid #b00
  582 + border-radius: $radius
  583 + color: #b00
  584 + font-weight: 700
  585 + padding-bottom: $gutter * 0.25
  586 + padding-left: $gutter * 0.5
  587 + padding-right: $gutter * 0.5
  588 + padding-top: $gutter * 0.25
  589 + margin-bottom: $gutter
  590 + input
  591 + border: 1px solid
  592 + display: block
  593 + margin-bottom: $gutter
  594 + padding-bottom: $gutter * 0.25
  595 + padding-left: $gutter * 0.5
  596 + padding-right: $gutter * 0.5
  597 + padding-top: $gutter * 0.25
  598 + width: 100%
  599 + &.button
  600 + @extend .button
  601 + margin-bottom: $gutter * 0.25
  602 + .label
  603 + vertical-align: middle
  604 + .icon
  605 + vertical-align: middle
  606 + .oauth
  607 + margin-top: $gutter * 0.5
  608 + text-align: right
  609 + .forgot-password
  610 + display: block
  611 + font-size: $font-size-small
  612 + text-align: center
  613 + i
  614 + font-style: normal
  615 + font-weight: 700
  616 + padding-left: $gutter * 0.25
  617 + padding-right: $gutter * 0.25
  618 + .row
  619 + input
  620 + margin-bottom: 0
  621 +
  622 +// 6.12 - votacao
  623 +.vote-actions
  624 + .like
  625 + display: inline-block
  626 +
  627 +// 6.13 - lista de resultados
  628 +.results-content
  629 + .total
  630 + float: left
  631 + .vote-result
  632 + float: right
  633 + .updated-at
  634 + @extend .vote-result
  635 + margin-top: $gutter
  636 + table
  637 + clear: both
  638 + font-weight: 300
  639 + tr:nth-child(odd)
  640 + background: #e5e5e5
  641 + td
  642 + padding: $gutter * 0.25
  643 + .header
  644 + font-weight: 700
  645 + text-align: center
  646 + .abstract-text
  647 + width: 80%
  648 + p
  649 + margin: inherit
  650 + .value
  651 + text-align: center
  652 + width: 10%
  653 + .truncate
  654 + display: table
  655 + table-layout: fixed
  656 + width: 100%
  657 + .truncated
  658 + overflow-x: hidden
  659 + text-overflow: ellipsis
  660 + white-space: nowrap
  661 +
  662 +// 6.14 - paginador
  663 +.paging
  664 + padding: $gutter * 0.25
  665 + ul
  666 + display: table
  667 + list-style: none
  668 + margin: auto
  669 + padding: 0
  670 + li
  671 + float: left
  672 + span
  673 + @extend .page-link
  674 + .page-link
  675 + padding: 0 7px
  676 + font-size: $font-size-small
  677 + font-weight: 400
  678 + text-align: center
  679 + background-color: #000
  680 + color: #fff
  681 + display: inline-block
  682 + line-height: 24px
  683 + .current
  684 + background-color: lighten(#000, $darken)
  685 + .next
  686 + border-radius: 0 $radius $radius 0
  687 + .prev
  688 + border-radius: $radius 0 0 $radius
  689 +
  690 +// 6.15 - calendario dos ministros
  691 +.slick
  692 + &-slider
  693 + list-style: none
  694 + margin-bottom: 0
  695 + margin-left: auto
  696 + margin-right: auto
  697 + margin-top: $gutter * 2
  698 + padding: 0
  699 + position: relative
  700 + width: 80%
  701 + li
  702 + background-color: #eeeff1
  703 + margin-bottom: $gutter * 0.25
  704 + padding: $gutter * 0.5
  705 + span
  706 + display: block
  707 + .date, .time
  708 + display: inline-block
  709 + margin-top: $gutter
  710 + width: 45%
  711 + &-list
  712 + overflow: hidden
  713 + &-slide
  714 + float: left
  715 + &-def
  716 + background-color: transparent
  717 + border: 0
  718 + color: #000
  719 + font-size: 0
  720 + position: absolute
  721 + top: 43%
  722 + width: 20px
  723 + &:before
  724 + font-family: "FontAwesome"
  725 + font-size: 20px
  726 + &-prev
  727 + @extend .slick-def
  728 + left: -25px
  729 + &:before
  730 + content: "\f053"
  731 + &-next
  732 + @extend .slick-def
  733 + right: -25px
  734 + &:before
  735 + content: "\f054"
  736 + &-disabled
  737 + opacity: 0.25
  738 +
  739 +// 6.16 - listas
  740 +.list-container-border
  741 + border: 3px solid
  742 + border-radius: $radius
  743 +.list
  744 + &-unstyled
  745 + li
  746 + border-top: 1px solid darken(#eeeff1,$darken)
  747 + font-size: $font-size-big
  748 + font-weight: 700
  749 + padding: $gutter
  750 + &:first-child
  751 + border-top: 0
  752 + &-styled
  753 + margin-left: $gutter
  754 + padding-left: 0
  755 +.no-border
  756 + li
  757 + border: 0
  758 + padding-bottom: $gutter * 0.25
  759 + padding-left: 0
  760 + padding-right: 0
  761 + padding-top: $gutter * 0.25
  762 +
  763 +
  764 +// ------------------------------------
  765 +// 7 - Modificadores
  766 +// ------------------------------------
  767 +h2
  768 + &.name
  769 + color: #6c6c6c
  770 + font-size: $font-size-big
  771 + font-weight: 700
  772 + margin: 0
  773 + padding: 0
  774 + text-transform: none
  775 + &.menu
  776 + background-color: #484848
  777 + border: 0
  778 + border-top-left-radius: $radius
  779 + border-top-right-radius: $radius
  780 + color: #fff
  781 + font-size: $font-size-base - 1
  782 + font-weight: 300
  783 + margin: 0
  784 + padding-bottom: $gutter
  785 + padding-left: $gutter
  786 + padding-right: $gutter
  787 + padding-top: $gutter
  788 +
  789 +h3.titulo-destaque
  790 + font-size: $font-size-h3 + 10
  791 +.bloco-destaque
  792 + padding: $gutter * 1.75
  793 + border-radius: $radius
  794 + h4
  795 + margin-bottom: $gutter * 3
  796 +
  797 +@each $category, $description in $categories-descriptions
  798 + section.#{$category}
  799 + .description
  800 + margin-top: $gutter
  801 + &:before
  802 + content: "#{$description}"
  803 + color: #6c6c6c
  804 + font-family: asap, sans
  805 + padding-top: $gutter
  806 +
  807 +
  808 +// ------------------------------------
  809 +// 8 - Cores do Temas
  810 +// ------------------------------------
  811 +
  812 +@each $category, $color in $categories
  813 + .#{$category}
  814 + color: $color
  815 + a
  816 + color: $color
  817 + .button,.show_body a
  818 + background-color: $color
  819 + border-color: darken($color, $darken)
  820 + color: #fff
  821 + +hover($color,$darken)
  822 + .select
  823 + background-color: $color
  824 + .proposal
  825 + &-header
  826 + .title,p
  827 + background-color: darken($color, $darken)
  828 + .box
  829 + &-propostas
  830 + border-color: $color
  831 + &-title,&-bottom
  832 + color: $color
  833 + &-category
  834 + li
  835 + background-color: $color
  836 + .slick
  837 + &-prev,&-next
  838 + color: $color
  839 + &-slider
  840 + .date,.time
  841 + color: $color
  842 + .login,.signup
  843 + input
  844 + border-color: $color
  845 + &.button
  846 + +hover($color,$darken)
  847 + i
  848 + color: $color
  849 + .list
  850 + &-unstyled li
  851 + color: $color
  852 + .bloco-destaque
  853 + background-color: $color
  854 + background-image: url(http://www.participa.br/articles/public/0009/6039/mais-medicos-foto4.png)
  855 + background-repeat: no-repeat
  856 + background-position: 100% 100%
  857 + color: #fff
  858 + p
  859 + color: #fff
  860 + .select
  861 + .proposal-link
  862 + background-image: url(images/icons/#{$category}.png)
  863 + background-position: 5px 50%
  864 + background-repeat: no-repeat
  865 + background-size: 32px
  866 + .category-#{$category}
  867 + background-color: $color
  868 + background-position: 5px 50%
  869 + background-repeat: no-repeat
  870 + background-size: 40px
  871 + border-color: darken($color, $darken)
  872 + .icon
  873 + &-#{$category}
  874 + background-color: $color
  875 + background-image: url(images/icons/#{$category}.png)
  876 +
  877 +
  878 +// ------------------------------------
  879 +// 9 - Alto Contraste
  880 +// ------------------------------------
  881 +
  882 +.contrast
  883 + background-color: #000
  884 + color: #fff
  885 + .container
  886 + h2,h3,h4,a,p,li,label,.label,.login i
  887 + color: #fff
  888 + a
  889 + text-decoration: underline
  890 + small
  891 + color: darken(#fff, 40%)
  892 + .button,.show_body a,.login input.button,.box-category li
  893 + background-color: #fff
  894 + border-color: darken(#fff, 40%)
  895 + color: #000
  896 + text-decoration: none
  897 + +hover(#fff, 40%)
  898 + .icon
  899 + &-facebook
  900 + background-image: url(images/icons/icon-facebook-contrast.png) !important
  901 + &-twitter
  902 + background-image: url(images/icons/icon-twitter-contrast.png) !important
  903 + &-gplus
  904 + background-image: url(images/icons/icon-gplus-contrast.png) !important
  905 + &-whatsapp
  906 + background-image: url(images/icons/icon-whatsapp-contrast.png) !important
  907 + .tab
  908 + a
  909 + background-color: darken(#fff, 85%)
  910 + border-bottom-color: #fff
  911 + .active
  912 + background-color: #000
  913 + border-color: #fff
  914 + border-bottom-color: #000
  915 + #proposal-categories,#proposal-group
  916 + border-color: #fff
  917 + .proposal-category
  918 + a
  919 + background-color: darken(#fff, 85%) !important
  920 + .arrow-box:after
  921 + border-bottom-color: darken(#fff, 85%) !important
  922 + .select
  923 + background-color: darken(#fff, 85%)
  924 + section
  925 + background-color: darken(#fff, 85%)
  926 + &:hover
  927 + background-color: darken(#fff, 85%)
  928 + .box
  929 + background-color: #000
  930 + .proposal-header
  931 + .title, p
  932 + background-color: darken(#fff, 85%)
  933 + .box
  934 + background-color: darken(#fff, 85%)
  935 + text-decoration: none
  936 + &-propostas
  937 + border-color: #fff
  938 + &-title,&-subtitle,&-info,&-bottom,.social span,&-header
  939 + color: #fff
  940 + .slick
  941 + &-prev,&-next
  942 + color: #fff
  943 + &-slider
  944 + li
  945 + background-color: #000
  946 + .date,.time
  947 + color: #fff
  948 + .bloco-destaque
  949 + background: darken(#fff, 85%)
0 950 \ No newline at end of file
... ...