Don't allow line breaks in zone list items
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:
parent
7183f0725c
commit
09cc2e6a2b
1 changed files with 23 additions and 6 deletions
|
@ -1340,6 +1340,13 @@ function ItemZonesInfo({ compatibleBodiesAndTheirZones, restrictedZones }) {
|
|||
as="li"
|
||||
display="inline"
|
||||
_notLast={{ _after: { content: '", "' } }}
|
||||
>
|
||||
<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}
|
||||
|
@ -1347,6 +1354,7 @@ function ItemZonesInfo({ compatibleBodiesAndTheirZones, restrictedZones }) {
|
|||
showBodyInfo={showBodyInfo}
|
||||
/>
|
||||
</Box>
|
||||
</Box>
|
||||
))}
|
||||
</Box>
|
||||
</Box>
|
||||
|
@ -1362,10 +1370,19 @@ function ItemZonesInfo({ compatibleBodiesAndTheirZones, restrictedZones }) {
|
|||
key={zoneLabel}
|
||||
as="li"
|
||||
display="inline"
|
||||
whiteSpace="nowrap"
|
||||
_notLast={{ _after: { content: '", "' } }}
|
||||
>
|
||||
<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>
|
||||
) : (
|
||||
|
|
Loading…
Reference in a new issue