MOBILE-4081 reconnect: Order login-methods and qrlogin in the template

main
Alfonso Salces 2022-12-05 13:51:16 +01:00
parent ff7d7eb12f
commit ef5bcbee86
4 changed files with 15 additions and 25 deletions

View File

@ -1,8 +1,7 @@
<core-spacer *ngIf="loginMethods?.length" class="core-login-methods__spacer"></core-spacer>
<ion-list *ngIf="loginMethods?.length" class="ion-padding-top core-login-methods">
<ion-button [fill]="'clear'" class="ion-text-wrap" *ngFor="let method of loginMethods" (click)="method.action()"
<ng-container *ngIf="loginMethods?.length">
<ion-button [fill]="'outline'" class="ion-text-wrap ion-margin" *ngFor="let method of loginMethods" (click)="method.action()"
[attr.aria-label]="method.name" expand="block">
<ion-icon *ngIf="method.icon" [name]="method.icon" slot="start"></ion-icon>
<ion-label>{{ method.name }}</ion-label>
</ion-button>
</ion-list>
</ng-container>

View File

@ -1,12 +0,0 @@
@import "~theme/globals";
ion-item-divider {
--item-divider-border-width: 4px;
margin: 0 1em;
}
.core-login-methods {
margin: .5em 0;
&__spacer {
margin: .5em 1em;
}
}

View File

@ -17,7 +17,7 @@ import { CoreLoginHelper, CoreLoginMethod } from '@features/login/services/login
@Component({
selector: 'core-login-methods',
templateUrl: 'login-methods.html',
styleUrls: ['../../login.scss', 'login-methods.scss'],
styleUrls: ['../../login.scss'],
})
export class CoreLoginMethodsComponent implements OnInit {

View File

@ -78,8 +78,18 @@
{{ 'core.login.loginbutton' | translate }}
</ion-button>
<ng-container *ngIf="showScanQR && !isBrowserSSO">
<!-- Forgotten password option. -->
<ion-button *ngIf="showForgottenPassword && !isOAuth" expand="block" fill="clear"
class="core-login-forgotten-password core-button-as-link ion-text-wrap" (click)="forgottenPassword()">
{{ 'core.login.forgotten' | translate }}
</ion-button>
<div class="ion-text-center ion-padding core-login-site-qrcode-separator">{{ 'core.login.or' | translate }}</div>
<!-- Login methods -->
<core-login-methods></core-login-methods>
<ng-container *ngIf="showScanQR && !isBrowserSSO">
<ion-button expand="block" fill="outline" class="ion-margin core-login-site-qrcode"
(click)="showInstructionsAndScanQR()">
<ion-icon slot="start" name="fas-qrcode" aria-hidden="true"></ion-icon>
@ -88,14 +98,7 @@
</ng-container>
</form>
<!-- Forgotten password option. -->
<ion-button *ngIf="showForgottenPassword && !isOAuth" expand="block" fill="clear"
class="core-login-forgotten-password core-button-as-link ion-text-wrap" (click)="forgottenPassword()">
{{ 'core.login.forgotten' | translate }}
</ion-button>
<!-- Login methods -->
<core-login-methods></core-login-methods>
<!-- Identity providers. -->
<ion-list *ngIf="identityProviders?.length" class="ion-padding-top core-login-identity-providers">