Dicken/dickendock
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

fix: KöPi - exakte marktguru Selektoren, saubere Anzeige

Browse Source
This commit is contained in:
Dicken
2026-07-09 00:57:46 +02:00
parent d2b8706b26
commit 0eec03d5c7
2 changed files with 40 additions and 65 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
frontend/src/tools/koepi.jsx
View File

@@ -35,17 +35,23 @@ function OfferCard({ offer }) {
display:'flex', flexDirection:'column',
}}>
{/* Produktbild */}
<div style={{ height:150, background:'#fff', display:'flex', alignItems:'center', justifyContent:'center', flexShrink:0, overflow:'hidden' }}>
<div style={{ height:160, background:'#fff', display:'flex', alignItems:'center', justifyContent:'center', flexShrink:0, overflow:'hidden', position:'relative' }}>
{offer.image
? <img src={`/api/tools/koepi/img?url=${encodeURIComponent(offer.image)}`}
alt={offer.name} style={{ maxHeight:'100%', maxWidth:'100%', objectFit:'contain' }}
onError={e => { e.target.parentElement.innerHTML = '<div style="color:#555;font-size:40px">🍺</div>'; }}
onError={e => { e.target.style.display='none'; }}
/>
: <div style={{ fontSize:40 }}>🍺</div>
: null
}
{offer.badge && (
<div style={{ position:'absolute', top:6, left:6, background:'#e2001a', color:'#fff',
borderRadius:4, padding:'2px 6px', fontSize:9, fontFamily:'monospace', fontWeight:700 }}>
{offer.badge}
</div>
)}
</div>
<div style={{ padding:'12px 14px', flex:1, display:'flex', flexDirection:'column', gap:6 }}>
<div style={{ padding:'12px 14px', flex:1, display:'flex', flexDirection:'column', gap:5 }}>
{/* Händler Badge */}
<div style={{
display:'inline-block', alignSelf:'flex-start',
@@ -54,17 +60,19 @@ function OfferCard({ offer }) {
color, fontFamily:'monospace', fontSize:10, fontWeight:700,
}}>{offer.retailer}</div>
{/* Name */}
{/* Name + Marke */}
<div style={{ color:'#fff', fontFamily:'monospace', fontSize:13, fontWeight:600, lineHeight:1.3 }}>
{offer.name}
{offer.brand && offer.brand !== offer.name && (
<span style={{ color:'rgba(255,255,255,0.4)', fontSize:10, marginLeft:6 }}>{offer.brand}</span>
)}
König Pilsener
</div>
{offer.name && offer.name.toLowerCase() !== 'könig pilsener' && (
<div style={{ color:'rgba(255,255,255,0.5)', fontFamily:'monospace', fontSize:11 }}>
{offer.name}
</div>
)}
{/* Beschreibung/Flaschengröße */}
{offer.description && (
<div style={{ color:'rgba(255,255,255,0.5)', fontFamily:'monospace', fontSize:10, lineHeight:1.4 }}>
<div style={{ color:'rgba(255,255,255,0.55)', fontFamily:'monospace', fontSize:10, lineHeight:1.5 }}>
{offer.description}
</div>
)}
@@ -82,15 +90,15 @@ function OfferCard({ offer }) {
</div>
{/* Gültigkeit */}
<div style={{ marginTop:'auto', paddingTop:6, borderTop:'1px solid rgba(255,255,255,0.06)' }}>
<div style={{ marginTop:'auto', paddingTop:6, borderTop:'1px solid rgba(255,255,255,0.06)', display:'flex', flexDirection:'column', gap:3 }}>
{offer.validity && (
<div style={{ color: offer.validity.includes('Neu') ? '#4ecdc4' : '#f59e0b', fontFamily:'monospace', fontSize:10 }}>
<div style={{ color:'#f59e0b', fontFamily:'monospace', fontSize:10 }}>
⏰ {offer.validity}
</div>
)}
{offer.dateRange && (
<div style={{ color:'rgba(255,255,255,0.35)', fontFamily:'monospace', fontSize:10, marginTop:2 }}>
📅 {offer.dateRange}
<div style={{ color:'rgba(255,255,255,0.35)', fontFamily:'monospace', fontSize:10 }}>
📅 Gültig: {offer.dateRange}
</div>
)}
</div>