DevTools: Datetime-Tool (Umrechner/Geburtstag/Differenz), dunkle Texte in DevTools+Skizze aufgehellt

This commit is contained in:
2026-06-01 09:18:47 +02:00
parent 34639a044d
commit 6dfe140d13
2 changed files with 246 additions and 16 deletions

View File

@@ -158,7 +158,7 @@ function Shape({ s, selected, onClick }) {
// ── Properties Panel ──────────────────────────────────────────────────────────
function PropsPanel({ shape, onChange, onDelete, vars, scale, onScaleChange }) {
if (!shape) return (
<div style={{color:'rgba(255,255,255,0.2)',fontFamily:'monospace',fontSize:10,padding:'14px 0',textAlign:'center',lineHeight:1.8}}>
<div style={{color:'rgba(255,255,255,0.5)',fontFamily:'monospace',fontSize:10,padding:'14px 0',textAlign:'center',lineHeight:1.8}}>
Form auswählen oder zeichnen.<br/>
<span style={{fontSize:9,opacity:0.6}}>V=Auswählen R=Rect L=Linie C=Kreis</span>
</div>
@@ -207,7 +207,7 @@ function PropsPanel({ shape, onChange, onDelete, vars, scale, onScaleChange }) {
<div style={{display:'flex',gap:6,alignItems:'center'}}>
<input type="number" value={scale} onChange={e=>onScaleChange(parseFloat(e.target.value)||1)}
step={0.1} min={0.1} style={{...S.inp,flex:1,fontSize:12,padding:'5px 8px'}}/>
<span style={{color:'rgba(255,255,255,0.3)',fontFamily:'monospace',fontSize:9}}>mm/px</span>
<span style={{color:'rgba(255,255,255,0.5)',fontFamily:'monospace',fontSize:9}}>mm/px</span>
</div>
</div>
</div>
@@ -386,7 +386,7 @@ export default function Skizze({ toast, mobile }) {
border: tool===t.id?'none':'1px solid rgba(255,255,255,0.1)',
}}>{t.label}</button>
))}
<span style={{color:'rgba(255,255,255,0.2)',fontFamily:'monospace',fontSize:9,alignSelf:'center',marginLeft:4}}>
<span style={{color:'rgba(255,255,255,0.5)',fontFamily:'monospace',fontSize:9,alignSelf:'center',marginLeft:4}}>
{TOOLS.find(t=>t.id===tool)?.title}
</span>
</div>
@@ -433,7 +433,7 @@ export default function Skizze({ toast, mobile }) {
{Object.entries(vars).map(([k,v])=>(
<span key={k} style={{cursor:'pointer'}} onClick={()=>{setFormula(f=>f+k);formulaRef.current?.focus();}}>
<code style={{color:'#4ecdc4',fontSize:10}}>{k}</code>
<span style={{color:'rgba(255,255,255,0.35)',fontFamily:'monospace',fontSize:10}}>={typeof v==='number'?v.toFixed(2):v}</span>
<span style={{color:'rgba(255,255,255,0.55)',fontFamily:'monospace',fontSize:10}}>={typeof v==='number'?v.toFixed(2):v}</span>
</span>
))}
</div>
@@ -463,7 +463,7 @@ export default function Skizze({ toast, mobile }) {
{/* Ergebnisse */}
{results.length===0&&Object.keys(vars).length===0&&(
<div style={{color:'rgba(255,255,255,0.15)',fontFamily:'monospace',fontSize:11,textAlign:'center',padding:'8px 0'}}>
<div style={{color:'rgba(255,255,255,0.45)',fontFamily:'monospace',fontSize:11,textAlign:'center',padding:'8px 0'}}>
Formen zeichnen benennen hier rechnen
</div>
)}
@@ -482,7 +482,7 @@ export default function Skizze({ toast, mobile }) {
</code>
<button onClick={()=>setResults(p=>p.filter(x=>x.id!==r.id))}
style={{background:'transparent',border:'none',cursor:'pointer',
color:'rgba(255,255,255,0.2)',fontSize:12,padding:'0 2px',lineHeight:1}}></button>
color:'rgba(255,255,255,0.5)',fontSize:12,padding:'0 2px',lineHeight:1}}></button>
</div>
</div>
))}