aronmal/leaky-ships
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Use of classNames

Browse source
This commit is contained in:
aronmal 2023-01-11 21:08:40 +01:00
parent b3fdf8dbeb
commit ee08d3fc1f
Signed by: aronmal
GPG key ID: 816B7707426FC612
4 changed files with 9 additions and 5 deletions
Download patch file Download diff file Expand all files Collapse all files

3
leaky-ships/components/Labeling.tsx
View file

@ -1,3 +1,4 @@
import classNames from 'classnames';
import { CSSProperties } from 'react'
import { fieldIndex } from '../helpers';
import { FieldType } from '../interfaces';
@ -21,7 +22,7 @@ function Labeling({count}: {count: number}) {
elems = elems.sort((a, b) => fieldIndex(count, a.x, a.y)-fieldIndex(count, b.x, b.y));
return <>
{elems.map(({field, x, y, orientation}, i) =>
<span key={i} className={`label ${orientation} ${field}`} style={{'--x': x, '--y': y} as CSSProperties}>{field}</span>
<span key={i} className={classNames('label', orientation, field)} style={{'--x': x, '--y': y} as CSSProperties}>{field}</span>
)}
</>
}