imterah/element-portable
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

The Welcome Home Screen: Dedicated Download Apps Dialog (#9120)

Browse source 
* Implement new download apps dialog
* Added screenshot test for app download dialog
This commit is contained in:
Janne Mareike Koschinski 2022-08-02 16:08:02 +02:00 • committed by GitHub
parent 6796375b10
commit b62413d725
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
9 changed files with 207 additions and 1 deletions
Download patch file Download diff file Expand all files Collapse all files

1
res/css/_components.pcss
View file

@ -94,6 +94,7 @@
@import "./views/context_menus/_RoomNotificationContextMenu.pcss";
@import "./views/dialogs/_AddExistingToSpaceDialog.pcss";
@import "./views/dialogs/_AnalyticsLearnMoreDialog.pcss";
@import "./views/dialogs/_AppDownloadDialog.pcss";
@import "./views/dialogs/_BugReportDialog.pcss";
@import "./views/dialogs/_BulkRedactDialog.pcss";
@import "./views/dialogs/_ChangelogDialog.pcss";

70
res/css/views/dialogs/_AppDownloadDialog.pcss Normal file
View file

@ -0,0 +1,70 @@
.mx_AppDownloadDialog {
display: flex;
flex-direction: column;
gap: $spacing-32;
color: $primary-content;
.mx_AppDownloadDialog_desktop {
display: flex;
flex-direction: column;
align-items: center;
gap: $spacing-16;
}
.mx_AppDownloadDialog_mobile {
display: flex;
flex-direction: row;
gap: $spacing-24;
.mx_AppDownloadDialog_app {
display: flex;
flex-direction: column;
flex-grow: 1;
flex-basis: 50%;
align-items: center;
gap: $spacing-16;
.mx_QRCode {
padding: $spacing-24;
border: 1px solid $quinary-content;
border-radius: 4px;
align-self: stretch;
display: flex;
align-items: center;
flex-direction: column;
.mx_VerificationQRCode {
height: 144px;
width: 144px;
image-rendering: pixelated;
border-radius: 0;
}
}
.mx_AppDownloadDialog_info {
font-size: $font-12px;
color: $tertiary-content;
}
.mx_AppDownloadDialog_links {
display: flex;
flex-direction: row;
gap: $spacing-8;
.mx_AccessibleButton {
svg {
height: 40px;
}
}
}
}
}
.mx_AppDownloadDialog_legal {
p {
margin: 0;
font-size: $font-12px;
color: $tertiary-content;
}
}
}