Details | Last modification | View Log | RSS feed
| Rev | Author | Line No. | Line |
|---|---|---|---|
| 1 | espaco | 1 | /*** |
| 2 | Social Icons |
||
| 3 | ***/ |
||
| 4 | |||
| 5 | .social-icons { |
||
| 6 | padding: 0; |
||
| 7 | margin:0; |
||
| 8 | |||
| 9 | @include clearfix(); |
||
| 10 | |||
| 11 | li { |
||
| 12 | float:left; |
||
| 13 | display:inline; |
||
| 14 | list-style:none; |
||
| 15 | margin-right:5px; |
||
| 16 | margin-bottom:5px; |
||
| 17 | text-indent:-9999px; |
||
| 18 | |||
| 19 | > a { |
||
| 20 | @include border-radius(2px); |
||
| 21 | width:28px; |
||
| 22 | height:28px; |
||
| 23 | display:block; |
||
| 24 | background-position:0 0; |
||
| 25 | background-repeat:no-repeat; |
||
| 26 | transition: all 0.3s ease-in-out; |
||
| 27 | -o-transition: all 0.3s ease-in-out; |
||
| 28 | -ms-transition: all 0.3s ease-in-out; |
||
| 29 | -moz-transition: all 0.3s ease-in-out; |
||
| 30 | -webkit-transition: all 0.3s ease-in-out; |
||
| 31 | } |
||
| 32 | |||
| 33 | &:hover { |
||
| 34 | > a { |
||
| 35 | background-position:0 -38px; |
||
| 36 | } |
||
| 37 | } |
||
| 38 | |||
| 39 | .amazon {background: url(../img/social/amazon.png) no-repeat;} |
||
| 40 | .behance {background: url(../img/social/behance.png) no-repeat;} |
||
| 41 | .blogger {background: url(../img/social/blogger.png) no-repeat;} |
||
| 42 | .deviantart {background: url(../img/social/deviantart.png) no-repeat;} |
||
| 43 | .dribbble {background: url(../img/social/dribbble.png) no-repeat;} |
||
| 44 | .dropbox {background: url(../img/social/dropbox.png) no-repeat;} |
||
| 45 | .evernote {background: url(../img/social/evernote.png) no-repeat;} |
||
| 46 | .facebook {background: url(../img/social/facebook.png) no-repeat;} |
||
| 47 | .forrst {background: url(../img/social/forrst.png) no-repeat;} |
||
| 48 | .github {background: url(../img/social/github.png) no-repeat;} |
||
| 49 | .googleplus {background: url(../img/social/googleplus.png) no-repeat;} |
||
| 50 | .jolicloud {background: url(../img/social/jolicloud.png) no-repeat;} |
||
| 51 | .last-fm {background: url(../img/social/last-fm.png) no-repeat;} |
||
| 52 | .linkedin {background: url(../img/social/linkedin.png) no-repeat;} |
||
| 53 | .picasa {background: url(../img/social/picasa.png) no-repeat;} |
||
| 54 | .pintrest {background: url(../img/social/pintrest.png) no-repeat;} |
||
| 55 | .rss {background: url(../img/social/rss.png) no-repeat;} |
||
| 56 | .skype {background: url(../img/social/skype.png) no-repeat;} |
||
| 57 | .spotify {background: url(../img/social/spotify.png) no-repeat;} |
||
| 58 | .stumbleupon {background: url(../img/social/stumbleupon.png) no-repeat;} |
||
| 59 | .tumblr {background: url(../img/social/tumblr.png) no-repeat;} |
||
| 60 | .twitter {background: url(../img/social/twitter.png) no-repeat;} |
||
| 61 | .vimeo {background: url(../img/social/vimeo.png) no-repeat;} |
||
| 62 | .wordpress {background: url(../img/social/wordpress.png) no-repeat;} |
||
| 63 | .xing {background: url(../img/social/xing.png) no-repeat;} |
||
| 64 | .yahoo {background: url(../img/social/yahoo.png) no-repeat;} |
||
| 65 | .youtube {background: url(../img/social/youtube.png) no-repeat;} |
||
| 66 | .vk {background: url(../img/social/vk.png) no-repeat;} |
||
| 67 | .instagram {background: url(../img/social/instagram.png) no-repeat;} |
||
| 68 | .reddit {background: url(../img/social/reddit.png) no-repeat;} |
||
| 69 | .aboutme {background: url(../img/social/aboutme.png) no-repeat;} |
||
| 70 | .flickr {background: url(../img/social/flickr.png) no-repeat;} |
||
| 71 | .foursquare {background: url(../img/social/foursquare.png) no-repeat;} |
||
| 72 | .gravatar {background: url(../img/social/gravatar.png) no-repeat;} |
||
| 73 | .klout {background: url(../img/social/klout.png) no-repeat;} |
||
| 74 | .myspace {background: url(../img/social/myspace.png) no-repeat;} |
||
| 75 | .quora {background: url(../img/social/quora.png) no-repeat;} |
||
| 76 | } |
||
| 77 | |||
| 78 | &.social-icons-color { |
||
| 79 | > li { |
||
| 80 | > a { |
||
| 81 | opacity: 0.7; |
||
| 82 | background-position:0 -38px !important; |
||
| 83 | |||
| 84 | &:hover { |
||
| 85 | opacity: 1; |
||
| 86 | } |
||
| 87 | } |
||
| 88 | } |
||
| 89 | } |
||
| 90 | |||
| 91 | &.social-icons-circle { |
||
| 92 | > li { |
||
| 93 | > a { |
||
| 94 | border-radius: 25px !important; |
||
| 95 | } |
||
| 96 | } |
||
| 97 | } |
||
| 98 | |||
| 99 | } |
||
| 100 | |||
| 101 | /*** |
||
| 102 | Inline Social Icons |
||
| 103 | ***/ |
||
| 104 | |||
| 105 | .social-icon { |
||
| 106 | display:inline-block !important; |
||
| 107 | width:28px; |
||
| 108 | height:28px; |
||
| 109 | background-position:0 0; |
||
| 110 | background-repeat:no-repeat; |
||
| 111 | @include border-radius(2px); |
||
| 112 | transition: all 0.3s ease-in-out; |
||
| 113 | -o-transition: all 0.3s ease-in-out; |
||
| 114 | -ms-transition: all 0.3s ease-in-out; |
||
| 115 | -moz-transition: all 0.3s ease-in-out; |
||
| 116 | -webkit-transition: all 0.3s ease-in-out; |
||
| 117 | |||
| 118 | &.social-icon-circle { |
||
| 119 | border-radius: 25px !important; |
||
| 120 | } |
||
| 121 | } |
||
| 122 | |||
| 123 | .social-icon { |
||
| 124 | &.amazon {background: url(../img/social/amazon.png) no-repeat;} |
||
| 125 | &.behance {background: url(../img/social/behance.png) no-repeat;} |
||
| 126 | &.blogger {background: url(../img/social/blogger.png) no-repeat;} |
||
| 127 | &.deviantart {background: url(../img/social/deviantart.png) no-repeat;} |
||
| 128 | &.dribbble {background: url(../img/social/dribbble.png) no-repeat;} |
||
| 129 | &.dropbox {background: url(../img/social/dropbox.png) no-repeat;} |
||
| 130 | &.evernote {background: url(../img/social/evernote.png) no-repeat;} |
||
| 131 | &.facebook {background: url(../img/social/facebook.png) no-repeat;} |
||
| 132 | &.forrst {background: url(../img/social/forrst.png) no-repeat;} |
||
| 133 | &.github {background: url(../img/social/github.png) no-repeat;} |
||
| 134 | &.googleplus {background: url(../img/social/googleplus.png) no-repeat;} |
||
| 135 | &.jolicloud {background: url(../img/social/jolicloud.png) no-repeat;} |
||
| 136 | &.last-fm {background: url(../img/social/last-fm.png) no-repeat;} |
||
| 137 | &.linkedin {background: url(../img/social/linkedin.png) no-repeat;} |
||
| 138 | &.picasa {background: url(../img/social/picasa.png) no-repeat;} |
||
| 139 | &.pintrest {background: url(../img/social/pintrest.png) no-repeat;} |
||
| 140 | &.rss {background: url(../img/social/rss.png) no-repeat;} |
||
| 141 | &.skype {background: url(../img/social/skype.png) no-repeat;} |
||
| 142 | &.spotify {background: url(../img/social/spotify.png) no-repeat;} |
||
| 143 | &.stumbleupon {background: url(../img/social/stumbleupon.png) no-repeat;} |
||
| 144 | &.tumblr {background: url(../img/social/tumblr.png) no-repeat;} |
||
| 145 | &.twitter {background: url(../img/social/twitter.png) no-repeat;} |
||
| 146 | &.vimeo {background: url(../img/social/vimeo.png) no-repeat;} |
||
| 147 | &.wordpress {background: url(../img/social/wordpress.png) no-repeat;} |
||
| 148 | &.xing {background: url(../img/social/xing.png) no-repeat;} |
||
| 149 | &.yahoo {background: url(../img/social/yahoo.png) no-repeat;} |
||
| 150 | &.youtube {background: url(../img/social/youtube.png) no-repeat;} |
||
| 151 | &.vk {background: url(../img/social/vk.png) no-repeat;} |
||
| 152 | &.instagram {background: url(../img/social/instagram.png) no-repeat;} |
||
| 153 | &.reddit {background: url(../img/social/reddit.png) no-repeat;} |
||
| 154 | &.aboutme {background: url(../img/social/aboutme.png) no-repeat;} |
||
| 155 | &.flickr {background: url(../img/social/flickr.png) no-repeat;} |
||
| 156 | &.foursquare {background: url(../img/social/foursquare.png) no-repeat;} |
||
| 157 | &.gravatar {background: url(../img/social/gravatar.png) no-repeat;} |
||
| 158 | &.klout {background: url(../img/social/klout.png) no-repeat;} |
||
| 159 | &.myspace {background: url(../img/social/myspace.png) no-repeat;} |
||
| 160 | &.quora {background: url(../img/social/quora.png) no-repeat;} |
||
| 161 | |||
| 162 | &:hover { |
||
| 163 | background-position:0 -38px; |
||
| 164 | } |
||
| 165 | } |
||
| 166 | |||
| 167 | .social-icon-color { |
||
| 168 | opacity: 0.7; |
||
| 169 | background-position:0 -38px !important; |
||
| 170 | |||
| 171 | &:hover { |
||
| 172 | opacity: 1; |
||
| 173 | } |
||
| 174 | } |