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

bug fixes for new ItemCard

Browse source 
Oops, I messed up the background color in dark mode! and left in an extra `as` prop
This commit is contained in:
Emi Matchu 2021-01-14 05:33:16 -08:00
parent 8567f9d4b8
commit 1376e95f84
1 changed files with 3 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
src/app/components/ItemCard.js
View file

@ -9,6 +9,7 @@ import {
WrapItem, WrapItem,
useColorModeValue, useColorModeValue,
useTheme, useTheme,
useToken,
} from "@chakra-ui/react"; } from "@chakra-ui/react";
import { CheckIcon, NotAllowedIcon, StarIcon } from "@chakra-ui/icons"; import { CheckIcon, NotAllowedIcon, StarIcon } from "@chakra-ui/icons";
import { HiSparkles } from "react-icons/hi"; import { HiSparkles } from "react-icons/hi";
@ -18,6 +19,7 @@ import { safeImageUrl, useCommonStyles } from "../util";
function ItemCard({ item, badges, variant = "list", ...props }) { function ItemCard({ item, badges, variant = "list", ...props }) {
const { brightBackground } = useCommonStyles(); const { brightBackground } = useCommonStyles();
const brightBackgroundValue = useToken("colors", brightBackground);
const theme = useTheme(); const theme = useTheme();
switch (variant) { switch (variant) {
@ -28,7 +30,6 @@ function ItemCard({ item, badges, variant = "list", ...props }) {
<ClassNames> <ClassNames>
{({ css }) => ( {({ css }) => (
<Link <Link
as={Link}
to={`/items/${item.id}`} to={`/items/${item.id}`}
className={css` className={css`
transition: all 0.2s; transition: all 0.2s;
@ -52,7 +53,7 @@ function ItemCard({ item, badges, variant = "list", ...props }) {
border-radius: ${theme.radii.md}; border-radius: ${theme.radii.md};
padding: ${theme.space["3"]}; padding: ${theme.space["3"]};
width: calc(80px + 2em); width: calc(80px + 2em);
background: ${brightBackground}; background: ${brightBackgroundValue};
`} `}
> >
<img <img