Improve layout on mobile

This commit is contained in:
RMidhunSuresh 2023-06-19 13:55:17 +05:30
parent 93f4158645
commit bc2553f856
3 changed files with 14 additions and 5 deletions

View File

@ -101,6 +101,14 @@ the layout viewport up without resizing it when the keyboard shows */
.middle .close-middle { display: block !important; }
/* hide grid button */
.LeftPanel .grid { display: none !important; }
.VerificationReadyTileView {
flex-direction: column;
}
.VerificationTileView__actions {
justify-content: center;
}
}
.LeftPanel {

View File

@ -1535,6 +1535,7 @@ button.RoomDetailsView_row::after {
font-size: 1.4rem;
color: var(--text-color);
gap: 4px;
text-align: center;
}
.VerificationInProgressTileView,
@ -1542,7 +1543,7 @@ button.RoomDetailsView_row::after {
.VerificationCancelledTileView,
.VerificationReadyTileView {
background: var(--background-color-primary--darker-5);
padding: 12px;
padding: 8px;
box-sizing: border-box;
border-radius: 8px;
}
@ -1550,18 +1551,18 @@ button.RoomDetailsView_row::after {
.VerificationTileView {
display: flex;
justify-content: center;
padding: 16px;
padding: 5px 10%;
box-sizing: border-box;
}
.VerificationInProgressTileView .VerificationTileView__shield,
.VerificationReadyTileView .VerificationTileView__shield {
background: url("./icons/e2ee-normal.svg?primary=background-color-secondary--darker-40");
background: url("./icons/e2ee-normal.svg?primary=background-color-secondary--darker-40") no-repeat;
}
.VerificationCompletedTileView .VerificationTileView__shield {
background: url("./icons/e2ee-normal.svg?primary=accent-color");
background: url("./icons/e2ee-normal.svg?primary=accent-color") no-repeat;
}
.VerificationTileView__shield {

View File

@ -52,8 +52,8 @@ export class VerificationTileView extends TemplateView<VerificationTile> {
class VerificationReadyTileView extends TemplateView<VerificationTile> {
render(t: Builder<VerificationTile>, vm: VerificationTile) {
return t.div({ className: "VerificationReadyTileView" }, [
t.div({ className: "VerificationTileView__shield" }),
t.div({ className: "VerificationTileView__description" }, [
t.div({ className: "VerificationTileView__shield" }),
t.div(vm.description)
]),
t.div({ className: "VerificationTileView__actions" }, [