Border Radius Shopify Video

Store Design
, , , ,
1

Hi,

How can I make the corners sharp on this video? How do I change the border-radius? Thanks!

drakenbergs.se

drakenberg_0-1734180364346.png
drakenberg_0-1734180364346.png565×699 327 KB

2

Hello @drakenberg

Go to Online Store, then Theme, and select Edit Code.
Search for assets/base.css Add the provided code at the end of the file.

.deferred-media__poster {
border-radius: 0!important;
}

devcoders_0-1734181027825.png
devcoders_0-1734181027825.png1342×338 245 KB

3

Hello there @drakenberg Check out the link in the reply marked as a solution here https://community.shopify.com/topic/2173815 and I think you should be able to apply or edit that code to help you achieve what you are looking for.

4

Thanks! I needed to add this code too to make it sharp!

.media > *:not(.zoom):not(.deferred-media__poster-button),
.media model-viewer {
border-radius: 0!important;
}

so it looked like this:
.media > *:not(.zoom):not(.deferred-media__poster-button),
.media model-viewer {
border-radius: 0!important;
}
.deferred-media__poster {
border-radius: 0!important;
}

5

Hello @drakenberg

Okay, great! It’s working fine now, right, dear?

6

Hi @drakenberg

I hope you are well. You can follow our instructions below:
Step 1: Shopify admin > Online store > Customize: https://prnt.sc/XQ6IDB99kUCd
Step 2: From the left menu > Theme settings > Open Custom CSS: https://prnt.sc/iDxwa8zBQ4Z-
Step 3: Copy the code below and paste it there

Here is the code for Step 3:

deferred-media.video-section__media {
    border-radius: 0 !important;
}

Please let me know if it works. Thank you!

Best,
Daisy - Avada Support Team.