OpenNeo/impress-2020
OpenNeo/impress-2020
1
0
Fork 0
Code Pull requests Activity

Don't allow line breaks in zone list items

Browse source 
Some looked really bad in the new design, like Jewelled Staff, which was breaking between the words "2 species", making a real bad tooltip target too.

Now, there's no line breaks allowed inside a list item at all! We force it to break between items, instead. (Could have also maybe implemented this with flex wrapping? This seemed like a straighter path, but…)
This commit is contained in:
Emi Matchu 2021-02-12 18:25:08 -08:00
parent 7183f0725c
commit 09cc2e6a2b
1 changed files with 23 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

29
src/app/ItemPage.js
View file

@ -1341,11 +1341,19 @@ function ItemZonesInfo({ compatibleBodiesAndTheirZones, restrictedZones }) {
display="inline"
_notLast={{ _after: { content: '", "' } }}
>
<ItemZonesInfoListItem
zoneLabel={zoneLabel}
bodies={bodies}
showBodyInfo={showBodyInfo}
/>
<Box
as="span"
// Don't wrap any of the list item content. But, by putting
// this in an extra container element, we _do_ allow wrapping
// _between_ list items.
whiteSpace="nowrap"
>
<ItemZonesInfoListItem
zoneLabel={zoneLabel}
bodies={bodies}
showBodyInfo={showBodyInfo}
/>
</Box>
</Box>
))}
</Box>
@ -1362,9 +1370,18 @@ function ItemZonesInfo({ compatibleBodiesAndTheirZones, restrictedZones }) {
key={zoneLabel}
as="li"
display="inline"
whiteSpace="nowrap"
_notLast={{ _after: { content: '", "' } }}
>
{zoneLabel}
<Box
as="span"
// Don't wrap any of the list item content. But, by putting
// this in an extra container element, we _do_ allow wrapping
// _between_ list items.
whiteSpace="nowrap"
>
{zoneLabel}
</Box>
</Box>
))}
</Box>