Joomla Templates Club 406,261 posts

[Ashwin Iyer Friend Ashwin IyerJoin date: September 2014Posts: 78Downloads:23Uploads:0 Thanks: 5 Thanked: 1 times in 1 posts]

#189763

Hello Guys,

Check out Awesome Team section on http://www.permaleaf.com – Applications section in the respective website

You will see when it goes on Chrome or Safari the round circles are replaced with squares. How can this be solved?

Ash

[Phill Moderator PhillJoin date: February 2014Posts: 7013Downloads:40Uploads:77 Thanks: 917 Thanked: 2206 times in 1818 posts]

#502339

Are you using the latest version of the template and plugin? As you membership has expired for this template you will probably not have the latest version. The current demo currently shows the “Awesome Team” thumbnails in a rectangular format on all browser I have checked on including FF, IE10 and Safari – http://www.joomlart.com/demo/#ja_onepage.

[Ashwin Iyer Friend Ashwin IyerJoin date: September 2014Posts: 78Downloads:23Uploads:0 Thanks: 5 Thanked: 1 times in 1 posts]

#502486

Hello Phill,

If you can check the Modern style its still in a Circular format. Can you please help? Also I checked and I do have the latest version of the template

Ash

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

#502698

Hi Ash,

Thank you for your feedbacks, it is an error on the Metro style of our JA Onepage template. In this case, you can solve the issue by adding below codes into templatesja_onepagelessthemesmetrotemplate.less file:

div.thumb-mask {
position: relative;
display: block;
height: 180px;
width: 180px;
.border-radius(180px) !important;
overflow: hidden;
.transition(0.5s);
margin: auto;
}

div.thumb-mask .mask-inner {
height: 180px;
position: absolute;
left: -30px;
top: 0px;
width: 240px;
}

//Fix for Opera, IE
ul.thumbnails li:hover div.thumb-mask .mask {
background: url(../../../images/themes/metro/avatar-mask.png) no-repeat left top;
}

Then Compile less to css in Template Manager. In addition, you can put my attached image to templates/ja_onepage/images/themes/metro path.

---

Attachments:

1. avatar-mask.zip

[Ashwin Iyer Friend Ashwin IyerJoin date: September 2014Posts: 78Downloads:23Uploads:0 Thanks: 5 Thanked: 1 times in 1 posts]

#502704

Hello Leo,

Will this help solve my issue? I am asking this because I am using Modern theme not Metro

Ash

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

#502741

Hi Ash,

These css styles affecting the circle around the Awesome images are the same codes in the Onepage themes, they will help to solve your issue on Modern theme.

[Author]

Posts