knight/datahub
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[examples/538][sm] - bug fixes + favicon

Browse Source
This commit is contained in:
Luccas Mateus de Medeiros Gomes 2023-05-09 15:06:26 -03:00
parent a954575397
commit 714faf9986
3 changed files with 13 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
examples/fiverthirtyeight-example/pages/_document.tsx
View File

@ -1,13 +1,19 @@
import { Html, Head, Main, NextScript } from 'next/document'
import { Html, Head, Main, NextScript } from 'next/document';
export default function Document() {
return (
<Html lang="en">
<Head />
<Head>
<link
rel="icon"
type="image/x-icon"
href="https://projects.fivethirtyeight.com/shared/favicon.ico"
/>
</Head>
<body>
<Main />
<NextScript />
</body>
</Html>
)
);
}

13
examples/fiverthirtyeight-example/pages/api/hello.ts
View File

@ -1,13 +0,0 @@
// Next.js API route support: https://nextjs.org/docs/api-routes/introduction
import type { NextApiRequest, NextApiResponse } from 'next'
type Data = {
name: string
}
export default function handler(
req: NextApiRequest,
res: NextApiResponse<Data>
) {
res.status(200).json({ name: 'John Doe' })
}

8
examples/fiverthirtyeight-example/pages/index.tsx
View File

@ -25,7 +25,7 @@ export function MobileItem({dataset} : { dataset: Dataset}) {
<div className="flex flex-col">
<span className="font-light">{dataset.name}</span>
{dataset.articles.map((article) => (
<div className='py-1 flex flex-col'>
<div key={article.title} className='py-1 flex flex-col'>
<span className="font-bold hover:underline">{article.title}</span>
<span className="font-light text-base">{format(article.date)}</span>{' '}
</div>
@ -63,7 +63,7 @@ export function DesktopItem({dataset} : { dataset: Dataset}) {
return (
<>
{dataset.articles.map((article, index) => (
<tr className={`${index === (dataset.articles.length - 1) ? 'border-b' : ''} border-zinc-400`}>
<tr key={article.url} className={`${index === (dataset.articles.length - 1) ? 'border-b' : ''} border-zinc-400`}>
<td className="py-8 font-light">{index === 0 ? dataset.name : ''}</td>
<td>
<a className="py-8 font-bold hover:underline" href={article.url}>
@ -148,7 +148,7 @@ export default function Home( { datasets }: { datasets: Dataset[] }) {
stories and visualizations of&nbsp;your&nbsp;own.
</p>
</div>
<article className="w-full px-2 md:hidden py-4">{datasets.map(dataset => <MobileItem dataset={dataset} />)}</article>
<article className="w-full px-2 md:hidden py-4">{datasets.map(dataset => <MobileItem key={dataset.name} dataset={dataset} />)}</article>
<table className="w-full mt-10 mb-4 hidden md:table">
<thead className="border-b-4 pb-2 border-zinc-900">
<tr>
@ -163,7 +163,7 @@ export default function Home( { datasets }: { datasets: Dataset[] }) {
</th>
</tr>
</thead>
<tbody>{datasets.map(dataset => <DesktopItem dataset={dataset} />)}</tbody>
<tbody>{datasets.map(dataset => <DesktopItem key={dataset.name} dataset={dataset} />)}</tbody>
</table>
<p className="text-[13px] py-8">
Unless otherwise noted, our data sets are available under the{' '}