Commit 79727b5f9268e943c7a5671ef6d9eb632ef17848
Exists in
master
and in
11 other branches
Merge branch 'master' of https://gitlab.com/participa/proposal-app
Showing
3 changed files
with
82 additions
and
77 deletions
Show diff stats
index.html
| ... | ... | @@ -178,7 +178,8 @@ |
| 178 | 178 | </script> |
| 179 | 179 | |
| 180 | 180 | <script id="results" type='text/x-handlebars-template'> |
| 181 | - <div class="results-content"> | |
| 181 | + <div class="loading">Carregando...</div> | |
| 182 | + <div class="results-content hide"> | |
| 182 | 183 | <a href="#" class="vote-result">Fechar</a> |
| 183 | 184 | <table> |
| 184 | 185 | <tr class="header"> | ... | ... |
js/main.js
| ... | ... | @@ -162,9 +162,13 @@ function loadRandomProposal(topic_id, private_token) { |
| 162 | 162 | $(document.body).on('click', '.vote-result', function(e) { |
| 163 | 163 | $('.results-container').toggle(); |
| 164 | 164 | if($('.results-container').is(":visible")) { |
| 165 | + $('.results-container .loading').show(); | |
| 166 | + $('.results-container .results-content').hide(); | |
| 165 | 167 | var url = host + '/api/v1/articles/' + topic_id + '/children' + '?private_token=' + private_token + '&limit=10&fields=id,name,abstract,votes_for,votes_against&content_type=ProposalsDiscussionPlugin::Proposal'; |
| 166 | 168 | $.getJSON(url).done(function( data ) { |
| 167 | 169 | $('.results-container').html(resultsTemplate(data)); |
| 170 | + $('.results-container .loading').hide(); | |
| 171 | + $('.results-container .results-content').show(); | |
| 168 | 172 | }); |
| 169 | 173 | $('.experience-proposal-container').hide(); |
| 170 | 174 | $('.talk-proposal-container').hide(); | ... | ... |
sass/_proposal_detail.scss
| ... | ... | @@ -86,87 +86,88 @@ |
| 86 | 86 | } |
| 87 | 87 | } |
| 88 | 88 | } |
| 89 | - .results-container { | |
| 90 | - &:before { | |
| 91 | - content:""; | |
| 92 | - display:table; | |
| 93 | - clear:both; | |
| 94 | - } | |
| 95 | - .results-content { | |
| 96 | - border: 1px solid #00a9bd; | |
| 97 | - margin-top: 20px; | |
| 98 | - .vote-result { | |
| 99 | - font-weight: bolder; | |
| 100 | - font-size: 12px; | |
| 101 | - text-transform: uppercase; | |
| 102 | - color: gray; | |
| 103 | - border: none; | |
| 104 | - margin: 10px; | |
| 105 | - border-radius: 6px; | |
| 106 | - text-align: center; | |
| 107 | - text-decoration: none; | |
| 108 | - padding: 9px; | |
| 109 | - display: block; | |
| 110 | - float: right; | |
| 111 | - } | |
| 112 | - } | |
| 113 | - table { | |
| 114 | - clear: both; | |
| 115 | - margin-top: 20px; | |
| 116 | - tbody tr:nth-child(odd) { | |
| 117 | - background-color: #e5e5e5; | |
| 118 | - } | |
| 119 | 89 | |
| 120 | - .abstract-text { | |
| 121 | - width: 80%; | |
| 122 | - } | |
| 123 | - .votes-for { | |
| 124 | - width: 10%; | |
| 125 | - text-align: center; | |
| 126 | - } | |
| 127 | - .votes-against { | |
| 128 | - @extend .votes-for; | |
| 129 | - } | |
| 130 | - .score { | |
| 131 | - @extend .votes-for; | |
| 132 | - } | |
| 133 | - .header { | |
| 134 | - line-height: 32px; | |
| 135 | - font-weight: bold; | |
| 136 | - text-align: center; | |
| 137 | - color: rgb(68, 68, 68); | |
| 138 | - .votes-for { | |
| 139 | - background-image: url(./images/result-like.png); | |
| 140 | - background-repeat: no-repeat; | |
| 141 | - display: inline-block; | |
| 142 | - background-position: center; | |
| 143 | - } | |
| 144 | - .votes-against { | |
| 145 | - background-image: url(./images/result-dislike.png); | |
| 90 | + @each $category, $color in $categories { | |
| 91 | + .#{$category}{ | |
| 92 | + .results-container { | |
| 93 | + &:before { | |
| 94 | + content:""; | |
| 95 | + display:table; | |
| 96 | + clear:both; | |
| 146 | 97 | } |
| 147 | - .score { | |
| 148 | - background-image: none; | |
| 98 | + .results-content { | |
| 99 | + border: 1px solid $color; | |
| 100 | + margin-top: 20px; | |
| 101 | + .vote-result { | |
| 102 | + font-weight: bolder; | |
| 103 | + font-size: 12px; | |
| 104 | + text-transform: uppercase; | |
| 105 | + color: gray; | |
| 106 | + border: none; | |
| 107 | + margin: 10px; | |
| 108 | + border-radius: 6px; | |
| 109 | + text-align: center; | |
| 110 | + text-decoration: none; | |
| 111 | + padding: 9px; | |
| 112 | + display: block; | |
| 113 | + float: right; | |
| 114 | + } | |
| 149 | 115 | } |
| 150 | - } | |
| 116 | + table { | |
| 117 | + clear: both; | |
| 118 | + margin-top: 20px; | |
| 119 | + tbody tr:nth-child(odd) { | |
| 120 | + background-color: #e5e5e5; | |
| 121 | + } | |
| 151 | 122 | |
| 152 | - .truncate { | |
| 153 | - display: table; | |
| 154 | - table-layout: fixed; | |
| 155 | - width: 100%; | |
| 156 | - } | |
| 157 | - .truncated { | |
| 158 | - overflow-x: hidden; | |
| 159 | - text-overflow: ellipsis; | |
| 160 | - white-space: nowrap; | |
| 161 | - } | |
| 162 | - tr { | |
| 163 | - color: rgb(77, 77, 77); | |
| 123 | + .abstract-text { | |
| 124 | + width: 80%; | |
| 125 | + } | |
| 126 | + .votes-for { | |
| 127 | + width: 10%; | |
| 128 | + text-align: center; | |
| 129 | + } | |
| 130 | + .votes-against { | |
| 131 | + @extend .votes-for; | |
| 132 | + } | |
| 133 | + .score { | |
| 134 | + @extend .votes-for; | |
| 135 | + } | |
| 136 | + .header { | |
| 137 | + line-height: 32px; | |
| 138 | + font-weight: bold; | |
| 139 | + text-align: center; | |
| 140 | + color: rgb(68, 68, 68); | |
| 141 | + .votes-for { | |
| 142 | + background-image: url(./images/result-like.png); | |
| 143 | + background-repeat: no-repeat; | |
| 144 | + display: inline-block; | |
| 145 | + background-position: center; | |
| 146 | + } | |
| 147 | + .votes-against { | |
| 148 | + background-image: url(./images/result-dislike.png); | |
| 149 | + } | |
| 150 | + .score { | |
| 151 | + background-image: none; | |
| 152 | + } | |
| 153 | + } | |
| 154 | + | |
| 155 | + .truncate { | |
| 156 | + display: table; | |
| 157 | + table-layout: fixed; | |
| 158 | + width: 100%; | |
| 159 | + } | |
| 160 | + .truncated { | |
| 161 | + overflow-x: hidden; | |
| 162 | + text-overflow: ellipsis; | |
| 163 | + white-space: nowrap; | |
| 164 | + } | |
| 165 | + tr { | |
| 166 | + color: rgb(77, 77, 77); | |
| 167 | + } | |
| 168 | + } | |
| 164 | 169 | } |
| 165 | - } | |
| 166 | - } | |
| 167 | 170 | |
| 168 | - @each $category, $color in $categories { | |
| 169 | - .#{$category}{ | |
| 170 | 171 | .proposal-header { |
| 171 | 172 | .title { |
| 172 | 173 | background: $color; |
| ... | ... | @@ -436,7 +437,6 @@ |
| 436 | 437 | } |
| 437 | 438 | } |
| 438 | 439 | } |
| 439 | - | |
| 440 | 440 | } |
| 441 | 441 | li{ |
| 442 | 442 | background-color: $color; | ... | ... |