gaspersic/developer-roadmap
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Refactor guides page

Browse Source
This commit is contained in:
Kamran Ahmed
2021-08-15 15:57:21 +02:00
parent 74791e1f7d
commit 51a5f570fe
2 changed files with 44 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

33
pages/guides/index.tsx
View File

@@ -5,6 +5,7 @@ import { LinksListItem } from '../../components/links-list-item';
import { OpensourceBanner } from '../../components/opensource-banner';
import { UpdatesBanner } from '../../components/updates-banner';
import { Footer } from '../../components/footer';
import { GuideGridItem } from './components/guide-grid-item';
export default function Guides() {
return (
@@ -17,28 +18,22 @@ export default function Guides() {
<Text fontSize='15px'>Succinct graphical explanations to development related topics.</Text>
</Container>
</Box>
<Container maxW='container.md' position='relative'>
<Badge mt='40px' mb='10px' variant='solid' colorScheme='green'>Recent Guides</Badge>
{/*<Text mt='40px' mb='10px' fontWeight={700} color='green.500'>Recent Guides</Text>*/}
{/*<Heading mt='40px' mb='15px' color='green.500' fontSize='20px'>Recent Guides</Heading>*/}
<Container maxW='container.md' position='relative' mt='30px'>
<Stack isInline mb='30px' spacing='15px'>
<Link _hover={{ textDecoration: 'none', transform: 'scale(1.02)' }} as={Box} href='#' shadow='xl' p='20px' py='25px' rounded='10px' bg={'gray.700'} flex={1}>
<Text mb='10px' fontSize='13px' color='gray.400'>June 25, 2021</Text>
<Heading color='white' mb={'6px'} fontSize='22px'>Session Based Authentication</Heading>
<Text color='gray.300' fontSize='14px'>Learn what the Session Based Authentication is, the pros and cons
.</Text>
</Link>
<Link _hover={{ textDecoration: 'none', transform: 'scale(1.02)' }} as={Box} href='#' shadow='xl' p='20px' py='25px' rounded='10px' bg={'purple.800'} flex={1}>
<Text mb='10px' fontSize='13px' color='gray.400'>June 25, 2021</Text>
<Heading color='white' mb={'6px'} fontSize='22px'>JSON Web Tokens</Heading>
<Text color='gray.300' fontSize='14px'>Learn what the Session Based Authentication is, the pros and cons
and how you can implement it in your
apps.</Text>
</Link>
<GuideGridItem
title='Session Based Authentication'
subtitle='Learn what the Session Based Authentication is, the pros and cons.'
date='June 25, 2021'
isNew
/>
<GuideGridItem
title='JSON Web Tokens'
subtitle='Learn what the Session Based Authentication is, the pros and cons and how you can implement it in your apps.'
date='June 25, 2021'
colorIndex={1}
/>
</Stack>
<Badge mt='30px' mb='10px' variant='solid' colorScheme='green'>Past Guides</Badge>
<LinksList>
<LinksListItem title='Session based Authentication' badgeText='pro' subtitle='June 12, 2021' />
<LinksListItem title='Session based Authentication' subtitle='June 12, 2021' />