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

fix CSS bugs in Item

Browse source
This commit is contained in:
Matt Dunn-Rankin 2020-04-30 00:30:27 -07:00
parent 2db0e33f28
commit a3204cd2cf
1 changed files with 22 additions and 14 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

36
src/app/Item.js
View file

@ -28,21 +28,27 @@ export function Item({ item, itemNameId, outfitState, dispatchToOutfit }) {
return ( return (
<ItemContainer> <ItemContainer>
<ItemThumbnail <Box>
src={`/api/assetProxy?url=${encodeURIComponent(item.thumbnailUrl)}`} <ItemThumbnail
isWorn={isWorn} src={`/api/assetProxy?url=${encodeURIComponent(item.thumbnailUrl)}`}
/> isWorn={isWorn}
/>
</Box>
<Box width="3" /> <Box width="3" />
<ItemName id={itemNameId} isWorn={isWorn}> <Box>
{item.name} <ItemName id={itemNameId} isWorn={isWorn}>
</ItemName> {item.name}
</ItemName>
</Box>
<Box flexGrow="1" /> <Box flexGrow="1" />
{isInOutfit && ( {isInOutfit && (
<RemoveItemButton <Box>
onClick={() => <RemoveItemButton
dispatchToOutfit({ type: "removeItem", itemId: item.id }) onClick={() =>
} dispatchToOutfit({ type: "removeItem", itemId: item.id })
/> }
/>
</Box>
)} )}
</ItemContainer> </ItemContainer>
); );
@ -115,14 +121,16 @@ function ItemThumbnail({ src, isWorn }) {
rounded="lg" rounded="lg"
boxShadow="md" boxShadow="md"
border="1px" border="1px"
borderColor="green.700"
width="50px" width="50px"
height="50px" height="50px"
overflow="hidden" overflow="hidden"
transition="all 0.15s" transition="all 0.15s"
transformOrigin="center" transformOrigin="center"
transform="scale(0.8)"
className={css([ className={css([
{
borderColor: theme.colors.green["700"],
transform: "scale(0.8)",
},
!isWorn && { !isWorn && {
[containerHasFocus]: { [containerHasFocus]: {
opacity: "0.9", opacity: "0.9",