Adjusting information inside a card visually
Context
Currently, I'm working on Product Listing page of a web-store. Products shown on the web-store can basically be rented out and we have defined rental prices for different time duration such as monthly price, weekly, daily, per hour, per minute. If the store owner has setup all of these prices, then we need to show them all in the product card.
Current Card looks like this:
As I am involved in the redesigning of the web-store, I wanted to change the look and feel of the product cards so that more cards can be fit in one row and information can be displayed properly when it comes to visuals.
Here is what I have mocked:
Problem
In the redesigned mock-up, we can see that only the first three price breakdowns are visible. I want to show rental prices which are per hour and per minute. For that I need extra horizontal space.
What I had in mind was to introduce a carousel inside the card in the prices section which can be used to view the remaining two prices. Will that be a good ux pattern?
Something like this:
Let me know what you think of this ux pattern and any alternatives that we could introduce for such case. Thanks !!