CIT
/
Vmeda.Online
forked from EVOgeek/Vmeda.Online
2
0
Fork 0
Code Pull Requests Activity

MOBILE-4201 login: Redesign reconnect page

main
Pau Ferrer Ocaña 2023-08-25 14:58:43 +02:00
parent 7dec27239d
commit 75171da002
3 changed files with 19 additions and 37 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
src/core/features/login/login.scss
View File

@ -29,29 +29,16 @@
}
}
form .item.item-input,
form .core-username.item {
form .item.item-input {
margin-bottom: 16px;
}
form .core-username.ios {
--inner-border-width: 0 0 1px 0;
}
form .item,
form .item ion-label {
--background: var(--core-login-input-background);
--color: var(--core-login-input-color);
}
form .core-username.item p {
font-size: 16px;
}
form .core-username.item.md p {
@include padding-horizontal(8px, null);
}
.core-login-site-logo img {
max-width: 100%;
}

35
src/core/features/login/pages/reconnect/reconnect.html
View File

@ -21,10 +21,6 @@
<core-loading [hideUntil]="!showLoading">
<div class="list-item-limited-width">
<div class="ion-text-wrap ion-text-center ion-margin-bottom" [ngClass]="{'item-avatar-center': showUserAvatar}">
<!-- Show user avatar. -->
<core-user-avatar class="large-avatar" *ngIf="showUserAvatar" [user]="siteInfo" [linkProfile]="false"
[siteId]="siteId"></core-user-avatar>
<div class="core-login-site-logo" *ngIf="!showUserAvatar">
<!-- Show site logo or a default image. -->
<img *ngIf="logoUrl" [src]="logoUrl" role="presentation" onError="this.src='assets/img/login_logo.png'" alt="">
@ -36,6 +32,13 @@
</p>
<p class="core-siteurl">{{siteUrl}}</p>
<!-- Show user avatar. -->
<core-user-avatar class="large-avatar" *ngIf="showUserAvatar" [user]="siteInfo" [linkProfile]="false"
[siteId]="siteId"></core-user-avatar>
<p *ngIf="siteInfo?.fullname" class="core-login-fullname">
<core-format-text [text]="siteInfo?.fullname" [filter]="false"></core-format-text>
</p>
<ion-card *ngIf="!isLoggedOut" class="core-danger-card core-login-reconnect-warning">
<ion-item>
<ion-icon name="fas-circle-exclamation" slot="start" aria-hidden="true"></ion-icon>
@ -50,13 +53,9 @@
<div [innerHTML]="exceededAttemptsHTML" (click)="exceededAttemptsClicked($event)"></div>
</core-login-exceeded-attempts>
</div>
<form *ngIf="!isOAuth" [formGroup]="credForm" (ngSubmit)="login($event)" class="core-login-form" #reconnectForm>
<ion-item class="ion-text-wrap core-username item-interactive">
<ion-label>
<p>{{username}}</p>
</ion-label>
</ion-item>
<ion-item class="ion-margin-bottom" *ngIf="!isBrowserSSO">
<form *ngIf="!isBrowserSSO" [formGroup]="credForm" (ngSubmit)="login($event)" class="core-login-form" #reconnectForm>
<ion-item class="ion-margin-bottom">
<ion-label class="sr-only">{{ 'core.login.password' | translate }}</ion-label>
<core-show-password name="password">
<ion-input class="core-ioninput-password" name="password" type="password"
@ -65,23 +64,23 @@
</ion-input>
</core-show-password>
</ion-item>
<ion-button *ngIf="!isBrowserSSO" type="submit" expand="block" [disabled]="!credForm.valid"
class="ion-margin core-login-login-button ion-text-wrap">
{{ 'core.login.loginbutton' | translate }}
</ion-button>
<ion-button expand="block" *ngIf="isBrowserSSO" (click)="openBrowserSSO()"
<ion-button type="submit" expand="block" [disabled]="!credForm.valid"
class="ion-margin core-login-login-button ion-text-wrap">
{{ 'core.login.loginbutton' | translate }}
</ion-button>
<!-- Forgotten password option. -->
<ion-button *ngIf="showForgottenPassword && !isOAuth" expand="block" fill="clear"
<ion-button *ngIf="showForgottenPassword && !isBrowserSSO" expand="block" fill="clear"
class="core-login-forgotten-password core-button-as-link ion-text-wrap" (click)="forgottenPassword()">
{{ 'core.login.forgotten' | translate }}
</ion-button>
</form>
<ion-button expand="block" *ngIf="isBrowserSSO" (click)="openBrowserSSO()"
class="ion-margin core-login-login-button ion-text-wrap">
{{ 'core.login.loginbutton' | translate }}
</ion-button>
<!-- Additional Login methods -->
<core-login-methods *ngIf="siteConfig" [siteConfig]="siteConfig" [reconnect]="true" [siteUrl]="siteUrl"
[redirectData]="redirectData"></core-login-methods>

6
src/core/features/login/pages/reconnect/reconnect.ts
View File

@ -50,7 +50,6 @@ export class CoreLoginReconnectPage implements OnInit, OnDestroy {
showForgottenPassword = true;
showUserAvatar = false;
isBrowserSSO = false;
isOAuth = false;
isLoggedOut: boolean;
siteId!: string;
siteInfo?: CoreSiteBasicInfo;
@ -118,9 +117,6 @@ export class CoreLoginReconnectPage implements OnInit, OnDestroy {
this.username = site.infos.username;
this.supportConfig = new CoreUserAuthenticatedSupportConfig(site);
// If login was OAuth we should only reach this page if the OAuth method ID has changed.
this.isOAuth = site.isOAuth();
const availableSites = await CoreLoginHelper.getAvailableSites();
// Show logo instead of avatar if it's a fixed site.
@ -185,7 +181,7 @@ export class CoreLoginReconnectPage implements OnInit, OnDestroy {
CoreEvents.trigger(CoreEvents.LOGIN_SITE_CHECKED, { config: this.siteConfig });
}
this.isBrowserSSO = !this.isOAuth && CoreLoginHelper.isSSOLoginNeeded(this.siteConfig.typeoflogin);
this.isBrowserSSO = CoreLoginHelper.isSSOLoginNeeded(this.siteConfig.typeoflogin);
await CoreSites.checkApplication(this.siteConfig);