mirror of https://github.com/Lissy93/dashy.git
✍️ Adds intro text, and makes show hide functionality
This commit is contained in:
parent
6036503e15
commit
abe4b7e60c
|
@ -1,4 +1,4 @@
|
|||
import React from 'react';
|
||||
import React, { useState } from 'react'
|
||||
import useDocusaurusContext from '@docusaurus/useDocusaurusContext';
|
||||
import styles from '../styles/Header.module.scss';
|
||||
|
||||
|
@ -11,16 +11,30 @@ import IconBannerDocs from '../../static/icons/banner_docs.svg';
|
|||
|
||||
export default function HomepageHeader() {
|
||||
const { siteConfig } = useDocusaurusContext();
|
||||
const [showMore, setShowMore] = useState(false);
|
||||
return (
|
||||
<header className={styles.heroBanner}>
|
||||
<h1 className={styles.heroTitle}>{siteConfig.title}</h1>
|
||||
<h3 className={styles.heroSubTitle}>{siteConfig.tagline}</h3>
|
||||
<div className={styles.buttons}>
|
||||
<Button to="/docs" color="pink"><IconBannerDemo />Try it Out</Button>
|
||||
<Button to="/docs" color="blue"><IconBannerGetStarted />Get Started</Button>
|
||||
<Button to="/docs" color="pink"><IconBannerGetStarted />Get Started</Button>
|
||||
<Button to="/docs" color="blue"><IconBannerDemo />Try it Out</Button>
|
||||
<Button to="/docs" color="green"><IconBannerSource />Source Code</Button>
|
||||
<Button to="/docs" color="yellow"><IconBannerDocs />Documentation</Button>
|
||||
</div>
|
||||
<div className={styles.dashyDescription}>
|
||||
Dashy is an easy-to-deploy, highly-customizable self-hosted dashboard.
|
||||
It helps you keep your apps and services organized in a single place,
|
||||
and makes launching your apps super quick, with customizable keyboard
|
||||
shortcuts and instant search.
|
||||
<span className={styles.keepReading} onClick={() => setShowMore(!showMore)}>
|
||||
{!showMore ? 'Keep Reading...' : 'Show Less'}
|
||||
</span>
|
||||
{showMore && (
|
||||
<p className={styles.dashyDescription}>See me now</p>
|
||||
)
|
||||
}
|
||||
</div>
|
||||
</header>
|
||||
);
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue