I have to post this in general because I cannot locate my purchase code for Salient and cannot confirm the purchase.
In the referenced link https://staging2.keystoneindustries.com/ you will notice there are 3 fancy box elements using the color box hover effect(cosmetics, dental, retail). Two of them are using the gradients that are able to be entered into the color settings of the Salient theme. My issue is that I have 3 gradients. I need a custom css code that will allow me to be able to use a 3rd gradient on the retail box like I have for the cosmetics and dental ones. The hex colors for this box are #00aeef, #26e0b3.
I tried to get this code to work by creating a custom css class for the column but the gradient isn't diagonal like the other two and it only wraps the text and not the full box:
Could you allow us to log in to your website backend dashboard so we can check on this for you more? We are gonna need the username and password of the admin user as well as the login URL.
Add this into the Custom CSS box in your Salient Theme Options panel (We write all Custom CSS in the Live Browser to ensure accuracy. If you cannot see any changes, make sure there is no red cross in the Custom CSS Box as any syntax error would cause all CSS under that line of code to not show up on the Frontend):
I have to post this in general because I cannot locate my purchase code for Salient and cannot confirm the purchase.
In the referenced link https://staging2.keystoneindustries.com/ you will notice there are 3 fancy box elements using the color box hover effect(cosmetics, dental, retail). Two of them are using the gradients that are able to be entered into the color settings of the Salient theme. My issue is that I have 3 gradients. I need a custom css code that will allow me to be able to use a 3rd gradient on the retail box like I have for the cosmetics and dental ones. The hex colors for this box are #00aeef, #26e0b3.
I tried to get this code to work by creating a custom css class for the column but the gradient isn't diagonal like the other two and it only wraps the text and not the full box:
.custom-color-1 .nectar-fancy-box[data-style="color_box_hover"]:hover .inner-wrap {
background: linear-gradient(to right,#26e0b3,#00aeef)!important;
}
Hey Again,
Could you allow us to log in to your website backend dashboard so we can check on this for you more? We are gonna need the username and password of the admin user as well as the login URL.
Thanks.
ThemeNectar Support Team
Hey Again,
Add this into the Custom CSS box in your Salient Theme Options panel (We write all Custom CSS in the Live Browser to ensure accuracy. If you cannot see any changes, make sure there is no red cross in the Custom CSS Box as any syntax error would cause all CSS under that line of code to not show up on the Frontend):
.nectar-button.regular-button.extra-color-1, .nectar-button.tilt.extra-color-1, body .swiper-slide .button.transparent_2 .extra-color-1:hover, #sidebar .widget:hover [class^="icon-"].icon-3x.extra-color-1:not(.alt-style), .portfolio-filters-inline[data-color-scheme="extra-color-1"], .portfolio-filters[data-color-scheme="extra-color-1"] #sort-portfolio, .portfolio-filters[data-color-scheme="extra-color-1"] a, .nectar-fancy-box[data-color="extra-color-1"]:after, .divider-small-border[data-color="extra-color-1"], .divider-border[data-color="extra-color-1"], .nectar-animated-title[data-color="extra-color-1"] .nectar-animated-title-inner:after, .portfolio-filters-inline[data-color-scheme="extra-color-1-underline"] a:after, .nectar-video-box[data-color="extra-color-1"] .nectar_video_lightbox, body .nectar-video-box[data-color="extra-color-1"][data-hover="zoom_button"] .nectar_video_lightbox:after, .nectar_video_lightbox.play_button_with_text[data-color="extra-color-1"]:not([data-style="small"]) .play > .inner-wrap:before, body.material .nectar-video-box[data-color="extra-color-1"] .nectar_video_lightbox:before, .nectar-hor-list-item[data-color="extra-color-1"]:before, .nectar-fancy-box[data-color="extra-color-1"]:not([data-style="default"]) .box-bg:after, body.material[data-button-style^="rounded"] .nectar-button.see-through.extra-color-1[data-color-override="false"] i, .nectar-recent-posts-single_featured.multiple_featured .controls[data-color="extra-color-1"] li:after, .extra-color-1.icon-normal, .bar_graph li .extra-color-1, .nectar-progress-bar .extra-color-1, .swiper-slide .button.solid_color .extra-color-1, .swiper-slide .button.solid_color_2 .extra-color-1 { background: linear-gradient(to right,#26e0b3,#00aeef)!important; }Thanks.
ThemeNectar Support Team
Awesome that worked great! Thank you again for the help