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

Iterate styles around Link new device via QR (#12356)

Browse source 
* Rearrange user settings tab order to move Sessions up to 2nd

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Iterate copy & iconography on Settings > Sessions > Link new device

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Iterate design of Scan QR code screen

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Tweak styles

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update tests and snapshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update tests and snapshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update screenshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
This commit is contained in:
Michael Telatynski 2024-03-22 15:50:06 +00:00 • committed by GitHub
parent 64806d0490
commit 56d7911897
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
13 changed files with 238 additions and 247 deletions
Download patch file Download diff file Expand all files Collapse all files

29
res/css/views/auth/_LoginWithQR.pcss
View file

@ -14,7 +14,12 @@ See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_LoginWithQRSection .mx_AccessibleButton {
.mx_LoginWithQRSection p {
margin-top: 0;
margin-bottom: $spacing-16;
}
.mx_LoginWithQRSection .mx_AccessibleButton svg {
margin-right: $spacing-12;
}
@ -69,7 +74,6 @@ limitations under the License.
}
.mx_QRCode {
padding: $spacing-12 $spacing-40;
margin: $spacing-28 0;
}
@ -89,7 +93,7 @@ limitations under the License.
.mx_LoginWithQR_centreTitle {
h1 {
text-align: centre;
text-align: center;
}
}
@ -141,14 +145,28 @@ limitations under the License.
}
}
.mx_LoginWithQR_heading {
display: flex;
gap: $spacing-12;
align-items: center;
}
.mx_LoginWithQR_BackButton {
height: $spacing-12;
margin-bottom: $spacing-24;
height: $spacing-28;
border-radius: $spacing-28;
padding: $spacing-4;
box-sizing: border-box;
background-color: var(--cpd-color-bg-subtle-secondary);
svg {
height: 100%;
}
}
.mx_LoginWithQR_breadcrumbs {
font-size: $font-13px;
color: var(--cpd-color-text-secondary);
}
.mx_LoginWithQR_main {
display: flex;
flex-direction: column;
@ -156,7 +174,6 @@ limitations under the License.
}
.mx_QRCode {
border: 1px solid $quinary-content;
border-radius: $spacing-8;
display: flex;
justify-content: center;