Start9/start-os
2
0
Fork 0
mirror of https://github.com/Start9Labs/start-os.git synced 2026-04-01 21:13:09 +00:00
Code Issues Packages Projects Releases Wiki Activity

styling etc

Browse Source
This commit is contained in:
Matt Hill
2021-06-28 14:36:57 -06:00
committed by Aiden McClelland
parent 517251d672
commit a2103d4307
49 changed files with 519 additions and 539 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
ui/src/app/components/status/status.component.html
View File

@@ -1,24 +1,9 @@
<p *ngIf="size === 'small'" style="margin: 0 0 4px 0;">
<ion-text [color]="color">{{ display }}</ion-text>
<p
[style.color]="'var(--ion-color-' + color + ')'"
[style.font-size]="size"
[style.font-style]="style"
[style.font-weight]="weight"
>
{{ display }}
<ion-spinner *ngIf="showDots" class="dots dots-small" name="dots" [color]="color"></ion-spinner>
</p>
<p *ngIf="size === 'italics-small'" style="margin: 0 0 4px 0; font-style: italic;">
<ion-text [color]="color">{{ display }}</ion-text>
<ion-spinner *ngIf="showDots" class="dots dots-small" name="dots" [color]="color"></ion-spinner>
</p>
<h3 *ngIf="size === 'medium'">
<ion-text [color]="color">{{ display }}</ion-text>
<ion-spinner *ngIf="showDots" class="dots dots-medium" name="dots" [color]="color"></ion-spinner>
</h3>
<h1 *ngIf="size === 'large'">
<ion-text [color]="color">{{ display }}</ion-text>
<ion-spinner *ngIf="showDots" class="dots" name="dots" [color]="color"></ion-spinner>
</h1>
<h1 *ngIf="size === 'bold-large'" style="font-size: 18px; font-weight: 500">
<ion-text [color]="color">{{ display }}</ion-text>
<ion-spinner *ngIf="showDots" class="dots" name="dots" [color]="color"></ion-spinner>
</h1>

20
ui/src/app/components/status/status.component.scss
View File

@@ -1,17 +1,5 @@
.icon-small {
width: auto;
height: 14px;
padding-left: 6px;
}
.icon-medium {
width: auto;
height: 18px;
padding-left: 8px;
}
.icon-large {
width: auto;
height: 24px;
padding-left: 12px;
p {
margin: 0;
overflow: hidden;
text-overflow: ellipsis;
}

4
ui/src/app/components/status/status.component.ts
View File

@@ -11,7 +11,9 @@ import { renderPkgStatus } from 'src/app/services/pkg-status-rendering.service'
export class StatusComponent {
@Input() pkg: PackageDataEntry
@Input() connection: ConnectionState
@Input() size: 'small' | 'medium' | 'large' | 'italics-small' | 'bold-large' = 'large'
@Input() size?: 'small' | 'medium' | 'large' = 'large'
@Input() style?: string = 'regular'
@Input() weight?: string = 'normal'
display = ''
color = ''
showDots = false