From 231dd00de6cec09ccd2031061da892ec783b7dda Mon Sep 17 00:00:00 2001
From: Leonardo Merlin <leonardo.merlin@serpro.gov.br>
Date: Mon, 7 Sep 2015 14:27:41 -0300
Subject: [PATCH] Sync

---
 src/app/components/navbar/navbar.html                     |  2 +-
 src/app/components/navbar/navbar.scss                     | 34 ----------------------------------
 src/app/components/proposal-related/proposal-related.html | 63 ++++++++++++++++++++++++++++++++++++++++++++++++++-------------
 src/app/components/proposal-related/proposal-related.scss | 24 ++++++++++++++++++++++--
 src/app/index.scss                                        | 39 +++++++++++++++++++++++++++++++++++++--
 src/assets/images/icons/ranking.png                       | Bin 298 -> 0 bytes
 src/assets/images/icons/sprite.png                        | Bin 109438 -> 0 bytes
 7 files changed, 110 insertions(+), 52 deletions(-)

diff --git a/src/app/components/navbar/navbar.html b/src/app/components/navbar/navbar.html
index e95fd8b..b77f5d3 100644
--- a/src/app/components/navbar/navbar.html
+++ b/src/app/components/navbar/navbar.html
@@ -23,7 +23,7 @@
         <li role="separator" class="divider hidden-xs hidden-sm"><span>|</span></li>
         <li class="dropdown">
           <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Compartilhar <span class="icon icon-social-share-small"></span></a>
-          <ul class="dropdown-menu">
+          <ul class="dropdown-menu dropdown-menu-right dropdown-menu-social">
             <li>
               <a social-facebook custom-url="http://dialoga.gov.br" title="Compartilhar no Facebook">
                 <span class="icon-circle icon-small icon-circle-social-facebook"><span class="icon icon-social-facebook"></span></span>
diff --git a/src/app/components/navbar/navbar.scss b/src/app/components/navbar/navbar.scss
index 1581a6d..34792c9 100644
--- a/src/app/components/navbar/navbar.scss
+++ b/src/app/components/navbar/navbar.scss
@@ -84,40 +84,6 @@
                 margin-top: 0px;
             }
         }
-
-        .dropdown-menu {
-            min-width: 200px;
-            background-color: #eee;
-            padding: 5px;
-            height: 47px;
-
-            &:after {
-                clear: both;
-            }
-
-            li {
-                float: left;
-                padding: 0;
-                margin: 0;
-                width: 45px;
-                text-align: center;
-
-                & > a {
-                    padding: 0;
-                }
-
-                &:first-child {
-                    // margin-left: 5px;
-                }
-            }
-            
-            .icon {
-                transform: scale(0.7);
-                position: relative;
-                top: -10px;
-                left: -10px;
-            }
-        }
     }
 
     .contraste & {
diff --git a/src/app/components/proposal-related/proposal-related.html b/src/app/components/proposal-related/proposal-related.html
index 9324000..877545a 100644
--- a/src/app/components/proposal-related/proposal-related.html
+++ b/src/app/components/proposal-related/proposal-related.html
@@ -7,37 +7,74 @@
     <div class="proposal-related--content">
   	 <div class="proposal-related--content-inner" ng-bind-html="vm.proposal.abstract"></div>
     </div>
-  	<div class="proposal-related--actions">
+  	<div class="proposal-related--actions text-center">
   		<div class="row">
-  			<div class="col-sm-4">
-  				<div class="action vote_for" title="Apoiar">
+  			<div class="col-xs-4">
+  				<div class="action vote_for">
   					<div class="icon-circle">
   						<span class="glyphicon glyphicon-ok" aria-hidden="true"></span>
   					</div>
-  					<div class="sr-only">Apoiar proposta</div>
+  					<div class="action-label">Apoio</div>
   				</div>
   			</div>
-  			<div class="col-sm-4">
-  				<div class="action next" title="Pular proposta">
+  			<div class="col-xs-4">
+  				<div class="action next">
   					<div class="icon-circle">
   						<span class="glyphicon glyphicon-share-alt" aria-hidden="true"></span>
   					</div>
-  					<div class="sr-only">Pular proposta</div>
+  					<div class="action-label">Pular</div>
   				</div>
   			</div>
-  			<div class="col-sm-4">
-  				<div class="action vote_against" title="Não apoiar">
+  			<div class="col-xs-4">
+  				<div class="action vote_against">
   					<div class="icon-circle">
   						<span class="glyphicon glyphicon-remove" aria-hidden="true"></span>
   					</div>
-  					<div class="sr-only">Não apoiar</div>
+  					<div class="action-label">Não Apoio</div>
   				</div>
   			</div>
   		</div>
   	</div>
   </div>
-  <div class="proposal-related--bottom">
-  	<div class="proposal-related--share">[SHARE]</div>
-  	<div class="proposal-related--ranking">[RANKING]</div>
+  <div class="proposal-related--bottom text-center">
+  	<div class="proposal-related--share">
+      <span>COMPARTILHE ESSA <b>PROPOSTA</b></span>
+      <div class="dropdown">
+        <button id="dropdown-share-btn" class="btn btn-link dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><span class="icon icon-social-share-small" aria-hidden="true"></span></button>
+        <ul class="dropdown-menu dropdown-menu-right dropdown-menu-social" aria-labelledby="dropdown-share-btn">
+          <li>
+            <a social-facebook="" custom-url="http://dialoga.gov.br" title="Compartilhar no Facebook" class="ng-isolate-scope" rel="nofollow" href="https://facebook.com/sharer.php?u=http%3A%2F%2Fdialoga.gov.br">
+              <span class="icon-circle icon-small icon-circle-social-facebook"><span class="icon icon-social-facebook"></span></span>
+              <span class="sr-only">Compartilhar no Facebook</span>
+            </a>
+          </li>
+          <li>
+            <a social-twitter="" custom-url="http://dialoga.gov.br" status="This status is #" title="Compartilhar no Twitter" class="ng-isolate-scope" rel="nofollow" href="https://twitter.com/intent/tweet?text=This%20status%20is%20%23">
+              <span class="icon-circle icon-small icon-circle-social-twitter"><span class="icon icon-social-twitter"></span></span>
+              <span class="sr-only">Compartilhar no Twitter</span>
+            </a>
+          </li>
+          <li>
+            <a social-gplus="" custom-url="http://dialoga.gov.br" title="Compartilhar no Google Plus" class="ng-isolate-scope" rel="nofollow" href="https://plus.google.com/share?url=http%3A%2F%2Fdialoga.gov.br">
+              <span class="icon-circle icon-small icon-circle-social-googleplus"><span class="icon icon-social-googleplus"></span></span>
+              <span class="sr-only">Compartilhar no Google Plus</span>
+            </a>
+          </li>
+          <li>
+            <a href="mailto:contato@dialoga.gov.br?subject=Conheça o Dialoga Brasil" title="Enviar por email">
+              <span class="icon-circle icon-small icon-circle-social-whatsapp"><span class="icon icon-social-whatsapp"></span></span>
+              <span class="sr-only">Enviar por email</span>
+            </a>
+          </li>
+        </ul>
+      </div>
+    </div>
+  	<div class="proposal-related--ranking">
+     <div class="proposal-related--ranking-inner">
+       <span class="icon icon-small icon-ranking" aria-hidden="true"></span>
+       <span>Colocação nos resultados:</span>
+       <span>{{::vm.proposal.ranking_position}}º</span>
+     </div>
+    </div>
   </div>
 </div>
diff --git a/src/app/components/proposal-related/proposal-related.scss b/src/app/components/proposal-related/proposal-related.scss
index cd72e81..ff775c8 100644
--- a/src/app/components/proposal-related/proposal-related.scss
+++ b/src/app/components/proposal-related/proposal-related.scss
@@ -1,7 +1,7 @@
 .proposal-related {
 	background-color: #f1f1f1;
 	border-radius: 5px;
-	overflow: hidden;
+	// overflow: hidden;
 
 	&.focus {
 		border: 7px solid #000;
@@ -25,7 +25,8 @@
 	&--bottom {
 		border-bottom-left-radius: 5px;
 		border-bottom-right-radius: 5px;
-		overflow: hidden;
+		// overflow: hidden;
+        border-bottom: 5px solid #dadada;
 	}
 
 	&--theme {
@@ -40,6 +41,25 @@
         padding-bottom: 20px;
     }
 
+    &--share {
+        padding: 15px 0;
+        background-color: #e8e8e8;
+    }
+
+    &--ranking {
+        font-weight: bold;
+        padding: 10px 0;
+        background-color: #dadada;
+    }
+
+    .action-label {
+        margin-top: 10px;
+    }
+
+    .dropdown {
+        display: inline-block;
+    }
+
 	.glyphicon {
 		color: #fff;
 	}
diff --git a/src/app/index.scss b/src/app/index.scss
index 17cf114..0832347 100644
--- a/src/app/index.scss
+++ b/src/app/index.scss
@@ -132,9 +132,44 @@ body {
     }
 }
 
+
+.dropdown-menu.dropdown-menu-social {
+    min-width: 200px;
+    background-color: #eee;
+    padding: 5px;
+    height: 47px;
+
+    &:after {
+        clear: both;
+    }
+
+    li {
+        float: left;
+        padding: 0;
+        margin: 0;
+        width: 45px;
+        text-align: center;
+
+        & > a {
+            padding: 0;
+        }
+
+        &:first-child {
+            // margin-left: 5px;
+        }
+    }
+
+    .icon {
+        transform: scale(0.7);
+        position: relative;
+        top: -10px;
+        left: -10px;
+    }
+}
+
 .icon {
     display: inline-block;
-    vertical-align: middle; 
+    vertical-align: middle;
 }
 
 .icon-wrapper-rounded {
@@ -152,7 +187,7 @@ body {
     // border: 1px solid #eee;
     border-radius: 100%;
     overflow: hidden;
-    
+
     &.icon-small {
         width: 35px;
         height: 35px;
diff --git a/src/assets/images/icons/ranking.png b/src/assets/images/icons/ranking.png
index 0ea6dd7..19c4250 100644
Binary files a/src/assets/images/icons/ranking.png and b/src/assets/images/icons/ranking.png differ
diff --git a/src/assets/images/icons/sprite.png b/src/assets/images/icons/sprite.png
index 5cb983f..c553a49 100644
Binary files a/src/assets/images/icons/sprite.png and b/src/assets/images/icons/sprite.png differ
--
libgit2 0.21.2