carloshra/nexus-spa
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fixed badge colors on dark

Browse Source
This commit is contained in:
Cagatay Civici
2025-01-08 16:30:26 +03:00
parent 34bce8d2f4
commit ab8d8abe13
2 changed files with 16 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
src/app/pages/uikit/listdemo.ts
View File

@@ -1,12 +1,12 @@
import { CommonModule } from '@angular/common';
import { Component } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { DataViewModule } from 'primeng/dataview';
import { CommonModule } from '@angular/common';
import { SelectButtonModule } from 'primeng/selectbutton';
import { PickListModule } from 'primeng/picklist';
import { OrderListModule } from 'primeng/orderlist';
import { TagModule } from 'primeng/tag';
import { ButtonModule } from 'primeng/button';
import { DataViewModule } from 'primeng/dataview';
import { OrderListModule } from 'primeng/orderlist';
import { PickListModule } from 'primeng/picklist';
import { SelectButtonModule } from 'primeng/selectbutton';
import { TagModule } from 'primeng/tag';
import { Product, ProductService } from '../service/product.service';
@Component({
@@ -33,7 +33,9 @@ import { Product, ProductService } from '../service/product.service';
<div class="flex flex-col sm:flex-row sm:items-center p-6 gap-4" [ngClass]="{ 'border-t border-surface': i !== 0 }">
<div class="md:w-40 relative">
<img class="block xl:block mx-auto rounded w-full" src="https://primefaces.org/cdn/primevue/images/product/{{ item.image }}" [alt]="item.name" />
<p-tag [value]="item.inventoryStatus" [severity]="getSeverity(item)" class="absolute dark:!bg-surface-900" [style]="{ left: '4px', top: '4px' }"></p-tag>
<div class="absolute bg-black/70 rounded-border" [style]="{ left: '4px', top: '4px' }">
<p-tag [value]="item.inventoryStatus" [severity]="getSeverity(item)"></p-tag>
</div>
</div>
<div class="flex flex-col md:flex-row justify-between md:items-center flex-1 gap-6">
<div class="flex flex-row md:flex-col justify-between items-start gap-2">
@@ -76,7 +78,9 @@ import { Product, ProductService } from '../service/product.service';
<div class="bg-surface-50 flex justify-center rounded p-6">
<div class="relative mx-auto">
<img class="rounded w-full" src="https://primefaces.org/cdn/primevue/images/product/{{ item.image }}" [alt]="item.name" style="max-width: 300px" />
<p-tag [value]="item.inventoryStatus" [severity]="getSeverity(item)" class="absolute dark:!bg-surface-900" [style]="{ left: '4px', top: '4px' }"></p-tag>
<div class="absolute bg-black/70 rounded-border" [style]="{ left: '4px', top: '4px' }">
<p-tag [value]="item.inventoryStatus" [severity]="getSeverity(item)"></p-tag>
</div>
</div>
</div>
<div class="pt-12">

6
src/app/pages/uikit/mediademo.ts
View File

@@ -5,8 +5,8 @@ import { CarouselModule } from 'primeng/carousel';
import { GalleriaModule } from 'primeng/galleria';
import { ImageModule } from 'primeng/image';
import { TagModule } from 'primeng/tag';
import { Product, ProductService } from '../service/product.service';
import { PhotoService } from '../service/photo.service';
import { Product, ProductService } from '../service/product.service';
@Component({
selector: 'app-media-demo',
@@ -20,7 +20,9 @@ import { PhotoService } from '../service/photo.service';
<div class="mb-4">
<div class="relative mx-auto">
<img src="https://primefaces.org/cdn/primeng/images/demo/product/{{ product.image }}" [alt]="product.name" class="w-full rounded-border" />
<p-tag [value]="product.inventoryStatus" styleClass="dark:!bg-surface-900 " [severity]="getSeverity(product.inventoryStatus)" class="absolute" [ngStyle]="{ 'left.px': 5, 'top.px': 5 }" />
<div class="absolute bg-black/70 rounded-border" [ngStyle]="{ 'left.px': 5, 'top.px': 5 }">
<p-tag [value]="product.inventoryStatus" [severity]="getSeverity(product.inventoryStatus)" />
</div>
</div>
</div>
<div class="mb-4 font-medium">{{ product.name }}</div>