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

[Pages][m]: Add stub pages for learn, doc and gallery

Browse Source
This commit is contained in:
Rising Odegua
2021-05-19 12:15:49 +01:00
parent c4375a6d70
commit 9ad383420d
6 changed files with 135 additions and 165 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
docs/components/Footer/index.jsx
View File

@@ -0,0 +1,16 @@
import styles from '../../styles/Home.module.css'
export default function Footer() {
return (
<footer className={styles.footer}>
<a
href="https://www.datopian.com/"
target="_blank"
rel="noopener noreferrer"
>
Built by{' '}
<img src="/datopian-logo.png" alt="Datopian Logo" className={styles.logo} />
</a>
</footer>
)
}

66
docs/components/Nav/index.jsx
View File

@@ -1,9 +1,7 @@
import { useState } from 'react' import { useState } from 'react'
import Head from 'next/head'
import Link from 'next/link' import Link from 'next/link'
import styles from '../styles/Home.module.css'
export default function Home() { export default function Nav() {
const [open, setOpen] = useState(false); const [open, setOpen] = useState(false);
const handleClick = (event) => { const handleClick = (event) => {
event.preventDefault(); event.preventDefault();
@@ -17,7 +15,6 @@ export default function Home() {
{ title: 'Github', path: 'https://github.com/datopian/portal.js' }] { title: 'Github', path: 'https://github.com/datopian/portal.js' }]
return ( return (
<>
<nav className="flex items-center justify-between flex-wrap bg-white p-4 border-b border-gray-200"> <nav className="flex items-center justify-between flex-wrap bg-white p-4 border-b border-gray-200">
<div className="flex items-center flex-shrink-0 text-gray-700 mr-6"> <div className="flex items-center flex-shrink-0 text-gray-700 mr-6">
<img src="/logo.svg" alt="portal logo" width="110" /> <img src="/logo.svg" alt="portal logo" width="110" />
@@ -47,66 +44,5 @@ export default function Home() {
})} })}
</div> </div>
</nav> </nav>
<div className={styles.container}>
<Head>
<title>Create Portal App</title>
<link rel="icon" href="/favicon.ico" />
</Head>
<main className={styles.main}>
<h1 className={styles.title}>
Welcome to <a href="https://github.com/datopian/portal.js">Portal.js!</a>
</h1>
<p className={styles.description}>
Rapidly build rich data portals using a modern frontend framework!
</p>
<div className={styles.grid}>
<a href="/docs" className={styles.card}>
<h3>Documentation &rarr;</h3>
<p>Find in-depth information about Portal.js features and API.</p>
</a>
<a href="/learn" className={styles.card}>
<h3>Learn &rarr;</h3>
<p>Learn about Portal.js with examples!</p>
</a>
<a
href="/gallery"
className={styles.card}
>
<h3>Gallery &rarr;</h3>
<p>Discover examples of Portal.js projects.</p>
</a>
<a
href="https://github.com/datopian/portal.js"
className={styles.card}
>
<h3>Contribute &rarr;</h3>
<p>
Checkout the Portal.js repository on github
</p>
</a>
</div>
</main>
<footer className={styles.footer}>
<a
href="https://www.datopian.com/"
target="_blank"
rel="noopener noreferrer"
>
Built by{' '}
<img src="/datopian-logo.png" alt="Datopian Logo" className={styles.logo} />
</a>
</footer>
</div>
</>
) )
} }

23
docs/pages/docs.js
View File

@@ -0,0 +1,23 @@
import Head from 'next/head'
import Nav from '../components/Nav'
import Footer from '../components/Footer'
import styles from '../styles/Home.module.css'
export default function Docs() {
return (
<>
<Head>
<title>Portal.js Api Documentation</title>
<link rel="icon" href="/favicon.ico" />
</Head>
<Nav />
<div className={styles.container}>
<main className={styles.main}>
</main>
<Footer />
</div>
</>
)
}

23
docs/pages/gallery.js
View File

@@ -0,0 +1,23 @@
import Head from 'next/head'
import Nav from '../components/Nav'
import Footer from '../components/Footer'
import styles from '../styles/Home.module.css'
export default function Gallery() {
return (
<>
<Head>
<title>Portal.js Gallery</title>
<link rel="icon" href="/favicon.ico" />
</Head>
<Nav />
<div className={styles.container}>
<main className={styles.main}>
</main>
<Footer />
</div>
</>
)
}

61
docs/pages/index.js
View File

@@ -1,59 +1,18 @@
import { useState } from 'react'
import Head from 'next/head' import Head from 'next/head'
import Link from 'next/link' import Nav from '../components/Nav'
import Footer from '../components/Footer'
import styles from '../styles/Home.module.css' import styles from '../styles/Home.module.css'
export default function Home() { export default function Home() {
const [open, setOpen] = useState(false);
const handleClick = (event) => {
event.preventDefault();
setOpen(!open);
};
const navMenu = [{ title: 'Home', path: '/' },
{ title: 'Gallery', path: '/gallery' },
{ title: 'Docs', path: '/docs' },
{ title: 'Learn', path: '/learn' },
{ title: 'Github', path: 'https://github.com/datopian/portal.js' }]
return ( return (
<> <>
<nav className="flex items-center justify-between flex-wrap bg-white p-4 border-b border-gray-200">
<div className="flex items-center flex-shrink-0 text-gray-700 mr-6">
<img src="/logo.svg" alt="portal logo" width="110" />
</div>
<div className="block lg:hidden mx-4">
<button
onClick={handleClick}
className="flex items-center px-3 py-2 border rounded text-gray-700 border-orange-400 hover:text-black hover:border-black"
>
<svg
className="fill-current h-3 w-3"
viewBox="0 0 20 20"
xmlns="http://www.w3.org/2000/svg"
>
<title>Menu</title>
<path d="M0 3h20v2H0V3zm0 6h20v2H0V9zm0 6h20v2H0v-2z" />
</svg>
</button>
</div>
<div className={`${open ? `block` : `hidden`} lg:block`}>
{navMenu.map((menu, index) => {
return (<Link href={menu.path} key={index}>
<a className="block mt-4 lg:inline-block lg:mt-0 active:bg-primary-background text-gray-700 hover:text-black mr-6">
{menu.title}
</a>
</Link>)
})}
</div>
</nav>
<div className={styles.container}>
<Head> <Head>
<title>Create Portal App</title> <title>Create Portal App</title>
<link rel="icon" href="/favicon.ico" /> <link rel="icon" href="/favicon.ico" />
</Head> </Head>
<Nav />
<div className={styles.container}>
<main className={styles.main}> <main className={styles.main}>
@@ -95,17 +54,7 @@ export default function Home() {
</a> </a>
</div> </div>
</main> </main>
<Footer />
<footer className={styles.footer}>
<a
href="https://www.datopian.com/"
target="_blank"
rel="noopener noreferrer"
>
Built by{' '}
<img src="/datopian-logo.png" alt="Datopian Logo" className={styles.logo} />
</a>
</footer>
</div> </div>
</> </>
) )

23
docs/pages/learn.js
View File

@@ -0,0 +1,23 @@
import Head from 'next/head'
import Nav from '../components/Nav'
import Footer from '../components/Footer'
import styles from '../styles/Home.module.css'
export default function Learn() {
return (
<>
<Head>
<title>Portal.js Learn by Examples</title>
<link rel="icon" href="/favicon.ico" />
</Head>
<Nav />
<div className={styles.container}>
<main className={styles.main}>
</main>
<Footer />
</div>
</>
)
}