style.css 5.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286
  1. .socialite {
  2. padding-left: 0;
  3. list-style: none;
  4. }
  5. .socialite li
  6. {
  7. display: inline-block;
  8. margin: .25em;
  9. line-height: 24px;
  10. }
  11. .socialite li a {
  12. font-size: .875em;
  13. border-radius: 2px;
  14. border: 1px solid;
  15. box-shadow: 0 0 .5em #999;
  16. transition: background-color ease-in-out .5s, color ease-in-out .5s, border-color ease-in-out .5s, box-shadow ease-in-out .5s;
  17. }
  18. .socialite li a:hover {
  19. box-shadow: 0 0 1em #666;
  20. }
  21. .socialite li a:link,
  22. .socialite li a:visited {
  23. text-decoration: none;
  24. }
  25. .socialite li.name a,
  26. .socialite li.icon a {
  27. background-size: 1.25em;
  28. background-repeat: no-repeat;
  29. background-position: .25em center;
  30. padding: .25em .25em .25em 1.75em;
  31. color: #000000;
  32. }
  33. .socialite li.color a
  34. {
  35. padding: .25em .25em .25em .25em;
  36. color: #ffffff;
  37. }
  38. /*
  39. * Social network specific settings
  40. */
  41. /* Twitter */
  42. .socialite li.name .twitter,
  43. .socialite li.icon .twitter,
  44. .socialite li.color .twitter {
  45. border-color: #1da1f3;
  46. }
  47. .socialite li.name .twitter,
  48. .socialite li.icon .twitter {
  49. background-image: url("images/twitter.svg");
  50. }
  51. .socialite li.color .twitter {
  52. background-color: #1da1f3;
  53. }
  54. /* Facebook */
  55. .socialite li.name .facebook,
  56. .socialite li.icon .facebook,
  57. .socialite li.color .facebook {
  58. border-color: #3b5998;
  59. }
  60. .socialite li.name .facebook,
  61. .socialite li.icon .facebook {
  62. background-image: url("images/facebook.svg");
  63. }
  64. .socialite li.color .facebook {
  65. background-color: #3b5998;
  66. }
  67. /* Google+ */
  68. .socialite li.name .googleplus,
  69. .socialite li.icon .googleplus,
  70. .socialite li.color .googleplus {
  71. border-color: #dd4f43;
  72. }
  73. .socialite li.name .googleplus,
  74. .socialite li.icon .googleplus {
  75. background-image: url("images/google_plus.svg");
  76. }
  77. .socialite li.color .googleplus {
  78. background-color: #dd4f43;
  79. }
  80. /* LinkedIn */
  81. .socialite li.name .linkedin,
  82. .socialite li.icon .linkedin,
  83. .socialite li.color .linkedin {
  84. border-color: #0077b5;
  85. }
  86. .socialite li.name .linkedin,
  87. .socialite li.icon .linkedin {
  88. background-image: url("images/linkedin.svg");
  89. }
  90. .socialite li.color .linkedin {
  91. background-color: #0077b5;
  92. }
  93. /* Pinterest */
  94. .socialite li.name .pinterest,
  95. .socialite li.icon .pinterest,
  96. .socialite li.color .pinterest {
  97. border-color: #bd081b;
  98. }
  99. .socialite li.name .pinterest,
  100. .socialite li.icon .pinterest {
  101. background-image: url("images/pinterest.svg");
  102. }
  103. .socialite li.color .pinterest {
  104. background-color: #bd081b;
  105. }
  106. /* Tumblr */
  107. .socialite li.name .tumblr,
  108. .socialite li.icon .tumblr,
  109. .socialite li.color .tumblr {
  110. border-color: #39475d;
  111. }
  112. .socialite li.name .tumblr,
  113. .socialite li.icon .tumblr {
  114. background-image: url("images/tumblr.svg");
  115. }
  116. .socialite li.color .tumblr {
  117. background-color: #39475d;
  118. }
  119. /* Reddit */
  120. .socialite li.name .reddit,
  121. .socialite li.icon .reddit,
  122. .socialite li.color .reddit {
  123. border-color: #ff4500;
  124. }
  125. .socialite li.name .reddit,
  126. .socialite li.icon .reddit {
  127. background-image: url("images/reddit.svg");
  128. }
  129. .socialite li.color .reddit {
  130. background-color: #ff4500;
  131. }
  132. /* Taringa */
  133. .socialite li.name .taringa,
  134. .socialite li.icon .taringa,
  135. .socialite li.color .taringa {
  136. border-color: #005dab;
  137. }
  138. .socialite li.name .taringa,
  139. .socialite li.icon .taringa {
  140. background-image: url("images/taringa.svg");
  141. }
  142. .socialite li.color .taringa {
  143. background-color: #005dab;
  144. }
  145. /* StumbleUpon */
  146. .socialite li.name .stumbleupon,
  147. .socialite li.icon .stumbleupon,
  148. .socialite li.color .stumbleupon {
  149. border-color: #eb4924;
  150. }
  151. .socialite li.name .stumbleupon,
  152. .socialite li.icon .stumbleupon {
  153. background-image: url("images/stumbleupon.svg");
  154. }
  155. .socialite li.color .stumbleupon {
  156. background-color: #eb4924;
  157. }
  158. /* Telegram */
  159. .socialite li.name .telegram,
  160. .socialite li.icon .telegram,
  161. .socialite li.color .telegram {
  162. border-color: #1d94d3;
  163. }
  164. .socialite li.name .telegram,
  165. .socialite li.icon .telegram {
  166. background-image: url("images/telegram.svg");
  167. }
  168. .socialite li.color .telegram {
  169. background-color: #1d94d3;
  170. }
  171. /* Hacker News */
  172. .socialite li.name .hackernews,
  173. .socialite li.icon .hackernews,
  174. .socialite li.color .hackernews {
  175. border-color: #ff6600;
  176. }
  177. .socialite li.name .hackernews,
  178. .socialite li.icon .hackernews {
  179. background-image: url("images/hackernews.svg");
  180. }
  181. .socialite li.color .hackernews {
  182. background-color: #ff6600;
  183. }
  184. /* Xing */
  185. .socialite li.name .xing,
  186. .socialite li.icon .xing,
  187. .socialite li.color .xing {
  188. border-color: #175e60;
  189. }
  190. .socialite li.name .xing,
  191. .socialite li.icon .xing {
  192. background-image: url("images/xing.svg");
  193. }
  194. .socialite li.color .xing {
  195. background-color: #175e60;
  196. }
  197. /* Vk */
  198. .socialite li.name .vk,
  199. .socialite li.icon .vk,
  200. .socialite li.color .vk {
  201. border-color: #4c75a3;
  202. }
  203. .socialite li.name .vk,
  204. .socialite li.icon .vk {
  205. background-image: url("images/vk.svg");
  206. }
  207. .socialite li.color .vk {
  208. background-color: #4c75a3;
  209. }
  210. /* Email */
  211. .socialite li.name .email,
  212. .socialite li.icon .email,
  213. .socialite li.color .email {
  214. border-color: #673147;
  215. }
  216. .socialite li.name .email,
  217. .socialite li.icon .email {
  218. background-image: url("images/email.svg");
  219. }
  220. .socialite li.color .email {
  221. background-color: #673147;
  222. }