Mirrors/gomuks
1
0
Fork 1
mirror of https://github.com/tulir/gomuks.git synced 2025-04-20 10:33:41 -05:00
Code Issues Projects Releases Packages Wiki Activity Actions 3

web/modal: make edit history modal fullscreen on mobile

Browse source
This commit is contained in:
Tulir Asokan 2025-02-23 23:21:01 +02:00
parent 4a728e187c
commit 7ed0f2633c
3 changed files with 17 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

10
web/src/ui/modal/Lightbox.css
View file

@ -19,6 +19,16 @@ div.overlay {
overflow: hidden; overflow: hidden;
display: flex; display: flex;
&.full-screen-mobile {
@media screen and (max-width: 30rem) {
max-width: 100%;
max-height: 100%;
width: 100%;
height: 100%;
border-radius: 0;
}
}
> div.modal-box-inner { > div.modal-box-inner {
overflow: scroll; overflow: scroll;
} }

6
web/src/ui/timeline/EventEditHistory.css
View file

@ -6,8 +6,14 @@ div.event-edit-history-modal {
--timeline-status-size: 0; --timeline-status-size: 0;
--timeline-horizontal-padding: 0; --timeline-horizontal-padding: 0;
min-width: 20rem; min-width: 20rem;
box-sizing: border-box;
padding: 1rem; padding: 1rem;
@media screen and (max-width: 30rem) {
min-width: 100%;
padding: .5rem;
}
> p { > p {
margin: 0; margin: 0;
} }

2
web/src/ui/timeline/TimelineEvent.tsx
View file

@ -125,7 +125,7 @@ const TimelineEvent = ({
content: <EventEditHistory evt={evt} roomCtx={roomCtx}/>, content: <EventEditHistory evt={evt} roomCtx={roomCtx}/>,
dimmed: true, dimmed: true,
boxed: true, boxed: true,
boxClass: "event-edit-history-wrapper", boxClass: "full-screen-mobile event-edit-history-wrapper",
innerBoxClass: "event-edit-history-modal", innerBoxClass: "event-edit-history-modal",
}) })
} }