Floating badge to change on mobile

Ask the Community Customization
1

I am hoping you can help me get the floating badge to change on mobile, to be a floating square with the rating and maybe one star or something to fit better on the phone.

2 Likes
3

Hi there, @Rev_Devan :waving_hand:

Here is a CSS code to make the badge square on mobile and display only 1 star:

@media (max-width: 480px) {
  .es-badge-container {
    aspect-ratio: 1/1;
    display: flex;
    border-radius: 0px;
    scale:0.9;
  }

  .es-rating-item:not(:first-child) {
    display: none;
  }

  .es-rating-container {
    justify-content: center;
  }
}

Please check it out and let me know if you like the result :wink:

1 Like