No arrows displaying in mobile roundabout

[lesliekirk]

Can't post the link to the site but I can share a couple screenshots. In the mobile (phone) view. The arrows for the Featured Products disappears.



The arrows are there in larger views



What should I look for? The roundabout is not set to autoscroll.

Also, a semi-related question - how do I make a roundabout display more than 2 in the mobile size? The images above the Featured Products are also in a roundabout, but I'd like it to display 4 images instead of 2.

Thanks!
Leslie

[gsam]

I was working with the same issue on the related products. I noticed the css contained the display:none:
<button class="x-carousel__button u-icon-chevron-left" data-hook="carousel__button-previous" style="display: none;"></button>.

Found that the style is coming from the roundabout.css file.

To over-ride it I added this to my theme-styles.css, notice the !mportant tag added to the display:inline-block.

.x-carousel__button {
display: inline-block !important;
padding: 0;
position: absolute;
top: 50%;
font-size: 3rem;
background-color: rgba(255, 255, 255, 0);
border: 0 none;
opacity: 0.25;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
transition: ease-in-out 0.3s;
z-index: 50;
}

.x-carousel__button-right {
right: 0;
}

.x-carousel__button:hover {
background-color: rgba(255, 255, 255, 0.25);
opacity: 1;
}

[gsam]

I'm still trying to figure out how to hide the arrows on larger screen displays where it is not needed.

[Matt Zimmermann]

I have made an update to Roundabout which change the way the buttons are displayed: https://github.com/mivaecommerce/rea...dows/issues/51

[lesliekirk]

I'm still trying to figure out how to hide the arrows on larger screen displays where it is not needed.

Thanks! That got it for me. Now to figure how to change the number of items displayed.

[lesliekirk]

This may still need a bit of tweaking. The arrows are rather persistent when in the mobile view and the menu is displayed.

[Matt Zimmermann]

Hi Leslie,

Sounds like it might be a z-index issue. Can you post a link to the site?

[lesliekirk]

Hi Leslie,

Sounds like it might be a z-index issue. Can you post a link to the site?

z-index is my thought too. Can't post the site, its a dev site behind a mote.

[gsam]

I've had a few complaints that the arrows are not clearly visible because they are sometimes positioned over the images. Are the arrows graphic files that I can change? Anyway to fill the arrows with white and give it a black border so it will be visible over an image or a white background?

[gsam]

I knew as soon as I posted this I would see the answer. Found it in the CSS resource file: roundabout.css