How to make bottom sheet wider on desktop

Ionic Framework Ionic Angular
1

how to make bottom sheet wider on desktop? On mobile it’s 100% width. But on desktop only like 50%

Can I make it wider on desktop? Like 80% width? It would be very nice, since I am displaying huge images inside my modal which should be very wide.

Talking about this bottom sheet:

2

Set --width: 100% on ion-modal.

<ion-modal style="--width: 100%" ref="modal" trigger="open-modal" :initial-breakpoint="0.25" :breakpoints="[0, 0.25, 0.5, 0.75]">
    <!-- Stuff -->
<ion-modal>
3

Thank yoU! My modal was set by a controller but I simply set a (globals.scss) style for it, using the class set by the constructor

1 Like