Adds hover effects on login buttons and reverts error on form-composite-field
This commit is contained in:
parent
43d9e2bd44
commit
45e5848956
|
@ -7,21 +7,21 @@
|
||||||
<div class="row justify-content-center pb-4">
|
<div class="row justify-content-center pb-4">
|
||||||
<div class="flex-column">
|
<div class="flex-column">
|
||||||
<div *ngIf="hasOpenAireOauth()" class="col-auto pr-4">
|
<div *ngIf="hasOpenAireOauth()" class="col-auto pr-4">
|
||||||
<button mat-icon-button (click)="openaireLogin()" class="d-flex justify-content-center">
|
<button mat-icon-button (click)="openaireLogin()" class="openaireIconButton d-flex justify-content-center align-items-center">
|
||||||
<span class="openaireIcon"></span>
|
<span class="openaireIcon"></span>
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="flex-column">
|
<div class="flex-column">
|
||||||
<div *ngIf="hasOrcidOauth()" class="col-auto pl-4 pr-4">
|
<div *ngIf="hasOrcidOauth()" class="col-auto pl-4 pr-4">
|
||||||
<button mat-icon-button (click)="orcidLogin()" class="d-flex justify-content-center">
|
<button mat-icon-button (click)="orcidLogin()" class="orcidIconMediumButton d-flex justify-content-center align-items-center">
|
||||||
<span class="orcidIconMedium"></span>
|
<span class="orcidIconMedium"></span>
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="flex-column">
|
<div class="flex-column">
|
||||||
<div *ngIf="hasB2AccessOauth()" class="col-auto pl-4">
|
<div *ngIf="hasB2AccessOauth()" class="col-auto pl-4">
|
||||||
<button mat-icon-button (click)="b2AccessLogin()" class="d-flex justify-content-center">
|
<button mat-icon-button (click)="b2AccessLogin()" class="iconmediumButton d-flex justify-content-center align-items-center">
|
||||||
<span class="iconmedium"></span>
|
<span class="iconmedium"></span>
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
@ -30,21 +30,21 @@
|
||||||
<div class="row justify-content-center">
|
<div class="row justify-content-center">
|
||||||
<div class="flex-column">
|
<div class="flex-column">
|
||||||
<div *ngIf="hasGoogleOauth()" class="col-auto pr-4">
|
<div *ngIf="hasGoogleOauth()" class="col-auto pr-4">
|
||||||
<button mat-icon-button id="googleSignInButton" class="d-flex justify-content-center">
|
<button mat-icon-button id="googleSignInButton" class="d-flex justify-content-center align-items-center">
|
||||||
<span class="googleIcon"></span>
|
<span class="googleIcon"></span>
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="flex-column">
|
<div class="flex-column">
|
||||||
<div *ngIf="hasFacebookOauth()" class="col-auto pl-4 pr-4">
|
<div *ngIf="hasFacebookOauth()" class="col-auto pl-4 pr-4">
|
||||||
<button mat-icon-button (click)="facebookLogin()" class="d-flex justify-content-center">
|
<button mat-icon-button (click)="facebookLogin()" class="facebookIconButton d-flex justify-content-center align-items-center">
|
||||||
<span class="facebookIcon"></span>
|
<span class="facebookIcon"></span>
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="flex-column">
|
<div class="flex-column">
|
||||||
<div *ngIf="hasTwitterOauth()" class="col-auto pl-4">
|
<div *ngIf="hasTwitterOauth()" class="col-auto pl-4">
|
||||||
<button mat-icon-button (click)="twitterLogin()" class="d-flex justify-content-center">
|
<button mat-icon-button (click)="twitterLogin()" class="twitterIconButton d-flex justify-content-center align-items-center">
|
||||||
<span class="twitterIcon"></span>
|
<span class="twitterIcon"></span>
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
@ -147,4 +147,4 @@
|
||||||
<h5>{{ 'HOME.LOGIN.TEXT' | translate }}</h5>
|
<h5>{{ 'HOME.LOGIN.TEXT' | translate }}</h5>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div> -->
|
</div> -->
|
||||||
|
|
|
@ -32,13 +32,13 @@
|
||||||
font: Bold 38px/82px Roboto;
|
font: Bold 38px/82px Roboto;
|
||||||
height: 60px;
|
height: 60px;
|
||||||
letter-spacing: -0.95px;
|
letter-spacing: -0.95px;
|
||||||
color: #23BCBA;
|
color: #23bcba;
|
||||||
margin-top: 11px;
|
margin-top: 11px;
|
||||||
margin-bottom: 21px;
|
margin-bottom: 21px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.line {
|
.line {
|
||||||
border-top: 5px solid #23BCBA;
|
border-top: 5px solid #23bcba;
|
||||||
width: 116px;
|
width: 116px;
|
||||||
margin-bottom: 97px;
|
margin-bottom: 97px;
|
||||||
}
|
}
|
||||||
|
@ -165,18 +165,18 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.accesss-methods .configurable-logo {
|
.accesss-methods .configurable-logo {
|
||||||
flex-grow: 0;
|
flex-grow: 0;
|
||||||
padding-top: 21px;
|
padding-top: 21px;
|
||||||
padding-bottom: 21px;
|
padding-bottom: 21px;
|
||||||
margin-top: 5px;
|
margin-top: 5px;
|
||||||
height: 90px;
|
height: 90px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.accesss-methods .zenodo-logo {
|
.accesss-methods .zenodo-logo {
|
||||||
height: 75px;
|
height: 75px;
|
||||||
padding-top: 8px;
|
padding-top: 8px;
|
||||||
margin-top: 13px;
|
margin-top: 13px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.tip {
|
.tip {
|
||||||
margin-top: -20px;
|
margin-top: -20px;
|
||||||
|
@ -234,16 +234,38 @@ span.facebookIcon {
|
||||||
|
|
||||||
span.twitterIcon {
|
span.twitterIcon {
|
||||||
background: url("../../../../assets/images/argos-login/NoPath\ -\ Copy\ \(5\).png") no-repeat;
|
background: url("../../../../assets/images/argos-login/NoPath\ -\ Copy\ \(5\).png") no-repeat;
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
span.googleIcon, span.facebookIcon, span.twitterIcon {
|
span.googleIcon,
|
||||||
|
span.facebookIcon,
|
||||||
|
span.twitterIcon {
|
||||||
float: left;
|
float: left;
|
||||||
transform: scale(0.8);
|
transform: scale(0.8);
|
||||||
width: 45px;
|
width: 45px;
|
||||||
height: 45px;
|
height: 45px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#googleSignInButton,
|
||||||
|
.facebookIconButton,
|
||||||
|
.twitterIconButton,
|
||||||
|
.openaireIconButton,
|
||||||
|
.orcidIconMediumButton,
|
||||||
|
.iconmediumButton {
|
||||||
|
width: 60px !important;
|
||||||
|
height: 60px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
#googleSignInButton:hover,
|
||||||
|
.facebookIconButton:hover,
|
||||||
|
.twitterIconButton:hover,
|
||||||
|
.openaireIconButton:hover,
|
||||||
|
.orcidIconMediumButton:hover,
|
||||||
|
.iconmediumButton:hover {
|
||||||
|
// background-color: #129d993b;
|
||||||
|
background-color: #ececec;
|
||||||
|
border-radius: 60%;
|
||||||
|
}
|
||||||
|
|
||||||
span.openaireIcon {
|
span.openaireIcon {
|
||||||
background: url("../../../../assets/images/argos-login/NoPath\ -\ Copy\ \(6\).png") no-repeat;
|
background: url("../../../../assets/images/argos-login/NoPath\ -\ Copy\ \(6\).png") no-repeat;
|
||||||
background-position: center;
|
background-position: center;
|
||||||
|
@ -257,7 +279,7 @@ span.orcidIconMedium {
|
||||||
background: url("../../../../assets/images/argos-login/NoPath\ -\ Copy.png") no-repeat;
|
background: url("../../../../assets/images/argos-login/NoPath\ -\ Copy.png") no-repeat;
|
||||||
background-position: center;
|
background-position: center;
|
||||||
float: left;
|
float: left;
|
||||||
transform: scale(0.80);
|
transform: scale(0.8);
|
||||||
width: 50px;
|
width: 50px;
|
||||||
height: 45px;
|
height: 45px;
|
||||||
}
|
}
|
||||||
|
@ -271,17 +293,17 @@ span.iconmedium {
|
||||||
}
|
}
|
||||||
|
|
||||||
span.configurableIcon {
|
span.configurableIcon {
|
||||||
float: right;
|
float: right;
|
||||||
width: 80px;
|
width: 80px;
|
||||||
height: 56px;
|
height: 56px;
|
||||||
}
|
}
|
||||||
|
|
||||||
span.zenodoIcon {
|
span.zenodoIcon {
|
||||||
background: url("../../../../assets/images/argos-login/zenodo-gradient-200.png") no-repeat;
|
background: url("../../../../assets/images/argos-login/zenodo-gradient-200.png") no-repeat;
|
||||||
background-position: center;
|
background-position: center;
|
||||||
float: right;
|
float: right;
|
||||||
transform: scale(0.70);
|
transform: scale(0.7);
|
||||||
width: 200px;
|
width: 200px;
|
||||||
height: 80px;
|
height: 80px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -301,14 +323,14 @@ span.zenodoIcon {
|
||||||
}
|
}
|
||||||
|
|
||||||
.configurable-button {
|
.configurable-button {
|
||||||
margin-top: 10px;
|
margin-top: 10px;
|
||||||
width: fit-content;
|
width: fit-content;
|
||||||
}
|
}
|
||||||
|
|
||||||
.zenodo-button {
|
.zenodo-button {
|
||||||
margin-top: 10px;
|
margin-top: 10px;
|
||||||
width: fit-content;
|
width: fit-content;
|
||||||
}
|
}
|
||||||
|
|
||||||
// .login-logo {
|
// .login-logo {
|
||||||
// background: url(img/open-dmp.png) no-repeat;
|
// background: url(img/open-dmp.png) no-repeat;
|
||||||
|
@ -318,7 +340,7 @@ span.zenodoIcon {
|
||||||
// }
|
// }
|
||||||
|
|
||||||
.laptop-img {
|
.laptop-img {
|
||||||
// background: url("../../../../assets/splash/assets/img/laptop.png") no-repeat;
|
// background: url("../../../../assets/splash/assets/img/laptop.png") no-repeat;
|
||||||
background: url("../../../../assets/splash/assets/img/1_Main/Png/Who\ \ \ Benefits\ Small.png") no-repeat;
|
background: url("../../../../assets/splash/assets/img/1_Main/Png/Who\ \ \ Benefits\ Small.png") no-repeat;
|
||||||
width: 164px;
|
width: 164px;
|
||||||
height: 200px;
|
height: 200px;
|
||||||
|
|
|
@ -1,6 +1,7 @@
|
||||||
<div *ngIf="form && this.visibilityRulesService.checkElementVisibility(this.form.get('id').value)" [formGroup]="form" class="dynamic-form-composite-field row">
|
<div *ngIf="form && this.visibilityRulesService.checkElementVisibility(this.form.get('id').value)" [formGroup]="form" class="dynamic-form-composite-field row">
|
||||||
|
|
||||||
<div *ngIf="form.get('fields').value.length === 1 && this.visibilityRulesService.checkElementVisibility(form.get('fields')['controls'][0].get('id').value)" class="col-12">
|
<!-- <div *ngIf="form.get('fields').value.length === 1 && this.visibilityRulesService.checkElementVisibility(form.get('fields')['controls'][0].get('id').value)" class="col-12"> -->
|
||||||
|
<div *ngIf="form.get('fields').length === 1 && this.visibilityRulesService.checkElementVisibility(form.get('fields')['controls'][0].get('id').value)" class="col-12">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-12">
|
<div class="col-12">
|
||||||
<app-form-composite-title class="row" [form]="form" [isChild]="isChild"></app-form-composite-title>
|
<app-form-composite-title class="row" [form]="form" [isChild]="isChild"></app-form-composite-title>
|
||||||
|
@ -22,7 +23,8 @@
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div *ngIf="form.get('fields').value.length > 1" class="col-12">
|
<!-- <div *ngIf="form.get('fields').value.length > 1" class="col-12"> -->
|
||||||
|
<div *ngIf="form.get('fields').length > 1" class="col-12">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-12">
|
<div class="col-12">
|
||||||
<app-form-composite-title class="row" [form]="form" [isChild]="isChild"></app-form-composite-title>
|
<app-form-composite-title class="row" [form]="form" [isChild]="isChild"></app-form-composite-title>
|
||||||
|
|
Loading…
Reference in New Issue