Skip to content
Snippets Groups Projects
Commit c741974f authored by Lukasz Lopatowski's avatar Lukasz Lopatowski
Browse files

Merge branch... 

Merge branch '217-re-work-login-and-registration-views-based-on-new-landing-page-design' into 'develop'

Resolve "Re-work login and registration views based on new landing page design"

See merge request !23
parents 7a2468d3 3fcf3927
Branches
Tags
1 merge request!23Resolve "Re-work login and registration views based on new landing page design"
Hide whitespace changes
Inline Side-by-side
Showing
with 126 additions and 37 deletions
src/app/shared/common/domainfilter/domainfilter.component.css
+ 4
− 0
View file @ c741974f
......@@ -35,3 +35,7 @@
max-height: 450px;
overflow-y: auto;
}
.dropdown-menu>.active>a, .dropdown-menu>.active>a:focus, .dropdown-menu>.active>a:hover{
background-color: #233354;
background-image: unset;
}
src/app/shared/common/domainfilter/domainfilter.component.html
+ 1
− 1
View file @ c741974f
<span [routerLinkActiveOptions]="{exact:true}" [routerLinkActive]="['active']" class="dropdown dropdown-domains">
<a class="dropdown-toggle" data-close-others="true" data-toggle="dropdown" href="#">
<span style="color: gray;">{{ "FILTER.DOMAIN" | translate }}: {{ getCurrent() }}<span class="caret"></span></span>
<span style="color: #6D788E;">{{ "FILTER.DOMAIN" | translate }}: {{ getCurrent() }}<span class="caret"></span></span>
</a>
<ul class="dropdown-menu" [ngClass]="{'long-domain-list': (domains | async)?.length > 16}">
<input *ngIf="(domains | async)?.length > 16" class="search" type="text" [(ngModel)]="searchTerm"
......
src/app/shared/navbar/navbar.component.css
+ 49
− 3
View file @ c741974f
......@@ -26,6 +26,15 @@
.lang-circle-icon{
height: 26px;
}
.navbar-left{
padding-top: 6px;
display: flex;
align-items: center;
}
.navbar-right{
display:flex;
align-items: center;
}
@media (max-width: 1199px) {
.navbar-collapse .nav > .divider-vertical {
......@@ -39,6 +48,7 @@
}
.navbar-left,.navbar-right {
float: none !important;
display:block;
}
.navbar-toggle {
display: block;
......@@ -81,10 +91,11 @@
}
.navbar .divider-vertical {
height: 50px;
height: 30px;
width: 1px;
margin: 0 5px;
border-right: 2px solid #ffffff;
border-left: 2px solid #e6e6e6;
background-color: #6D788E;
border-radius: 99px;
}
.navbar-inverse .divider-vertical {
......@@ -93,8 +104,18 @@
}
.btn{
background: transparent;
margin-left: 5px;
}
.btn:hover:active:focus{
color:#142548;
background: #D1D1D1;
}
.btn:focus{
color:#142548;
background: #D1D1D1;
outline: none;
}
.navbar-list, .navbar-list:link {
color: rgb(51, 51, 51);
......@@ -141,6 +162,10 @@
padding-bottom: 10px;
line-height: 20px;
}
.dropdown-menu>.active>a, .dropdown-menu>.active>a:focus, .dropdown-menu>.active>a:hover{
background-color: #233354;
background-image: unset;
}
.dropdown-menu>li>span {
display: block;
......@@ -172,3 +197,24 @@
overflow: hidden;
border-top: 1px solid #e9ecef;
}
.navbar-default{
padding: 5px 0;
border-top: none;
color: #6D788E;
}
.navbar-default .navbar-nav>li>a{
color: #6D788E;
padding:10px;
}
.navbar-default .navbar-nav>.active>a{
border-radius: 5px;
color: #142548;
padding:10px;
background-color: #D1D1D1;
}
.navbar-default .navbar-nav>.open>a{
border-radius: 5px;
color: #142548;
padding:10px;
background-color: #D1D1D1;
}
src/app/shared/navbar/navbar.component.html
+ 8
− 4
View file @ c741974f
<nav class="navbar navbar-default" id="navbar" role="navigation" style="margin:0">
<div class="container-fluid">
<div class="navbar-header">
<a routerLink="/"><img alt="Geant" src="assets/images/logo-small.png" style="margin: 5px; height:35px"></a>
<a routerLink="/"><img alt="Geant" src="assets/images/logo-small.png" style="margin: 8px; padding:4px; height:35px"></a>
<button class="navbar-toggle" data-target="#navbarCollapse" data-toggle="collapse" type="button">
<span class="sr-only">Toggle Navigation</span>
<em class="fas fa-bars"></em>
......@@ -108,9 +108,13 @@
<ul *ngIf="!authService.isLogged()" class="nav navbar-nav pull-right-lg" id="navbar-main-not-logged">
<li>
<button *ngIf="router.url == '/welcome' || router.url.startsWith('/welcome/login') || router.url == '/welcome/registration'"
class="btn navbar-btn" data-target="#login-register-panel" data-toggle="collapse">
{{ 'NAVBAR.LOGIN_REGISTER' | translate }}
<button *ngIf="router.url == '/welcome' || router.url.startsWith('/welcome/login') || router.url == '/welcome/registration'" data-parent="#accordion"
class="btn navbar-btn accordion-group" data-target="#login-panel" data-toggle="collapse" [routerLink]="['welcome/login']">
{{ 'WELCOME.LOGIN' | translate }}
</button>
<button *ngIf="router.url == '/welcome' || router.url.startsWith('/welcome/login') || router.url == '/welcome/registration'" data-parent="#accordion"
class="btn navbar-btn accordion-group" data-target="#register-panel" data-toggle="collapse" [routerLink]="['welcome/registration']">
{{ 'WELCOME.REGISTER' | translate }}
</button>
</li>
<li *ngIf="isServiceAvailable">
......
src/app/welcome/welcome.component.css
+ 6
− 0
View file @ c741974f
......@@ -75,3 +75,9 @@ html, body {
stroke-dashoffset: 0;
}
}
.panel-group{
margin: 0;
}
.panel+.panel{
margin: 0;
}
src/app/welcome/welcome.component.html
+ 41
− 29
View file @ c741974f
......@@ -12,7 +12,7 @@
<div *ngIf="landingProfile === 'VNOC'; else elseBlock">
<div class="row">
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12" id="welcome-container"
style="text-align: justify; padding: 0">
style="text-align: justify; padding: 0">
<div class="col-lg-12" style="padding: 0">
<section class="flex" style="justify-content: space-between; align-items: center;">
<div class="flex flex-column w-50" style="padding-left:160px; align-items: center">
......@@ -44,21 +44,27 @@
</div>
</section>
</div>
<div id="login-register-panel" class="col-lg-3 col-md-5 col-sm-6 col-xs-12 pull-right login-vertical-offset"
[ngClass]="router.url.startsWith('/welcome/login?ssoUserId=') ? '' : 'collapse'"
style="z-index: 800; position: fixed; right: 1px; margin-top: -15px; max-height: 50vh; font-size: 14px; padding-top: 20px">
<div class="panel panel-default">
<div class="panel-heading">
<div class="panel-group" id="accordion">
<div class="panel panel-default" style="border:none">
<div id="login-panel" class="col-lg-3 col-md-5 col-sm-6 col-xs-12 pull-right login-vertical-offset panel-collapse collapse"
[ngClass]="router.url.startsWith('/welcome/login?ssoUserId=') ? '' : 'collapse'"
style="z-index: 800; position: fixed; right: 1px; max-height: 50vh; font-size: 14px;">
<div class="panel panel-default ">
<div class="panel-body" id="login-out" style="overflow-y: auto;">
<nmaas-login></nmaas-login>
</div>
</div>
</div>
<div class="panel-body" id="login-out" style="overflow-y: auto;">
<ul class="nav nav-tabs nav-justified">
<li role="login" [routerLinkActive]="['active']" [routerLinkActiveOptions]="{exact:false}">
<a [routerLink]="['login']">{{ 'WELCOME.LOGIN' | translate }}</a></li>
<li role="registration" [routerLinkActive]="['active']"
[routerLinkActiveOptions]="{exact:true}">
<a [routerLink]="['registration']">{{ 'WELCOME.REGISTER' | translate }}</a></li>
</ul>
<router-outlet></router-outlet>
</div>
<div class="panel panel-default" style="border:none" >
<div id="register-panel" class="col-lg-3 col-md-5 col-sm-6 col-xs-12 pull-right login-vertical-offset panel-collapse collapse"
[ngClass]="router.url.startsWith('/welcome/login?ssoUserId=') ? '' : 'collapse'"
style="z-index: 800; position: fixed; right: 1px; max-height: 50vh; font-size: 14px;">
<div class="panel panel-default">
<div class="panel-body" id="login-out" style="overflow-y: auto;">
<nmaas-registration></nmaas-registration>
</div>
</div>
</div>
</div>
</div>
......@@ -139,21 +145,27 @@
</div>
</section>
</div>
<div id="login-register-panel" class="col-lg-3 col-md-5 col-sm-6 col-xs-12 pull-right login-vertical-offset"
[ngClass]="router.url.startsWith('/welcome/login?ssoUserId=') ? '' : 'collapse'"
style="z-index: 800; position: fixed; right: 1px; margin-top: -15px; max-height: 50vh; font-size: 14px; padding-top: 20px">
<div class="panel panel-default">
<div class="panel-heading">
<div class="panel-group" id="accordion">
<div class="panel panel-default" style="border:none">
<div id="login-panel" class="col-lg-3 col-md-5 col-sm-6 col-xs-12 pull-right login-vertical-offset panel-collapse collapse"
[ngClass]="router.url.startsWith('/welcome/login?ssoUserId=') ? '' : 'collapse'"
style="z-index: 800; position: fixed; right: 1px; max-height: 50vh; font-size: 14px;">
<div class="panel panel-default ">
<div class="panel-body" id="login-out" style="overflow-y: auto;">
<nmaas-login></nmaas-login>
</div>
</div>
</div>
<div class="panel-body" id="login-out" style="overflow-y: auto;">
<ul class="nav nav-tabs nav-justified">
<li role="login" [routerLinkActive]="['active']" [routerLinkActiveOptions]="{exact:false}">
<a [routerLink]="['login']">{{ 'WELCOME.LOGIN' | translate }}</a></li>
<li role="registration" [routerLinkActive]="['active']"
[routerLinkActiveOptions]="{exact:true}">
<a [routerLink]="['registration']">{{ 'WELCOME.REGISTER' | translate }}</a></li>
</ul>
<router-outlet></router-outlet>
</div>
<div class="panel panel-default" style="border:none" >
<div id="register-panel" class="col-lg-3 col-md-5 col-sm-6 col-xs-12 pull-right login-vertical-offset panel-collapse collapse"
[ngClass]="router.url.startsWith('/welcome/login?ssoUserId=') ? '' : 'collapse'"
style="z-index: 800; position: fixed; right: 1px; max-height: 50vh; font-size: 14px;">
<div class="panel panel-default">
<div class="panel-body" id="login-out" style="overflow-y: auto;">
<nmaas-registration></nmaas-registration>
</div>
</div>
</div>
</div>
</div>
......
src/styles.css
+ 17
− 0
View file @ c741974f
......@@ -54,3 +54,20 @@
font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
font-size: 14px;
}
.btn-primary{
background:#233354;
border:none;
}
.btn-primary:hover{
background: #414f6b;
border:none;
}
.btn-primary[disabled]{
text-shadow:none;
background: #414f6b;
cursor: not-allowed;
/*color: #61b4f9;*/
}
.btn-primary[disabled]:hover{
background: #414f6b;
}
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment