Commit 79727b5f9268e943c7a5671ef6d9eb632ef17848

Authored by Caio Almeida
2 parents f9cb23c5 9d07adf3

Merge branch 'master' of https://gitlab.com/participa/proposal-app

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;
... ...