From ed48cfae3d51a0ea9e1263884c7d00b25684ccc9 Mon Sep 17 00:00:00 2001
From: seiyria <kyle@seiyria.com>
Date: Sat, 17 Oct 2015 11:04:11 -0500
Subject: [PATCH] fix(tournaments): social icons have appropriate colors

closes #68
---
 .../partials/tournaments/in-progress.jade     | 22 +++++++++----------
 src/scss/site.scss                            | 15 +++++++++++++
 2 files changed, 26 insertions(+), 11 deletions(-)

diff --git a/src/jade/partials/tournaments/in-progress.jade b/src/jade/partials/tournaments/in-progress.jade
index 0e9c18b..0ef0304 100644
--- a/src/jade/partials/tournaments/in-progress.jade
+++ b/src/jade/partials/tournaments/in-progress.jade
@@ -9,14 +9,14 @@ script(type="text/ng-template", id="/tournaments/in-progress")
 
     .text-right.auto-vert-margin(flex, layout="row", layout-align="end center")
       .hide-underline(ng-show="ref.public && hasAccess")
-        a.copy-url(data-clipboard-text="{{url}}")
-          ng-md-icon.pointer.margin-left-10(size="20", icon="link")
-        a(ng-click="share('facebook')")
-          ng-md-icon.pointer.margin-left-10(size="20", icon="facebook")
-        a(ng-click="share('twitter')")
-          ng-md-icon.pointer.margin-left-10(size="20", icon="twitter")
-        a(ng-click="share('google')")
-          ng-md-icon.pointer.margin-left-10.margin-right-10(size="20", icon="google-plus")
+        md-button.md-fab.md-mini.md-accent.copy-url(data-clipboard-text="{{url}}", aria-label="copy url to clipboard")
+          ng-md-icon(size="20", icon="link", style="fill:white")
+        md-button.md-fab.md-mini.color-facebook(ng-click="share('facebook')", aria-label="share on facebook")
+          ng-md-icon(size="20", icon="facebook", style="fill:white")
+        md-button.md-fab.md-mini.color-twitter(ng-click="share('twitter')", aria-label="share on twitter")
+          ng-md-icon(size="20", icon="twitter", style="fill:white")
+        md-button.md-fab.md-mini.color-google(ng-click="share('google')", aria-label="share on google+")
+          ng-md-icon(size="20", icon="google-plus", style="fill:white")
 
   .header-bar(layout="row", hide-gt-sm)
     .text-center.md-title(flex)
@@ -35,15 +35,15 @@ script(type="text/ng-template", id="/tournaments/in-progress")
           ng-md-icon(size="24", icon="link", style="fill: white")
           md-tooltip(md-direction="top") Copy link to clipboard
 
-        md-button.md-fab.md-mini.md-raised.md-accent.md-hue-1(aria-label="share on facebook", ng-click="share('facebook')")
+        md-button.md-fab.md-mini.md-raised.md-accent.color-facebook(aria-label="share on facebook", ng-click="share('facebook')")
           ng-md-icon(size="24", icon="facebook", style="fill: white")
           md-tooltip(md-direction="top") Share on facebook
 
-        md-button.md-fab.md-mini.md-raised.md-accent.md-hue-1(aria-label="share on twitter", ng-click="share('twitter')")
+        md-button.md-fab.md-mini.md-raised.md-accent.color-twitter(aria-label="share on twitter", ng-click="share('twitter')")
           ng-md-icon(size="24", icon="twitter", style="fill: white")
           md-tooltip(md-direction="top") Share on twitter
 
-        md-button.md-fab.md-mini.md-raised.md-accent.md-hue-1(aria-label="share on google plus", ng-click="share('google')")
+        md-button.md-fab.md-mini.md-raised.md-accent.color-google(aria-label="share on google plus", ng-click="share('google')")
           ng-md-icon(size="24", icon="google-plus", style="fill: white")
           md-tooltip(md-direction="top") Share on google plus
 
diff --git a/src/scss/site.scss b/src/scss/site.scss
index d1e9d91..66f5d9e 100644
--- a/src/scss/site.scss
+++ b/src/scss/site.scss
@@ -285,6 +285,21 @@ md-data-table-toolbar > form > input:focus {
   z-index: 12;
 }
 
+.color-facebook {
+  background-color: #3b5998!important;
+  color: #fff!important;
+}
+
+.color-google {
+  background-color: #dc4e41!important;
+  color: #fff!important;
+}
+
+.color-twitter {
+  background-color: #55acee!important;
+  color: #fff!important;
+}
+
 $paddings: top bottom left right;
 
 @for $size from 1 to 11 {