zocial 0.0.2 → 0.0.3
Sign up to get free protection for your applications and to get access to all the features.
- data/README.mdown +36 -22
- data/lib/zocial.rb +2 -2
- data/stylesheets/_zocial.sass +4 -5
- data/stylesheets/partials/_adjustments.sass +27 -10
- data/stylesheets/partials/_base.sass +5 -3
- data/stylesheets/partials/_colors.sass +1 -0
- data/stylesheets/partials/_fonts.sass +11 -4
- data/stylesheets/partials/{_full.sass → _mixins.sass} +73 -5
- data/templates/css/manifest.rb +1 -0
- data/templates/css/zocial-min.css +1 -1
- data/templates/css/zocial.css +345 -50
- data/templates/css/zocial.sass +3 -1
- data/templates/fonts/manifest.rb +6 -6
- data/templates/fonts/zocial/zocial-regular-webfont.eot +0 -0
- data/templates/fonts/zocial/zocial-regular-webfont.svg +138 -0
- data/templates/fonts/zocial/zocial-regular-webfont.ttf +0 -0
- data/templates/fonts/zocial/zocial-regular-webfont.woff +0 -0
- metadata +10 -11
- data/stylesheets/partials/_lite.sass +0 -70
- data/templates/fonts/zocial/zocial-lite-regular-webfont.eot +0 -0
- data/templates/fonts/zocial/zocial-lite-regular-webfont.svg +0 -37
- data/templates/fonts/zocial/zocial-lite-regular-webfont.ttf +0 -0
- data/templates/fonts/zocial/zocial-lite-regular-webfont.woff +0 -0
data/README.mdown
CHANGED
@@ -1,10 +1,10 @@
|
|
1
|
-
# Zocial
|
1
|
+
# Zocial, a CSS3 social buttons Sass framework.
|
2
2
|
|
3
|
-
## Zocial is a CSS3
|
3
|
+
## Zocial is a CSS3 social buttons set and vector icons with @font-face as a Sass mixin and usable as a Compass extension.
|
4
4
|
|
5
5
|
HUGE thanks to [Sam Collins](http://twitter.com/smcllns) for all his hard work on the original CSS3 button set and the Zocial icons font! Without his work, this project would not exist.
|
6
6
|
|
7
|
-
|
7
|
+
This project comes with a free subset of that font set, and includes:
|
8
8
|
|
9
9
|
* Twitter
|
10
10
|
* Facebook
|
@@ -12,8 +12,7 @@ You can find the CSS only version (no Sass) and the full font set at [zocial.smc
|
|
12
12
|
* GitHub
|
13
13
|
* RSS
|
14
14
|
* Smashing Magazine
|
15
|
-
|
16
|
-
![Zocial-Lite Preview](https://github.com/adamstac/zocial/raw/master/test/public/images/zocial-lite-preview.jpg)
|
15
|
+
* and MANY more ...
|
17
16
|
|
18
17
|
## Installation
|
19
18
|
|
@@ -34,51 +33,66 @@ You should see something like this:
|
|
34
33
|
|
35
34
|
-> % compass install zocial/fonts
|
36
35
|
directory fonts/zocial/
|
37
|
-
create fonts/zocial/zocial-
|
38
|
-
create fonts/zocial/zocial-
|
39
|
-
create fonts/zocial/zocial-
|
40
|
-
create fonts/zocial/zocial-
|
36
|
+
create fonts/zocial/zocial-regular-webfont.eot
|
37
|
+
create fonts/zocial/zocial-regular-webfont.svg
|
38
|
+
create fonts/zocial/zocial-regular-webfont.ttf
|
39
|
+
create fonts/zocial/zocial-regular-webfont.woff
|
41
40
|
|
42
41
|
Once you've done this, your project will be ready to use Zocial! The next step is to "mixin" Zocial which is covered in the usage section.
|
43
42
|
|
44
43
|
## Usage
|
45
44
|
|
46
|
-
Zocial
|
45
|
+
Zocial has a few defaults in place that you can override for your project.
|
47
46
|
|
48
47
|
// Defaults
|
49
48
|
$zocial-font-size: 1.8em
|
50
|
-
$zocial-
|
51
|
-
$zocial-icon-
|
49
|
+
$zocial-font-weight: bold
|
50
|
+
$zocial-icon-font: zocial
|
51
|
+
$zocial-icon-default: "\0020"
|
52
52
|
$zocial-text-font: helvetica
|
53
|
+
|
54
|
+
`$zocial-font-size` is set using ems and will vary in size based on your default font size.
|
55
|
+
|
56
|
+
`$zocial-icon-font` is set to "zocial" by default. In a previous version, there was a "lite" version of the font offered as open source, but now the full Zocial font is now included as open source and you can use all the buttons zocial has to offer.
|
57
|
+
|
58
|
+
`$zocial-icon-default` is set to an empty space by default. Feel free to update this if you plan to use a default button and want to set a default icon.
|
59
|
+
|
60
|
+
`$zocial-text-font` is set to "helvetica" by default, but can set to [any of the fonts](https://github.com/adamstac/zocial/blob/master/stylesheets/partials/_fonts.sass) defined. In a future release, we plan to work on adding better options for using other fonts. Please be patient.
|
53
61
|
|
54
|
-
|
62
|
+
### Mixins
|
55
63
|
|
56
|
-
|
64
|
+
Once you have Zocial's settings in place, it's time to mixin zocial. Zocial has two mixins, one for the free set (zocial-lite) and one for the full set (zocial-full) that can [purchased here](http://zocial.smcllns.com/).
|
57
65
|
|
58
|
-
|
66
|
+
To use the free set that comes with this project, use this mixin:
|
67
|
+
|
68
|
+
// SCSS
|
69
|
+
@include zocial;
|
70
|
+
|
71
|
+
// Sass
|
72
|
+
+zocial
|
59
73
|
|
60
74
|
## HTML Markup
|
61
75
|
|
62
76
|
Here's a snippet of example HTML markup in both HTML and Haml. The caveat or gotcha that most people stumble over is the required nested `<span>` element. As you can see, each Zocial button gets the required `.zocial` class name plus the button name.
|
63
77
|
|
64
|
-
<button class="zocial
|
78
|
+
<button class="zocial twitter">
|
65
79
|
<span>Sign in with Twitter</span>
|
66
80
|
</button>
|
67
|
-
<a class="zocial
|
81
|
+
<a class="zocial twitter" href="#">
|
68
82
|
<span>Sign in with Twitter</span>
|
69
83
|
</a>
|
70
84
|
|
71
|
-
%button.zocial.
|
85
|
+
%button.zocial.twitter
|
72
86
|
%span Sign in with Twitter
|
73
|
-
%a(href="#" class="zocial
|
87
|
+
%a(href="#" class="zocial twitter")
|
74
88
|
%span Sign in with Twitter
|
75
89
|
|
76
90
|
To use just the icon version of the Zocial button, all you need to do is add the class name `.icon` to the above markup. Here's is the repeated code, but this time adding the `.icon` class.
|
77
91
|
|
78
|
-
<button class="zocial twitter">
|
92
|
+
<button class="zocial icon twitter">
|
79
93
|
<span>Sign in with Twitter</span>
|
80
94
|
</button>
|
81
|
-
<a class="zocial twitter" href="#">
|
95
|
+
<a class="zocial icon twitter" href="#">
|
82
96
|
<span>Sign in with Twitter</span>
|
83
97
|
</a>
|
84
98
|
|
@@ -102,7 +116,7 @@ The examples shown above illustrate how to use the Twitter Zocial button. Below
|
|
102
116
|
|
103
117
|
**Icon font:**
|
104
118
|
|
105
|
-
* zocial
|
119
|
+
* zocial
|
106
120
|
|
107
121
|
**Text font:**
|
108
122
|
|
data/lib/zocial.rb
CHANGED
data/stylesheets/_zocial.sass
CHANGED
@@ -1,11 +1,11 @@
|
|
1
|
-
//
|
1
|
+
// Hello Compass.
|
2
2
|
@import "compass"
|
3
3
|
|
4
4
|
// Default variables
|
5
5
|
$zocial-font-size: 1.8em !default
|
6
6
|
$zocial-font-weight: bold !default
|
7
|
-
$zocial-icon-font: zocial
|
8
|
-
$zocial-icon-default: "
|
7
|
+
$zocial-icon-font: zocial !default
|
8
|
+
$zocial-icon-default: "\0020" !default
|
9
9
|
$zocial-text-font: helvetica !default
|
10
10
|
|
11
11
|
// Zocial is magic!
|
@@ -13,5 +13,4 @@ $zocial-text-font: helvetica !default
|
|
13
13
|
@import "partials/base"
|
14
14
|
@import "partials/adjustments"
|
15
15
|
@import "partials/colors"
|
16
|
-
@import "partials/
|
17
|
-
@import "partials/full"
|
16
|
+
@import "partials/mixins"
|
@@ -1,19 +1,36 @@
|
|
1
1
|
// Adjustments for light background buttons
|
2
2
|
//
|
3
|
-
//
|
4
|
-
// &.
|
3
|
+
// Lite
|
4
|
+
// &.github, &.twitter, &.white
|
5
|
+
//
|
6
|
+
// Full
|
7
|
+
// &.cloudapp, &.dropbox, &.gmail, &.instapaper,
|
8
|
+
// &.openid, &.plancast, &.posterous, &.wikipedia
|
5
9
|
.adjustment-1
|
6
|
-
+
|
7
|
-
+
|
10
|
+
+box-shadow(inset 0 0.063em 0 rgba(#fff, 0.4), inset 0 0 0.063em rgba(#fff, 0.6), 0 0.063em 0 rgba(#fff, 0.3))
|
11
|
+
+text-shadow(0 1px 0 rgba(#fff, 0.8))
|
8
12
|
|
9
|
-
//
|
13
|
+
// Lite
|
14
|
+
// &.github:hover > span, &.github:focus > span
|
15
|
+
// &.twitter:focus > span
|
10
16
|
//
|
11
|
-
//
|
12
|
-
// &.plancast:
|
17
|
+
// Full
|
18
|
+
// &.plancast:hover > span, &.plancast:focus > span,
|
19
|
+
// &.posterous:hover > span, &.posterous:focus > span,
|
20
|
+
// &.dropbox:hover > span, &.dropbox:focus > span,
|
21
|
+
// &.openid:hover > span, &.openid:focus > span,
|
22
|
+
// &.instapaper:hover > span, &.instapaper:focus > span,
|
23
|
+
// &.wikipedia:hover > span, &.wikipedia:focus > span,
|
24
|
+
// &.gmail:hover > span, &.gmail:focus > span
|
13
25
|
.adjustment-2
|
14
|
-
+background(linear-gradient(top, rgba(#fff
|
26
|
+
+background(linear-gradient(top, rgba(#fff, 0.5), rgba(#fff, 0.2) 49%, rgba(#000, 0.05) 51%, rgba(#000, 0.15)))
|
15
27
|
|
28
|
+
// Lite
|
16
29
|
// &.twitter:active > span, &.github:active > span
|
17
|
-
//
|
30
|
+
//
|
31
|
+
// Full
|
32
|
+
// &.dropbox:active > span, &.gmail:active > span, &.instapaper:active > span,
|
33
|
+
// &.openid:active > span, &.plancast:active > span, &.posterous:active > span,
|
34
|
+
// &.wikipedia:active > span
|
18
35
|
.adjustment-3
|
19
|
-
+background(linear-gradient(bottom, rgba(#fff,0), rgba(#fff,0) 30%, rgba(#000, 0) 50%, rgba(#000
|
36
|
+
+background(linear-gradient(bottom, rgba(#fff, 0), rgba(#fff, 0) 30%, rgba(#000, 0) 50%, rgba(#000, 0.1)))
|
@@ -1,3 +1,4 @@
|
|
1
|
+
// Zocial base button architecture
|
1
2
|
=zocial-base
|
2
3
|
.zocial, .zocial > span
|
3
4
|
+border-radius(0.2em)
|
@@ -19,12 +20,12 @@
|
|
19
20
|
padding: 0
|
20
21
|
text-decoration: none !important
|
21
22
|
|
22
|
-
//
|
23
|
+
// Tweak to styles for -moz
|
23
24
|
button::-moz-focus-inner
|
24
25
|
border: 0
|
25
26
|
padding: 0
|
26
27
|
|
27
|
-
//
|
28
|
+
// Add a class of "icon" to display as standalone icons instead
|
28
29
|
&.icon
|
29
30
|
width: 1.85em
|
30
31
|
overflow: hidden
|
@@ -66,4 +67,5 @@
|
|
66
67
|
& > span:before
|
67
68
|
content: $zocial-icon-default
|
68
69
|
|
69
|
-
|
70
|
+
// Include zocial-base
|
71
|
+
+zocial-base
|
@@ -1,19 +1,26 @@
|
|
1
1
|
// Font family mixin
|
2
2
|
=font-family($zocial-text-font)
|
3
3
|
@extend .ff-#{$zocial-text-font}
|
4
|
+
|
5
|
+
// Example:
|
6
|
+
//
|
7
|
+
// body > header
|
8
|
+
// +font-family(helvetica)
|
9
|
+
// Options: zocial, zocial-lite, helvetica, arial (alias to helvetica), lucida, lucida-grande (alias to lucida), times, georgia
|
4
10
|
|
5
|
-
//
|
11
|
+
// Zocial full
|
6
12
|
@if $zocial-icon-font == "zocial"
|
7
13
|
+font-face("Zocial", font-files("zocial/zocial-regular-webfont.woff", woff, "zocial/zocial-regular-webfont.ttf", truetype, "zocial/zocial-regular-webfont.svg", svg), "zocial/zocial-regular-webfont.eot")
|
8
14
|
.ff-zocial
|
9
15
|
font-family: "Zocial", sans-serif
|
10
16
|
|
17
|
+
// Zocial lite
|
11
18
|
@if $zocial-icon-font == "zocial-lite"
|
12
19
|
+font-face("Zocial-Lite", font-files("zocial/zocial-lite-regular-webfont.woff", woff, "zocial/zocial-lite-regular-webfont.ttf", truetype, "zocial/zocial-lite-regular-webfont.svg", svg), "zocial/zocial-lite-regular-webfont.eot")
|
13
20
|
.ff-zocial-lite
|
14
21
|
font-family: "Zocial-Lite", sans-serif
|
15
22
|
|
16
|
-
//
|
23
|
+
// Common font stack classes
|
17
24
|
@if $zocial-text-font == "helvetica"
|
18
25
|
.ff-helvetica
|
19
26
|
font-family: Clean, "Helvetica-Neue", Helvetica, Arial, sans-serif
|
@@ -32,8 +39,8 @@
|
|
32
39
|
|
33
40
|
@if $zocial-text-font == "times"
|
34
41
|
.ff-times
|
35
|
-
font-family:
|
42
|
+
font-family: Times, "Times New Roman", serif
|
36
43
|
|
37
44
|
@if $zocial-text-font == "georgia"
|
38
45
|
.ff-georgia
|
39
|
-
font-family:
|
46
|
+
font-family: Georgia, Times, "Times New Roman", serif
|
@@ -1,7 +1,7 @@
|
|
1
|
-
|
2
|
-
|
3
|
-
|
4
|
-
//
|
1
|
+
// Include all of zocial
|
2
|
+
=zocial
|
3
|
+
|
4
|
+
// Zocial, Sorted A-Z
|
5
5
|
+zocial-amazon
|
6
6
|
+zocial-android
|
7
7
|
+zocial-aol
|
@@ -15,11 +15,14 @@
|
|
15
15
|
+zocial-eventasaurus
|
16
16
|
+zocial-eventbrite
|
17
17
|
+zocial-evernote
|
18
|
+
+zocial-facebook
|
18
19
|
+zocial-flattr
|
19
20
|
+zocial-forrst
|
20
21
|
+zocial-foursquare
|
22
|
+
+zocial-github
|
21
23
|
+zocial-gmail
|
22
24
|
+zocial-google
|
25
|
+
+zocial-googleplus
|
23
26
|
+zocial-gowalla
|
24
27
|
+zocial-guest
|
25
28
|
+zocial-html5
|
@@ -34,12 +37,15 @@
|
|
34
37
|
+zocial-paypal
|
35
38
|
+zocial-plancast
|
36
39
|
+zocial-posterous
|
40
|
+
+zocial-rss
|
37
41
|
+zocial-scribd
|
38
42
|
+zocial-skype
|
43
|
+
+zocial-smashingmag
|
39
44
|
+zocial-songkick
|
40
45
|
+zocial-soundcloud
|
41
46
|
+zocial-spotify
|
42
47
|
+zocial-tumblr
|
48
|
+
+zocial-twitter
|
43
49
|
+zocial-vimeo
|
44
50
|
+zocial-wikipedia
|
45
51
|
+zocial-wordpress
|
@@ -47,7 +53,7 @@
|
|
47
53
|
+zocial-yelp
|
48
54
|
+zocial-youtube
|
49
55
|
|
50
|
-
//
|
56
|
+
// Zocial full (paid), Sorted A-Z
|
51
57
|
=zocial-amazon
|
52
58
|
.zocial.amazon
|
53
59
|
background: #FFAD1D
|
@@ -138,6 +144,12 @@
|
|
138
144
|
& > span:before
|
139
145
|
content: "E"
|
140
146
|
|
147
|
+
=zocial-facebook
|
148
|
+
.zocial.facebook
|
149
|
+
background: #4863AE
|
150
|
+
&> span:before
|
151
|
+
content: "f"
|
152
|
+
|
141
153
|
=zocial-flattr
|
142
154
|
.zocial.flattr
|
143
155
|
background: #8ABA42
|
@@ -157,6 +169,18 @@
|
|
157
169
|
& > span:before
|
158
170
|
content: "4"
|
159
171
|
|
172
|
+
=zocial-github
|
173
|
+
.zocial.github
|
174
|
+
@extend .adjustment-1
|
175
|
+
color: #050505 !important
|
176
|
+
background: #FBFBFB
|
177
|
+
&:hover > span, &:focus > span
|
178
|
+
@extend .adjustment-2
|
179
|
+
&:active > span
|
180
|
+
@extend .adjustment-3
|
181
|
+
& > span:before
|
182
|
+
content: "g"
|
183
|
+
|
160
184
|
=zocial-gmail
|
161
185
|
.zocial.gmail
|
162
186
|
@extend .adjustment-1
|
@@ -176,6 +200,26 @@
|
|
176
200
|
& > span:before
|
177
201
|
content: "G"
|
178
202
|
|
203
|
+
=zocial-googleplus
|
204
|
+
.zocial.googleplus
|
205
|
+
background: #282626
|
206
|
+
&:before
|
207
|
+
content: ""
|
208
|
+
display: block
|
209
|
+
height: 0.2em
|
210
|
+
margin-bottom: -0.1em
|
211
|
+
width: 100%
|
212
|
+
position: relative
|
213
|
+
left: 0em
|
214
|
+
top: 0
|
215
|
+
+background(linear-gradient(left, #d20e1b, #d20e1b 25%, #3156e6 25%, #3156e6 50%, #2aa134 50%, #2aa134 75%, #ecb01b 75%, #ecb01b))
|
216
|
+
+border-radius(0.2em 0.2em 0 0)
|
217
|
+
border-bottom: 1px solid rgba(#000,.8)
|
218
|
+
+box-shadow(inset 0 0.063em 0 rgba(#fff,.4), inset 0 0 0.063em rgba(#fff,.6), 0 0.063em 0 rgba(#fff,.3))
|
219
|
+
z-index: 0
|
220
|
+
& > span:before
|
221
|
+
content: "+"
|
222
|
+
|
179
223
|
=zocial-gowalla
|
180
224
|
.zocial.gowalla
|
181
225
|
background: #FF720A
|
@@ -287,6 +331,12 @@
|
|
287
331
|
& > span:before
|
288
332
|
content: "~"
|
289
333
|
|
334
|
+
=zocial-rss
|
335
|
+
.zocial.rss
|
336
|
+
background: #FF7F25
|
337
|
+
& > span:before
|
338
|
+
content: "R"
|
339
|
+
|
290
340
|
=zocial-scribd
|
291
341
|
.zocial.scribd
|
292
342
|
background: #231C1A
|
@@ -300,6 +350,12 @@
|
|
300
350
|
& > span:before
|
301
351
|
content: "S"
|
302
352
|
|
353
|
+
=zocial-smashingmag
|
354
|
+
.zocial.smashingmag
|
355
|
+
background: #FF4F27
|
356
|
+
& > span:before
|
357
|
+
content: "*"
|
358
|
+
|
303
359
|
=zocial-songkick
|
304
360
|
.zocial.songkick
|
305
361
|
background: #FF0050
|
@@ -324,6 +380,18 @@
|
|
324
380
|
& > span:before
|
325
381
|
content: "t"
|
326
382
|
|
383
|
+
=zocial-twitter
|
384
|
+
.zocial.twitter
|
385
|
+
@extend .adjustment-1
|
386
|
+
background: #E9F9FF
|
387
|
+
color: #3C6B9C !important
|
388
|
+
&:focus > span
|
389
|
+
@extend .adjustment-2
|
390
|
+
&:active > span
|
391
|
+
@extend .adjustment-3
|
392
|
+
& > span:before
|
393
|
+
content: "T"
|
394
|
+
|
327
395
|
=zocial-vimeo
|
328
396
|
.zocial.vimeo
|
329
397
|
background: #00A2CD
|
data/templates/css/manifest.rb
CHANGED
@@ -1 +1 @@
|
|
1
|
-
@font-face{font-family:"Zocial-Lite";src:url('/fonts/zocial/zocial-lite-regular-webfont.eot');src:url('/fonts/zocial/zocial-lite-regular-webfont.eot?iefix') format('eot'),url('/fonts/zocial/zocial-lite-regular-webfont.woff') format('woff'), url('/fonts/zocial/zocial-lite-regular-webfont.ttf') format('truetype'), url('/fonts/zocial/zocial-lite-regular-webfont.svg') format('svg')}.ff-zocial-lite,.zocial > span:before{font-family:"Zocial-Lite",sans-serif}.ff-helvetica,.ff-arial,.zocial{font-family:Clean,"Helvetica-Neue",Helvetica,Arial,sans-serif}.zocial,.zocial > span{-moz-border-radius:0.2em;-webkit-border-radius:0.2em;-o-border-radius:0.2em;-ms-border-radius:0.2em;-khtml-border-radius:0.2em;border-radius:0.2em;position:relative}.zocial{-moz-box-shadow:inset 0 0.063em 0 rgba(255,255,255,0.4),inset 0 0 0.063em rgba(255,255,255,0.6),0 0.063em 0 rgba(255,255,255,0.3);-webkit-box-shadow:inset 0 0.063em 0 rgba(255,255,255,0.4),inset 0 0 0.063em rgba(255,255,255,0.6),0 0.063em 0 rgba(255,255,255,0.3);-o-box-shadow:inset 0 0.063em 0 rgba(255,255,255,0.4),inset 0 0 0.063em rgba(255,255,255,0.6),0 0.063em 0 rgba(255,255,255,0.3);box-shadow:inset 0 0.063em 0 rgba(255,255,255,0.4),inset 0 0 0.063em rgba(255,255,255,0.6),0 0.063em 0 rgba(255,255,255,0.3);text-shadow:0 1px 0 rgba(0,0,0,0.5);position:relative;border:1px solid rgba(0,0,0,0.2);border-bottom-color:rgba(0,0,0,0.4);color:#fff !important;cursor:pointer;display:inline-block;font-size:1.8em;outline:none;padding:0;text-decoration:none !important}.zocial button::-moz-focus-inner{border:0;padding:0}.zocial.icon{width:1.85em;overflow:hidden}.zocial > span{position:relative;display:inline-block;font-size:80%;font-weight:bold;line-height:2em;padding-right:0.825em;white-space:nowrap}.zocial > span:before{-moz-box-shadow:0.075em 0 0 rgba(255,255,255,0.25);-webkit-box-shadow:0.075em 0 0 rgba(255,255,255,0.25);-o-box-shadow:0.075em 0 0 rgba(255,255,255,0.25);box-shadow:0.075em 0 0 rgba(255,255,255,0.25);border-right:0.075em solid rgba(0,0,0,0.1);display:block;float:left;font-size:125%;font-style:normal;font-weight:normal;margin:0.068em 0.5em 0 0;text-align:center;width:1.75em}.zocial > span{background:-webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, rgba(255,255,255,0.1)), color-stop(49%, rgba(255,255,255,0.05)), color-stop(51%, rgba(0,0,0,0.05)), color-stop(100%, rgba(0,0,0,0.1)));background:-webkit-linear-gradient(top, rgba(255,255,255,0.1),rgba(255,255,255,0.05) 49%,rgba(0,0,0,0.05) 51%,rgba(0,0,0,0.1));background:-moz-linear-gradient(top, rgba(255,255,255,0.1),rgba(255,255,255,0.05) 49%,rgba(0,0,0,0.05) 51%,rgba(0,0,0,0.1));background:-o-linear-gradient(top, rgba(255,255,255,0.1),rgba(255,255,255,0.05) 49%,rgba(0,0,0,0.05) 51%,rgba(0,0,0,0.1));background:-ms-linear-gradient(top, rgba(255,255,255,0.1),rgba(255,255,255,0.05) 49%,rgba(0,0,0,0.05) 51%,rgba(0,0,0,0.1));background:linear-gradient(top, rgba(255,255,255,0.1),rgba(255,255,255,0.05) 49%,rgba(0,0,0,0.05) 51%,rgba(0,0,0,0.1))}.zocial:hover > span,.zocial:focus > span{background:-webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, rgba(255,255,255,0.15)), color-stop(49%, rgba(255,255,255,0.15)), color-stop(51%, rgba(0,0,0,0.1)), color-stop(100%, rgba(0,0,0,0.15)));background:-webkit-linear-gradient(top, rgba(255,255,255,0.15),rgba(255,255,255,0.15) 49%,rgba(0,0,0,0.1) 51%,rgba(0,0,0,0.15));background:-moz-linear-gradient(top, rgba(255,255,255,0.15),rgba(255,255,255,0.15) 49%,rgba(0,0,0,0.1) 51%,rgba(0,0,0,0.15));background:-o-linear-gradient(top, rgba(255,255,255,0.15),rgba(255,255,255,0.15) 49%,rgba(0,0,0,0.1) 51%,rgba(0,0,0,0.15));background:-ms-linear-gradient(top, rgba(255,255,255,0.15),rgba(255,255,255,0.15) 49%,rgba(0,0,0,0.1) 51%,rgba(0,0,0,0.15));background:linear-gradient(top, rgba(255,255,255,0.15),rgba(255,255,255,0.15) 49%,rgba(0,0,0,0.1) 51%,rgba(0,0,0,0.15))}.zocial:active > span{background:-webkit-gradient(linear, 50% 100%, 50% 0%, color-stop(0%, rgba(255,255,255,0.1)), color-stop(30%, rgba(255,255,255,0)), color-stop(50%, rgba(0,0,0,0)), color-stop(100%, rgba(0,0,0,0.1)));background:-webkit-linear-gradient(bottom, rgba(255,255,255,0.1),rgba(255,255,255,0) 30%,rgba(0,0,0,0) 50%,rgba(0,0,0,0.1));background:-moz-linear-gradient(bottom, rgba(255,255,255,0.1),rgba(255,255,255,0) 30%,rgba(0,0,0,0) 50%,rgba(0,0,0,0.1));background:-o-linear-gradient(bottom, rgba(255,255,255,0.1),rgba(255,255,255,0) 30%,rgba(0,0,0,0) 50%,rgba(0,0,0,0.1));background:-ms-linear-gradient(bottom, rgba(255,255,255,0.1),rgba(255,255,255,0) 30%,rgba(0,0,0,0) 50%,rgba(0,0,0,0.1));background:linear-gradient(bottom, rgba(255,255,255,0.1),rgba(255,255,255,0) 30%,rgba(0,0,0,0) 50%,rgba(0,0,0,0.1))}.zocial.twitter,.zocial.github{text-shadow:0 1px 0 rgba(255,255,255,0.8);-moz-box-shadow:inset 0 0.063em 0 rgba(255,255,255,0.4),inset 0 0 0.063em rgba(255,255,255,0.6),0 0.063em 0 rgba(255,255,255,0.3);-webkit-box-shadow:inset 0 0.063em 0 rgba(255,255,255,0.4),inset 0 0 0.063em rgba(255,255,255,0.6),0 0.063em 0 rgba(255,255,255,0.3);-o-box-shadow:inset 0 0.063em 0 rgba(255,255,255,0.4),inset 0 0 0.063em rgba(255,255,255,0.6),0 0.063em 0 rgba(255,255,255,0.3);box-shadow:inset 0 0.063em 0 rgba(255,255,255,0.4),inset 0 0 0.063em rgba(255,255,255,0.6),0 0.063em 0 rgba(255,255,255,0.3)}.zocial.github:hover > span,.zocial.twitter:focus > span,.zocial.github:focus > span{background:-webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, rgba(255,255,255,0.5)), color-stop(49%, rgba(255,255,255,0.2)), color-stop(51%, rgba(0,0,0,0.05)), color-stop(100%, rgba(0,0,0,0.15)));background:-webkit-linear-gradient(top, rgba(255,255,255,0.5),rgba(255,255,255,0.2) 49%,rgba(0,0,0,0.05) 51%,rgba(0,0,0,0.15));background:-moz-linear-gradient(top, rgba(255,255,255,0.5),rgba(255,255,255,0.2) 49%,rgba(0,0,0,0.05) 51%,rgba(0,0,0,0.15));background:-o-linear-gradient(top, rgba(255,255,255,0.5),rgba(255,255,255,0.2) 49%,rgba(0,0,0,0.05) 51%,rgba(0,0,0,0.15));background:-ms-linear-gradient(top, rgba(255,255,255,0.5),rgba(255,255,255,0.2) 49%,rgba(0,0,0,0.05) 51%,rgba(0,0,0,0.15));background:linear-gradient(top, rgba(255,255,255,0.5),rgba(255,255,255,0.2) 49%,rgba(0,0,0,0.05) 51%,rgba(0,0,0,0.15))}.zocial.twitter:active > span,.zocial.github:active > span{background:-webkit-gradient(linear, 50% 100%, 50% 0%, color-stop(0%, rgba(255,255,255,0)), color-stop(30%, rgba(255,255,255,0)), color-stop(50%, rgba(0,0,0,0)), color-stop(100%, rgba(0,0,0,0.1)));background:-webkit-linear-gradient(bottom, rgba(255,255,255,0),rgba(255,255,255,0) 30%,rgba(0,0,0,0) 50%,rgba(0,0,0,0.1));background:-moz-linear-gradient(bottom, rgba(255,255,255,0),rgba(255,255,255,0) 30%,rgba(0,0,0,0) 50%,rgba(0,0,0,0.1));background:-o-linear-gradient(bottom, rgba(255,255,255,0),rgba(255,255,255,0) 30%,rgba(0,0,0,0) 50%,rgba(0,0,0,0.1));background:-ms-linear-gradient(bottom, rgba(255,255,255,0),rgba(255,255,255,0) 30%,rgba(0,0,0,0) 50%,rgba(0,0,0,0.1));background:linear-gradient(bottom, rgba(255,255,255,0),rgba(255,255,255,0) 30%,rgba(0,0,0,0) 50%,rgba(0,0,0,0.1))}.zocial > span:before{content:"\00a0"}.zocial.white{background:#fff;color:#000 !important}.zocial.white > span:before{content:"\00a0";color:#000}.zocial.black{background:#000;color:#fff !important}.zocial.black > span:before{content:"\00a0";color:#fff}.zocial.red{background:red;color:#fff !important}.zocial.red > span:before{content:"\00a0";color:#fff}.zocial.green{background:green;color:#fff !important}.zocial.green > span:before{content:"\00a0";color:#fff}.zocial.blue{background:blue;color:#fff !important}.zocial.blue > span:before{content:"\00a0";color:#fff}.zocial.facebook > span:before{content:"f"}.zocial.github > span:before{content:"g"}.zocial.googleplus > span:before{content:"+"}.zocial.rss > span:before{content:"R"}.zocial.smashingmag > span:before{content:"*"}.zocial.twitter > span:before{content:"T"}.zocial.github{color:#050505 !important;background:#fbfbfb}.zocial.googleplus{background:#282626}.zocial.googleplus:before{content:"";display:block;height:0.2em;margin-bottom:-0.1em;width:100%;position:relative;left:0em;top:0;background:-webkit-gradient(linear, 0% 50%, 100% 50%, color-stop(0%, #d20e1b), color-stop(25%, #d20e1b), color-stop(25%, #3156e6), color-stop(50%, #3156e6), color-stop(50%, #2aa134), color-stop(75%, #2aa134), color-stop(75%, #ecb01b), color-stop(100%, #ecb01b));background:-webkit-linear-gradient(left, #d20e1b,#d20e1b 25%,#3156e6 25%,#3156e6 50%,#2aa134 50%,#2aa134 75%,#ecb01b 75%,#ecb01b);background:-moz-linear-gradient(left, #d20e1b,#d20e1b 25%,#3156e6 25%,#3156e6 50%,#2aa134 50%,#2aa134 75%,#ecb01b 75%,#ecb01b);background:-o-linear-gradient(left, #d20e1b,#d20e1b 25%,#3156e6 25%,#3156e6 50%,#2aa134 50%,#2aa134 75%,#ecb01b 75%,#ecb01b);background:-ms-linear-gradient(left, #d20e1b,#d20e1b 25%,#3156e6 25%,#3156e6 50%,#2aa134 50%,#2aa134 75%,#ecb01b 75%,#ecb01b);background:linear-gradient(left, #d20e1b,#d20e1b 25%,#3156e6 25%,#3156e6 50%,#2aa134 50%,#2aa134 75%,#ecb01b 75%,#ecb01b);-moz-border-radius:0.2em 0.2em 0 0;-webkit-border-radius:0.2em 0.2em 0 0;-o-border-radius:0.2em 0.2em 0 0;-ms-border-radius:0.2em 0.2em 0 0;-khtml-border-radius:0.2em 0.2em 0 0;border-radius:0.2em 0.2em 0 0;border-bottom:1px solid rgba(0,0,0,0.8);-moz-box-shadow:inset 0 0.063em 0 rgba(255,255,255,0.4),inset 0 0 0.063em rgba(255,255,255,0.6),0 0.063em 0 rgba(255,255,255,0.3);-webkit-box-shadow:inset 0 0.063em 0 rgba(255,255,255,0.4),inset 0 0 0.063em rgba(255,255,255,0.6),0 0.063em 0 rgba(255,255,255,0.3);-o-box-shadow:inset 0 0.063em 0 rgba(255,255,255,0.4),inset 0 0 0.063em rgba(255,255,255,0.6),0 0.063em 0 rgba(255,255,255,0.3);box-shadow:inset 0 0.063em 0 rgba(255,255,255,0.4),inset 0 0 0.063em rgba(255,255,255,0.6),0 0.063em 0 rgba(255,255,255,0.3);z-index:0}.zocial.facebook{background:#4863ae}.zocial.rss{background:#ff7f25}.zocial.smashingmag{background:#ff4f27}.zocial.twitter{background:#e9f9ff;color:#3c6b9c !important}
|
1
|
+
@font-face{font-family:"Zocial";src:url('/fonts/zocial/zocial-regular-webfont.eot');src:url('/fonts/zocial/zocial-regular-webfont.eot?iefix') format('eot'),url('/fonts/zocial/zocial-regular-webfont.woff') format('woff'), url('/fonts/zocial/zocial-regular-webfont.ttf') format('truetype'), url('/fonts/zocial/zocial-regular-webfont.svg') format('svg')}.ff-zocial,.zocial > span:before{font-family:"Zocial",sans-serif}.ff-helvetica,.ff-arial,.zocial{font-family:Clean,"Helvetica-Neue",Helvetica,Arial,sans-serif}.zocial,.zocial > span{-moz-border-radius:0.2em;-webkit-border-radius:0.2em;-o-border-radius:0.2em;-ms-border-radius:0.2em;-khtml-border-radius:0.2em;border-radius:0.2em;position:relative}.zocial{-moz-box-shadow:inset 0 0.063em 0 rgba(255,255,255,0.4),inset 0 0 0.063em rgba(255,255,255,0.6),0 0.063em 0 rgba(255,255,255,0.3);-webkit-box-shadow:inset 0 0.063em 0 rgba(255,255,255,0.4),inset 0 0 0.063em rgba(255,255,255,0.6),0 0.063em 0 rgba(255,255,255,0.3);-o-box-shadow:inset 0 0.063em 0 rgba(255,255,255,0.4),inset 0 0 0.063em rgba(255,255,255,0.6),0 0.063em 0 rgba(255,255,255,0.3);box-shadow:inset 0 0.063em 0 rgba(255,255,255,0.4),inset 0 0 0.063em rgba(255,255,255,0.6),0 0.063em 0 rgba(255,255,255,0.3);text-shadow:0 1px 0 rgba(0,0,0,0.5);position:relative;border:1px solid rgba(0,0,0,0.2);border-bottom-color:rgba(0,0,0,0.4);color:#fff !important;cursor:pointer;display:inline-block;font-size:1.8em;outline:none;padding:0;text-decoration:none !important}.zocial button::-moz-focus-inner{border:0;padding:0}.zocial.icon{width:1.85em;overflow:hidden}.zocial > span{position:relative;display:inline-block;font-size:80%;font-weight:bold;line-height:2em;padding-right:0.825em;white-space:nowrap}.zocial > span:before{-moz-box-shadow:0.075em 0 0 rgba(255,255,255,0.25);-webkit-box-shadow:0.075em 0 0 rgba(255,255,255,0.25);-o-box-shadow:0.075em 0 0 rgba(255,255,255,0.25);box-shadow:0.075em 0 0 rgba(255,255,255,0.25);border-right:0.075em solid rgba(0,0,0,0.1);display:block;float:left;font-size:125%;font-style:normal;font-weight:normal;margin:0.068em 0.5em 0 0;text-align:center;width:1.75em}.zocial > span{background:-webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, rgba(255,255,255,0.1)), color-stop(49%, rgba(255,255,255,0.05)), color-stop(51%, rgba(0,0,0,0.05)), color-stop(100%, rgba(0,0,0,0.1)));background:-webkit-linear-gradient(top, rgba(255,255,255,0.1),rgba(255,255,255,0.05) 49%,rgba(0,0,0,0.05) 51%,rgba(0,0,0,0.1));background:-moz-linear-gradient(top, rgba(255,255,255,0.1),rgba(255,255,255,0.05) 49%,rgba(0,0,0,0.05) 51%,rgba(0,0,0,0.1));background:-o-linear-gradient(top, rgba(255,255,255,0.1),rgba(255,255,255,0.05) 49%,rgba(0,0,0,0.05) 51%,rgba(0,0,0,0.1));background:-ms-linear-gradient(top, rgba(255,255,255,0.1),rgba(255,255,255,0.05) 49%,rgba(0,0,0,0.05) 51%,rgba(0,0,0,0.1));background:linear-gradient(top, rgba(255,255,255,0.1),rgba(255,255,255,0.05) 49%,rgba(0,0,0,0.05) 51%,rgba(0,0,0,0.1))}.zocial:hover > span,.zocial:focus > span{background:-webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, rgba(255,255,255,0.15)), color-stop(49%, rgba(255,255,255,0.15)), color-stop(51%, rgba(0,0,0,0.1)), color-stop(100%, rgba(0,0,0,0.15)));background:-webkit-linear-gradient(top, rgba(255,255,255,0.15),rgba(255,255,255,0.15) 49%,rgba(0,0,0,0.1) 51%,rgba(0,0,0,0.15));background:-moz-linear-gradient(top, rgba(255,255,255,0.15),rgba(255,255,255,0.15) 49%,rgba(0,0,0,0.1) 51%,rgba(0,0,0,0.15));background:-o-linear-gradient(top, rgba(255,255,255,0.15),rgba(255,255,255,0.15) 49%,rgba(0,0,0,0.1) 51%,rgba(0,0,0,0.15));background:-ms-linear-gradient(top, rgba(255,255,255,0.15),rgba(255,255,255,0.15) 49%,rgba(0,0,0,0.1) 51%,rgba(0,0,0,0.15));background:linear-gradient(top, rgba(255,255,255,0.15),rgba(255,255,255,0.15) 49%,rgba(0,0,0,0.1) 51%,rgba(0,0,0,0.15))}.zocial:active > span{background:-webkit-gradient(linear, 50% 100%, 50% 0%, color-stop(0%, rgba(255,255,255,0.1)), color-stop(30%, rgba(255,255,255,0)), color-stop(50%, rgba(0,0,0,0)), color-stop(100%, rgba(0,0,0,0.1)));background:-webkit-linear-gradient(bottom, rgba(255,255,255,0.1),rgba(255,255,255,0) 30%,rgba(0,0,0,0) 50%,rgba(0,0,0,0.1));background:-moz-linear-gradient(bottom, rgba(255,255,255,0.1),rgba(255,255,255,0) 30%,rgba(0,0,0,0) 50%,rgba(0,0,0,0.1));background:-o-linear-gradient(bottom, rgba(255,255,255,0.1),rgba(255,255,255,0) 30%,rgba(0,0,0,0) 50%,rgba(0,0,0,0.1));background:-ms-linear-gradient(bottom, rgba(255,255,255,0.1),rgba(255,255,255,0) 30%,rgba(0,0,0,0) 50%,rgba(0,0,0,0.1));background:linear-gradient(bottom, rgba(255,255,255,0.1),rgba(255,255,255,0) 30%,rgba(0,0,0,0) 50%,rgba(0,0,0,0.1))}.zocial > span:before{content:"\0020"}.adjustment-1,.zocial.cloudapp,.zocial.dropbox,.zocial.github,.zocial.gmail,.zocial.instapaper,.zocial.openid,.zocial.plancast,.zocial.posterous,.zocial.twitter,.zocial.wikipedia{-moz-box-shadow:inset 0 0.063em 0 rgba(255,255,255,0.4),inset 0 0 0.063em rgba(255,255,255,0.6),0 0.063em 0 rgba(255,255,255,0.3);-webkit-box-shadow:inset 0 0.063em 0 rgba(255,255,255,0.4),inset 0 0 0.063em rgba(255,255,255,0.6),0 0.063em 0 rgba(255,255,255,0.3);-o-box-shadow:inset 0 0.063em 0 rgba(255,255,255,0.4),inset 0 0 0.063em rgba(255,255,255,0.6),0 0.063em 0 rgba(255,255,255,0.3);box-shadow:inset 0 0.063em 0 rgba(255,255,255,0.4),inset 0 0 0.063em rgba(255,255,255,0.6),0 0.063em 0 rgba(255,255,255,0.3);text-shadow:0 1px 0 rgba(255,255,255,0.8)}.adjustment-2,.zocial.dropbox:hover > span,.zocial.dropbox:focus > span,.zocial.github:hover > span,.zocial.github:focus > span,.zocial.gmail:hover > span,.zocial.gmail:focus > span,.zocial.instapaper:hover > span,.zocial.instapaper:focus > span,.zocial.openid:hover > span,.zocial.openid:focus > span,.zocial.plancast:hover > span,.zocial.plancast:focus > span,.zocial.posterous:hover > span,.zocial.posterous:focus > span,.zocial.twitter:focus > span,.zocial.wikipedia:hover > span,.zocial.wikipedia:focus > span{background:-webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, rgba(255,255,255,0.5)), color-stop(49%, rgba(255,255,255,0.2)), color-stop(51%, rgba(0,0,0,0.05)), color-stop(100%, rgba(0,0,0,0.15)));background:-webkit-linear-gradient(top, rgba(255,255,255,0.5),rgba(255,255,255,0.2) 49%,rgba(0,0,0,0.05) 51%,rgba(0,0,0,0.15));background:-moz-linear-gradient(top, rgba(255,255,255,0.5),rgba(255,255,255,0.2) 49%,rgba(0,0,0,0.05) 51%,rgba(0,0,0,0.15));background:-o-linear-gradient(top, rgba(255,255,255,0.5),rgba(255,255,255,0.2) 49%,rgba(0,0,0,0.05) 51%,rgba(0,0,0,0.15));background:-ms-linear-gradient(top, rgba(255,255,255,0.5),rgba(255,255,255,0.2) 49%,rgba(0,0,0,0.05) 51%,rgba(0,0,0,0.15));background:linear-gradient(top, rgba(255,255,255,0.5),rgba(255,255,255,0.2) 49%,rgba(0,0,0,0.05) 51%,rgba(0,0,0,0.15))}.adjustment-3,.zocial.dropbox:active > span,.zocial.github:active > span,.zocial.gmail:active > span,.zocial.instapaper:active > span,.zocial.openid:active > span,.zocial.plancast:active > span,.zocial.posterous:active > span,.zocial.twitter:active > span,.zocial.wikipedia:active > span{background:-webkit-gradient(linear, 50% 100%, 50% 0%, color-stop(0%, rgba(255,255,255,0)), color-stop(30%, rgba(255,255,255,0)), color-stop(50%, rgba(0,0,0,0)), color-stop(100%, rgba(0,0,0,0.1)));background:-webkit-linear-gradient(bottom, rgba(255,255,255,0),rgba(255,255,255,0) 30%,rgba(0,0,0,0) 50%,rgba(0,0,0,0.1));background:-moz-linear-gradient(bottom, rgba(255,255,255,0),rgba(255,255,255,0) 30%,rgba(0,0,0,0) 50%,rgba(0,0,0,0.1));background:-o-linear-gradient(bottom, rgba(255,255,255,0),rgba(255,255,255,0) 30%,rgba(0,0,0,0) 50%,rgba(0,0,0,0.1));background:-ms-linear-gradient(bottom, rgba(255,255,255,0),rgba(255,255,255,0) 30%,rgba(0,0,0,0) 50%,rgba(0,0,0,0.1));background:linear-gradient(bottom, rgba(255,255,255,0),rgba(255,255,255,0) 30%,rgba(0,0,0,0) 50%,rgba(0,0,0,0.1))}.zocial.amazon{background:#ffad1d;color:#030037 !important;text-shadow:0 1px 0 rgba(255,255,255,0.5)}.zocial.amazon > span:before{content:"a"}.zocial.android{background:#a4c639}.zocial.android > span:before{content:"&"}.zocial.aol{background:red}.zocial.aol > span:before{content:'"'}.zocial.appstore{background:#007dcb !important}.zocial.appstore > span:before{content:"^"}.zocial.chrome{background:#006cd4}.zocial.chrome > span:before{content:"["}.zocial.cloudapp{background:#fff;color:#312c2a !important}.zocial.cloudapp > span:before{content:"c"}.zocial.creativecommons{background:#000}.zocial.creativecommons > span:before{content:"C"}.zocial.disqus{background:#216892}.zocial.disqus > span:before{content:"Q"}.zocial.dribbble{background:#ea4c89}.zocial.dribbble > span:before{content:"D"}.zocial.dropbox{background:#f5f5f5;color:#312c2a !important}.zocial.dropbox > span:before{content:"d";color:#4ea4e3}.zocial.eventasaurus{background:#8ccc33}.zocial.eventasaurus > span:before{content:"v"}.zocial.eventbrite{background:#ff5616}.zocial.eventbrite > span:before{content:"|"}.zocial.evernote{background:#6bb130;color:#fff !important}.zocial.evernote > span:before{content:"E"}.zocial.facebook{background:#4863ae}.zocial.facebook > span:before{content:"f"}.zocial.flattr{background:#8aba42}.zocial.flattr > span:before{content:"%"}.zocial.forrst{background:#1e360d}.zocial.forrst > span:before{content:":";color:#50894f}.zocial.foursquare{background:#44a8e0}.zocial.foursquare > span:before{content:"4"}.zocial.github{color:#050505 !important;background:#fbfbfb}.zocial.github > span:before{content:"g"}.zocial.gmail{background:#efefef;color:#222 !important}.zocial.gmail > span:before{content:"m";color:red}.zocial.google{background:#4e6cf7}.zocial.google > span:before{content:"G"}.zocial.googleplus{background:#282626}.zocial.googleplus:before{content:"";display:block;height:0.2em;margin-bottom:-0.1em;width:100%;position:relative;left:0em;top:0;background:-webkit-gradient(linear, 0% 50%, 100% 50%, color-stop(0%, #d20e1b), color-stop(25%, #d20e1b), color-stop(25%, #3156e6), color-stop(50%, #3156e6), color-stop(50%, #2aa134), color-stop(75%, #2aa134), color-stop(75%, #ecb01b), color-stop(100%, #ecb01b));background:-webkit-linear-gradient(left, #d20e1b,#d20e1b 25%,#3156e6 25%,#3156e6 50%,#2aa134 50%,#2aa134 75%,#ecb01b 75%,#ecb01b);background:-moz-linear-gradient(left, #d20e1b,#d20e1b 25%,#3156e6 25%,#3156e6 50%,#2aa134 50%,#2aa134 75%,#ecb01b 75%,#ecb01b);background:-o-linear-gradient(left, #d20e1b,#d20e1b 25%,#3156e6 25%,#3156e6 50%,#2aa134 50%,#2aa134 75%,#ecb01b 75%,#ecb01b);background:-ms-linear-gradient(left, #d20e1b,#d20e1b 25%,#3156e6 25%,#3156e6 50%,#2aa134 50%,#2aa134 75%,#ecb01b 75%,#ecb01b);background:linear-gradient(left, #d20e1b,#d20e1b 25%,#3156e6 25%,#3156e6 50%,#2aa134 50%,#2aa134 75%,#ecb01b 75%,#ecb01b);-moz-border-radius:0.2em 0.2em 0 0;-webkit-border-radius:0.2em 0.2em 0 0;-o-border-radius:0.2em 0.2em 0 0;-ms-border-radius:0.2em 0.2em 0 0;-khtml-border-radius:0.2em 0.2em 0 0;border-radius:0.2em 0.2em 0 0;border-bottom:1px solid rgba(0,0,0,0.8);-moz-box-shadow:inset 0 0.063em 0 rgba(255,255,255,0.4),inset 0 0 0.063em rgba(255,255,255,0.6),0 0.063em 0 rgba(255,255,255,0.3);-webkit-box-shadow:inset 0 0.063em 0 rgba(255,255,255,0.4),inset 0 0 0.063em rgba(255,255,255,0.6),0 0.063em 0 rgba(255,255,255,0.3);-o-box-shadow:inset 0 0.063em 0 rgba(255,255,255,0.4),inset 0 0 0.063em rgba(255,255,255,0.6),0 0.063em 0 rgba(255,255,255,0.3);box-shadow:inset 0 0.063em 0 rgba(255,255,255,0.4),inset 0 0 0.063em rgba(255,255,255,0.6),0 0.063em 0 rgba(255,255,255,0.3);z-index:0}.zocial.googleplus > span:before{content:"+"}.zocial.gowalla{background:#ff720a}.zocial.gowalla > span:before{content:"@"}.zocial.guest{background:#1b4d6d}.zocial.guest > span:before{content:"?"}.zocial.html5{background:#ff3617}.zocial.html5 > span:before{content:"5"}.zocial.ie{background:#00a1d9}.zocial.ie > span:before{content:"6"}.zocial.instapaper{color:#222 !important;background:#eee}.zocial.instapaper > span:before{content:"I"}.zocial.intensedebate{background:#0099e1}.zocial.intensedebate > span:before{content:"{"}.zocial.itunes{background:#222}.zocial.itunes > span:before{content:"A"}.zocial.lastfm{background:#dc1a23}.zocial.lastfm > span:before{content:"l"}.zocial.linkedin{background:#0083a8}.zocial.linkedin > span:before{content:"L"}.zocial.meetup{background:#ff0026}.zocial.meetup > span:before{content:"M"}.zocial.openid{background:#f5f5f5;color:#333 !important}.zocial.openid > span:before{content:"o";color:#ff921d}.zocial.paypal{background:#ff921d;color:#032751 !important;text-shadow:0 1px 0 rgba(255,255,255,0.5)}.zocial.paypal > span:before{content:"$"}.zocial.plancast{background:#e7ebed;color:#333 !important}.zocial.plancast > span:before{content:"P"}.zocial.posterous{background:#ffd959;color:#bc7134 !important}.zocial.posterous > span:before{content:"~"}.zocial.rss{background:#ff7f25}.zocial.rss > span:before{content:"R"}.zocial.scribd{background:#231c1a}.zocial.scribd > span:before{content:"}";color:#00d5ea !important}.zocial.skype{background:#00a2ed}.zocial.skype > span:before{content:"S"}.zocial.smashingmag{background:#ff4f27}.zocial.smashingmag > span:before{content:"*"}.zocial.songkick{background:#ff0050}.zocial.songkick > span:before{content:"k"}.zocial.soundcloud{background:#ff4500}.zocial.soundcloud > span:before{content:"s"}.zocial.spotify{background:#60af00}.zocial.spotify > span:before{content:"=zocial-"}.zocial.tumblr{background:#374a61}.zocial.tumblr > span:before{content:"t"}.zocial.twitter{background:#e9f9ff;color:#3c6b9c !important}.zocial.twitter > span:before{content:"T"}.zocial.vimeo{background:#00a2cd}.zocial.vimeo > span:before{content:"V"}.zocial.wikipedia{background:#fff;color:#000 !important}.zocial.wikipedia > span:before{content:","}.zocial.wordpress{background:#464646}.zocial.wordpress > span:before{content:"w"}.zocial.yahoo{background:#a200c2}.zocial.yahoo > span:before{content:"Y"}.zocial.yelp{background:#e60010}.zocial.yelp > span:before{content:"y"}.zocial.youtube{background:red}.zocial.youtube > span:before{content:"U"}
|
data/templates/css/zocial.css
CHANGED
@@ -1,11 +1,11 @@
|
|
1
1
|
@font-face {
|
2
|
-
font-family: "Zocial
|
3
|
-
src: url('/fonts/zocial/zocial-
|
4
|
-
src: url('/fonts/zocial/zocial-
|
2
|
+
font-family: "Zocial";
|
3
|
+
src: url('/fonts/zocial/zocial-regular-webfont.eot');
|
4
|
+
src: url('/fonts/zocial/zocial-regular-webfont.eot?iefix') format('eot'), url('/fonts/zocial/zocial-regular-webfont.woff') format('woff'), url('/fonts/zocial/zocial-regular-webfont.ttf') format('truetype'), url('/fonts/zocial/zocial-regular-webfont.svg') format('svg');
|
5
5
|
}
|
6
6
|
|
7
|
-
.ff-zocial
|
8
|
-
font-family: "Zocial
|
7
|
+
.ff-zocial, .zocial > span:before {
|
8
|
+
font-family: "Zocial", sans-serif;
|
9
9
|
}
|
10
10
|
|
11
11
|
.ff-helvetica, .ff-arial, .zocial {
|
@@ -95,14 +95,19 @@
|
|
95
95
|
background: -ms-linear-gradient(bottom, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0) 30%, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.1));
|
96
96
|
background: linear-gradient(bottom, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0) 30%, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.1));
|
97
97
|
}
|
98
|
-
.zocial
|
99
|
-
|
98
|
+
.zocial > span:before {
|
99
|
+
content: "\0020";
|
100
|
+
}
|
101
|
+
|
102
|
+
.adjustment-1, .zocial.cloudapp, .zocial.dropbox, .zocial.github, .zocial.gmail, .zocial.instapaper, .zocial.openid, .zocial.plancast, .zocial.posterous, .zocial.twitter, .zocial.wikipedia {
|
100
103
|
-moz-box-shadow: inset 0 0.063em 0 rgba(255, 255, 255, 0.4), inset 0 0 0.063em rgba(255, 255, 255, 0.6), 0 0.063em 0 rgba(255, 255, 255, 0.3);
|
101
104
|
-webkit-box-shadow: inset 0 0.063em 0 rgba(255, 255, 255, 0.4), inset 0 0 0.063em rgba(255, 255, 255, 0.6), 0 0.063em 0 rgba(255, 255, 255, 0.3);
|
102
105
|
-o-box-shadow: inset 0 0.063em 0 rgba(255, 255, 255, 0.4), inset 0 0 0.063em rgba(255, 255, 255, 0.6), 0 0.063em 0 rgba(255, 255, 255, 0.3);
|
103
106
|
box-shadow: inset 0 0.063em 0 rgba(255, 255, 255, 0.4), inset 0 0 0.063em rgba(255, 255, 255, 0.6), 0 0.063em 0 rgba(255, 255, 255, 0.3);
|
107
|
+
text-shadow: 0 1px 0 rgba(255, 255, 255, 0.8);
|
104
108
|
}
|
105
|
-
|
109
|
+
|
110
|
+
.adjustment-2, .zocial.dropbox:hover > span, .zocial.dropbox:focus > span, .zocial.github:hover > span, .zocial.github:focus > span, .zocial.gmail:hover > span, .zocial.gmail:focus > span, .zocial.instapaper:hover > span, .zocial.instapaper:focus > span, .zocial.openid:hover > span, .zocial.openid:focus > span, .zocial.plancast:hover > span, .zocial.plancast:focus > span, .zocial.posterous:hover > span, .zocial.posterous:focus > span, .zocial.twitter:focus > span, .zocial.wikipedia:hover > span, .zocial.wikipedia:focus > span {
|
106
111
|
background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, rgba(255, 255, 255, 0.5)), color-stop(49%, rgba(255, 255, 255, 0.2)), color-stop(51%, rgba(0, 0, 0, 0.05)), color-stop(100%, rgba(0, 0, 0, 0.15)));
|
107
112
|
background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0.2) 49%, rgba(0, 0, 0, 0.05) 51%, rgba(0, 0, 0, 0.15));
|
108
113
|
background: -moz-linear-gradient(top, rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0.2) 49%, rgba(0, 0, 0, 0.05) 51%, rgba(0, 0, 0, 0.15));
|
@@ -110,7 +115,8 @@
|
|
110
115
|
background: -ms-linear-gradient(top, rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0.2) 49%, rgba(0, 0, 0, 0.05) 51%, rgba(0, 0, 0, 0.15));
|
111
116
|
background: linear-gradient(top, rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0.2) 49%, rgba(0, 0, 0, 0.05) 51%, rgba(0, 0, 0, 0.15));
|
112
117
|
}
|
113
|
-
|
118
|
+
|
119
|
+
.adjustment-3, .zocial.dropbox:active > span, .zocial.github:active > span, .zocial.gmail:active > span, .zocial.instapaper:active > span, .zocial.openid:active > span, .zocial.plancast:active > span, .zocial.posterous:active > span, .zocial.twitter:active > span, .zocial.wikipedia:active > span {
|
114
120
|
background: -webkit-gradient(linear, 50% 100%, 50% 0%, color-stop(0%, rgba(255, 255, 255, 0)), color-stop(30%, rgba(255, 255, 255, 0)), color-stop(50%, rgba(0, 0, 0, 0)), color-stop(100%, rgba(0, 0, 0, 0.1)));
|
115
121
|
background: -webkit-linear-gradient(bottom, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0) 30%, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.1));
|
116
122
|
background: -moz-linear-gradient(bottom, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0) 30%, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.1));
|
@@ -118,71 +124,157 @@
|
|
118
124
|
background: -ms-linear-gradient(bottom, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0) 30%, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.1));
|
119
125
|
background: linear-gradient(bottom, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0) 30%, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.1));
|
120
126
|
}
|
121
|
-
|
122
|
-
|
127
|
+
|
128
|
+
.zocial.amazon {
|
129
|
+
background: #ffad1d;
|
130
|
+
color: #030037 !important;
|
131
|
+
text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
|
132
|
+
}
|
133
|
+
.zocial.amazon > span:before {
|
134
|
+
content: "a";
|
135
|
+
}
|
136
|
+
|
137
|
+
.zocial.android {
|
138
|
+
background: #a4c639;
|
139
|
+
}
|
140
|
+
.zocial.android > span:before {
|
141
|
+
content: "&";
|
142
|
+
}
|
143
|
+
|
144
|
+
.zocial.aol {
|
145
|
+
background: red;
|
146
|
+
}
|
147
|
+
.zocial.aol > span:before {
|
148
|
+
content: '"';
|
149
|
+
}
|
150
|
+
|
151
|
+
.zocial.appstore {
|
152
|
+
background: #007dcb !important;
|
153
|
+
}
|
154
|
+
.zocial.appstore > span:before {
|
155
|
+
content: "^";
|
156
|
+
}
|
157
|
+
|
158
|
+
.zocial.chrome {
|
159
|
+
background: #006cd4;
|
160
|
+
}
|
161
|
+
.zocial.chrome > span:before {
|
162
|
+
content: "[";
|
123
163
|
}
|
124
|
-
|
164
|
+
|
165
|
+
.zocial.cloudapp {
|
125
166
|
background: white;
|
126
|
-
color:
|
167
|
+
color: #312c2a !important;
|
127
168
|
}
|
128
|
-
.zocial.
|
129
|
-
content: "
|
130
|
-
color: black;
|
169
|
+
.zocial.cloudapp > span:before {
|
170
|
+
content: "c";
|
131
171
|
}
|
132
|
-
|
172
|
+
|
173
|
+
.zocial.creativecommons {
|
133
174
|
background: black;
|
134
|
-
color: white !important;
|
135
175
|
}
|
136
|
-
.zocial.
|
137
|
-
content: "
|
138
|
-
color: white;
|
176
|
+
.zocial.creativecommons > span:before {
|
177
|
+
content: "C";
|
139
178
|
}
|
140
|
-
|
141
|
-
|
142
|
-
|
179
|
+
|
180
|
+
.zocial.disqus {
|
181
|
+
background: #216892;
|
143
182
|
}
|
144
|
-
.zocial.
|
145
|
-
content: "
|
146
|
-
color: white;
|
183
|
+
.zocial.disqus > span:before {
|
184
|
+
content: "Q";
|
147
185
|
}
|
148
|
-
|
149
|
-
|
150
|
-
|
186
|
+
|
187
|
+
.zocial.dribbble {
|
188
|
+
background: #ea4c89;
|
151
189
|
}
|
152
|
-
.zocial.
|
153
|
-
content: "
|
154
|
-
color: white;
|
190
|
+
.zocial.dribbble > span:before {
|
191
|
+
content: "D";
|
155
192
|
}
|
156
|
-
|
157
|
-
|
193
|
+
|
194
|
+
.zocial.dropbox {
|
195
|
+
background: #f5f5f5;
|
196
|
+
color: #312c2a !important;
|
197
|
+
}
|
198
|
+
.zocial.dropbox > span:before {
|
199
|
+
content: "d";
|
200
|
+
color: #4ea4e3;
|
201
|
+
}
|
202
|
+
|
203
|
+
.zocial.eventasaurus {
|
204
|
+
background: #8ccc33;
|
205
|
+
}
|
206
|
+
.zocial.eventasaurus > span:before {
|
207
|
+
content: "v";
|
208
|
+
}
|
209
|
+
|
210
|
+
.zocial.eventbrite {
|
211
|
+
background: #ff5616;
|
212
|
+
}
|
213
|
+
.zocial.eventbrite > span:before {
|
214
|
+
content: "|";
|
215
|
+
}
|
216
|
+
|
217
|
+
.zocial.evernote {
|
218
|
+
background: #6bb130;
|
158
219
|
color: white !important;
|
159
220
|
}
|
160
|
-
.zocial.
|
161
|
-
content: "
|
162
|
-
|
221
|
+
.zocial.evernote > span:before {
|
222
|
+
content: "E";
|
223
|
+
}
|
224
|
+
|
225
|
+
.zocial.facebook {
|
226
|
+
background: #4863ae;
|
163
227
|
}
|
164
228
|
.zocial.facebook > span:before {
|
165
229
|
content: "f";
|
166
230
|
}
|
167
|
-
|
168
|
-
|
231
|
+
|
232
|
+
.zocial.flattr {
|
233
|
+
background: #8aba42;
|
169
234
|
}
|
170
|
-
.zocial.
|
171
|
-
content: "
|
235
|
+
.zocial.flattr > span:before {
|
236
|
+
content: "%";
|
172
237
|
}
|
173
|
-
|
174
|
-
|
238
|
+
|
239
|
+
.zocial.forrst {
|
240
|
+
background: #1e360d;
|
175
241
|
}
|
176
|
-
.zocial.
|
177
|
-
content: "
|
242
|
+
.zocial.forrst > span:before {
|
243
|
+
content: ":";
|
244
|
+
color: #50894f;
|
178
245
|
}
|
179
|
-
|
180
|
-
|
246
|
+
|
247
|
+
.zocial.foursquare {
|
248
|
+
background: #44a8e0;
|
249
|
+
}
|
250
|
+
.zocial.foursquare > span:before {
|
251
|
+
content: "4";
|
181
252
|
}
|
253
|
+
|
182
254
|
.zocial.github {
|
183
255
|
color: #050505 !important;
|
184
256
|
background: #fbfbfb;
|
185
257
|
}
|
258
|
+
.zocial.github > span:before {
|
259
|
+
content: "g";
|
260
|
+
}
|
261
|
+
|
262
|
+
.zocial.gmail {
|
263
|
+
background: #efefef;
|
264
|
+
color: #222222 !important;
|
265
|
+
}
|
266
|
+
.zocial.gmail > span:before {
|
267
|
+
content: "m";
|
268
|
+
color: red;
|
269
|
+
}
|
270
|
+
|
271
|
+
.zocial.google {
|
272
|
+
background: #4e6cf7;
|
273
|
+
}
|
274
|
+
.zocial.google > span:before {
|
275
|
+
content: "G";
|
276
|
+
}
|
277
|
+
|
186
278
|
.zocial.googleplus {
|
187
279
|
background: #282626;
|
188
280
|
}
|
@@ -214,16 +306,219 @@
|
|
214
306
|
box-shadow: inset 0 0.063em 0 rgba(255, 255, 255, 0.4), inset 0 0 0.063em rgba(255, 255, 255, 0.6), 0 0.063em 0 rgba(255, 255, 255, 0.3);
|
215
307
|
z-index: 0;
|
216
308
|
}
|
217
|
-
.zocial.
|
218
|
-
|
309
|
+
.zocial.googleplus > span:before {
|
310
|
+
content: "+";
|
311
|
+
}
|
312
|
+
|
313
|
+
.zocial.gowalla {
|
314
|
+
background: #ff720a;
|
315
|
+
}
|
316
|
+
.zocial.gowalla > span:before {
|
317
|
+
content: "@";
|
318
|
+
}
|
319
|
+
|
320
|
+
.zocial.guest {
|
321
|
+
background: #1b4d6d;
|
322
|
+
}
|
323
|
+
.zocial.guest > span:before {
|
324
|
+
content: "?";
|
325
|
+
}
|
326
|
+
|
327
|
+
.zocial.html5 {
|
328
|
+
background: #ff3617;
|
329
|
+
}
|
330
|
+
.zocial.html5 > span:before {
|
331
|
+
content: "5";
|
219
332
|
}
|
333
|
+
|
334
|
+
.zocial.ie {
|
335
|
+
background: #00a1d9;
|
336
|
+
}
|
337
|
+
.zocial.ie > span:before {
|
338
|
+
content: "6";
|
339
|
+
}
|
340
|
+
|
341
|
+
.zocial.instapaper {
|
342
|
+
color: #222222 !important;
|
343
|
+
background: #eeeeee;
|
344
|
+
}
|
345
|
+
.zocial.instapaper > span:before {
|
346
|
+
content: "I";
|
347
|
+
}
|
348
|
+
|
349
|
+
.zocial.intensedebate {
|
350
|
+
background: #0099e1;
|
351
|
+
}
|
352
|
+
.zocial.intensedebate > span:before {
|
353
|
+
content: "{";
|
354
|
+
}
|
355
|
+
|
356
|
+
.zocial.itunes {
|
357
|
+
background: #222222;
|
358
|
+
}
|
359
|
+
.zocial.itunes > span:before {
|
360
|
+
content: "A";
|
361
|
+
}
|
362
|
+
|
363
|
+
.zocial.lastfm {
|
364
|
+
background: #dc1a23;
|
365
|
+
}
|
366
|
+
.zocial.lastfm > span:before {
|
367
|
+
content: "l";
|
368
|
+
}
|
369
|
+
|
370
|
+
.zocial.linkedin {
|
371
|
+
background: #0083a8;
|
372
|
+
}
|
373
|
+
.zocial.linkedin > span:before {
|
374
|
+
content: "L";
|
375
|
+
}
|
376
|
+
|
377
|
+
.zocial.meetup {
|
378
|
+
background: #ff0026;
|
379
|
+
}
|
380
|
+
.zocial.meetup > span:before {
|
381
|
+
content: "M";
|
382
|
+
}
|
383
|
+
|
384
|
+
.zocial.openid {
|
385
|
+
background: #f5f5f5;
|
386
|
+
color: #333333 !important;
|
387
|
+
}
|
388
|
+
.zocial.openid > span:before {
|
389
|
+
content: "o";
|
390
|
+
color: #ff921d;
|
391
|
+
}
|
392
|
+
|
393
|
+
.zocial.paypal {
|
394
|
+
background: #ff921d;
|
395
|
+
color: #032751 !important;
|
396
|
+
text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
|
397
|
+
}
|
398
|
+
.zocial.paypal > span:before {
|
399
|
+
content: "$";
|
400
|
+
}
|
401
|
+
|
402
|
+
.zocial.plancast {
|
403
|
+
background: #e7ebed;
|
404
|
+
color: #333333 !important;
|
405
|
+
}
|
406
|
+
.zocial.plancast > span:before {
|
407
|
+
content: "P";
|
408
|
+
}
|
409
|
+
|
410
|
+
.zocial.posterous {
|
411
|
+
background: #ffd959;
|
412
|
+
color: #bc7134 !important;
|
413
|
+
}
|
414
|
+
.zocial.posterous > span:before {
|
415
|
+
content: "~";
|
416
|
+
}
|
417
|
+
|
220
418
|
.zocial.rss {
|
221
419
|
background: #ff7f25;
|
222
420
|
}
|
421
|
+
.zocial.rss > span:before {
|
422
|
+
content: "R";
|
423
|
+
}
|
424
|
+
|
425
|
+
.zocial.scribd {
|
426
|
+
background: #231c1a;
|
427
|
+
}
|
428
|
+
.zocial.scribd > span:before {
|
429
|
+
content: "}";
|
430
|
+
color: #00d5ea !important;
|
431
|
+
}
|
432
|
+
|
433
|
+
.zocial.skype {
|
434
|
+
background: #00a2ed;
|
435
|
+
}
|
436
|
+
.zocial.skype > span:before {
|
437
|
+
content: "S";
|
438
|
+
}
|
439
|
+
|
223
440
|
.zocial.smashingmag {
|
224
441
|
background: #ff4f27;
|
225
442
|
}
|
443
|
+
.zocial.smashingmag > span:before {
|
444
|
+
content: "*";
|
445
|
+
}
|
446
|
+
|
447
|
+
.zocial.songkick {
|
448
|
+
background: #ff0050;
|
449
|
+
}
|
450
|
+
.zocial.songkick > span:before {
|
451
|
+
content: "k";
|
452
|
+
}
|
453
|
+
|
454
|
+
.zocial.soundcloud {
|
455
|
+
background: #ff4500;
|
456
|
+
}
|
457
|
+
.zocial.soundcloud > span:before {
|
458
|
+
content: "s";
|
459
|
+
}
|
460
|
+
|
461
|
+
.zocial.spotify {
|
462
|
+
background: #60af00;
|
463
|
+
}
|
464
|
+
.zocial.spotify > span:before {
|
465
|
+
content: "=zocial-";
|
466
|
+
}
|
467
|
+
|
468
|
+
.zocial.tumblr {
|
469
|
+
background: #374a61;
|
470
|
+
}
|
471
|
+
.zocial.tumblr > span:before {
|
472
|
+
content: "t";
|
473
|
+
}
|
474
|
+
|
226
475
|
.zocial.twitter {
|
227
476
|
background: #e9f9ff;
|
228
477
|
color: #3c6b9c !important;
|
229
478
|
}
|
479
|
+
.zocial.twitter > span:before {
|
480
|
+
content: "T";
|
481
|
+
}
|
482
|
+
|
483
|
+
.zocial.vimeo {
|
484
|
+
background: #00a2cd;
|
485
|
+
}
|
486
|
+
.zocial.vimeo > span:before {
|
487
|
+
content: "V";
|
488
|
+
}
|
489
|
+
|
490
|
+
.zocial.wikipedia {
|
491
|
+
background: white;
|
492
|
+
color: black !important;
|
493
|
+
}
|
494
|
+
.zocial.wikipedia > span:before {
|
495
|
+
content: ",";
|
496
|
+
}
|
497
|
+
|
498
|
+
.zocial.wordpress {
|
499
|
+
background: #464646;
|
500
|
+
}
|
501
|
+
.zocial.wordpress > span:before {
|
502
|
+
content: "w";
|
503
|
+
}
|
504
|
+
|
505
|
+
.zocial.yahoo {
|
506
|
+
background: #a200c2;
|
507
|
+
}
|
508
|
+
.zocial.yahoo > span:before {
|
509
|
+
content: "Y";
|
510
|
+
}
|
511
|
+
|
512
|
+
.zocial.yelp {
|
513
|
+
background: #e60010;
|
514
|
+
}
|
515
|
+
.zocial.yelp > span:before {
|
516
|
+
content: "y";
|
517
|
+
}
|
518
|
+
|
519
|
+
.zocial.youtube {
|
520
|
+
background: red;
|
521
|
+
}
|
522
|
+
.zocial.youtube > span:before {
|
523
|
+
content: "U";
|
524
|
+
}
|