Lars/mitai-jinkendo
1
0
Fork 0
Code Issues 23 Pull Requests Actions Packages Projects Releases 2 Wiki Activity

Membership-System und Bug Fixing (inkl. Nutrition) #8

Merged
Lars merged 56 commits from develop into main 2026-03-21 08:48:57 +01:00
Conversation 0 Commits 56 Files Changed 43 +40 -26
4 changed files with 40 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit 30df150b6f - Show all commits

34
frontend/src/components/UsageBadge.css
View File

@ -1,43 +1,53 @@
/** /**
* UsageBadge Styles * UsageBadge Styles - Dezente Version
* *
* Small, visually distinct inline badge for usage indicators * Sehr kleine, subtile Badge für Usage-Anzeige
* Phase 3: Frontend Display * Phase 3: Frontend Display
*/ */
.usage-badge { .usage-badge {
display: inline-block; display: inline-block;
font-size: 0.75rem; font-size: 0.65rem;
font-weight: 500; font-weight: 500;
padding: 2px 6px; padding: 2px 5px;
border-radius: 4px; border-radius: 3px;
margin-left: 6px; margin-left: 10px;
opacity: 0.8; opacity: 0.6;
font-variant-numeric: tabular-nums; font-variant-numeric: tabular-nums;
white-space: nowrap; white-space: nowrap;
transition: opacity 0.2s;
}
.usage-badge:hover {
opacity: 0.9;
} }
.usage-badge--ok { .usage-badge--ok {
color: var(--accent, #1D9E75); color: var(--text3, #888);
background: rgba(29, 158, 117, 0.1); background: rgba(136, 135, 128, 0.08);
} }
.usage-badge--warning { .usage-badge--warning {
color: #d97706; color: #d97706;
background: rgba(217, 119, 6, 0.1); background: rgba(217, 119, 6, 0.08);
} }
.usage-badge--exceeded { .usage-badge--exceeded {
color: var(--danger, #D85A30); color: var(--danger, #D85A30);
background: rgba(216, 90, 48, 0.1); background: rgba(216, 90, 48, 0.1);
font-weight: 600; font-weight: 600;
opacity: 0.75;
}
.usage-badge--exceeded:hover {
opacity: 1;
} }
/* Responsive: Even smaller on mobile */ /* Responsive: Even smaller on mobile */
@media (max-width: 640px) { @media (max-width: 640px) {
.usage-badge { .usage-badge {
font-size: 0.7rem; font-size: 0.6rem;
padding: 1px 4px; padding: 1px 4px;
margin-left: 4px; margin-left: 8px;
} }
} }

8
frontend/src/pages/Analysis.jsx
View File

@ -240,8 +240,8 @@ export default function Analysis() {
<div className="card" style={{marginBottom:16,borderColor:'var(--accent)',borderWidth:2}}> <div className="card" style={{marginBottom:16,borderColor:'var(--accent)',borderWidth:2}}>
<div style={{display:'flex',alignItems:'flex-start',gap:12}}> <div style={{display:'flex',alignItems:'flex-start',gap:12}}>
<div style={{flex:1}}> <div style={{flex:1}}>
<div style={{fontWeight:700,fontSize:15,color:'var(--accent)'}}> <div style={{fontWeight:700,fontSize:15,color:'var(--accent)',display:'flex',alignItems:'center',justifyContent:'space-between'}}>
🔬 Mehrstufige Gesamtanalyse <span>🔬 Mehrstufige Gesamtanalyse</span>
{aiUsage && <UsageBadge {...aiUsage} />} {aiUsage && <UsageBadge {...aiUsage} />}
</div> </div>
<div style={{fontSize:12,color:'var(--text2)',marginTop:3,lineHeight:1.5}}> <div style={{fontSize:12,color:'var(--text2)',marginTop:3,lineHeight:1.5}}>
@ -295,8 +295,8 @@ export default function Analysis() {
<div key={p.id} className="card section-gap"> <div key={p.id} className="card section-gap">
<div style={{display:'flex',alignItems:'flex-start',gap:12}}> <div style={{display:'flex',alignItems:'flex-start',gap:12}}>
<div style={{flex:1}}> <div style={{flex:1}}>
<div style={{fontWeight:600,fontSize:15}}> <div style={{fontWeight:600,fontSize:15,display:'flex',alignItems:'center',justifyContent:'space-between'}}>
{SLUG_LABELS[p.slug]||p.name} <span>{SLUG_LABELS[p.slug]||p.name}</span>
{aiUsage && <UsageBadge {...aiUsage} />} {aiUsage && <UsageBadge {...aiUsage} />}
</div> </div>
{p.description && <div style={{fontSize:12,color:'var(--text3)',marginTop:2}}>{p.description}</div>} {p.description && <div style={{fontSize:12,color:'var(--text3)',marginTop:2}}>{p.description}</div>}

20
frontend/src/pages/SettingsPage.jsx
View File

@ -379,17 +379,21 @@ export default function SettingsPage() {
</div> </div>
)} )}
{canExport && <> {canExport && <>
<button className="btn btn-primary btn-full" <button className="btn btn-primary btn-full" style={{position:'relative'}}
onClick={()=>api.exportZip()}> onClick={()=>api.exportZip()}>
<Download size={14}/> ZIP exportieren <div style={{display:'flex',alignItems:'center',justifyContent:'space-between',width:'100%'}}>
{exportUsage && <UsageBadge {...exportUsage} />} <span><Download size={14}/> ZIP exportieren</span>
<span style={{fontSize:11,opacity:0.8,marginLeft:6}}>— je eine CSV pro Kategorie</span> {exportUsage && <UsageBadge {...exportUsage} />}
</div>
<span style={{fontSize:11,opacity:0.8,display:'block',marginTop:2}}>je eine CSV pro Kategorie</span>
</button> </button>
<button className="btn btn-secondary btn-full" <button className="btn btn-secondary btn-full" style={{position:'relative'}}
onClick={()=>api.exportJson()}> onClick={()=>api.exportJson()}>
<Download size={14}/> JSON exportieren <div style={{display:'flex',alignItems:'center',justifyContent:'space-between',width:'100%'}}>
{exportUsage && <UsageBadge {...exportUsage} />} <span><Download size={14}/> JSON exportieren</span>
<span style={{fontSize:11,opacity:0.8,marginLeft:6}}>— maschinenlesbar, alles in einer Datei</span> {exportUsage && <UsageBadge {...exportUsage} />}
</div>
<span style={{fontSize:11,opacity:0.8,display:'block',marginTop:2}}>maschinenlesbar, alles in einer Datei</span>
</button> </button>
</>} </>}
</div> </div>

4
frontend/src/pages/WeightScreen.jsx
View File

@ -69,8 +69,8 @@ export default function WeightScreen() {
{/* Eingabe */} {/* Eingabe */}
<div className="card section-gap"> <div className="card section-gap">
<div className="card-title"> <div className="card-title" style={{display:'flex',alignItems:'center',justifyContent:'space-between'}}>
Eintrag hinzufügen <span>Eintrag hinzufügen</span>
{weightUsage && <UsageBadge {...weightUsage} />} {weightUsage && <UsageBadge {...weightUsage} />}
</div> </div>
<div className="form-row"> <div className="form-row">