status-im
/
dappconnect-sdks
mirror of https://github.com/status-im/dappconnect-sdks.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

fix: repos cards

This commit is contained in:
marcelines 2023-06-07 14:42:52 +01:00
parent a35371dc60
commit a4797bb5db
No known key found for this signature in database
GPG Key ID: 56B1E53E2A3F43C7
1 changed files with 61 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

85
apps/website/src/pages/insights/repos.tsx
View File

@ -1,4 +1,5 @@
import { Text } from '@status-im/components'
import { Shadow, Text } from '@status-im/components'
import { OpenIcon, UnlockedIcon } from '@status-im/icons'
import { Link } from '@/components/link'
import { InsightsLayout } from '@/layouts/insights-layout'
@ -30,6 +31,24 @@ const repos = [
issues: 10,
stars: 5,
},
{
name: 'nim-waku',
description: 'a free (libre) open source, mobile OS for Ethereum.',
issues: 10,
stars: 5,
},
{
name: 'go-waku',
description: 'a free (libre) open source, mobile OS for Ethereum.',
issues: 10,
stars: 5,
},
{
name: 'js-waku',
description: 'a free (libre) open source, mobile OS for Ethereum.',
issues: 10,
stars: 5,
},
{
name: 'nimbus-eth2',
description: 'a free (libre) open source, mobile OS for Ethereum.',
@ -55,30 +74,48 @@ const ReposPage: Page = () => {
<div className="grid grid-cols-3 gap-5">
{repos.map(repo => (
<Link
key={repo.name}
href={`https://github.com/status-im/${repo.name}`}
className="border-neutral-10 hover:border-neutral-40 flex h-[124px] flex-col rounded-2xl border px-4 py-3 transition-colors duration-200"
>
<Text size={15} weight="semibold">
{repo.name}
</Text>
<Text size={15} color="$neutral-50">
{repo.description}
</Text>
<Shadow key={repo.name}>
<Link
href={`https://github.com/status-im/${repo.name}`}
className="border-neutral-10 hover:border-neutral-40 flex h-[124px] flex-col justify-between rounded-2xl border px-4 py-3 transition-colors duration-200"
>
<div className="flex flex-col">
<Text size={15} weight="semibold">
{repo.name}
</Text>
<Text size={15} color="$neutral-50">
{repo.description}
</Text>
</div>
<div className="flex gap-3 pt-4">
<Text size={13} weight="medium" color="$neutral-50">
Public
</Text>
<Text size={13} weight="medium" color="$neutral-50">
42 Issues
</Text>
<Text size={13} weight="medium" color="$neutral-50">
32
</Text>
</div>
</Link>
<div className="flex gap-3 pt-4">
<div className="flex items-center">
<div className="pr-1">
<UnlockedIcon size={12} color="$neutral-50" />
</div>
<Text size={13} weight="medium" color="$neutral-100">
Public
</Text>
</div>
<div className="flex items-center">
<div className="pr-1">
<OpenIcon size={12} color="$neutral-50" />
</div>
<Text size={13} weight="medium" color="$neutral-100">
42 issues
</Text>
</div>
<div className="flex items-center">
<div className="pr-1">
<OpenIcon size={12} color="$neutral-50" />
</div>
<Text size={13} weight="medium" color="$neutral-100">
32
</Text>
</div>
</div>
</Link>
</Shadow>
))}
</div>
</div>