Professional Location Card Distance Error

Search Best Practices - Search Front-End
1

Hi Team!

I am working on building out an Answers experience for a bank and am seeing an error in the way the distance is displayed on the results card (attached). Essentially, the distance is being attached to the title of the card instead of being right-aligned. I am seeing this on a forked version of the professional-location card, but am also seeing the same error on the standard professional-location card. . I am testing these both on a vertical-map page. Additionally, I have not edited the distance value in the code at all. I am wondering if this is a common issue or could easily be fixed with some CSS? Any help would be appreciated!

Garrett

professional-location
professional-location928×312 20.6 KB
!

2

Screenshot 2021-04-21 153505
Screenshot 2021-04-21 153505923×337 52.4 KB

Here is the actual screenshot on my card override! The one above is the standard professional-location card.

3

Hey team! Any update on this issue? I’ve seen it in most new Answers builds the past few weeks

4

Hey Jessie,

We just raised this to our Product team again and it should be fixed in an upcoming theme. Thanks for flagging!

5

For those interested, the CSS fix that will fix this is:

.HitchhikerLocationCard-closeCardButtonWrapper{
margin-left: auto; 
padding-left: 16px;
}
1 Like
6

Hi Garrett and Jessie,

With our November '21 Release and Theme v1.26, we’ve fixed the distance alignment on the theme professional cards. Upgrade your theme to get the fix. If you previously forked the cards, you’ll need to re-fork them to get the update.