Commit a7280607 authored by Chris Hines's avatar Chris Hines
Browse files

more styling changes

parent 94ba5aff
Pipeline #7810 passed with stages
in 13 minutes and 7 seconds
......@@ -51,7 +51,7 @@ import { ShareconnectComponent } from './shareconnect/shareconnect.component';
import { LaunchDialogComponent } from './launch-dialog/launch-dialog.component';
import { ModaldialogComponent } from './modaldialog/modaldialog.component'
import {OverlayModule} from '@angular/cdk/overlay';
import { LoginComponent } from './login/login.component';
import { LoginComponent, SafeHtmlPipe } from './login/login.component';
import { SettingsComponent } from './settings/settings.component';
import { LogoutComponent } from './logout/logout.component';
import { AccountinfoComponent } from './accountinfo/accountinfo.component';
......@@ -83,6 +83,7 @@ import {SettingsService } from './settings.service';
SettingsComponent,
LogoutComponent,
AccountinfoComponent,
SafeHtmlPipe,
],
imports: [
BrowserModule,
......
<div fxLayout="column" style="height: 100%">
<!--<div fxFlex style="flex: 1 1 0%; box-sizing: border-box">-->
<div fxLayout="column" fxLayoutAlign="space-around stretch" style="height: 100%; width: 100%" >
<div fxLayout="row">
<div fxFlex></div>
<div fxFlex fxLayout="column">
<div style="width: 100%">
<mat-form-field fxFlex>
<mat-label>Choose a server</mat-label>
<mat-select [(value)]="selected">
<mat-option *ngFor="let sshauthzserver of (authService.loggedOutAuthZ | async)" [value]="sshauthzserver">
{{ sshauthzserver.name }}
</mat-option>
</mat-select>
</mat-form-field>
</div>
<div fxLayout="row" fxLayoutAlign="space-around center" style="width: 100%">
<button mat-flat-button (click)="login()" color=primary style="width: 25%; text-align: center">Login</button>
<button *ngIf="(authService.loggedInAuthZ | async) != null && (authService.loggedInAuthZ | async).length > 0" mat-flat-button routerLink="/launch" color=warn style="width: 25%; text-align: center">Cancel</button>
</div>
<div *ngIf="selected !== undefined" [innerHTML]="selected.desc">
</div>
<div fxLayout="row" fxLayoutAlign="space-around stretch" style="height:100%; width: 100%" align="center" text-align="center">
<div fxFlex></div>
<div style="width: 500px; height: 100%">
<!--<div fxFlex style="flex: 1 1 0%; box-sizing: border-box">-->
<div fxLayout="column" fxLayoutAlign="none stretch" fxFlex >
<div style="height: 50px"></div>
<mat-form-field style="width: 100%">
<mat-label>Choose a server</mat-label>
<mat-select [(value)]="selected">
<mat-option *ngFor="let sshauthzserver of (authService.loggedOutAuthZ | async)" [value]="sshauthzserver">
{{ sshauthzserver.name }}
</mat-option>
</mat-select>
</mat-form-field>
<div style="height: 50px"></div>
<div fxLayout="row" fxLayoutAlign="space-around center" style="width: 100%">
<button mat-flat-button (click)="login()" [disabled]="selected === undefined" color=primary style="width: 25%; text-align: center">Login</button>
<button *ngIf="(authService.loggedInAuthZ | async) != null && (authService.loggedInAuthZ | async).length > 0" mat-flat-button routerLink="/launch" color=warn style="width: 25%; text-align: center">Cancel</button>
</div>
<div fxFlex></div>
<div style="height: 50px"></div>
<div fxFlex *ngIf="selected !== undefined" [innerHTML]="selected.desc | safeHtml"></div>
</div>
<div fxFlex></div>
<button mat-icon-button routerLink="/settings"><mat-icon>settings</mat-icon></button>
</div>
<!--</div>-->
<!--</div>-->
</div>
<div fxFlex></div>
</div>
......@@ -16,6 +16,17 @@ import { LogoutdialogComponent } from '../logoutdialog/logoutdialog.component';
import { SshAuthzServer } from '../identity';
import { ComputesitesService } from '../computesites.service';
import {DomSanitizer} from '@angular/platform-browser';
import {PipeTransform, Pipe} from "@angular/core";
@Pipe({ name: 'safeHtml'})
export class SafeHtmlPipe implements PipeTransform {
constructor(private sanitized: DomSanitizer) {}
transform(value) {
return this.sanitized.bypassSecurityTrustHtml(value);
}
}
@Component({
selector: 'app-login',
templateUrl: './login.component.html',
......
<div style="height: 100%">
<mat-toolbar color="primary">
<mat-toolbar-row>
<button mat-icon-button ><mat-icon>menu</mat-icon></button>
<span>Strudel v2.0</span>
<span class="fill-horizontal-space"></span>
</mat-toolbar-row>
</mat-toolbar>
<div style="height: 10%"></div>
<div fxLayout=row style="width: 100vw">
<div fxFlex></div>
<div fxLayout="column" style="width: 25%">
<div style="text-align: center">Really Logout?</div>
<div style="height: 10%"></div>
<div fxLayout="row" fxLayoutAlign="space-around center" style="width: 100%">
<button mat-flat-button (click)="logout()" color=warn style="width: 25%;">Logout</button>
<button mat-flat-button routerLink="/launch" color=primary style="width: 25%;">Cancel</button>
......
......@@ -11,7 +11,7 @@
"scope": "user:email",
"cafp": "RSA SHA256:cmDxHrZQSPlBMUUcI/BWmruXho1XOzfXPDHSqVTwV2I",
"signup": "https://docs.massive.org.au/M3/requesting-an-account.html",
"desc": "The Characterisation Virtual Laboratory focuses on providing tools necessary for processing various experimental data such as MRI, CT and EM imaging techniques.<p>By Authenticating to the CVL you will gain access to the CVL@MASSIVE cluster at Monash University"
"desc": "<div><div>Don't have an account?</div><div style=\"height:25px\"></div><div><a href=signup style=\"text-decoration: none\">Signup</a></div><div style=\"height:25px\"></div><div>The Characterisation Virtual Laboratory focuses on providing tools necessary for processing various experimental data such as MRI, CT and EM imaging techniques.<p>By Authenticating to the CVL you will gain access to the CVL@MASSIVE cluster at Monash University</div></div>"
},
{
"authorise": "https://sshauthz.cloud.cvl.org.au/pysshauthz/oauth2/oauth/authorize/choose",
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment