frassidavid/canti
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: aggiunta etichetta 'Non Validato' per i canti personalizzati della comunità

Browse Source 
- Definita la proprietà 'nonValidato' nell'interfaccia Canto.
- Impostato il flag 'nonValidato: true' sui canti mappati in ComunitaService.
- Creato e integrato il badge grafico rosso soft '.non-validato-badge' sia in HomePage (accanto al titolo del canto) sia in PlayerPage (nell'intestazione del brano), con supporto alla modalità ad alto contrasto.
This commit is contained in:
David Frassi
2026-05-20 12:15:50 +02:00
parent 19993a0051
commit 0bcf5c5de7
7 changed files with 51 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/home/home.page.html
+4 -2
View File
@@ -266,8 +266,10 @@
<div class="content-column" (click)="goToCanto(canto.id)">
<div class="top-row">
<ion-label class="info-section">
<h2 class="outfit-font" style="font-weight: 500; color: var(--ion-color-secondary)">
<span *ngIf="getCommunitySongNumber(canto)" style="color: var(--ion-color-secondary); font-weight: 600; margin-right: 8px; opacity: 0.9;">{{ getCommunitySongNumber(canto) }}</span>{{ canto.titolo }}
<h2 class="outfit-font" style="font-weight: 500; color: var(--ion-color-secondary); display: flex; align-items: center; flex-wrap: wrap; gap: 4px;">
<span *ngIf="getCommunitySongNumber(canto)" style="color: var(--ion-color-secondary); font-weight: 600; margin-right: 8px; opacity: 0.9;">{{ getCommunitySongNumber(canto) }}</span>
<span>{{ canto.titolo }}</span>
<span *ngIf="canto.nonValidato" class="non-validato-badge">Non Validato</span>
</h2>
<p style="color: rgba(255,255,255,0.6); margin-bottom: 2px; display: flex; align-items: center; flex-wrap: wrap; gap: 8px;">
<span>{{ canto.autore || 'Autore sconosciuto' }}</span>
src/app/home/home.page.scss
+21
View File
@@ -921,3 +921,24 @@ ion-title {
color: rgba(0, 0, 0, 0.5) !important;
}
}
.non-validato-badge {
font-size: 0.65rem;
background: rgba(231, 76, 60, 0.15); /* Soft premium red */
color: #e74c3c;
padding: 1px 6px;
border-radius: 6px;
border: 1px solid rgba(231, 76, 60, 0.3);
font-weight: 600;
text-transform: uppercase;
letter-spacing: 0.5px;
margin-left: 6px;
display: inline-block;
vertical-align: middle;
}
:host-context(body.high-contrast) .non-validato-badge {
background: rgba(231, 76, 60, 0.1) !important;
color: #c0392b !important;
border-color: #c0392b !important;
}