mirror of
https://github.com/kamranahmedse/developer-roadmap.git
synced 2025-02-24 03:23:08 +01:00
Guides listing
This commit is contained in:
parent
c097017520
commit
fc159ecb9b
@ -2,6 +2,7 @@ import React from 'react';
|
|||||||
import { Badge, Flex, Link, Text } from '@chakra-ui/react';
|
import { Badge, Flex, Link, Text } from '@chakra-ui/react';
|
||||||
|
|
||||||
type LinksListItemProps = {
|
type LinksListItemProps = {
|
||||||
|
href: string;
|
||||||
title: string;
|
title: string;
|
||||||
subtitle: string;
|
subtitle: string;
|
||||||
badgeText?: string;
|
badgeText?: string;
|
||||||
@ -10,10 +11,11 @@ type LinksListItemProps = {
|
|||||||
};
|
};
|
||||||
|
|
||||||
export function LinksListItem(props: LinksListItemProps) {
|
export function LinksListItem(props: LinksListItemProps) {
|
||||||
const { title, subtitle, badgeText, icon, hideSubtitleOnMobile = false } = props;
|
const { title, subtitle, badgeText, icon, hideSubtitleOnMobile = false, href } = props;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Link
|
<Link
|
||||||
|
href={href}
|
||||||
fontSize={['14px', '14px', '15px']}
|
fontSize={['14px', '14px', '15px']}
|
||||||
py='9px'
|
py='9px'
|
||||||
d='flex'
|
d='flex'
|
||||||
|
@ -20,7 +20,7 @@
|
|||||||
"createdAt": "2020-07-01T19:59:14.191Z"
|
"createdAt": "2020-07-01T19:59:14.191Z"
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"title": "OAuth — Open Authorization",
|
"title": "OAuth — Open Authorization",
|
||||||
"description": "Learn and understand what is OAuth and how it works",
|
"description": "Learn and understand what is OAuth and how it works",
|
||||||
"url": "/guides/oauth",
|
"url": "/guides/oauth",
|
||||||
"fileName": "oauth",
|
"fileName": "oauth",
|
||||||
|
@ -66,6 +66,7 @@ export default function Home(props: HomeProps) {
|
|||||||
{guides.map(guide => (
|
{guides.map(guide => (
|
||||||
<LinksListItem
|
<LinksListItem
|
||||||
key={guide.url}
|
key={guide.url}
|
||||||
|
href={guide.url}
|
||||||
title={guide.title}
|
title={guide.title}
|
||||||
badgeText={guide.isPro ? 'PRO' : ''}
|
badgeText={guide.isPro ? 'PRO' : ''}
|
||||||
subtitle={guide.formattedUpdatedAt}
|
subtitle={guide.formattedUpdatedAt}
|
||||||
|
Loading…
x
Reference in New Issue
Block a user