Commit 1236efbf340bf5ddfe374b31a742269c25e7bba7
1 parent
ffa79326
Exists in
master
and in
6 other branches
New pagination style
Showing
2 changed files
with
35 additions
and
20 deletions
Show diff stats
js/main.js
| ... | ... | @@ -169,8 +169,8 @@ define(['handlebars', 'fastclick', 'handlebars_helpers'], function(Handlebars, F |
| 169 | 169 | items: data.pagination.total, |
| 170 | 170 | itemsOnPage: data.pagination.per_page, |
| 171 | 171 | currentPage: data.pagination.page, |
| 172 | - prevText: 'Anterior', | |
| 173 | - nextText: 'Próximo', | |
| 172 | + prevText: '«', | |
| 173 | + nextText: '»', | |
| 174 | 174 | cssStyle: 'compact-theme', |
| 175 | 175 | onPageClick: function(page, e) { |
| 176 | 176 | Main.loadRanking($resultsContainer, topic_id, page); | ... | ... |
sass/_proposal_detail.scss
| ... | ... | @@ -202,35 +202,50 @@ |
| 202 | 202 | ul { |
| 203 | 203 | list-style: none; |
| 204 | 204 | padding: 0; |
| 205 | - display: table; | |
| 205 | + display: block; | |
| 206 | 206 | margin: 0 auto; |
| 207 | + text-align: center; | |
| 207 | 208 | li { |
| 208 | 209 | list-style: none; |
| 210 | + display: inline; | |
| 209 | 211 | padding: 0; |
| 210 | - margin: 0; | |
| 211 | - float: left; | |
| 212 | + margin: 0 10px; | |
| 213 | + float: none; | |
| 214 | + &.active { | |
| 215 | + .next, .prev { | |
| 216 | + opacity: 0.5; | |
| 217 | + } | |
| 218 | + } | |
| 212 | 219 | a, span { |
| 213 | - float: left; | |
| 214 | - color: white; | |
| 220 | + background: transparent; | |
| 221 | + border: 0; | |
| 222 | + border-bottom: 1px solid #000; | |
| 223 | + color: #000; | |
| 224 | + display: inline-block; | |
| 225 | + // float: left; | |
| 215 | 226 | font-size: 14px; |
| 216 | - line-height: 24px; | |
| 217 | 227 | font-weight: normal; |
| 228 | + line-height: 1.2; | |
| 229 | + margin: 0; | |
| 230 | + min-width: 0; | |
| 231 | + padding: 0; | |
| 218 | 232 | text-align: center; |
| 219 | - min-width: 14px; | |
| 220 | - padding: 0 7px; | |
| 221 | - background: $color; | |
| 222 | - width: 100%; | |
| 223 | 233 | text-transform: none; |
| 224 | - } | |
| 225 | - .prev { | |
| 226 | - border-radius: 3px 0 0 3px; | |
| 227 | - } | |
| 228 | - .next { | |
| 229 | - border-right: 1px solid #AAA; | |
| 230 | - border-radius: 0 3px 3px 0; | |
| 234 | + width: auto; | |
| 235 | + vertical-align: middle; | |
| 231 | 236 | } |
| 232 | 237 | .current { |
| 233 | - opacity: 0.5; | |
| 238 | + padding: 10px; | |
| 239 | + background-color: #ccc; | |
| 240 | + border-bottom-color: #ccc; | |
| 241 | + border-radius: 6px; | |
| 242 | + } | |
| 243 | + .next, .prev { | |
| 244 | + background-color: $color; | |
| 245 | + border-bottom: 3px solid darken($color, 15%); | |
| 246 | + border-radius: 6px; | |
| 247 | + color: #fff; | |
| 248 | + padding: 10px 15px; | |
| 234 | 249 | } |
| 235 | 250 | } |
| 236 | 251 | } | ... | ... |