Don't wrap concordance results in multiple lines.

This commit is contained in:
2023-01-18 13:11:08 +01:00
parent b000f2225c
commit 691196ebf1
2 changed files with 22 additions and 2 deletions
@@ -6,8 +6,8 @@ const ConcordanceListItem = (props) => {
return (
<>
<div className={`row ${styles.item}`} onClick={() => { props.toggleDetails(props.index) }}>
<div className='col text-end'><ConcordanceTokens tokens={props.item.leftContext} />&nbsp;</div>
<div className='col'><ConcordanceTokens tokens={[props.item.centerContext]} /> <ConcordanceTokens tokens={props.item.rightContext} /></div>
<div className={`col ${styles.left}`}><span><ConcordanceTokens tokens={props.item.leftContext} />&nbsp;</span></div>
<div className={`col ${styles.right}`}><ConcordanceTokens tokens={[props.item.centerContext]} /> <ConcordanceTokens tokens={props.item.rightContext} /></div>
</div>
{props.expanded && <ConcordanceDetails paragraphId={props.item.paragraphId} tokenOrder={props.item.centerContext.tokenOrder} onClose={() => { props.toggleDetails(null) }} />}
</>
@@ -5,4 +5,24 @@
cursor: pointer;
margin-bottom: 0.5rem;
padding-bottom: 0.5rem;
:global(.col) {
&.left,
&.right {
overflow: hidden;
white-space: nowrap;
text-overflow: clip;
}
&.left {
span {
display: inline-block;
float: right;
min-width: 100%;
overflow: visible;
text-align: right;
}
}
}
}