Joomla Templates Club 406,261 posts

[amir00251 Friend amir00251Join date: January 2011Posts: 113Downloads:38Uploads:13 Thanks: 13 Thanked: 11 times in 1 posts]

#189073

Hello, I’d like to change the Opacity of the social icons, image above, for both desktop and mobile themes, I think they need to be more clear specially on mobile view.

Would appreciate if you could suggest a css addition, I could not get this right when I checked the element.

Thank you.

---

Attachments:

1. 

[phong nam Friend phong namJoin date: May 2015Posts: 3779Downloads:1Uploads:587 Thanks: 499 Thanked: 974 times in 888 posts]

#499541

Hi amir00251,

You can open templatesja_smashboardlessstyle.less file, then find lines (at 96th):

a {
background: url("@{T3ImagePath}/black-trans-40.png");
border: 1px solid transparent;
color: @white;
display: inline-block;
font-size: 0;
margin-left: 5px;
padding: 0;
height: 29px;
opacity: 0.15;
-ms-filter: alpha(opacity=15);
filter: alpha(opacity=15);
text-align: center;
vertical-align: middle;
width: 29px;
.border-radius(@baseBorderRadius);

// link state
&:hover, &:focus, &:active {
background: url("@{T3ImagePath}/black-trans-25.png");
border: 1px solid rgba(255,255,255,0.15);
opacity: 1;
text-decoration: none;
-ms-filter: alpha(opacity=100);
filter: alpha(opacity=100);
}


You can chane opacity of social icons on both desktop and mobile devices with hover, focus, active condition also. Remember to Compile Lss to Css in Template Manager.

Note: Another solution is creating a custom.css file at templates/ja_smashboard/css/ path & put below css codes into:

@media (max-width: 460px) {
.head-social ul.btn-social li.dropdown a {
opactity: 0.5 !important;
}
}

These codes will override the opacity of social icons style on mobile view.

1 user says Thank You to phong nam for this useful post

1. amir00251

[amir00251 Friend amir00251Join date: January 2011Posts: 113Downloads:38Uploads:13 Thanks: 13 Thanked: 11 times in 1 posts]

#499645

Thank you very much, the first solution worked, 0.4 I think is better than 0.15 which is set for this parameter.

[Author]

Posts