Download as
Browse Code »

Commit 07dd602eac614e7b3767ef82ba0be59f3c859562

Authored by Rafael Diego
1 parent 3cd6b93a
Exists in master and in 8 other branches css-list, feature-captcha, feature-proposal-vote, feature-respostas, production, rafael, staging, the_glorious_return_of_piwik

CSS do conteudo

Showing 2 changed files with 144 additions and 63 deletions   Show diff stats
src/app/layout.scss
  Diff comments   View file @07dd602
@@ -29,21 +29,21 @@ @@ -29,21 +29,21 @@
29 table-layout: fixed; 29 table-layout: fixed;
30 height: 100%; 30 height: 100%;
31 width: 100%; 31 width: 100%;
32 -}  
33 -.col-xs-height { 32 + }
  33 + .col-xs-height {
34 display: table-cell; 34 display: table-cell;
35 float: none; 35 float: none;
36 height: 100%; 36 height: 100%;
37 -}  
38 -.col-xs-top { 37 + }
  38 + .col-xs-top {
39 vertical-align: top; 39 vertical-align: top;
40 -}  
41 -.col-xs-middle { 40 + }
  41 + .col-xs-middle {
42 vertical-align: middle; 42 vertical-align: middle;
43 -}  
44 -.col-xs-bottom { 43 + }
  44 + .col-xs-bottom {
45 vertical-align: bottom; 45 vertical-align: bottom;
46 -} 46 + }
47 } 47 }
48 48
49 @media (min-width: 768px) { 49 @media (min-width: 768px) {
@@ -52,21 +52,21 @@ @@ -52,21 +52,21 @@
52 table-layout: fixed; 52 table-layout: fixed;
53 height: 100%; 53 height: 100%;
54 width: 100%; 54 width: 100%;
55 -}  
56 -.col-sm-height { 55 + }
  56 + .col-sm-height {
57 display: table-cell; 57 display: table-cell;
58 float: none; 58 float: none;
59 height: 100%; 59 height: 100%;
60 -}  
61 -.col-sm-top { 60 + }
  61 + .col-sm-top {
62 vertical-align: top; 62 vertical-align: top;
63 -}  
64 -.col-sm-middle { 63 + }
  64 + .col-sm-middle {
65 vertical-align: middle; 65 vertical-align: middle;
66 -}  
67 -.col-sm-bottom { 66 + }
  67 + .col-sm-bottom {
68 vertical-align: bottom; 68 vertical-align: bottom;
69 -} 69 + }
70 } 70 }
71 71
72 @media (min-width: 992px) { 72 @media (min-width: 992px) {
@@ -75,21 +75,21 @@ @@ -75,21 +75,21 @@
75 table-layout: fixed; 75 table-layout: fixed;
76 height: 100%; 76 height: 100%;
77 width: 100%; 77 width: 100%;
78 -}  
79 -.col-md-height { 78 + }
  79 + .col-md-height {
80 display: table-cell; 80 display: table-cell;
81 float: none; 81 float: none;
82 height: 100%; 82 height: 100%;
83 -}  
84 -.col-md-top { 83 + }
  84 + .col-md-top {
85 vertical-align: top; 85 vertical-align: top;
86 -}  
87 -.col-md-middle { 86 + }
  87 + .col-md-middle {
88 vertical-align: middle; 88 vertical-align: middle;
89 -}  
90 -.col-md-bottom { 89 + }
  90 + .col-md-bottom {
91 vertical-align: bottom; 91 vertical-align: bottom;
92 -} 92 + }
93 } 93 }
94 94
95 @media (min-width: 1200px) { 95 @media (min-width: 1200px) {
@@ -98,38 +98,38 @@ @@ -98,38 +98,38 @@
98 table-layout: fixed; 98 table-layout: fixed;
99 height: 100%; 99 height: 100%;
100 width: 100%; 100 width: 100%;
101 -}  
102 -.col-lg-height { 101 + }
  102 + .col-lg-height {
103 display: table-cell; 103 display: table-cell;
104 float: none; 104 float: none;
105 height: 100%; 105 height: 100%;
106 -}  
107 -.col-lg-top { 106 + }
  107 + .col-lg-top {
108 vertical-align: top; 108 vertical-align: top;
109 -}  
110 -.col-lg-middle { 109 + }
  110 + .col-lg-middle {
111 vertical-align: middle; 111 vertical-align: middle;
112 -}  
113 -.col-lg-bottom { 112 + }
  113 + .col-lg-bottom {
114 vertical-align: bottom; 114 vertical-align: bottom;
115 -} 115 + }
116 } 116 }
117 117
118 .vcenter { 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 .no-space-left { margin-left: 0; padding-left: 0;} 126 .no-space-left { margin-left: 0; padding-left: 0;}
127 .no-space-right { margin-right: 0; padding-right: 0;} 127 .no-space-right { margin-right: 0; padding-right: 0;}
128 128
129 .text-center-sm { 129 .text-center-sm {
130 - @media screen and (max-width: $screen-sm) {  
131 - text-align: center;  
132 - } 130 + @media screen and (max-width: $screen-sm) {
  131 + text-align: center;
  132 + }
133 } 133 }
134 134
135 .btn-submit { 135 .btn-submit {
@@ -157,9 +157,9 @@ @@ -157,9 +157,9 @@
157 position: relative; 157 position: relative;
158 top: -30px; 158 top: -30px;
159 right: 0px; 159 right: 0px;
160 -} 160 + }
161 161
162 -&-body { 162 + &-body {
163 padding: 25px 35px; 163 padding: 25px 35px;
164 height: 500px; 164 height: 500px;
165 165
@@ -168,9 +168,9 @@ @@ -168,9 +168,9 @@
168 overflow-y: auto; 168 overflow-y: auto;
169 padding: 15px; 169 padding: 15px;
170 height: 440px; 170 height: 440px;
  171 + }
171 } 172 }
172 } 173 }
173 -}  
174 174
175 .modal-fechar-pequeno { 175 .modal-fechar-pequeno {
176 font-size: 15px; 176 font-size: 15px;
@@ -180,13 +180,6 @@ @@ -180,13 +180,6 @@
180 font-size: 24px; 180 font-size: 24px;
181 } 181 }
182 182
183 -// Sobreescreve a classe do bootstrap  
184 -.close {  
185 - color: white;  
186 - opacity: 1;  
187 - font-weight: normal;  
188 -}  
189 -  
190 .btn-question { 183 .btn-question {
191 color: #484848; 184 color: #484848;
192 background-color: #fff; 185 background-color: #fff;
@@ -204,17 +197,49 @@ @@ -204,17 +197,49 @@
204 padding: 30px; 197 padding: 30px;
205 } 198 }
206 199
207 -.destaque-cinza-claro {  
208 - background-color: #F8F8F8; 200 +.destaque-biodiversidade {
  201 + background-color: #3CC667;
209 padding: 30px; 202 padding: 30px;
  203 + color: white;
  204 +}
  205 +
  206 +.destaque-biodiversidade-nobg {
  207 + color: gray;
  208 +}
  209 +
  210 +.destaque-cultura-viva {
  211 + background-color: #F8F8F8;
  212 + padding: 0px;
  213 + padding-left: 30px;
210 } 214 }
211 215
212 .left-border-gray { 216 .left-border-gray {
213 border-left: 3px solid #eeeeee; 217 border-left: 3px solid #eeeeee;
  218 + margin-bottom: 10px;
214 219
215 @media (max-width: 768px) { 220 @media (max-width: 768px) {
216 border: none; 221 border: none;
  222 + }
217 } 223 }
  224 +
  225 +.right-border-gray {
  226 + border-right: 3px solid #eeeeee;
  227 + margin-bottom: 10px;
  228 +
  229 + @media (max-width: 768px) {
  230 + border: none;
  231 + }
  232 +}
  233 +
  234 +.bottom-border-gray {
  235 + border-bottom: 1px lightgray;
  236 + border-bottom-style: solid;
  237 + margin: 0px!important;
  238 + padding: 30px;
  239 +}
  240 +
  241 +.padding-30 {
  242 + padding: 30px;
218 } 243 }
219 244
220 ul.list-color { 245 ul.list-color {
@@ -228,8 +253,8 @@ ul.list-color li:before { @@ -228,8 +253,8 @@ ul.list-color li:before {
228 @each $category, $color in $categories { 253 @each $category, $color in $categories {
229 .#{$category} & { 254 .#{$category} & {
230 color: $color; 255 color: $color;
  256 + }
231 } 257 }
232 -}  
233 258
234 } 259 }
235 260
@@ -256,5 +281,61 @@ a.link-black { @@ -256,5 +281,61 @@ a.link-black {
256 } 281 }
257 282
258 .inline-block { 283 .inline-block {
259 - display: inline-block; 284 + display: inline-block;
260 } 285 }
  286 +
  287 +.no-margin-bottom {
  288 + margin-bottom: 0px!important;
  289 +}
  290 +
  291 +.margin-20 {
  292 + margin: 20px;
  293 +}
  294 +
  295 +article.program-content {
  296 + margin-top: 40px;
  297 +}
  298 +
  299 +article.program-content div.ng-binding div.container div.row {
  300 + margin-bottom: 40px;
  301 +}
  302 +
  303 +article.program-content h3 {
  304 + margin-bottom: 15px;
  305 +}
  306 +
  307 +blockquote {
  308 + border-left: none;
  309 + padding-left: 50px;
  310 + font-size: 20px;
  311 +
  312 + &:before {
  313 + @each $category, $color in $categories {
  314 + .#{$category} & {
  315 + color: $color;
  316 + }
  317 + }
  318 + color: #ECAAAB;
  319 + content: "⌜";
  320 + font-size: 200px;
  321 + left: -2px;
  322 + position: absolute;
  323 + top: -50px;
  324 + font-weight: bolder;
  325 + }
  326 +}
  327 +
  328 +.destaque-sinesp {
  329 + font-size:18px;
  330 +}
  331 +
  332 +// Sobreescreve a classe do bootstrap
  333 +.close {
  334 + color: white;
  335 + opacity: 1;
  336 + font-weight: normal;
  337 +}
  338 +
  339 +// .img-responsive {
  340 +// width: 100%;
  341 +// }
src/app/pages/programas/programa.html
  Diff comments   View file @07dd602
@@ -60,7 +60,7 @@ @@ -60,7 +60,7 @@
60 <!-- Preview > coluna da direita --> 60 <!-- Preview > coluna da direita -->
61 <div class="col-md-4"> 61 <div class="col-md-4">
62 <div class="row"> 62 <div class="row">
63 - 63 +
64 <!-- Top Proposals --> 64 <!-- Top Proposals -->
65 <div> 65 <div>
66 <!-- Loading Top Proposals --> 66 <!-- Loading Top Proposals -->
@@ -69,7 +69,7 @@ @@ -69,7 +69,7 @@
69 Carregando propostas mais votadas... 69 Carregando propostas mais votadas...
70 </div> 70 </div>
71 </div> 71 </div>
72 - 72 +
73 <!-- Top Proposals > Carousel --> 73 <!-- Top Proposals > Carousel -->
74 <div class="col-xs-12" ng-if="!pagePrograma.loadingTopProposals && pagePrograma.proposalsTopRated && pagePrograma.proposalsTopRated.length > 0"> 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> 75 <h3 class="color-theme-fg">Propostas mais votadas</h3>
@@ -80,10 +80,10 @@ @@ -80,10 +80,10 @@
80 <!-- Proposal Box --> 80 <!-- Proposal Box -->
81 <div> 81 <div>
82 <div class="col-xs-12" ng-if="!pagePrograma.loadingProposalBox && pagePrograma.randomProposal" ng-class="{'focused-proposal': !!pagePrograma.search.proposal_id}"> 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> 83 + <h3 class="color-theme-fg">Apoie outras propostas</h3>
84 <proposal-box proposal="pagePrograma.randomProposal" topic="pagePrograma.article" category="pagePrograma.category" can-vote="true" focus="{{pagePrograma.search.proposal_id}}" ></proposal-box> 84 <proposal-box proposal="pagePrograma.randomProposal" topic="pagePrograma.article" category="pagePrograma.category" can-vote="true" focus="{{pagePrograma.search.proposal_id}}" ></proposal-box>
85 </div> 85 </div>
86 - 86 +
87 <!-- Loading Proposal Box --> 87 <!-- Loading Proposal Box -->
88 <div ng-if="pagePrograma.loadingProposalBox"> 88 <div ng-if="pagePrograma.loadingProposalBox">
89 <div class="alert alert-info" role="alert"> 89 <div class="alert alert-info" role="alert">
@@ -91,7 +91,7 @@ @@ -91,7 +91,7 @@
91 </div> 91 </div>
92 </div> 92 </div>
93 </div> 93 </div>
94 - 94 +
95 <!-- No Proposals? okay! --> 95 <!-- No Proposals? okay! -->
96 <div ng-if="!pagePrograma.loadingTopProposals && !pagePrograma.loadingProposalBox"> 96 <div ng-if="!pagePrograma.loadingTopProposals && !pagePrograma.loadingProposalBox">
97 <div class="col-xs-12" ng-if="!pagePrograma.randomProposal && !(pagePrograma.proposalsTopRated && pagePrograma.proposalsTopRated.length > 0)"> 97 <div class="col-xs-12" ng-if="!pagePrograma.randomProposal && !(pagePrograma.proposalsTopRated && pagePrograma.proposalsTopRated.length > 0)">