Home › Forums › Basel support forum › Wishlist Premium version – Problem with icon appearence
Wishlist Premium version – Problem with icon appearence
- This topic has 7 replies, 2 voices, and was last updated 7 years, 10 months ago by Artem Temos.
-
AuthorPosts
-
March 4, 2017 at 10:32 am #10482
makisParticipantGood Morning,
I update your yitheme wishlist to premium so to disable unathenticated users from creating wishlist and the appearance of the wishlist button changed.
May you help me with the icon and tooltip css?March 4, 2017 at 3:09 pm #10489
Artem TemosKeymasterHello,
Try to put the following code snippet to the Custom CSS section in Theme Settings
.product-grid-item .yith-wcwl-add-to-wishlist > a { font-size: 0; display: inline-block; position: relative; width: 35px; height: 35px; line-height: 35px; color: rgba(0,0,0,.9); } .product-grid-item .yith-wcwl-add-to-wishlist > a i:before { content: "\e08a"; font-size: 18px; vertical-align: middle; margin-right: 2px; display: inline-block; font-family: Simple-Line-Icons; -webkit-transition: all .2s; -moz-transition: all .2s; -o-transition: all .2s; transition: all .2s; } .product-grid-item .yith-wcwl-add-to-wishlist > a .basel-tooltip-label { bottom: auto; left: auto; right: 135%; top: 50%; -webkit-transform: translateX(0) translateY(-50%); -o-transform: translateX(0) translateY(-50%); -ms-transform: translateX(0) translateY(-50%); -sand-transform: translateX(0) translateY(-50%); -moz-transform: translateX(0) translateY(-50%); transform: translateX(0) translateY(-50%); } .product-grid-item .yith-wcwl-add-to-wishlist > a .basel-tooltip-label:before { content: ""; position: absolute; top: 50%; bottom: auto; left: 99%; right: auto; color: transparent; font-size: 16px; font-family: FontAwesome; line-height: 5px; -webkit-transform: translateX(0) translateY(-50%); -o-transform: translateX(0) translateY(-50%); -ms-transform: translateX(0) translateY(-50%); -sand-transform: translateX(0) translateY(-50%); -moz-transform: translateX(0) translateY(-50%); transform: translateX(0) translateY(-50%); -webkit-transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; -ms-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; transition: all .2s ease-in-out; } .product-grid-item .yith-wcwl-add-to-wishlist > a:hover .basel-tooltip-label { background-color: #000; color: #fff; visibility: visible; top: 50%; bottom: auto; left: auto; right: 115%; }
Regards
March 4, 2017 at 6:16 pm #10496
makisParticipantThanks it works perfect!!!
I observed a problem in the final product page with hearts. Please view the attached below.
March 4, 2017 at 10:35 pm #10504
Artem TemosKeymasterAdd this also
.single-product-content .entry-summary .yith-wcwl-add-to-wishlist > a { display: inline-block; vertical-align: middle; text-align: center; font-size: 14px; line-height: 1.5; color: #4E4E4E; text-decoration:none; } .single-product-content .entry-summary .yith-wcwl-add-to-wishlist > a:hover { color:#e70219; } .single-product-content .entry-summary .yith-wcwl-add-to-wishlist > a i { display:none; } .single-product-content .entry-summary .yith-wcwl-add-to-wishlist > a:before { content: "\e08a"; font-size: 18px; vertical-align: middle; margin-right: 2px; display: inline-block; font-family: Simple-Line-Icons; }
Regards
March 5, 2017 at 11:19 am #10507
makisParticipantThanks for your tries!!!
It didn’t workMarch 5, 2017 at 7:29 pm #10517
Artem TemosKeymasterSorry, try this please
.basel-buttons .yith-wcwl-add-to-wishlist>div>a i, .product-image-summary .yith-wcwl-add-to-wishlist>div>a i{ display:none; }
Regards
March 6, 2017 at 5:59 am #10524
makisParticipantThank you very much!!
It working perfect now.March 6, 2017 at 6:09 am #10529
Artem TemosKeymasterGreat, you are welcome!
-
AuthorPosts
The topic ‘Wishlist Premium version – Problem with icon appearence’ is closed to new replies.
- You must be logged in to create new topics. Login / Register