I’m trying to remove the borders from all my product/faq cards, which I was successfully able to do for all of them using this code in answers.scss:
.HitchhikerStandard {
border: none;
}
This worked for all the cards in universal but didn’t work for the ProductProminentImage cards specifically in the 2 column vertical I have. The grey border is still visible and I found the class that’s determining the “border: 1px solid …” but when I add it to the answers.scss it doesn’t make any changes. I’m assuming this is set deeper in the theme but I can’t find which file it’s in. Thank you!
Referring to this Office Hours Post: adding
.AnswersVerticalGrid .Hitchhiker-2-columns .yxt-Card-child, .AnswersVerticalGrid .Hitchhiker-3-columns .yxt-Card-child, .AnswersVerticalGrid .Hitchhiker-4-columns .yxt-Card-child {
border: none;
}
to the answers.scss file but outside the .answers {} did the trick! Thanks @Kristy_Huang!
1 Like
Hi,
I was able to follow this post and successfully remove the borders from my vertical search results. However, I am unable to remove them from the universal card… I have tried a few different target elements and haven’t been successful. Let me know where I might be missing something.
I have targeted
.HitchhikerProductProminentImage { border: none; } .HitchhikerProductProminentImage-img { border: none; }
as well as
.HitchhikerResultsGridThreeColumns { border: none; }
Hi @Sarah_Bokhari !
I was able to do this on my experience by navigating to the answers-variables.scss file in the code editor and setting --yxt-border-default: 0px;. Hope that works for you!
Thank you so much @Hannah_Mussi!
