fix!: Toggle use color minimalist

This commit is contained in:
DarioEsp 2022-07-24 00:55:46 -04:00
parent 0b7ea6015b
commit c1719ebe70
2 changed files with 5 additions and 5 deletions

View File

@ -6,6 +6,7 @@ import CustomLink from "@/common/link";
const SVGCard = (props: SVGCardProps) => { const SVGCard = (props: SVGCardProps) => {
const bg = useColorModeValue("bg.light", "bg.dark"); const bg = useColorModeValue("bg.light", "bg.dark");
const color = useColorModeValue("rgb(0,0,0, .1)", "rgb(255,255,255, .1)");
return ( return (
<Tap> <Tap>
<CustomLink href={`/svg/${props.id}`}> <CustomLink href={`/svg/${props.id}`}>
@ -17,8 +18,7 @@ const SVGCard = (props: SVGCardProps) => {
borderWidth="1px" borderWidth="1px"
mb="2" mb="2"
_hover={{ _hover={{
/* shadow: "md", */ border:`1px solid ${color}`,
border:"1px solid rgb(0,0,0, .1)",
transform: "scale(0.98)", transform: "scale(0.98)",
}} }}
transition="all 0.2s" > transition="all 0.2s" >

View File

@ -2,16 +2,16 @@ import React from "react";
import useSWR from "swr"; import useSWR from "swr";
import { getCategorySvgs } from "@/services"; import { getCategorySvgs } from "@/services";
import CustomLink from "@/common/link"; import CustomLink from "@/common/link";
import { Box } from "@chakra-ui/react"; import { Box, useColorModeValue } from "@chakra-ui/react";
import { RaceBy } from "@uiball/loaders"; import { RaceBy } from "@uiball/loaders";
const Categories = () => { const Categories = () => {
const { data, error } = useSWR(getCategorySvgs); const { data, error } = useSWR(getCategorySvgs);
const color = useColorModeValue("rgb(0,0,0, .1)", "rgb(255,255,255, .1)");
if (error) return <div>failed to load</div>; if (error) return <div>failed to load</div>;
if (!data) if (!data)
return <RaceBy size={52} lineWeight={3} speed={1.4} color="#4343E5" />; return <RaceBy size={52} lineWeight={3} speed={1.4} color="#4343E5" />;
return ( return (
<> <>
{data.map((category: string) => ( {data.map((category: string) => (
@ -23,7 +23,7 @@ const Categories = () => {
borderRadius="4px" borderRadius="4px"
borderWidth="1px" borderWidth="1px"
_hover={{ _hover={{
border:"1px solid rgb(0,0,0, .1)", border:`1px solid ${color}`,
transform: "scale(0.98)", transform: "scale(0.98)",
}}> }}>
{category} {category}