Skip to content

Commit

Permalink
Merge pull request #10 from dappcamp/staging
Browse files Browse the repository at this point in the history 
Add launch year for each tool
  • Loading branch information
@itsharshag
itsharshag authored Jun 7, 2022
2 parents 23d7e99 + 45b1797 commit 2581cb8
Show file tree
Hide file tree
Showing 7 changed files with 1,239 additions and 1,023 deletions.
17 changes: 14 additions & 3 deletions README.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,14 +2,25 @@

This landscape represents a comprehensive list of tools that developers use when developing smart contracts on Ethereum and EVM-compatible chains.

Currently it features 75+ tools spread across 15+ categories.

The tools within each category are sorted according to their popularity/usage.

![2022-06-07 14 38 00](https://user-images.githubusercontent.com/78253155/172342647-04fe429e-022f-4b95-a049-ac0299a55da7.gif)

### Contributing
To suggest changes to the categories or the entries, modify the [`landscape.json`](https://github.com/dappcamp/landscape/blob/master/app/data/landscape.json) file according to the below guidelines and open a pull request:

- **Required fields:** name, full_name, description, and logo
- SVG logos are preferred
To suggest any changes to the entries or the categories, modify the [`landscape.json`](https://github.com/dappcamp/landscape/blob/master/app/data/landscape.json) file and open a pull request.

To suggest new entries, follow the below guidelines:

- **Required fields:** name, full_name, category, description, launch_year, and logo
- Use a svg logo if possible

### Local setup

This landscape app is built using Next.js and Tailwind. Run the following commands to open the project locally:

```
cd app
yarn install
Expand Down
9 changes: 5 additions & 4 deletions app/components/LogoCard.jsx
View file
Original file line number Diff line number Diff line change
@@ -1,8 +1,8 @@
import React from 'react'
import { Card, Row } from '@nextui-org/react'

export default function LogoCard({ item, onClick }) {
const { logo, title, name } = item
export default function LogoCard({ item, onClick, showLaunchYear }) {
const { logo, title, name, launch_year } = item

return (
<Card
Expand All @@ -22,9 +22,10 @@ export default function LogoCard({ item, onClick }) {
</div>
</Card.Body>
<Card.Footer style={{ padding: "8px" }}>
<Row wrap="wrap" justify="space-between">
<div className='text-center w-full'>
<p className='font-semibold text-gray-600 text-xs text-center w-full single-line' style={{ maxWidth: "84px" }}>{name}</p>
</Row>
{showLaunchYear && <p className='text-xs text-gray-400'>{launch_year}</p>}
</div>
</Card.Footer>
</Card>
)
Expand Down
202 changes: 112 additions & 90 deletions app/components/ToolModal.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,103 +19,125 @@ const cleanUrl = (websiteUrl) => {
}
}

export default function ToolModal({ visible, setVisible, currentItem }){
const { name, full_name, description, website, title, logo, github, twitter, crunchbase, funding } = currentItem
export default function ToolModal({ visible, setVisible, currentItem }) {
const {
name,
full_name,
description,
website,
title,
logo,
github,
twitter,
crunchbase,
funding,
launch_year,
} = currentItem

const closeHandler = () => {
setVisible(false)
}

return (
<Modal
closeButton
width="480px"
aria-labelledby="modal-title"
open={visible}
onClose={closeHandler}
style={{ marginLeft: '16px', marginRight: '16px' }}
>
<Modal.Body>
<div className="pb-6">
<img
src={logo}
width={'48px'}
height={'48px'}
className="mb-4"
alt={title}
/>
<h1 className="font-bold text-xl mb-2">{full_name || name}</h1>
<p className="mb-3">{description}</p>
<div className="text-sm flex flex-col gap-2">
<div className="detail">
{cleanUrl(website) && (
<p>
<span className="font-semibold block mb-0.5 ">Website</span>{' '}
<a
href={website}
target="_blank"
className="text-blue-500 hover:font-semibold"
>
{cleanUrl(website)}
</a>
</p>
)}
</div>
<div className="detail">
{extractTwitterUsernameFromUrl(twitter) && (
<p>
<span className="font-semibold block mb-0.5 ">Twitter</span>{' '}
<a
href={twitter}
target="_blank"
className="text-blue-500 hover:font-semibold"
>
{extractTwitterUsernameFromUrl(twitter)}
</a>
</p>
)}
</div>
<div className="detail">
{cleanUrl(github) && (
<p>
<span className="font-semibold block mb-0.5 ">GitHub</span>{' '}
<a
href={github}
target="_blank"
className="text-blue-500 hover:font-semibold"
>
{cleanUrl(github)}
</a>
</p>
)}
</div>
<div className="detail">
{cleanUrl(crunchbase) && (
<p>
<span className="font-semibold block mb-0.5 ">
Crunchbase
</span>{' '}
<a
href={crunchbase}
target="_blank"
className="text-blue-500 hover:font-semibold"
>
{cleanUrl(crunchbase)}
</a>
</p>
)}
</div>
<div className="detail">
{funding && (
<p>
<span className="font-semibold block mb-0.5 ">Funding</span>{' '}
{funding}
</p>
)}
closeButton
width="480px"
aria-labelledby="modal-title"
open={visible}
onClose={closeHandler}
style={{ marginLeft: '16px', marginRight: '16px' }}
>
<Modal.Body>
<div className="pb-6">
<img
src={logo}
width={'48px'}
height={'48px'}
className="mb-4"
alt={title}
/>
<h1 className="font-bold text-xl mb-2">{full_name || name}</h1>
<p className="mb-3">{description}</p>
<div className="text-sm flex flex-col gap-2">
<div className="detail">
{launch_year && (
<p>
<span className="font-semibold block mb-0.5 ">
Launched In
</span>{' '}
{launch_year}
</p>
)}
</div>
<div className="detail">
{cleanUrl(website) && (
<p>
<span className="font-semibold block mb-0.5 ">Website</span>{' '}
<a
href={website}
target="_blank"
className="text-blue-500 hover:font-semibold"
>
{cleanUrl(website)}
</a>
</p>
)}
</div>
<div className="detail">
{extractTwitterUsernameFromUrl(twitter) && (
<p>
<span className="font-semibold block mb-0.5 ">Twitter</span>{' '}
<a
href={twitter}
target="_blank"
className="text-blue-500 hover:font-semibold"
>
{extractTwitterUsernameFromUrl(twitter)}
</a>
</p>
)}
</div>
<div className="detail">
{cleanUrl(github) && (
<p>
<span className="font-semibold block mb-0.5 ">GitHub</span>{' '}
<a
href={github}
target="_blank"
className="text-blue-500 hover:font-semibold"
>
{cleanUrl(github)}
</a>
</p>
)}
</div>
<div className="detail">
{cleanUrl(crunchbase) && (
<p>
<span className="font-semibold block mb-0.5 ">
Crunchbase
</span>{' '}
<a
href={crunchbase}
target="_blank"
className="text-blue-500 hover:font-semibold"
>
{cleanUrl(crunchbase)}
</a>
</p>
)}
</div>
<div className="detail">
{funding && (
<p>
<span className="font-semibold block mb-0.5 ">Funding</span>{' '}
{funding}
</p>
)}
</div>
</div>
</div>
</div>
</Modal.Body>
</Modal>
</Modal.Body>
</Modal>
)
}
}
Loading

1 comment on commit 2581cb8

@vercel
Copy link

@vercel vercel bot commented on 2581cb8 Jun 7, 2022

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Successfully deployed to the following URLs:

landscape – ./

landscape-dappcamp.vercel.app
landscape-git-master-dappcamp.vercel.app
landscape.dappcamp.xyz

Please sign in to comment.