Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • December 17, 2019 at 3:27 pm #1166859
    sdesign-web

    Hi Kriesi Team,

    i’m looking for a way to add an hover effect on the icon box element when the mouse is over it.
    see : https://image.noelshack.com/fichiers/2019/51/2/1576588347-capture-d-ecran-2019-12-17-a-11-43-31.jpg

    At the moment i use the hover effect on the column link but it’s very light.

    is there a way with quick css to add a more visible effect as for example increase the size of the icon or add a rounded color background ?

    Thank you in advance for your help ( you will find in private content a tempory admin access ).

    kind regards

    Stan

    December 17, 2019 at 7:36 pm #1166971
    Jordan Shannon

    Hey sdesign-web,

    Can you provide a link to the site and page in question? I only see the login creds.

    Best regards,
    Jordan Shannon

    December 18, 2019 at 10:18 am #1167200
    sdesign-web

    Hi Jordan,

    please find in private content the link to the concerned page ( it’s the home page ).

    Best regards,

    Stan

    December 19, 2019 at 4:29 pm #1167797
    Jordan Shannon

    Hi,

    Try the following in quick css and adjust the color to what you want.

    .iconbox:hover p,
.iconbox:hover h3,
.iconbox:hover .iconbox_icon{
color:yellow!important;
font-size:1em
}

    Best regards,
    Jordan Shannon

    December 19, 2019 at 6:49 pm #1167865
    sdesign-web

    Hi Jordan,

    thank you very much ! it works perfectly for hover color and size of content text !

    For the hover size what would be the quick CSS to :

    1 – increase only the icon size ?
    2 – increase all the box content ? ( size of the icon + size of title + size of content text ).

    Kind regards,

    Stan

    December 20, 2019 at 1:25 am #1167988
    Jordan Shannon

    Hi,

    Try this:

    .iconbox:hover p{
color:#ffd400!important;
font-size:16px
}

.iconbox:hover h3{
	color:#ffd400!important;
	font-size:30px!important;
}

.iconbox:hover a.iconbox_icon{
	color:#ffd400!important;
	font-size:60px!important;
}

    Best regards,
    Jordan Shannon

    December 20, 2019 at 10:16 am #1168066
    sdesign-web

    Great ! it’s exactly waht i want to achieve !

    Thank you very much for your help and the quality of your support !!

    best regards,

    Stan

    December 20, 2019 at 11:05 am #1168080
    sdesign-web

    Just a general question about quick css that I’ve been asking myself for a long time :
    Is it possible to apply quick css only on a particular page ?

    best regards,

    Stan

    December 20, 2019 at 4:20 pm #1168193
    Nikko

    Hi Stan,

    Yes it’s possible, each page has it’s own unique class name which you can use to style specific page only.
    You can use a web inspector to know the unique class of the body tag of each page.

    Best regards,
    Nikko

  • Author
    Posts
Viewing 9 posts - 1 through 9 (of 9 total)
  • You must be logged in to reply to this topic.