Commit 3e107985ea734714aa7ddbffd3bf8e19b41655b3
1 parent
56b86662
Exists in
master
and in
6 other branches
shareicon for program page
Showing
2 changed files
with
40 additions
and
11 deletions
Show diff stats
index.html
| @@ -95,7 +95,7 @@ | @@ -95,7 +95,7 @@ | ||
| 95 | <header> | 95 | <header> |
| 96 | <h1><a href="#">{{article.title}}</a></h1> | 96 | <h1><a href="#">{{article.title}}</a></h1> |
| 97 | <a id="display-contrast" href="#">Alto Contraste</a> | 97 | <a id="display-contrast" href="#">Alto Contraste</a> |
| 98 | - <div class="social"> | 98 | + <div class="social top"> |
| 99 | <ul> | 99 | <ul> |
| 100 | <li><a href="#" class="fb-share icon icon-facebook" data-description="Aqui suas ideias viram propostas e você ajuda a melhorar as ações do governo">Compartilhar no Facebook</a></li> | 100 | <li><a href="#" class="fb-share icon icon-facebook" data-description="Aqui suas ideias viram propostas e você ajuda a melhorar as ações do governo">Compartilhar no Facebook</a></li> |
| 101 | <li><a class="tw-share disabled icon icon-twitter">Compartilhar no Twitter</a></li> | 101 | <li><a class="tw-share disabled icon icon-twitter">Compartilhar no Twitter</a></li> |
| @@ -173,9 +173,7 @@ | @@ -173,9 +173,7 @@ | ||
| 173 | {{/each}} | 173 | {{/each}} |
| 174 | </ul> | 174 | </ul> |
| 175 | 175 | ||
| 176 | - <div class="social"> | ||
| 177 | - <a href="#" class="fb-share" data-caption="{{title}}" data-description="{{stripTags abstract}}">Compartilhar</a> | ||
| 178 | - </div> | 176 | + |
| 179 | <div class="proposal-header"> | 177 | <div class="proposal-header"> |
| 180 | <div class="abstract"> | 178 | <div class="abstract"> |
| 181 | <img src="{{../host}}{{image.url}}" alt="Imagem de apresentação do programa."/> | 179 | <img src="{{../host}}{{image.url}}" alt="Imagem de apresentação do programa."/> |
| @@ -193,12 +191,25 @@ | @@ -193,12 +191,25 @@ | ||
| 193 | </div> | 191 | </div> |
| 194 | 192 | ||
| 195 | <div class="container"> | 193 | <div class="container"> |
| 196 | - <div class="col-sm-4 col-sm-offset-4"> | ||
| 197 | - <div class="go-to-proposal-button"> | ||
| 198 | - <a href="#/programas/{{id}}" data-target="proposal-item-{{id}}"> | ||
| 199 | - <span class="fa fa-reply"></span> | ||
| 200 | - Participe | ||
| 201 | - </a> | 194 | + <div class="row"> |
| 195 | + <div class="col-sm-4"> | ||
| 196 | + <div class="go-to-proposal-button"> | ||
| 197 | + <a href="#/programas/{{id}}" data-target="proposal-item-{{id}}"> | ||
| 198 | + <span class="fa fa-reply"></span> | ||
| 199 | + Participe | ||
| 200 | + </a> | ||
| 201 | + </div> | ||
| 202 | + </div> | ||
| 203 | + <div class="col-sm-4 col-sm-offset-4"> | ||
| 204 | + <div class="social right"> | ||
| 205 | + <span>COMPARTILHE<br>ESTE PROGRAMA</span> | ||
| 206 | + <ul> | ||
| 207 | + <li><a href="#" class="fb-share icon icon-facebook" data-caption="{{title}}" data-description="{{stripTags abstract}}">Compartilhar no Facebook</a></li> | ||
| 208 | + <li><a class="tw-share disabled icon icon-twitter">Compartilhar no Twitter</a></li> | ||
| 209 | + <li><a class="gp-share disabled icon icon-gplus">Compartilhar no Google Plus</a></li> | ||
| 210 | + <li><a class="ws-share disabled icon icon-whatsapp">Compartilhar no WhatsApp</a></li> | ||
| 211 | + </ul> | ||
| 212 | + </div> | ||
| 202 | </div> | 213 | </div> |
| 203 | </div> | 214 | </div> |
| 204 | </div> | 215 | </div> |
sass/_share.scss
| 1 | .social { | 1 | .social { |
| 2 | - margin-top: 45px; | ||
| 3 | position: relative; | 2 | position: relative; |
| 4 | z-index: 1; | 3 | z-index: 1; |
| 4 | + &.top { | ||
| 5 | + margin-top: 45px; | ||
| 6 | + } | ||
| 7 | + &.right { | ||
| 8 | + padding-top: 10px; | ||
| 9 | + span { | ||
| 10 | + display: inline-block; | ||
| 11 | + font-size: 12px; | ||
| 12 | + font-weight: 300; | ||
| 13 | + padding-right: 10px; | ||
| 14 | + text-align: right; | ||
| 15 | + vertical-align: middle; | ||
| 16 | + } | ||
| 17 | + ul { | ||
| 18 | + display: inline-block; | ||
| 19 | + vertical-align: middle | ||
| 20 | + } | ||
| 21 | + } | ||
| 5 | span { | 22 | span { |
| 6 | display: block; | 23 | display: block; |
| 7 | margin-bottom: 10px; | 24 | margin-bottom: 10px; |
| @@ -19,6 +36,7 @@ | @@ -19,6 +36,7 @@ | ||
| 19 | background-repeat: no-repeat; | 36 | background-repeat: no-repeat; |
| 20 | background-position: 50% !important; | 37 | background-position: 50% !important; |
| 21 | background-size: auto !important; | 38 | background-size: auto !important; |
| 39 | + border: 0 !important; | ||
| 22 | display: inline-block; | 40 | display: inline-block; |
| 23 | height: 36px; | 41 | height: 36px; |
| 24 | min-width: 0 !important; | 42 | min-width: 0 !important; |