Flex-wrap buttons on dialogs to prevent overflowing

This commit is contained in:
schlagmichdoch 2023-12-09 17:37:44 +01:00
parent 78b758b990
commit e7031cea90
3 changed files with 59 additions and 31 deletions

View file

@ -388,6 +388,10 @@ x-dialog a {
/* Pair Devices Dialog & Public Room Dialog */
#public-room-dialog x-paper {
width: 450px;
}
.input-key-container {
width: 100%;
display: flex;
@ -544,18 +548,14 @@ x-dialog hr {
}
/* button row*/
.btn-row > .btn {
height: 100%;
width: 100%;
}
.btn-row > .btn {
margin-right: 5px;
margin-left: 5px;
.btn-row .btn {
margin: 3px;
flex-grow: 1;
height: 50px;
width: 120px; /* fixed width needed to ensure same width for all buttons */
}
x-paper > .btn-row {
height: 50px;
margin: 5px 10px 10px;
}
@ -638,10 +638,11 @@ x-dialog .dialog-subheader {
}
.share-panel {
min-width: 250px;
max-width: calc(100vw - 20px);
overflow: hidden;
background-color: var(--primary-color);
color: white;
background-color: var(--primary-color);
background-image: linear-gradient(225deg, var(--accent-color) 0%, color-mix(in srgb, var(--accent-color) 60%, black) 100%);
}
@ -677,6 +678,10 @@ x-dialog .dialog-subheader {
background-position: center;
}
.share-panel .btn {
height: 36px;
}
.share-descriptor {
justify-content: center;
}