DevTools TextDiff: kein Zeilenumbruch in Textarea, Zeilennummern bleiben korrekt
This commit is contained in:
@@ -1009,7 +1009,8 @@ function TextDiff({ mobile }) {
|
|||||||
const changedB = diff ? changedLineNums(diff, 'b') : new Set();
|
const changedB = diff ? changedLineNums(diff, 'b') : new Set();
|
||||||
|
|
||||||
const ta = { ...S.inp, fontSize:12, fontFamily:"'Courier New',monospace", width:'100%',
|
const ta = { ...S.inp, fontSize:12, fontFamily:"'Courier New',monospace", width:'100%',
|
||||||
boxSizing:'border-box', minHeight:180, resize:'vertical', lineHeight:'1.6', padding:'7px 8px' };
|
boxSizing:'border-box', minHeight:180, resize:'vertical', lineHeight:'1.6', padding:'7px 8px',
|
||||||
|
whiteSpace:'pre', overflowX:'auto', overflowWrap:'normal' };
|
||||||
|
|
||||||
function LineNumCol({ text, changedSet }) {
|
function LineNumCol({ text, changedSet }) {
|
||||||
return (
|
return (
|
||||||
@@ -1017,9 +1018,10 @@ function TextDiff({ mobile }) {
|
|||||||
padding:'7px 6px', minWidth:36, textAlign:'right', userSelect:'none',
|
padding:'7px 6px', minWidth:36, textAlign:'right', userSelect:'none',
|
||||||
fontFamily:"'Courier New',monospace", fontSize:12, lineHeight:'1.6',
|
fontFamily:"'Courier New',monospace", fontSize:12, lineHeight:'1.6',
|
||||||
background:'rgba(0,0,0,0.2)', borderRight:'1px solid rgba(255,255,255,0.07)',
|
background:'rgba(0,0,0,0.2)', borderRight:'1px solid rgba(255,255,255,0.07)',
|
||||||
whiteSpace:'pre', flexShrink:0}}>
|
flexShrink:0, overflowY:'hidden'}}>
|
||||||
{(text||' ').split('\n').map((_,i) => (
|
{(text||' ').split('\n').map((_,i) => (
|
||||||
<div key={i} style={{
|
<div key={i} style={{
|
||||||
|
height:'1.6em',
|
||||||
color: changedSet.has(i+1) ? '#ff6b9d' : 'rgba(255,255,255,0.25)',
|
color: changedSet.has(i+1) ? '#ff6b9d' : 'rgba(255,255,255,0.25)',
|
||||||
background: changedSet.has(i+1) ? 'rgba(255,107,157,0.12)' : 'transparent',
|
background: changedSet.has(i+1) ? 'rgba(255,107,157,0.12)' : 'transparent',
|
||||||
}}>{i+1}</div>
|
}}>{i+1}</div>
|
||||||
@@ -1044,7 +1046,7 @@ function TextDiff({ mobile }) {
|
|||||||
<div style={{display:'flex', borderRadius:6, overflow:'hidden', border:'1px solid rgba(255,255,255,0.1)', background:'rgba(255,255,255,0.04)'}}>
|
<div style={{display:'flex', borderRadius:6, overflow:'hidden', border:'1px solid rgba(255,255,255,0.1)', background:'rgba(255,255,255,0.04)'}}>
|
||||||
<LineNumCol text={val} changedSet={cset}/>
|
<LineNumCol text={val} changedSet={cset}/>
|
||||||
<textarea style={{...ta, border:'none', borderRadius:0, background:'transparent', flex:1, resize:'vertical'}}
|
<textarea style={{...ta, border:'none', borderRadius:0, background:'transparent', flex:1, resize:'vertical'}}
|
||||||
value={val} placeholder="Text hier einfügen…"
|
wrap="off" value={val} placeholder="Text hier einfügen…"
|
||||||
onChange={e=>{ setter(e.target.value); setDiff(null); }}/>
|
onChange={e=>{ setter(e.target.value); setDiff(null); }}/>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Reference in New Issue
Block a user