Download as
Browse Code »

Commit 53382f37f898bd0a039fb2a2888e22c1c0619d69

Authored by Leonardo Merlin
1 parent 80287b3f
Exists in master and in 6 other branches feature-captcha, feature-respostas, production, rafael, staging, the_glorious_return_of_piwik

WIP: update 'programa' page.

Showing 4 changed files with 346 additions and 212 deletions   Show diff stats
src/app/index.scss
  Diff comments   View file @53382f3
... ... @@ -292,7 +292,9 @@ $common-color: #5E739E;
292 292 .color-theme-common-fg {color: $common-color; }
293 293 .color-theme-common-bg {background-color: $common-color; }
294 294 .color-fg-white {color: #fff; }
295   -.color-bg-gray {color: #ccc; }
  295 +.color-bg-white {background-color: #fff; }
  296 +.color-fg-gray {color: #ccc; }
  297 +.color-bg-gray {background-color: #ccc; }
296 298  
297 299 // Contraste
298 300 .contraste {
... ...
src/app/pages/programas/programa.controller.js
  Diff comments   View file @53382f3
... ... @@ -275,4 +275,20 @@
275 275  
276 276 vm.proposalStatus = null;
277 277 };
  278 +
  279 + ProgramaPageController.prototype.toggleContentVisibility = function() {
  280 + var $sectionContent = angular.element('.section-content');
  281 +
  282 + if(!$sectionContent || $sectionContent.length === 0){
  283 + vm.$log.warn('".section-content" not found.');
  284 + return;
  285 + }
  286 +
  287 + if($sectionContent.is(':visible')){
  288 + $sectionContent.slideUp();
  289 + }else{
  290 + $sectionContent.slideDown();
  291 + angular.element('html,body').animate({scrollTop: $sectionContent.offset().top}, 'fast');
  292 + }
  293 + };
278 294 })();
... ...
src/app/pages/programas/programa.html
  Diff comments   View file @53382f3
1 1 <div class="container">
2   - <div class="row">
3   - <div class="col-sm-12">
4   - <div ncy-breadcrumb></div>
  2 + <div class="row">
  3 + <div class="col-sm-12">
  4 + <div ncy-breadcrumb></div>
  5 + </div>
5 6 </div>
6   - </div>
7 7 </div>
8   -
9 8 <div class="page--program">
10   - <section>
11   - <div class="container">
12   - <div class="row">
13   - <div class="col-sm-12">
14   - <div ng-if="!pagePrograma.article && pagePrograma.loading" class="alert alert-info" role="alert">Carregando detalhes sobre o progama...</div>
15   - <div ng-if="!pagePrograma.article && pagePrograma.error" class="alert alert-warning" role="alert">Erro ao carregar o programa.</div>
  9 + <section ng-if="!pagePrograma.article">
  10 + <div class="container">
  11 + <div class="row">
  12 + <div class="col-sm-12">
  13 + <div ng-if="pagePrograma.loading" class="alert alert-info" role="alert">Carregando detalhes sobre o progama...</div>
  14 + <div ng-if="pagePrograma.error" class="alert alert-warning" role="alert">Erro ao carregar o programa.</div>
  15 + </div>
  16 + </div>
16 17 </div>
17   - </div>
18   - </div>
19   - </section>
20   -
21   - <div role="main" ng-class="pagePrograma.category.slug">
22   - <section ng-if="pagePrograma.article.body">
23   - <div class="container">
24   - <div class="row">
25   - <article class="program-preview">
26   - <!-- Preview > Titulo -->
27   - <div class="col-md-12">
28   - <h1 class="program-preview--title color-theme-fg">{{::pagePrograma.article.title}}</h1>
  18 + </section>
  19 + <div role="main" ng-class="pagePrograma.category.slug">
  20 + <section ng-if="pagePrograma.article.body">
  21 + <div class="container">
  22 + <div class="row">
  23 + <article class="program-preview" ng-class="{ 'program-preview--archived': pagePrograma.article.archived }">
  24 + <!-- Preview > Titulo -->
  25 + <div class="col-md-12">
  26 + <h1 class="program-preview--title color-theme-fg">{{::pagePrograma.article.title}}</h1>
  27 + </div>
  28 + <!-- Preview > coluna da esquerda -->
  29 + <div class="col-md-8">
  30 + <div class="program-preview--box contraste-box">
  31 + <div class="program-preview--banner" ng-style="{'background-image':'url( {{::pagePrograma.banner.src}} )'}"></div>
  32 + <div class="program-preview--box--content-wrapper">
  33 + <div class="program-preview--icon icon-wrapper-rounded color-theme-bg" ng-class="pagePrograma.category.slug">
  34 + <span class="icon" ng-class="'icon-tema-' + pagePrograma.category.slug"></span>
  35 + </div>
  36 + <div class="program-preview--abstract color-theme-fg" ng-if="pagePrograma.article.archived === false">
  37 + <h2>{{::stripHtml(pagePrograma.article.summary)}}</h2>
  38 + </div>
  39 + <div class="program-preview--abstract-details" ng-if="pagePrograma.article.archived === false">
  40 + <div ng-bind-html="pagePrograma.article.summaryExtended"></div>
  41 + </div>
  42 + <div class="program-preview--share">
  43 + <div class="program-preview--share-label">COMPARTILHE ESTE <b>PROGRAMA</b></div>
  44 + <div class="dropdown">
  45 + <button id="dropdown-share-btn" class="btn btn-link dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" aria-label="Mostrar ou esconder a lista redes sociais para compartilhamento"><span class="icon icon-social-share-small" aria-hidden="true"></span></button>
  46 + <social-share social-url="pagePrograma.$state.href('programa', {slug: pagePrograma.article.slug}, {absolute: true})" social-text="pagePrograma.article.title" social-image="pagePrograma.banner.src" arrow-class="social-share--arrow" class="dropdown-menu dropdown-menu-right"></social-share>
  47 + </div>
  48 + </div>
  49 + <div class="program-preview--make-proposal" ng-if="pagePrograma.article.archived === false">
  50 + <div class="row">
  51 + <div class="col-sm-6">
  52 + <div class="button--themed">
  53 + <button type="button" class="btn btn-block" ng-click="pagePrograma.showProposalForm()">Faça uma proposta</button>
  54 + </div>
  55 + </div>
  56 + </div>
  57 + </div>
  58 + </div>
  59 + </div>
  60 + </div>
  61 + <!-- Preview > coluna da direita -->
  62 + <div class="col-md-4">
  63 + <div class="row">
  64 + <!-- Top Proposals -->
  65 + <div>
  66 + <!-- Loading Top Proposals -->
  67 + <div ng-if="pagePrograma.loadingTopProposals">
  68 + <div class="alert alert-info" role="alert">
  69 + Carregando propostas mais votadas...
  70 + </div>
  71 + </div>
  72 + <!-- Top Proposals > Carousel -->
  73 + <div class="col-xs-12" ng-if="!pagePrograma.loadingTopProposals && pagePrograma.proposalsTopRated && pagePrograma.proposalsTopRated.length > 0">
  74 + <h3 class="color-theme-fg">Propostas mais votadas</h3>
  75 + <proposal-carousel proposals="pagePrograma.proposalsTopRated" archived="pagePrograma.article.archived"></proposal-carousel>
  76 + </div>
  77 + </div>
  78 + <!-- Proposal Box -->
  79 + <div ng-if="!pagePrograma.article.archived">
  80 + <div class="col-xs-12" ng-if="!pagePrograma.loadingProposalBox && pagePrograma.randomProposal" ng-class="{'focused-proposal': !!pagePrograma.search.proposal_id}">
  81 + <h3 class="color-theme-fg">Apoie outras propostas</h3>
  82 + <proposal-box proposal="pagePrograma.randomProposal" topic="pagePrograma.article" category="pagePrograma.category" show-vote="true" focus="{{pagePrograma.search.proposal_id}}" do-vote="pagePrograma.vote(proposal_id, value)" archived="pagePrograma.article.archived"></proposal-box>
  83 + </div>
  84 + <!-- Loading Proposal Box -->
  85 + <div ng-if="pagePrograma.loadingProposalBox">
  86 + <div class="alert alert-info" role="alert">
  87 + Carregando propostas nesse programa...
  88 + </div>
  89 + </div>
  90 + </div>
  91 + <!-- No Proposals? okay! -->
  92 + <div ng-if="!pagePrograma.loadingTopProposals && !pagePrograma.loadingProposalBox">
  93 + <div class="col-xs-12" ng-if="!pagePrograma.randomProposal && !(pagePrograma.proposalsTopRated && pagePrograma.proposalsTopRated.length > 0)">
  94 + <h3>Programas sem propostas</h3>
  95 + <p>
  96 + Este programa ainda não possui nenhuma proposta.
  97 + <div class="button--themed">
  98 + <button type="button" class="btn btn-block" ng-click="pagePrograma.showProposalForm()">Faça uma proposta</button>
  99 + </div>
  100 + </p>
  101 + </div>
  102 + </div>
  103 + </div>
  104 + </div>
  105 + </article>
  106 + </div>
29 107 </div>
30   - <!-- Preview > coluna da esquerda -->
31   - <div class="col-md-8">
32   - <div class="program-preview--box contraste-box">
33   - <div class="program-preview--banner" ng-style="{'background-image':'url( {{::pagePrograma.banner.src}} )'}"></div>
34   - <div class="program-preview--box--content-wrapper">
35   - <div class="program-preview--icon icon-wrapper-rounded color-theme-bg" ng-class="pagePrograma.category.slug">
36   - <span class="icon" ng-class="'icon-tema-' + pagePrograma.category.slug"></span>
37   - </div>
38   - <div class="program-preview--abstract color-theme-fg">
39   - <h2>{{::stripHtml(pagePrograma.article.summary)}}</h2>
40   - </div>
41   - <div class="program-preview--abstract-details">
42   - <div ng-bind-html="pagePrograma.article.summaryExtended"></div>
43   - </div>
44   - <div class="program-preview--share">
45   - <div class="program-preview--share-label">COMPARTILHE ESTE <b>PROGRAMA</b></div>
46   - <div class="dropdown">
47   - <button id="dropdown-share-btn" class="btn btn-link dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" aria-label="Mostrar ou esconder a lista redes sociais para compartilhamento"><span class="icon icon-social-share-small" aria-hidden="true"></span></button>
48   - <social-share
49   - social-url="pagePrograma.$state.href('programa', {slug: pagePrograma.article.slug}, {absolute: true})"
50   - social-text="pagePrograma.article.title"
51   - social-image="pagePrograma.banner.src"
52   - arrow-class="social-share--arrow"
53   - class="dropdown-menu dropdown-menu-right"
54   - ></social-share>
  108 + </section>
  109 + <section id="section-proposal-list" class="proposal-extended-section" style="display:none;" ng-if="pagePrograma.proposalsTopFive && pagePrograma.proposalsTopFive.length > 0">
  110 + <div class="container">
  111 + <div class="proposal-extended-section-header">
  112 + <h3 class="color-theme-fg">Resultados de propostas mais votadas</h3>
  113 + <button type="button" aria-label="Close" class="btn btn-close" ng-click="pagePrograma.hideProposalsList()">
  114 + <span class="glyphicon glyphicon-remove" aria-hidden="true"></span>
  115 + </button>
  116 + </div>
  117 + <div class="proposal-extended-section-content">
  118 + <proposal-list proposals="pagePrograma.proposalsTopFive" archived="pagePrograma.article.archived"></proposal-list>
  119 + <div class="row text-center">
  120 + <div class="col-xs-12">
  121 + <a ui-sref="ranking({tema: pagePrograma.category.slug, programa: pagePrograma.article.slug})" class="btn btn-link">
  122 + <span ng-if="pagePrograma.total_proposals > 5">Veja todas as {{pagePrograma.total_proposals}} propostas</span>
  123 + </a>
  124 + </div>
55 125 </div>
56   - </div>
57   - <div class="program-preview--make-proposal">
  126 + </div>
  127 + </div>
  128 + </section>
  129 + <section id="section-proposal-form" class="proposal-extended-section" style="display:none;">
  130 + <div class="container">
  131 + <div class="proposal-extended-section-header">
  132 + <button type="button" aria-label="Close" class="btn btn-close" ng-click="pagePrograma.hideProposalForm()">
  133 + <span class="glyphicon glyphicon-remove" aria-hidden="true"></span>
  134 + </button>
  135 + </div>
  136 + <div ng-if="!pagePrograma.$rootScope.currentUser">
  137 + <show-message type="'alert'" message="'Você não está logado!'" description="'Você precisa estar logado para enviar uma proposta.'"></show-message>
58 138 <div class="row">
59   - <div class="col-sm-6">
60   - <div class="button--themed" ng-if="!pagePrograma.article.archived">
61   - <button type="button" class="btn btn-block" ng-click="pagePrograma.showProposalForm()">Faça uma proposta</button>
  139 + <div class="col-sm-4"></div>
  140 + <div class="col-sm-8 text-center-sm">
  141 + <a ui-sref="entrar({redirect_uri: pagePrograma.sendProposalRedirectURI})">Clique aqui para ir para a página de login</a>
62 142 </div>
63   - <div ng-if="pagePrograma.article.archived">
64   - <button type="button"
65   - class="btn btn-block disabled"
66   - title="Este programa já foi analisado. Não está mais habilitado a receber novas propostas."
67   - ng-click="pagePrograma.showDetailAboutArchived = true"
68   - >Faça uma proposta</button>
  143 + </div>
  144 + </div>
  145 + <div ng-if="pagePrograma.$rootScope.currentUser">
  146 + <div class="proposal-extended-section-content">
  147 + <div ng-if="pagePrograma.proposalStatus === pagePrograma.PROPOSAL_STATUS.SUCCESS">
  148 + <show-message type="'success'" message="'Proposta enviada com sucesso!'" description="'Sua proposta foi enviada para a nossa equipe de moderação. Em aproximadamente 72 horas você receberá em seu endereço de e-mail uma resposta sobre a sua proposta.'"></show-message>
  149 + <div class="row">
  150 + <div class="col-sm-4"></div>
  151 + <div class="col-sm-8 text-center-sm">
  152 + <button type="button" class="btn btn-link" ng-click="pagePrograma.sendAnotherProposal()">
  153 + Clique aqui para enviar outra proposta
  154 + </button>
  155 + </div>
  156 + </div>
  157 + </div>
  158 + <div ng-if="pagePrograma.proposalStatus === pagePrograma.PROPOSAL_STATUS.SENDING">
  159 + Enviando...
  160 + </div>
  161 + <div ng-if="pagePrograma.proposalStatus === pagePrograma.PROPOSAL_STATUS.ERROR">
  162 + <show-message type="'error'" message="'Erro ' + pagePrograma.error.code + '!'" description="pagePrograma.error.message"></show-message>
  163 + <div class="row">
  164 + <div class="col-sm-4"></div>
  165 + <div class="col-sm-8 text-center-sm">
  166 + <button type="button" class="btn btn-link" ng-click="pagePrograma.sendAnotherProposal()">
  167 + Clique aqui para enviar outra proposta
  168 + </button>
  169 + </div>
  170 + </div>
  171 + </div>
  172 + <div ng-if="!pagePrograma.proposalStatus">
  173 + <cadastro-proposta program="pagePrograma.article" status="pagePrograma.proposalStatus"></cadastro-proposta>
69 174 </div>
70   - </div>
71   - <div class="col-sm-6" ng-show="pagePrograma.showDetailAboutArchived === true">
72   - <p>(&#9679;) Este programa está arquivado.<br>Não pode receber novas propostas.</p>
73   - </div>
74 175 </div>
75   - </div>
76 176 </div>
77   - </div>
78 177 </div>
79   - <!-- Preview > coluna da direita -->
80   - <div class="col-md-4">
81   - <div class="row">
82   -
83   - <!-- Top Proposals -->
84   - <div>
85   - <!-- Loading Top Proposals -->
86   - <div ng-if="pagePrograma.loadingTopProposals">
87   - <div class="alert alert-info" role="alert">
88   - Carregando propostas mais votadas...
  178 + </section>
  179 + <section id="section-archived-banner" class="color-theme-bg" ng-if="pagePrograma.article.archived">
  180 + <div class="container">
  181 + <div class="row">
  182 + <div class="col-sm-12">
  183 + <h2>
  184 + <div class="program-banner--icon-container" aria-hidden="true">
  185 + <div class="program-banner--icon icon-wrapper-rounded color-bg-white" ng-class="pagePrograma.category.slug">
  186 + <span class="icon" ng-class="'icon-discussion'"></span>
  187 + </div>
  188 + </div>
  189 + <span class="archived-banner--title1">As propostas para este programa já foram</span>
  190 + <br/>
  191 + <span class="archived-banner--title2">respondidas pelo governo! Confira as respostas:</span>
  192 + </h2>
89 193 </div>
90   - </div>
91   -
92   - <!-- Top Proposals > Carousel -->
93   - <div class="col-xs-12" ng-if="!pagePrograma.loadingTopProposals && pagePrograma.proposalsTopRated && pagePrograma.proposalsTopRated.length > 0">
94   - <h3 class="color-theme-fg">Propostas mais votadas</h3>
95   - <proposal-carousel
96   - proposals="pagePrograma.proposalsTopRated"
97   - archived="pagePrograma.article.archived"
98   - ></proposal-carousel>
99   - </div>
100 194 </div>
101   -
102   - <!-- Proposal Box -->
103   - <div ng-if="!pagePrograma.article.archived">
104   - <div class="col-xs-12" ng-if="!pagePrograma.loadingProposalBox && pagePrograma.randomProposal" ng-class="{'focused-proposal': !!pagePrograma.search.proposal_id}">
105   - <h3 class="color-theme-fg">Apoie outras propostas</h3>
106   - <proposal-box
107   - proposal="pagePrograma.randomProposal"
108   - topic="pagePrograma.article"
109   - category="pagePrograma.category"
110   - show-vote="true"
111   - focus="{{pagePrograma.search.proposal_id}}"
112   - do-vote="pagePrograma.vote(proposal_id, value)"
113   - archived="pagePrograma.article.archived"
114   - ></proposal-box>
115   - </div>
116   -
117   - <!-- Loading Proposal Box -->
118   - <div ng-if="pagePrograma.loadingProposalBox">
119   - <div class="alert alert-info" role="alert">
120   - Carregando propostas nesse programa...
  195 + </div>
  196 + </section>
  197 + <section id="section-response" ng-if="pagePrograma.article.archived">
  198 + <div ng-if="!pagePrograma.proposalsTopRated">
  199 + <div class="container">
  200 + <div class="row">
  201 + <div class="col-sm-12">
  202 + <div class="alert alert-info" role="alert">
  203 + Carregando propostas mais votadas...
  204 + </div>
  205 + </div>
121 206 </div>
122   - </div>
123   - </div>
124   -
125   - <!-- No Proposals? okay! -->
126   - <div ng-if="!pagePrograma.loadingTopProposals && !pagePrograma.loadingProposalBox">
127   - <div class="col-xs-12" ng-if="!pagePrograma.randomProposal && !(pagePrograma.proposalsTopRated && pagePrograma.proposalsTopRated.length > 0)">
128   - <h3>Programas sem propostas</h3>
129   - <p>
130   - Este programa ainda não possui nenhuma proposta.
131   - <div class="button--themed">
132   - <button type="button" class="btn btn-block" ng-click="pagePrograma.showProposalForm()">Faça uma proposta</button>
133   - </div>
134   - </p>
135   - </div>
136 207 </div>
137   - </div>
138   - </div>
139   - </article>
140   - </div>
141   - </div>
142   - </section>
143   -
144   - <section id="section-proposal-list" class="proposal-extended-section" style="display:none;" ng-if="pagePrograma.proposalsTopFive && pagePrograma.proposalsTopFive.length > 0">
145   - <div class="container">
146   - <div class="proposal-extended-section-header">
147   - <h3 class="color-theme-fg">Resultados de propostas mais votadas</h3>
148   - <button type="button" aria-label="Close" class="btn btn-close" ng-click="pagePrograma.hideProposalsList()">
149   - <span class="glyphicon glyphicon-remove" aria-hidden="true"></span>
150   - </button>
151   - </div>
152   - <div class="proposal-extended-section-content">
153   - <proposal-list proposals="pagePrograma.proposalsTopFive" archived="pagePrograma.article.archived"></proposal-list>
154   - <div class="row text-center">
155   - <div class="col-xs-12">
156   - <a ui-sref="ranking({tema: pagePrograma.category.slug, programa: pagePrograma.article.slug})" class="btn btn-link">
157   - <span ng-if="pagePrograma.total_proposals > 5">Veja todas as {{pagePrograma.total_proposals}} propostas</span>
158   - </a>
159 208 </div>
160   - </div>
161   - </div>
162   - </div>
163   - </section>
164   -
165   - <section id="section-proposal-form" class="proposal-extended-section" style="display:none;">
166   - <div class="container">
167   - <div class="proposal-extended-section-header">
168   - <button type="button" aria-label="Close" class="btn btn-close" ng-click="pagePrograma.hideProposalForm()">
169   - <span class="glyphicon glyphicon-remove" aria-hidden="true"></span>
170   - </button>
171   - </div>
172   - <div ng-if="!pagePrograma.$rootScope.currentUser">
173   - <show-message
174   - type="'alert'"
175   - message="'Você não está logado!'"
176   - description="'Você precisa estar logado para enviar uma proposta.'"
177   - ></show-message>
178   - <div class="row">
179   - <div class="col-sm-4"></div>
180   - <div class="col-sm-8 text-center-sm">
181   - <a ui-sref="entrar({redirect_uri: pagePrograma.sendProposalRedirectURI})">Clique aqui para ir para a página de login</a>
182   - </div>
183   - </div>
184   - </div>
185   - <div ng-if="pagePrograma.$rootScope.currentUser">
186   - <div class="proposal-extended-section-content">
187   - <div ng-if="pagePrograma.proposalStatus === pagePrograma.PROPOSAL_STATUS.SUCCESS">
188   - <show-message
189   - type="'success'"
190   - message="'Proposta enviada com sucesso!'"
191   - description="'Sua proposta foi enviada para a nossa equipe de moderação. Em aproximadamente 72 horas você receberá em seu endereço de e-mail uma resposta sobre a sua proposta.'"
192   - ></show-message>
193   - <div class="row">
194   - <div class="col-sm-4"></div>
195   - <div class="col-sm-8 text-center-sm">
196   - <button type="button" class="btn btn-link" ng-click="pagePrograma.sendAnotherProposal()">
197   - Clique aqui para enviar outra proposta
198   - </button>
  209 + <div ng-if="pagePrograma.proposalsTopRated">
  210 + <div class="sub-section" ng-repeat="proposal in pagePrograma.proposalsTopRated">
  211 + <div class="container">
  212 + <div class="row">
  213 + <div class="col-sm-12">
  214 + <h3 class="color-theme-fg">{{($index+1)}}a proposta mais votada:</h3>
  215 + <p>{{::proposal.abstract}}</p>
  216 +
  217 + <div class="button--themed">
  218 + <button class="btn btn-block">
  219 + Veja a resposta e o compromisso do governo
  220 + <div class="button-left-icon">
  221 + <span class="glyphicon glyphicon-chevron-down pull-right color-theme-common-fg" aria-hidden="true"></span>
  222 + </div>
  223 + </button>
  224 + </div>
  225 + </div>
  226 + </div>
  227 + </div>
199 228 </div>
200   - </div>
201   - </div>
202   - <div ng-if="pagePrograma.proposalStatus === pagePrograma.PROPOSAL_STATUS.SENDING">
203   - Enviando...
204 229 </div>
205   - <div ng-if="pagePrograma.proposalStatus === pagePrograma.PROPOSAL_STATUS.ERROR">
206   - <show-message
207   - type="'error'"
208   - message="'Erro ' + pagePrograma.error.code + '!'"
209   - description="pagePrograma.error.message"
210   - ></show-message>
211   - <div class="row">
212   - <div class="col-sm-4"></div>
213   - <div class="col-sm-8 text-center-sm">
214   - <button type="button" class="btn btn-link" ng-click="pagePrograma.sendAnotherProposal()">
215   - Clique aqui para enviar outra proposta
216   - </button>
  230 + <div class="response--context vertical-padding">
  231 + <div class="container">
  232 + <div class="row">
  233 + <div class="col-sm-5">
  234 + <div class="button--themed">
  235 + <a class="btn btn-block" ui-sref="respostas">
  236 + <span>Veja todas as propostas</span>
  237 + <br/>
  238 + <span>Respondidas pelo governo</span>
  239 + <span class="glyphicon glyphicon-chevron-right"></span>
  240 + </a>
  241 + </div>
  242 + </div>
  243 + <div class="col-sm-2"></div>
  244 + <div class="col-sm-5">
  245 + <div class="button--themed">
  246 + <button type="button" class="btn btn-block" ng-click="pagePrograma.toggleContentVisibility()">
  247 + <span>Informações sobre o programa</span>
  248 + <br/>
  249 + <span>"{{::pagePrograma.article.title}}"</span>
  250 + <span class="glyphicon glyphicon-chevron-right"></span>
  251 + </button>
  252 + </div>
  253 + </div>
  254 + </div>
217 255 </div>
218   - </div>
219 256 </div>
220   - <div ng-if="!pagePrograma.proposalStatus">
221   - <cadastro-proposta program="pagePrograma.article" status="pagePrograma.proposalStatus"></cadastro-proposta>
222   - </div>
223   - </div>
224   - </div>
225   - </div>
226   - </section>
227   -
228   - <section class="section-content">
229   - <article class="program-content" ng-if="pagePrograma.article" ng-class="pagePrograma.article.slug">
230   - <div ng-bind-html="pagePrograma.article.bodyTrusted"></div>
231   - </article>
232   - </section>
233   - </div>
  257 + </section>
  258 + <section class="section-content" ng-style="{ display: pagePrograma.article.archived ? 'none': 'block' }">
  259 + <article class="program-content" ng-if="pagePrograma.article" ng-class="pagePrograma.article.slug">
  260 + <div ng-bind-html="pagePrograma.article.bodyTrusted"></div>
  261 + </article>
  262 + </section>
  263 + </div>
234 264 </div>
... ...
src/app/pages/programas/programas.scss
  Diff comments   View file @53382f3
... ... @@ -182,5 +182,91 @@
182 182 .proposal-extended-section-header {
183 183 position: relative;
184 184 }
  185 +
  186 + #section-archived-banner {
  187 + position: relative;
  188 + padding: 20px 0;
  189 + color: #fff;
  190 +
  191 + margin-top: 30px;
  192 +
  193 + h2 {
  194 + font-size: 28px;
  195 + line-height: 40px;
  196 +
  197 + @media screen and (max-width: $screen-md) {
  198 + font-size: 22px;
  199 + line-height: 30px;
  200 + }
  201 +
  202 + @media screen and (max-width: $screen-xs) {
  203 + font-size: 18px;
  204 + line-height: 24px;
  205 + }
  206 + }
  207 +
  208 + .program-banner--icon {
  209 + float: left;
  210 + margin-right: 20px;
  211 + width: 85px;
  212 + height: 85px;
  213 + overflow: hidden;
  214 +
  215 + .icon-discussion {
  216 + position: relative;
  217 + top: -3px;
  218 + left: -3px;
  219 + display: block;
  220 + width: 85px;
  221 + height: 85px;
  222 + background: red;
  223 + }
  224 + }
  225 +
  226 + .archived-banner--title2 {
  227 + font-weight: bold;
  228 + }
  229 + }
  230 +
  231 + #section-response {
  232 +
  233 + h3 {
  234 + font-weight: bold;
  235 + }
  236 + .sub-section{
  237 + padding: 20px 0;
  238 + &:nth-child(odd) {
  239 + background-color: #f1f1f1;
  240 + }
  241 +
  242 + &:nth-child(even) {
  243 + background-color: #ffffff;
  244 + }
  245 + }
  246 +
  247 + .button--themed {
  248 + position: relative;
  249 + max-width: 500px;
  250 +
  251 + button {
  252 + text-transform: uppercase;
  253 + letter-spacing: 1px;
  254 + }
  255 + }
  256 +
  257 + .button-left-icon {
  258 + position: absolute;
  259 + top: 15px;
  260 + right: 15px;
  261 +
  262 + .glyphicon {
  263 + position: relative;
  264 + top: -2px;
  265 + background-color: #fff;
  266 + padding: 6px 5px 5px 6px;
  267 + border-radius: 100%;
  268 + }
  269 + }
  270 + }
185 271 }
186 272  
... ...