Download as
Browse Code »

Commit fe7224aa6d62b5bd7ffcf4afec885eab56bdf2ce

Authored by Victor Costa
2 parents 853ce530 8e1954f5
Exists in master and in 5 other branches build, build2, contigency_plan_recaptcha, production, staging

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

Showing 2 changed files with 106 additions and 16 deletions   Show diff stats
index.html
  Diff comments   View file @fe7224a
... ... @@ -102,6 +102,7 @@
102 102 <div class="participar">
103 103 <a href="#" class="button button-inline participe">Participe</a>
104 104 <a href="#" class="entrar">Entrar</a>
  105 + <a href="#" class="logout">Sair</a>
105 106 </div>
106 107 <h1><a href="#">{{article.title}}</a></h1>
107 108 <div class="social top">
... ... @@ -138,13 +139,14 @@
138 139 <div class="col-sm-3">
139 140 <aside id="proposal-categories">
140 141 <div id="proposal-categories-container">
141   - <h2 class="menu"><strong>Programas</strong> por Tema</h2>
  142 + <h2 class="menu hidden-xs"><strong>Programas</strong> por Tema</h2>
142 143 <ul class="themes">
143 144 {{#each article.categories}}
144 145 <li id="proposal-category-{{slug}}" class="proposal-category" data-category="{{slug}}">
145 146 <a href="#/temas/{{slug}}/{{id}}" class="proposal-link" data-target="proposal-item-{{id}}">
146 147 <span class="icon icon-theme icon-{{slug}}"></span>
147   - {{name}}
  148 + <span class="themes-name">{{name}}</span>
  149 + <span class="fa fa-angle-right hidden-xs"></span>
148 150 </a>
149 151 <!-- <div class="arrow-box" style="display: none"></div> -->
150 152 </li>
... ... @@ -179,7 +181,7 @@
179 181 <input placeholder="palavra chave" id="search-input" type="text" name="search" />
180 182 </div>
181 183 -->
182   - <a class="ver-todos" href="#/programas" role="tab" aria-controls="proposal-group">Ver todos os programas</a>
  184 + <a class="ver-todos" href="#/programas" role="tab" aria-controls="proposal-group"><span class="fa fa-angle-right"></span>Ver todos os programas</a>
183 185 <h2 class="name">Programas</h2>
184 186  
185 187 <ul class="proposal-list row">
... ... @@ -218,7 +220,9 @@
218 220 <div class="abstract">{{{abstract}}}</div>
219 221 </a>
220 222 <div class="show_body row">
221   - <a class="col-sm-6 col-sm-offset-3" href="#/programas/{{id}}/sobre-o-programa"><span>Conheça o programa</span></a>
  223 + <div class="col-sm-6 col-sm-offset-3">
  224 + <a class="" href="#/programas/{{id}}/sobre-o-programa"><span>Conheça o programa</span></a>
  225 + </div>
222 226 </div>
223 227 </div>
224 228  
... ... @@ -253,7 +257,13 @@
253 257 <div class="container-title box-title">Faça Uma Proposta</div>
254 258 <div class="subtitle box-subtitle">Qual a sua sugestão para melhorar este programa?</div>
255 259 <div class="info box-info">Esta consulta termina em julho de 2015. Até lá, todas as propostas serão lidas e as cinco mais pontuadas em cada programa receberão resposta oficial do governo.</div>
256   - <div class="button send-proposal-button button-send box-footer"><a href="#"><span>Envie sua proposta</span></a></div>
  260 + <div class="row">
  261 + <div class="col-sm-6 col-sm-offset-3">
  262 + <div class="button send-proposal-button button-send box-footer">
  263 + <a href="#"><span>Envie sua proposta</span></a>
  264 + </div>
  265 + </div>
  266 + </div>
257 267 <div class="login-container hide">Login</div>
258 268 <form class="make-proposal-form save-article-form require-login hide" id="make-proposal-form-{{id}}" action="{{proposal_action ../article . }}" method="post">
259 269 <div class="message hide"></div>
... ... @@ -343,7 +353,11 @@
343 353 <div class="vote-actions">
344 354 <a href="#" class="icon icon-vote dislike" data-vote-value="-1"><span class="fa fa-times"></span></a>
345 355 <a href="#" class="icon icon-vote like" data-vote-value="1"><span class="fa fa-check"></span></a>
346   - <a href="#" class="skip button box-footer">Pular</a>
  356 + <div class="row">
  357 + <div class="col-sm-6 col-sm-offset-3">
  358 + <a href="#" class="skip button box-footer">Pular</a>
  359 + </div>
  360 + </div>
347 361 <a href="#" class="vote-result box-bottom">Resultados</a>
348 362 </div>
349 363 <div class="social">
... ... @@ -448,14 +462,14 @@
448 462 <div class="captcha col-sm-12">
449 463 <div id="g-recaptcha"></div>
450 464 </div>
451   - </div>
452   - <div class="actions col-sm-12">
453   - <div class="row">
454   - <div class="col-sm-4">
455   - <a href="#" class="confirm-signup button">Confirmar</a>
456   - </div>
457   - <div class="col-sm-4">
458   - <a href="#" class="cancel-signup button button-cancela">Cancelar</a>
  465 + <div class="actions col-sm-12">
  466 + <div class="row">
  467 + <div class="col-sm-4">
  468 + <a href="#" class="confirm-signup button button-confirm">Confirmar</a>
  469 + </div>
  470 + <div class="col-sm-4">
  471 + <a href="#" class="cancel-signup button button-cancela">Cancelar</a>
  472 + </div>
459 473 </div>
460 474 </div>
461 475 </div>
... ...
sass/style.sass
  Diff comments   View file @fe7224a
... ... @@ -39,6 +39,7 @@
39 39 // 7 - Modificadores
40 40 // 8 - Cores do Temas
41 41 // 9 - Alto Contraste
  42 +// 10 - Mobile
42 43 // ------------------------------------
43 44  
44 45  
... ... @@ -64,7 +65,7 @@ $theme-size-header: 24px
64 65 $proposal-title: 32px
65 66  
66 67 // 1.4 - dicionarios
67   -$categories: (saude: #3449b7, seguranca-publica: #ee2a61, educacao: #f39720, reducao-da-pobreza: #3ebb8f)
  68 +$categories: (saude: #3449b7, seguranca-publica: #e34748, educacao: #f39720, reducao-da-pobreza: #3ebb8f)
68 69 $categories-descriptions: (saude: "Saúde é direito de todos e dever do Estado. O Sistema Único de Saúde (SUS) é universal, integral e de responsabilidade do Governo Federal, estados e municípios. Atende a todos os brasileiros.", seguranca-publica: "A segurança pública é um direito fundamental dos cidadãos. A proteção da vida, a disseminação da cultura da paz e a integração dos órgãos e instituições municipais, estaduais e federais são os maiores compromissos dessa política pública.", educacao: "Uma pátria educadora se faz com oportunidades para todos. Nos últimos anos, o Brasil criou esse caminho de oportunidades. Ampliamos o acesso à educação em todos os níveis de ensino – da creche à pós-graduação – e para todos os brasileiros, independentemente de sua classe social. E ainda há muito a fazer. O Plano Nacional de Educação (PNE) estabelece novas metas para que o governo federal trabalhe em parceria com a sociedade, com os estados e os municípios na construção de um futuro melhor. Queremos agora um salto na qualidade do ensino.", reducao-da-pobreza: "Com o esforço do Brasil para reduzir a pobreza e a desigualdade, 36 milhões de pessoas superaram a miséria na última década e o país saiu do Mapa da Fome das Nações Unidas.")
69 70  
70 71 // 1.5 - cores
... ... @@ -220,6 +221,8 @@ td
220 221 &-participe
221 222 .fa
222 223 margin-right: $gutter * 0.5
  224 + &-confirm
  225 + margin-bottom: $gutter
223 226  
224 227 // 5.2 - botao voltar
225 228 .btn
... ... @@ -408,6 +411,14 @@ h1
408 411 +hover(#fff,$darken)
409 412 &:hover,&:focus
410 413 text-decoration: none
  414 + .fa
  415 + color: #898989
  416 + float: right
  417 + font-size: 45px
  418 + &-name
  419 + display: inline-block
  420 + width: 50%
  421 + vertical-align: middle
411 422 .arrow-box
412 423 position: relative
413 424 top: $gutter
... ... @@ -424,6 +435,10 @@ h1
424 435 // 6.7 - listagem dos programas aleatorios
425 436 .ver-todos
426 437 float: right
  438 + .fa
  439 + font-size: $theme-size-header
  440 + margin-right: $gutter * 0.5
  441 + vertical-align: bottom
427 442 .proposal
428 443 &-container
429 444 border-radius: $radius
... ... @@ -516,7 +531,6 @@ h1
516 531 margin-left: auto
517 532 margin-right: auto
518 533 margin-top: $gutter
519   - width: 40%
520 534 &-bottom
521 535 @extend .box-footer
522 536 bottom: 10px
... ... @@ -588,6 +602,7 @@ h1
588 602 border-top: 0
589 603 border-radius: $radius * 2
590 604 color: #fff
  605 + display: block
591 606 font-size: $font-size-h2
592 607 font-weight: 700
593 608 padding-bottom: $gutter * 0.5
... ... @@ -1113,3 +1128,64 @@ h3.titulo-destaque
1113 1128 @each $category,$color in $categories
1114 1129 .category-#{$category}
1115 1130 background-color: darken(#fff, 85%)
  1131 +
  1132 +
  1133 +// ------------------------------------
  1134 +// 10 - mobile
  1135 +// ------------------------------------
  1136 +@media (max-width: 480px)
  1137 + #content
  1138 + // margin-top: $gutter * 1.5 * (-1)
  1139 + margin-bottom: 0
  1140 + .embed-responsive
  1141 + margin-left: $gutter * (-1)
  1142 + margin-right: $gutter * (-1)
  1143 + .themes
  1144 + margin-bottom: $gutter * 1.5
  1145 + margin-left: $gutter * 1.5 * (-1)
  1146 + margin-right: $gutter * 1.5 * (-1)
  1147 + margin-top: $gutter * 1.5 * (-1)
  1148 + font-size: 0
  1149 + &-name
  1150 + display: block
  1151 + width: 100%
  1152 + li
  1153 + display: inline-block
  1154 + font-size: $font-size-base
  1155 + width: 25%
  1156 + vertical-align: top
  1157 + &:first-child
  1158 + a
  1159 + border-left: 0
  1160 + a
  1161 + border-left: 1px solid #f1f1f1
  1162 + display: block
  1163 + padding: 0
  1164 + text-align: center
  1165 + height: 145px
  1166 + .icon
  1167 + margin-bottom: $gutter * 0.5
  1168 + margin-left: 0
  1169 + margin-right: 0
  1170 + margin-top: $gutter
  1171 + .box
  1172 + &-header
  1173 + p
  1174 + height: auto
  1175 + &-propostas
  1176 + height: auto
  1177 + .proposal
  1178 + &-header
  1179 + .title
  1180 + margin: 0
  1181 + padding-bottom: 0
  1182 + position: inherit
  1183 + width: 100%
  1184 + p
  1185 + padding-bottom: $gutter
  1186 + .select
  1187 + .proposal
  1188 + &-selection
  1189 + float: none
  1190 + margin: 0
  1191 + width: 100%
... ...