diff --git a/README.markdown b/README.markdown index 4c915f3..ae5cf21 100644 --- a/README.markdown +++ b/README.markdown @@ -72,6 +72,7 @@ Enjoy Webicons! * Trip Advisor * Tumblr * Twitter +* Viadeo * Vimeo * Windows * WordPress diff --git a/webicons.css b/webicons.css index 4088721..3508764 100644 --- a/webicons.css +++ b/webicons.css @@ -786,6 +786,18 @@ .svg .webicon.twitter { background: url("webicons/webicon-twitter.svg"); } +.no-svg .webicon.viadeo { + background: url("webicons/webicon-viadeo-m.png"); } + +.no-svg .webicon.viadeo.large { + background: url("webicons/webicon-viadeo.png"); } + +.no-svg .webicon.viadeo.small { + background: url("webicons/webicon-viadeo-s.png"); } + +.svg .webicon.viadeo { + background: url("webicons/webicon-viadeo.svg"); } + .no-svg .webicon.vimeo { background: url("webicons/webicon-vimeo-m.png"); } diff --git a/webicons.html b/webicons.html index 89b5a75..b51e479 100644 --- a/webicons.html +++ b/webicons.html @@ -145,6 +145,8 @@ Twitter + Viadeo + Vimeo Windows @@ -289,6 +291,8 @@ Twitter + Viadeo + Vimeo Windows @@ -433,6 +437,8 @@ Twitter + Viadeo + Vimeo Windows diff --git a/webicons.less b/webicons.less new file mode 100644 index 0000000..b6c8539 --- /dev/null +++ b/webicons.less @@ -0,0 +1,24 @@ +/* Webicons by Adam Fairhead at Fairhead Creative http://fairheadcreative.com */ + +.webicon { display: inline-block; background-size: 100%; width: 30px; height: 30px; text-indent: -999em; text-align: left; -moz-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.5); -webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.5); box-shadow: 0 1px 0 rgba(0, 0, 0, 0.5); -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; margin-bottom: 5px; } +.webicon:hover { margin: -1px 0 1px; -moz-box-shadow: 0 2px 0 rgba(0, 0, 0, 0.25); -webkit-box-shadow: 0 2px 0 rgba(0, 0, 0, 0.25); box-shadow: 0 2px 0 rgba(0, 0, 0, 0.25); } +.webicon.small { width: 20px; height: 20px; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; } +.webicon.large { width: 48px; height: 48px; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; } + +// Include or remove the icons you want to use on your site from this list. +@webicons-icons: ~"f500px", ~"aboutme", ~"adn", ~"android", ~"apple", ~"behance", ~"bitbucket", ~"blogger", ~"branch", ~"coderwall", ~"creativecloud", ~"dribbble", ~"dropbox", ~"evernote", ~"fairheadcreative", ~"facebook", ~"flickr", ~"foursquare", ~"git", ~"github", ~"goodreads", ~"google", ~"googleplay", ~"googleplus", ~"hangouts", ~"html5", ~"icloud", ~"indiegogo", ~"instagram", ~"instapaper", ~"kickstarter", ~"klout", ~"lastfm", ~"linkedin", ~"mail", ~"medium", ~"mixi", ~"msn", ~"openid", ~"picasa", ~"pinterest", ~"pocketapp", ~"potluck", ~"quora", ~"orkut", ~"mercurial", ~"rdio", ~"reddit", ~"renren", ~"rss", ~"skitch", ~"skype", ~"soundcloud", ~"spotify", ~"stackoverflow", ~"stumbleupon", ~"svn", ~"tent", ~"tripadvisor", ~"tumblr", ~"twitter", ~"viadeo", ~"vimeo", ~"weibo", ~"windows", ~"wordpress", ~"xing", ~"yahoo", ~"yelp", ~"youtube", ~"youversion", ~"zerply"; + +// Specify the path to the webicons directory here. Include trailing slash. +@webicons-url: "webicons/"; + +.webicons-loop(@list, @index: 1) when (isstring(extract(@list, @index))) { + @webicons-icon: extract(@list, @index); + + .no-svg .webicon.@{webicons-icon} { background: url("@{webicons-url}webicon-@{webicons-icon}-m.png"); } + .no-svg .webicon.@{webicons-icon}.large { background: url("@{webicons-url}webicon-@{webicons-icon}.png"); } + .no-svg .webicon.@{webicons-icon}.small { background: url("@{webicons-url}webicon-@{webicons-icon}-s.png"); } + .svg .webicon.@{webicons-icon} { background: url("@{webicons-url}webicon-@{webicons-icon}.svg"); } + + .webicons-loop(@list, (@index + 1)); +} +.webicons-loop(@webicons-icons); \ No newline at end of file diff --git a/webicons.scss b/webicons.scss index c58ae31..b6a0afa 100644 --- a/webicons.scss +++ b/webicons.scss @@ -12,7 +12,7 @@ } // Include or remove the icons you want to use on your site from this list. -$webicons-icons: f500px aboutme adn android apple behance bitbucket blogger branch coderwall creativecloud dribbble dropbox evernote fairheadcreative facebook flickr foursquare git github goodreads google googleplay googleplus hangouts html5 icloud indiegogo instagram instapaper kickstarter klout lastfm linkedin mail medium mixi msn openid picasa pinterest pocketapp potluck quora orkut mercurial rdio reddit renren rss skitch skype soundcloud spotify stackoverflow stumbleupon svn tent tripadvisor tumblr twitter vimeo weibo windows wordpress xing yahoo yelp youtube youversion zerply; +$webicons-icons: f500px aboutme adn android apple behance bitbucket blogger branch coderwall creativecloud dribbble dropbox evernote fairheadcreative facebook flickr foursquare git github goodreads google googleplay googleplus hangouts html5 icloud indiegogo instagram instapaper kickstarter klout lastfm linkedin mail medium mixi msn openid picasa pinterest pocketapp potluck quora orkut mercurial rdio reddit renren rss skitch skype soundcloud spotify stackoverflow stumbleupon svn tent tripadvisor tumblr twitter viadeo vimeo weibo windows wordpress xing yahoo yelp youtube youversion zerply; // Specify the path to the webicons directory here. Include trailing slash. $webicons-url: "webicons/" !default; diff --git a/webicons/webicon-viadeo-m.png b/webicons/webicon-viadeo-m.png new file mode 100644 index 0000000..2cc6f26 Binary files /dev/null and b/webicons/webicon-viadeo-m.png differ diff --git a/webicons/webicon-viadeo-s.png b/webicons/webicon-viadeo-s.png new file mode 100644 index 0000000..ef7bdf8 Binary files /dev/null and b/webicons/webicon-viadeo-s.png differ diff --git a/webicons/webicon-viadeo.png b/webicons/webicon-viadeo.png new file mode 100644 index 0000000..45027a0 Binary files /dev/null and b/webicons/webicon-viadeo.png differ diff --git a/webicons/webicon-viadeo.svg b/webicons/webicon-viadeo.svg new file mode 100644 index 0000000..141e425 --- /dev/null +++ b/webicons/webicon-viadeo.svg @@ -0,0 +1,49 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +