This commit is contained in:
Aaron Greenspan
2021-01-17 11:18:55 -07:00
committed by Aiden McClelland
parent 567ac9fa50
commit aef63a60c2
2 changed files with 56 additions and 3 deletions

View File

@@ -24,19 +24,30 @@
<ion-col *ngFor="let app of apps" sizeXs="4" sizeSm="3" sizeMd="2" sizeLg="2">
<ng-container *ngIf="{ tor: app.subject.torAddress | async, status: app.subject.status | async, ui: app.subject.ui | async, iconURL: app.subject.iconURL | async | iconParse, title: app.subject.title | async } as vars" >
<ion-card class="installed-card" [class.installed-card-on]="vars.status === 'RUNNING'" style="position:relative" [routerLink]="['/services', 'installed', app.id]">
<ion-button
<div class="launch-container" *ngIf="vars.ui && !isConsulate" [disabled]="vars.status !== AppStatus.RUNNING || !isTor" (click)="launchUiTab(vars.tor)">
<div class="launch-button-triangle">
</div>
<!-- <ion-button>
</ion-button> -->
</div>
<!-- <ion-button
*ngIf="vars.ui && !isConsulate"
[disabled]="vars.status !== AppStatus.RUNNING || !isTor"
[class.launch-button-off]="vars.status !== AppStatus.RUNNING || !isTor"
class="launch-button-transparent"
class="launch-button-triangle"
(click)="launchUiTab(vars.tor)"
>
<ion-icon style="position: absolute;
top: 6px;
right: -1px;
width: 13px;" name="rocket-outline"></ion-icon>
</ion-button>
</ion-button> -->
<img style="position: absolute" class="main-img" [src]="vars.iconURL" [alt]="app.subject.title | async" />
<img class="main-img" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mNkYAAAAAYAAjCB0C8AAAAASUVORK5CYII=">

View File

@@ -90,10 +90,52 @@
--background: linear-gradient(200deg, rgb(35, 178, 251, 1), rgb(35, 178, 251, 0.25));
}
.launch-button-triangle {
// position: absolute;
// --border-radius: 0px;
width: 0px;
height: 0px;
right: 0px;
// --box-shadow: none;
/* top: -5px; */
// border-style: outset;
// border-width: 0px 0px 0px 0px;
// border-color: #2a2a2a;
margin: 0px;
// --background: linear-gradient(200deg, rgb(35, 178, 251, 1), rgb(35, 178, 251, 0.25));
border-style: solid;
border-width: 0 72px 73px 0;
border-color: blue;
/* border-width: 40px 80px 40px 0; */
border-color: transparent #007bff transparent transparent;
}
.launch-button-off {
--background: transparent;
--box-shadow: none;
border-color: transparent;
ion-icon {
color: var(--ion-color-medium);
}
}
.launch-container {
position: absolute;
// --border-radius: 0px;
width: 55%;
height: 55%;
right: 0px;
top: 0px;
// --box-shadow: none;
/* top: -5px; */
// border-style: outset;
// border-width: 0px 0px 0px 0px;
// border-color: #2a2a2a;
margin: 0px;
// --background: linear-gradient(200deg, rgb(35, 178, 251, 1), rgb(35, 178, 251, 0.25));
// border-style: solid;
// border-width: 0 72px 73px 0;
// border-color: blue;
/* border-width: 40px 80px 40px 0; */
// border-color: transparent #007bff transparent transparent;
}