Commit 7f0be9a4f9e79b9df8a4e1e365158727a3b114bb

Authored by augustoalmeida
1 parent cd5714b9

Alteração na apresentação dos shareicons para fontawesome

Showing 1 changed file with 60 additions and 10 deletions   Show diff stats
sass/_share.scss
... ... @@ -2,7 +2,7 @@
2 2 position: relative;
3 3 z-index: 1;
4 4 &.top {
5   - margin-top: 45px;
  5 + // margin-top: 45px;
6 6 }
7 7 &.right {
8 8 padding-top: 10px;
... ... @@ -30,6 +30,7 @@
30 30 li {
31 31 display: inline-block;
32 32 padding: 0 2px !important;
  33 + vertical-align: top;
33 34 }
34 35 .icon {
35 36 background-color: transparent !important;
... ... @@ -37,37 +38,86 @@
37 38 background-position: 50% !important;
38 39 background-size: auto !important;
39 40 border: 0 !important;
  41 + border-radius: 100%;
40 42 color: #fff;
41 43 display: inline-block;
42 44 font-size: 20px;
43 45 height: 36px;
44 46 min-width: 0 !important;
45   - padding: 9px 0 !important;
  47 + padding: 0 !important;
46 48 // text-indent: -999999px;
47 49 text-align: center;
  50 + text-decoration: none;
  51 + transform: all 200ms;
48 52 width: 36px;
49 53 &-facebook {
50   - background-image: url(images/icons/icon-facebook.png) !important;
  54 + background-color: #537abb !important;
  55 + padding: 8px 0 !important;
51 56 &.disabled {
52   - background-image: url(images/icons/icon-facebook-disabled.png) !important;
  57 + background-color: #fff !important;
  58 + color: #000 !important;
  59 + &:hover {
  60 + background-color: darken(#537abb, 15%) !important;
  61 + }
  62 + }
  63 + &:hover {
  64 + background-color: darken(#537abb, 15%) !important;
53 65 }
54 66 }
55 67 &-twitter {
56   - background-image: url(images/icons/icon-twitter.png) !important;
  68 + background-color: #78caee !important;
  69 + padding: 8px 0 !important;
57 70 &.disabled {
58   - background-image: url(images/icons/icon-twitter-disabled.png) !important;
  71 + background-color: #fff !important;
  72 + color: #000 !important;
  73 + &:hover {
  74 + background-color: darken(#537abb, 15%) !important;
  75 + }
  76 + }
  77 + &:hover {
  78 + background-color: darken(#fff, 15%) !important;
59 79 }
60 80 }
61 81 &-gplus {
62   - background-image: url(images/icons/icon-gplus.png) !important;
  82 + background-color: #d54000 !important;
  83 + padding: 9px 0 !important;
63 84 &.disabled {
64   - background-image: url(images/icons/icon-gplus-disabled.png) !important;
  85 + background-color: #fff !important;
  86 + color: #000 !important;
  87 + &:hover {
  88 + background-color: darken(#fff, 15%) !important;
  89 + }
  90 + }
  91 + &:hover {
  92 + background-color: darken(#d54000, 15%) !important;
65 93 }
66 94 }
67 95 &-whatsapp {
68   - background-image: url(images/icons/icon-whatsapp.png) !important;
  96 + background-color: #56ba62 !important;
  97 + padding: 7px 0 !important;
  98 + &.disabled {
  99 + background-color: #fff !important;
  100 + color: #000 !important;
  101 + &:hover {
  102 + background-color: darken(#fff, 15%) !important;
  103 + }
  104 + }
  105 + &:hover {
  106 + background-color: darken(#56ba62, 15%) !important;
  107 + }
  108 + }
  109 + &-email {
  110 + background-color: #edb24c !important;
  111 + padding: 7px 0 !important;
69 112 &.disabled {
70   - background-image: url(images/icons/icon-whatsapp-disabled.png) !important;
  113 + background-color: #fff !important;
  114 + color: #000 !important;
  115 + &:hover {
  116 + background-color: darken(#fff, 15%) !important;
  117 + }
  118 + }
  119 + &:hover {
  120 + background-color: darken(#edb24c, 15%) !important;
71 121 }
72 122 }
73 123 }
... ...