mirrors/PairDrop
1
0
Fork 0
mirror of https://github.com/schlagmichdoch/PairDrop.git synced 2025-04-21 07:16:18 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

Make Set Language Dialog properly scrollable on mobile devices by using the styling of Pair Device and Public Room Dialogs.

Browse source
This commit is contained in:
schlagmichdoch 2023-10-11 17:51:19 +02:00
parent 4854c816a4
commit 7a299a5c98
2 changed files with 24 additions and 22 deletions
Download patch file Download diff file Expand all files Collapse all files

23
public/styles.css
View file

@ -718,10 +718,12 @@ x-dialog x-background {
} }
x-dialog x-paper { x-dialog x-paper {
display: flex;
flex-direction: column;
width: calc(100vw - 10px);
z-index: 3; z-index: 3;
background: white; background: white;
border-radius: 8px; border-radius: 8px;
width: 100%;
max-width: 400px; max-width: 400px;
overflow: hidden; overflow: hidden;
box-sizing: border-box; box-sizing: border-box;
@ -729,6 +731,15 @@ x-dialog x-paper {
will-change: transform; will-change: transform;
} }
#pair-device-dialog x-paper,
#edit-paired-devices-dialog x-paper,
#public-room-dialog x-paper,
#language-select-dialog x-paper {
position: absolute;
top: max(50%, 350px);
margin-top: -328.5px;
}
x-paper > .row:first-of-type { x-paper > .row:first-of-type {
background-color: var(--accent-color); background-color: var(--accent-color);
border-bottom: solid 4px var(--border-color); border-bottom: solid 4px var(--border-color);
@ -748,16 +759,6 @@ x-paper > .row:first-of-type h2 {
--accent-color: var(--public-room-color); --accent-color: var(--public-room-color);
} }
#pair-device-dialog x-paper,
#public-room-dialog x-paper {
display: flex;
flex-direction: column;
position: absolute;
top: max(50%, 350px);
margin-top: -328.5px;
width: calc(100vw - 20px);
}
#pair-device-dialog ::-moz-selection, #pair-device-dialog ::-moz-selection,
#pair-device-dialog ::selection { #pair-device-dialog ::selection {
color: black; color: black;

23
public_included_ws_fallback/styles.css
View file

@ -748,10 +748,12 @@ x-dialog x-background {
} }
x-dialog x-paper { x-dialog x-paper {
display: flex;
flex-direction: column;
width: calc(100vw - 10px);
z-index: 3; z-index: 3;
background: white; background: white;
border-radius: 8px; border-radius: 8px;
width: 100%;
max-width: 400px; max-width: 400px;
overflow: hidden; overflow: hidden;
box-sizing: border-box; box-sizing: border-box;
@ -759,6 +761,15 @@ x-dialog x-paper {
will-change: transform; will-change: transform;
} }
#pair-device-dialog x-paper,
#edit-paired-devices-dialog x-paper,
#public-room-dialog x-paper,
#language-select-dialog x-paper {
position: absolute;
top: max(50%, 350px);
margin-top: -328.5px;
}
x-paper > .row:first-of-type { x-paper > .row:first-of-type {
background-color: var(--accent-color); background-color: var(--accent-color);
border-bottom: solid 4px var(--border-color); border-bottom: solid 4px var(--border-color);
@ -778,16 +789,6 @@ x-paper > .row:first-of-type h2 {
--accent-color: var(--public-room-color); --accent-color: var(--public-room-color);
} }
#pair-device-dialog x-paper,
#public-room-dialog x-paper {
display: flex;
flex-direction: column;
position: absolute;
top: max(50%, 350px);
margin-top: -328.5px;
width: calc(100vw - 20px);
}
#pair-device-dialog ::-moz-selection, #pair-device-dialog ::-moz-selection,
#pair-device-dialog ::selection { #pair-device-dialog ::selection {
color: black; color: black;