bootstrap-social.scss (3293B)
1 /* 2 * Social Buttons for Bootstrap 3 * 4 * Copyright 2013-2014 Panayiotis Lipiridis 5 * Licensed under the MIT License 6 * 7 * https://github.com/lipis/bootstrap-social 8 */ 9 10 $bs-height-base: ($line-height-computed + $padding-base-vertical * 2); 11 $bs-height-lg: (floor($font-size-large * $line-height-base) + $padding-large-vertical * 2); 12 $bs-height-sm: (floor($font-size-small * 1.5) + $padding-small-vertical * 2); 13 $bs-height-xs: (floor($font-size-small * 1.2) + $padding-small-vertical + 1); 14 15 .btn-social { 16 position: relative; 17 padding-left: ($bs-height-base + $padding-base-horizontal); 18 text-align: left; 19 white-space: nowrap; 20 overflow: hidden; 21 text-overflow: ellipsis; 22 > :first-child { 23 position: absolute; 24 left: 0; 25 top: 0; 26 bottom: 0; 27 width: $bs-height-base; 28 line-height: ($bs-height-base + 2); 29 font-size: 1.6em; 30 text-align: center; 31 border-right: 1px solid rgba(0, 0, 0, 0.2); 32 } 33 &.btn-lg { 34 padding-left: ($bs-height-lg + $padding-large-horizontal); 35 :first-child { 36 line-height: $bs-height-lg; 37 width: $bs-height-lg; 38 font-size: 1.8em; 39 } 40 } 41 &.btn-sm { 42 padding-left: ($bs-height-sm + $padding-small-horizontal); 43 :first-child { 44 line-height: $bs-height-sm; 45 width: $bs-height-sm; 46 font-size: 1.4em; 47 } 48 } 49 &.btn-xs { 50 padding-left: ($bs-height-xs + $padding-small-horizontal); 51 :first-child { 52 line-height: $bs-height-xs; 53 width: $bs-height-xs; 54 font-size: 1.2em; 55 } 56 } 57 } 58 59 .btn-social-icon { 60 @extend .btn-social; 61 height: ($bs-height-base + 2); 62 width: ($bs-height-base + 2); 63 padding: 0; 64 :first-child { 65 border: none; 66 text-align: center; 67 width: 100%!important; 68 } 69 &.btn-lg { 70 height: $bs-height-lg; 71 width: $bs-height-lg; 72 padding-left: 0; 73 padding-right: 0; 74 } 75 &.btn-sm { 76 height: ($bs-height-sm + 2); 77 width: ($bs-height-sm + 2); 78 padding-left: 0; 79 padding-right: 0; 80 } 81 &.btn-xs { 82 height: ($bs-height-xs + 2); 83 width: ($bs-height-xs + 2); 84 padding-left: 0; 85 padding-right: 0; 86 } 87 } 88 89 @mixin btn-social($color-bg, $color: #fff) { 90 background-color: $color-bg; 91 @include button-variant($color, $color-bg, rgba(0,0,0,.2)); 92 } 93 94 95 .btn-adn { @include btn-social(#d87a68); } 96 .btn-bitbucket { @include btn-social(#205081); } 97 .btn-dropbox { @include btn-social(#1087dd); } 98 .btn-facebook { @include btn-social(#3b5998); } 99 .btn-flickr { @include btn-social(#ff0084); } 100 .btn-foursquare { @include btn-social(#f94877); } 101 .btn-github { @include btn-social(#444444); } 102 .btn-google-plus { @include btn-social(#dd4b39); } 103 .btn-instagram { @include btn-social(#3f729b); } 104 .btn-linkedin { @include btn-social(#007bb6); } 105 .btn-microsoft { @include btn-social(#2672ec); } 106 .btn-openid { @include btn-social(#f7931e); } 107 .btn-pinterest { @include btn-social(#cb2027); } 108 .btn-reddit { @include btn-social(#eff7ff, #000); } 109 .btn-soundcloud { @include btn-social(#ff5500); } 110 .btn-tumblr { @include btn-social(#2c4762); } 111 .btn-twitter { @include btn-social(#55acee); } 112 .btn-vimeo { @include btn-social(#1ab7ea); } 113 .btn-vk { @include btn-social(#587ea3); } 114 .btn-yahoo { @include btn-social(#720e9e); }