Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • May 1, 2013 at 6:52 pm #22674
    artistic24459

    I would like to make the icons a little smaller.

    I under stand to do this I need to change each of the following to 0.9

    .avia_transform .avia-icon-list .avia_start_animation .iconlist_icon {

    -moz-transform: scale(1);

    -webkit-transform: scale(1);

    -o-transform: scale(1);

    transform: scale(1);

    }

    But how can I make the animation work smoothly into the new size as it jump to 0.9 at the end at the moment.

    I see the CSS for the animation but cant get it to match the new 0.9 size.

    -webkit-animation: avia_appear 1s 1 cubic-bezier(0.175, 0.885, 0.320, 1.275);

    -moz-animation: avia_appear 1s 1 cubic-bezier(0.175, 0.885, 0.320, 1.275);

    -o-animation: avia_appear 1s 1 cubic-bezier(0.175, 0.885, 0.320, 1.275);

    animation: avia_appear 1s 1 cubic-bezier(0.175, 0.885, 0.320, 1.275);

    Can anyone help?

    May 1, 2013 at 9:19 pm #116778
    Ismael

    Hi,

    You can make it smaller with this code

    .avia-icon-list .iconlist_icon{height:64px; width:64px; line-height: 60px; font-size: 30px; text-align: center; border-radius: 500px; position: relative; float:left; margin-right:30px; margin-left:2px; z-index: 5; border-style:solid; border-width:2px; color:#fff;}

    Change the values of height, width, line-height and font-size properties. Something like this.

    .avia-icon-list .iconlist_icon{height:50px; width:50px; line-height: 50px; font-size: 20px; text-align: center; border-radius: 500px; position: relative; float:left; margin-right:30px; margin-left:2px; z-index: 5; border-style:solid; border-width:2px; color:#fff;}

    Regards,

    Ismael

  • Author
    Posts
Viewing 2 posts - 1 through 2 (of 2 total)
  • The topic ‘Changing the 'Icon List' icon size animation’ is closed to new replies.