diff options
-rw-r--r-- | components/topnav.tsx | 5 | ||||
-rw-r--r-- | lib/theme.tsx | 24 | ||||
-rw-r--r-- | pages/index.tsx | 2 |
3 files changed, 24 insertions, 7 deletions
diff --git a/components/topnav.tsx b/components/topnav.tsx index 0364f40..80a6ce3 100644 --- a/components/topnav.tsx +++ b/components/topnav.tsx @@ -2,6 +2,7 @@ import { Link, Box, HStack, + Icon, IconButton, Menu, Heading, @@ -31,7 +32,7 @@ function MobileNav() { function DesktopNav() { return <HStack> <Box flex="1"> - <Link href="https://github.com/michalsapka/michal-sapka-pl">Source code</Link> + <Link variant="topnav-link" href="https://github.com/michalsapka/michal-sapka-pl"> <Icon as={DiGithubBadge}/> Source code</Link> </Box> </HStack> } @@ -53,7 +54,7 @@ export default function Navbar() { mb="1" > <HStack> - <Heading flex="0">Michal </Heading> + <Heading flex="0" mr="20px">Michal </Heading> <Box flex="1"> {isMobile ? null : <DesktopNav/>} </Box> diff --git a/lib/theme.tsx b/lib/theme.tsx index a7ae222..2d24742 100644 --- a/lib/theme.tsx +++ b/lib/theme.tsx @@ -5,8 +5,8 @@ import type { StyleFunctionProps } from '@chakra-ui/styled-system' const styles = { global: (props : StyleFunctionProps) => ({ body: { - bg: mode('#d5d6db', '#282a36')(props), - color: mode('#0f4b6e', '#f8f8f2')(props), + bg: mode('#f8f8f2', '#282a36')(props), + color: mode('#282a36', '#f8f8f2')(props), } }) } @@ -14,14 +14,30 @@ const styles = { const components = { Link: { baseStyle: (props : StyleFunctionProps) => ({ - color: mode('#3d7aed', '#bd93f9')(props), + color: mode('#ff5555', '#bd93f9')(props), + textUnderlineOffset: 3 - }) + }), + variants: { + 'topnav-link': (props : StyleFunctionProps) => ({ + color: mode('#282a36', '#f8f8f2')(props), + textDecoration: "none" + }) + } }, Text: { baseStyle: (_props : StyleFunctionProps) => ({ textAlign: "justify", }) + }, + Heading: { + variants: { + "section-title": { + pt: "10px", + pb: "10px", + fontSize: "1.5rem" + } + } } } diff --git a/pages/index.tsx b/pages/index.tsx index a654d93..261624d 100644 --- a/pages/index.tsx +++ b/pages/index.tsx @@ -52,7 +52,7 @@ const Home: NextPage = () => { borderRadius="full" borderWidth = "3px" borderStyle = "solid" - borderColor = {useColorModeValue("#FFFFFF", "#6272a4")} + borderColor = {useColorModeValue("#eee8d5", "#6272a4")} /> </Box> </Stack> |