Commit 9acab0bf2ed7d445986d283f372fadb98ea2a6a6
1 parent
d3cac6d4
Exists in
master
and in
8 other branches
Improve proposal-list animation
Showing
5 changed files
with
31 additions
and
9 deletions
Show diff stats
src/app/components/proposal-carousel/proposal-carousel.directive.js
src/app/components/proposal-list/proposal-list.html
1 | 1 | <div class="proposal-list"> |
2 | - <div class="table-responsive" ng-if="vm.loading"> | |
3 | - <div class="table-responsive">Carregando...</div> | |
2 | + <div class="" ng-if="vm.loading"> | |
3 | + <div class="">Carregando...</div> | |
4 | 4 | </div> |
5 | - <div class="table-responsive" ng-if="!vm.loading && vm.proposalsPerPage"> | |
5 | + <div class="" ng-if="!vm.loading && vm.proposalsPerPage"> | |
6 | 6 | <table class="table table-striped"> |
7 | 7 | <thead> |
8 | 8 | <tr> |
... | ... | @@ -25,13 +25,13 @@ |
25 | 25 | </div> |
26 | 26 | </div> |
27 | 27 | <div class="row row-actions"> |
28 | - <div class="col-md-8"> | |
28 | + <div class="col-sm-8"> | |
29 | 29 | <button type="button" class="btn btn-link btn-rate color-theme-common-fg" ng-click="vm.showContent(proposal)"> |
30 | 30 | Avalie esta proposta |
31 | 31 | <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span> |
32 | 32 | </button> |
33 | 33 | </div> |
34 | - <div class="col-md-4"> | |
34 | + <div class="col-sm-4"> | |
35 | 35 | <proposal-stats class="text-right" views="{{::proposal.hits}}" up="{{::proposal.votes_for}}" down="{{::proposal.votes_against}}"></proposal-stats> |
36 | 36 | </div> |
37 | 37 | </div> | ... | ... |
src/app/pages/programas/programa.controller.js
... | ... | @@ -118,16 +118,26 @@ |
118 | 118 | ProgramaPageController.prototype.attachListeners = function() { |
119 | 119 | var vm = this; |
120 | 120 | |
121 | - vm.$scope.$on('proposal-carousel:toProposals', function() { | |
121 | + vm.$scope.$on('proposal-carousel:showProposals', function() { | |
122 | 122 | if(!vm._proposal_list){ |
123 | 123 | vm._proposal_list = vm.$element.find('.proposal-ranking-section'); |
124 | 124 | } |
125 | 125 | |
126 | - vm._proposal_list.slideToggle(); | |
126 | + vm._proposal_list.slideDown(); | |
127 | 127 | angular.element('body').animate({scrollTop: vm._proposal_list.offset().top}, 'fast'); |
128 | 128 | }); |
129 | 129 | }; |
130 | 130 | |
131 | + ProgramaPageController.prototype.hideProposals = function() { | |
132 | + var vm = this; | |
133 | + | |
134 | + if(!vm._proposal_list){ | |
135 | + vm._proposal_list = vm.$element.find('.proposal-ranking-section'); | |
136 | + } | |
137 | + | |
138 | + vm._proposal_list.slideUp(); | |
139 | + }; | |
140 | + | |
131 | 141 | ProgramaPageController.prototype.makeProposal = function() { |
132 | 142 | var vm = this; |
133 | 143 | ... | ... |
src/app/pages/programas/programa.html
... | ... | @@ -85,6 +85,9 @@ |
85 | 85 | <div class="container"> |
86 | 86 | <div class="proposal-ranking-section-header"> |
87 | 87 | <h3 class="color-theme-fg">Resultados de propostas mais votadas</h3> |
88 | + <button class="btn btn-close" ng-click="pagePrograma.hideProposals()"> | |
89 | + <span class="glyphicon glyphicon-remove" aria-hidden="true"></span> | |
90 | + </button> | |
88 | 91 | </div> |
89 | 92 | <div class="proposal-ranking-section-table"> |
90 | 93 | <proposal-list proposals="pagePrograma.proposals"></proposal-list> | ... | ... |
src/app/pages/programas/programas.scss
... | ... | @@ -69,10 +69,19 @@ |
69 | 69 | h3 { |
70 | 70 | margin-top: 0; |
71 | 71 | } |
72 | - | |
73 | 72 | } |
74 | 73 | |
75 | 74 | .proposal-ranking-section { |
76 | 75 | background-color: #f1f1f1; |
77 | 76 | margin: 30px 0; |
77 | + | |
78 | + .proposal-ranking-section-header{ | |
79 | + position: relative; | |
80 | + } | |
81 | + | |
82 | + .btn-close { | |
83 | + position: absolute; | |
84 | + right: 0; | |
85 | + top: 0; | |
86 | + } | |
78 | 87 | } | ... | ... |