forks/peertube
1
0
Fork 0
Code Releases Activity

Prefer using our icons for notifications

Browse source
This commit is contained in:
Chocobozzz 2022-06-10 15:14:49 +02:00
parent a14c176472
commit 073367bb65
No known key found for this signature in database
GPG key ID: 583A612D890159BE
3 changed files with 17 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
client/src/app/app.component.html
View file

@ -53,9 +53,7 @@
<p>{{ message.detail }}</p> <p>{{ message.detail }}</p>
</div> </div>
<span *ngIf="message.severity === 'success'" class="glyphicon glyphicon-ok"></span> <my-global-icon [iconName]="getNotificationIcon(message)"></my-global-icon>
<span *ngIf="message.severity === 'info'" class="glyphicon glyphicon-info-sign"></span>
<span *ngIf="message.severity === 'error'" class="glyphicon glyphicon-remove"></span>
</div> </div>
</ng-template> </ng-template>
</p-toast> </p-toast>

12
client/src/app/app.component.ts
View file

@ -31,6 +31,7 @@ import { BroadcastMessageLevel, HTMLServerConfig, UserRole } from '@shared/model
import { MenuService } from './core/menu/menu.service' import { MenuService } from './core/menu/menu.service'
import { POP_STATE_MODAL_DISMISS } from './helpers' import { POP_STATE_MODAL_DISMISS } from './helpers'
import { InstanceService } from './shared/shared-instance' import { InstanceService } from './shared/shared-instance'
import { GlobalIconName } from './shared/shared-icons'
@Component({ @Component({
selector: 'my-app', selector: 'my-app',
@ -150,6 +151,17 @@ export class AppComponent implements OnInit, AfterViewInit {
this.screenService.isBroadcastMessageDisplayed = false this.screenService.isBroadcastMessageDisplayed = false
} }
getNotificationIcon (message: { severity: 'success' | 'error' | 'info' }): GlobalIconName {
switch (message.severity) {
case 'error':
return 'cross'
case 'success':
return 'tick'
case 'info':
return 'help'
}
}
private initRouteEvents () { private initRouteEvents () {
const eventsObs = this.router.events const eventsObs = this.router.events

8
client/src/sass/primeng-custom.scss
View file

@ -927,19 +927,19 @@ p-toast {
box-shadow: 0 2px 12px 0 rgba(0, 0 , 0, .1); box-shadow: 0 2px 12px 0 rgba(0, 0 , 0, .1);
overflow: hidden; overflow: hidden;
&.p-toast-message-success .glyphicon { &.p-toast-message-success my-global-icon {
color: #8BC34A !important; color: #8BC34A !important;
} }
&.p-toast-message-error .glyphicon { &.p-toast-message-error my-global-icon {
color: #F44336 !important; color: #F44336 !important;
} }
&.p-toast-message-warn .glyphicon { &.p-toast-message-warn my-global-icon {
color: #F1680D !important; color: #F1680D !important;
} }
&.p-toast-message-info .glyphicon { &.p-toast-message-info my-global-icon {
color: #03A9F4 !important; color: #03A9F4 !important;
} }