Commit ffa79326f20fd1197b2b710b62529e532afc06f8
1 parent
571044e8
Exists in
master
and in
6 other branches
New layout for results
Showing
2 changed files
with
41 additions
and
18 deletions
Show diff stats
index.html
... | ... | @@ -316,10 +316,9 @@ |
316 | 316 | <script id="results" type="text/x-handlebars-template"> |
317 | 317 | <div class="loading">Carregando...</div> |
318 | 318 | <div class="results-content hide"> |
319 | - <div class="clearfix"> | |
320 | - <span class="total">Total de propostas: <span class="value">{{pagination.total}}</span></span> | |
321 | - <a href="#" class="vote-result">Fechar</a> | |
322 | - </div> | |
319 | + <a href="#" class="vote-result"><span class="sr-only">Fechar</span><span class="fa fa-times"></span></a> | |
320 | + <h2>Resultados</h2> | |
321 | + <span class="total">Total de propostas: <strong class="value">{{pagination.total}}</strong></span> | |
323 | 322 | <div class="updated-at"> |
324 | 323 | <span>Última atualização </span> |
325 | 324 | <span class="timeago" title="{{updated_at}}"></span> |
... | ... | @@ -327,7 +326,7 @@ |
327 | 326 | <div class="table-responsive border"> |
328 | 327 | <table class="table"> |
329 | 328 | <tr class="header"> |
330 | - <th class="position">Posição</th> | |
329 | + <th class="position">Posição <a href="#"><span class="fa fa-question"></span></a></th> | |
331 | 330 | <th class="abstract-text">Propostas</th> |
332 | 331 | <th class="views">Exibições</th> |
333 | 332 | <th class="votes-for"><span class="fa fa-check"></span></th> | ... | ... |
sass/_proposal_detail.scss
... | ... | @@ -162,13 +162,16 @@ |
162 | 162 | display:table; |
163 | 163 | clear:both; |
164 | 164 | } |
165 | + h2 { | |
166 | + border-bottom: 0; | |
167 | + } | |
165 | 168 | .results-content { |
166 | 169 | border: 1px solid $color; |
167 | 170 | margin-top: 20px; |
168 | 171 | padding: 20px; |
169 | 172 | .vote-result { |
170 | 173 | font-weight: bolder; |
171 | - font-size: 12px; | |
174 | + font-size: 20px; | |
172 | 175 | text-transform: uppercase; |
173 | 176 | color: gray; |
174 | 177 | border: none; |
... | ... | @@ -189,9 +192,9 @@ |
189 | 192 | margin-right: 8px; |
190 | 193 | } |
191 | 194 | .total { |
192 | - padding: 10px; | |
193 | - color: gray; | |
194 | - font-size: 14px; | |
195 | + display: block; | |
196 | + font-size: 20px; | |
197 | + padding-bottom: 40px; | |
195 | 198 | float: left; |
196 | 199 | } |
197 | 200 | .simple-pagination { |
... | ... | @@ -290,7 +293,7 @@ |
290 | 293 | th { |
291 | 294 | background-color: $color; |
292 | 295 | color: #fff; |
293 | - padding: 20px; | |
296 | + padding: 15px 20px; | |
294 | 297 | border-bottom: 3px solid darken($color, 15%); |
295 | 298 | border-left: 1px solid lighten($color, 15%); |
296 | 299 | border-right: 1px solid lighten($color, 15%); |
... | ... | @@ -308,6 +311,27 @@ |
308 | 311 | border-top: 0; |
309 | 312 | } |
310 | 313 | } |
314 | + .position { | |
315 | + width: 20%; | |
316 | + a { | |
317 | + background-color: $color; | |
318 | + border: 1px solid #fff; | |
319 | + border-radius: 100%; | |
320 | + color: #fff; | |
321 | + display: inline-block; | |
322 | + font-size: 16px; | |
323 | + height: 30px; | |
324 | + margin-left: 5px; | |
325 | + padding: 2px 0; | |
326 | + text-align: center; | |
327 | + width: 30px; | |
328 | + vertical-align: middle; | |
329 | + transition: all 200ms; | |
330 | + &:hover { | |
331 | + background-color: darken($color, 15%); | |
332 | + } | |
333 | + } | |
334 | + } | |
311 | 335 | .votes-for { |
312 | 336 | // background-image: url(./images/result-like.png); |
313 | 337 | // background-repeat: no-repeat; |
... | ... | @@ -319,12 +343,12 @@ |
319 | 343 | background-color: #32dbb5; |
320 | 344 | border: 2px solid #ffffff; |
321 | 345 | border-radius: 100%; |
322 | - font-size: 12px; | |
323 | - height: 24px; | |
324 | - padding: 3px 0; | |
346 | + font-size: 16px; | |
347 | + height: 30px; | |
348 | + padding: 5px 0; | |
325 | 349 | text-align: center; |
326 | 350 | transition: all 200ms ease 0s; |
327 | - width: 24px; | |
351 | + width: 30px; | |
328 | 352 | } |
329 | 353 | } |
330 | 354 | .votes-against { |
... | ... | @@ -336,12 +360,12 @@ |
336 | 360 | background-color: #DB4127; |
337 | 361 | border: 2px solid #ffffff; |
338 | 362 | border-radius: 100%; |
339 | - font-size: 12px; | |
340 | - height: 24px; | |
341 | - padding: 3px 0; | |
363 | + font-size: 16px; | |
364 | + height: 30px; | |
365 | + padding: 5px 0; | |
342 | 366 | text-align: center; |
343 | 367 | transition: all 200ms ease 0s; |
344 | - width: 24px; | |
368 | + width: 30px; | |
345 | 369 | } |
346 | 370 | } |
347 | 371 | } | ... | ... |