share

[bigbangthinking]

OK OK I know this is not a Dante item probably, but it is so litlle 🙂

I´m trying to make my share item buttons to not have border and background. Almos done it using this code

a.share-facebook.sd-button.share-icon, a.share-twitter.sd-button.share-icon, a.share-pinterest.sd-button.share-icon, a.share-linkedin.sd-button.share-icon, a.share-google-plus-1.sd-button.share-icon, a.share-tumblr.sd-button.share-icon, a.share-email.sd-button.share-icon  {
background: transparent!important;
-moz-box-shadow: none;
-webkit-box-shadow: none;
box-shadow: none;
border-style:solid;
border-width:0px;
border-color:  transparent!important;
border-radius: 0px 0px 10px 10px;
}

but still have a very small shadow on the normal state of the button and an upper shadow as in the linkedIn button on click.Check out image

Any idea @Mohammad

[bigbangthinking]

the link is http://www.bigbangthinking.com

🙂

[Kyle – SUPPORT]

Hi

Try this custom css:

.sd-social-icon .sd-content ul li a.sd-button, .sd-social-text .sd-content ul li a.sd-button, .sd-content ul li a.sd-button, .sd-content ul li .option a.share-ustom, .sd-content ul li.preview-item div.option.option-smart-off a, .sd-content ul li.advanced a.share-more, .sd-social-icon-text .sd-content ul li a.sd-button, .sd-social-official .sd-content > ul > li > a.sd-button, #sharing_email .sharing_send, .sd-social-official .sd-content > ul > li .digg_button > a {
  box-shadow: none;
-moz-box-shadow: none;
-webkit-box-shadow: none;
}

– Kyle

[bigbangthinking]

Hi Kyle

Thanks that did the job, except for the click status, where I still get the upper line, like in the Linkedin link shown in the previously attached image.

Thanks
Gonzalo

[Kyle – SUPPORT]

Add this:

.sd-social-icon .sd-content ul li a.sd-button:active, .sd-social-text .sd-content ul li a.sd-button:active, .sd-social-icon-text .sd-content ul li a.sd-button:active, .sd-social-official .sd-content > ul > li > a.sd-button:active, .sd-social-official .sd-content > ul > li .digg_button > a:active {
  box-shadow: none;
}

– Kyle

[bigbangthinking]

Kyle GREAT JOB!

Thanks it working perfect. I´m leaving here the full code we used with some little tweaks. I´m not sure it if its redundant in some parts, but it works.

a.share-facebook.sd-button.share-icon, a.share-twitter.sd-button.share-icon, a.share-pinterest.sd-button.share-icon, a.share-linkedin.sd-button.share-icon, a.share-google-plus-1.sd-button.share-icon, a.share-tumblr.sd-button.share-icon, a.share-email.sd-button.share-icon  {
background: transparent!important;
-moz-box-shadow: none;
-webkit-box-shadow: none;
box-shadow: none;
border-style:solid;
border-width:0px;
border-color:  transparent!important;
border-radius: 0px 0px 10px 10px;
}

.sd-social-icon .sd-content ul li a.sd-button, .sd-social-text .sd-content ul li a.sd-button, .sd-content ul li a.sd-button, .sd-content ul li .option a.share-ustom, .sd-content ul li.preview-item div.option.option-smart-off a, .sd-content ul li.advanced a.share-more, .sd-social-icon-text .sd-content ul li a.sd-button, .sd-social-official .sd-content > ul > li > a.sd-button, #sharing_email .sharing_send, .sd-social-official .sd-content > ul > li .digg_button > a {
  box-shadow: none;
-moz-box-shadow: none;
-webkit-box-shadow: none;
}

.sd-social-icon .sd-content ul li a.sd-button:active, .sd-social-text .sd-content ul li a.sd-button:active, .sd-social-icon-text .sd-content ul li a.sd-button:active, .sd-social-official .sd-content > ul > li > a.sd-button:active, .sd-social-official .sd-content > ul > li .digg_button > a:active {
  box-shadow: none;
-moz-box-shadow: none;
-webkit-box-shadow: none;
}

Thanks Allot !!!

[Mohammad – SUPPORT]

Hi,
You most welcome. I’m glad that issue resolved. Great Thanks Kyle :-).
With Best Regards
Swift Ideas