Unverified Commit c7313b97 authored by Andrea Pappacoda's avatar Andrea Pappacoda Committed by GitHub

Clean upgrade to Docusaurus 2.0.0-beta.1 (#942)

parent bb2b12c9
# Website # Website
This website is built using [Docusaurus 2](https://v2.docusaurus.io/), a modern static website generator. This website is built using [Docusaurus 2](https://docusaurus.io/), a modern static website generator.
## Installation ## Installation
...@@ -14,7 +14,7 @@ yarn install ...@@ -14,7 +14,7 @@ yarn install
yarn start yarn start
``` ```
This command starts a local development server and open up a browser window. Most changes are reflected live without having to restart the server. This command starts a local development server and opens up a browser window. Most changes are reflected live without having to restart the server.
## Build ## Build
......
...@@ -8,16 +8,22 @@ ...@@ -8,16 +8,22 @@
"build": "docusaurus build", "build": "docusaurus build",
"swizzle": "docusaurus swizzle", "swizzle": "docusaurus swizzle",
"deploy": "docusaurus deploy", "deploy": "docusaurus deploy",
"clear": "docusaurus clear",
"serve": "docusaurus serve", "serve": "docusaurus serve",
"clear": "docusaurus clear" "write-translations": "docusaurus write-translations",
"write-heading-ids": "docusaurus write-heading-ids"
}, },
"dependencies": { "dependencies": {
"@docusaurus/core": "2.0.0-beta.0", "@docusaurus/core": "2.0.0-beta.1",
"@docusaurus/preset-classic": "2.0.0-beta.0", "@docusaurus/preset-classic": "2.0.0-beta.1",
"@mdx-js/react": "^1.6.21", "@mdx-js/react": "^1.6.21",
"@svgr/webpack": "^5.5.0",
"clsx": "^1.1.1", "clsx": "^1.1.1",
"react": "^16.8.4", "file-loader": "^6.2.0",
"react-dom": "^16.8.4" "prism-react-renderer": "^1.2.1",
"react": "^17.0.1",
"react-dom": "^17.0.1",
"url-loader": "^4.1.1"
}, },
"browserslist": { "browserslist": {
"production": [ "production": [
...@@ -31,4 +37,4 @@ ...@@ -31,4 +37,4 @@
"last 1 safari version" "last 1 safari version"
] ]
} }
} }
\ No newline at end of file
/**
* Creating a sidebar enables you to:
- create an ordered group of docs
- render a sidebar for each doc of that group
- provide next/previous navigation
The sidebars can be generated from the filesystem, or explicitly defined here.
Create as many sidebars as you want.
*/
module.exports = { module.exports = {
leftSidebar: { // By default, Docusaurus generates a sidebar from the docs folder structure
Pistache: ['quickstart', 'http-handler', 'asynchronous-http-programming', 'headers', 'routing'], leftSidebar: [{type: 'autogenerated', dirName: '.'}],
},
// But you can create a sidebar manually
/*
tutorialSidebar: [
{
type: 'category',
label: 'Tutorial',
items: ['hello'],
},
],
*/
}; };
import React from 'react';
import clsx from 'clsx';
import styles from './HomepageFeatures.module.css';
const FeatureList = [
{
title: 'Modern API',
Svg: require('../../static/img/undraw_futuristic_interface.svg').default,
description: (
<>
Written in pure C++17 and providing a low-level HTTP abstraction,
Pistache makes playing with its modern API fun and easy,
just take a look at the quickstart
</>
),
},
{
title: 'What\'s in the box',
Svg: require('../../static/img/undraw_accept_request.svg').default,
description: (
<>
<ul>
<li>A multi-threaded HTTP server to build your APIs</li>
<li>An asynchronous HTTP client to request APIs</li>
<li>An HTTP router to dispatch requests to C++ functions</li>
<li>A REST description DSL to easily define your APIs</li>
<li>Type-safe headers and MIME types implementation</li>
</ul>
</>
),
},
{
title: 'Use it',
Svg: require('../../static/img/undraw_version_control.svg').default,
description: (
<>
<ul>
<li>Clone it on <a href="https://github.com/pistacheio/pistache">GitHub</a></li>
<li>Start with the <a href="docs/">quickstart</a></li>
<li>Read the full user's <a href="docs/http-handler">guide</a></li>
<li>Have issues with it? Fill an <a href="https://github.com/pistacheio/pistache/issues">issue</a></li>
</ul>
</>
),
},
];
function Feature({Svg, title, description}) {
return (
<div className={clsx('col col--4')}>
<div className="text--center">
<Svg className={styles.featureSvg} alt={title} />
</div>
<h3>{title}</h3>
<p>{description}</p>
</div>
);
}
export default function HomepageFeatures() {
return (
<section className={styles.features}>
<div className="container">
<div className="row">
{FeatureList.map((props, idx) => (
<Feature key={idx} {...props} />
))}
</div>
</div>
</section>
);
}
/* stylelint-disable docusaurus/copyright-header */
.features {
display: flex;
align-items: center;
padding: 2rem 0;
width: 100%;
}
.featureSvg {
height: 200px;
width: 200px;
}
...@@ -18,12 +18,16 @@ ...@@ -18,12 +18,16 @@
} }
.docusaurus-highlight-code-line { .docusaurus-highlight-code-line {
background-color: rgb(72, 77, 91); background-color: rgba(0, 0, 0, 0.1);
display: block; display: block;
margin: 0 calc(-1 * var(--ifm-pre-padding)); margin: 0 calc(-1 * var(--ifm-pre-padding));
padding: 0 var(--ifm-pre-padding); padding: 0 var(--ifm-pre-padding);
} }
html[data-theme='dark'] .docusaurus-highlight-code-line {
background-color: rgba(0, 0, 0, 0.3);
}
.header-github-link:hover { .header-github-link:hover {
opacity: 0.6; opacity: 0.6;
} }
......
...@@ -3,104 +3,42 @@ import clsx from 'clsx'; ...@@ -3,104 +3,42 @@ import clsx from 'clsx';
import Layout from '@theme/Layout'; import Layout from '@theme/Layout';
import Link from '@docusaurus/Link'; import Link from '@docusaurus/Link';
import useDocusaurusContext from '@docusaurus/useDocusaurusContext'; import useDocusaurusContext from '@docusaurus/useDocusaurusContext';
import useBaseUrl from '@docusaurus/useBaseUrl'; import styles from './index.module.css';
import styles from './styles.module.css'; import HomepageFeatures from '../components/HomepageFeatures';
const features = [ function HomepageHeader() {
{ const {siteConfig} = useDocusaurusContext();
title: 'Modern API',
imageUrl: 'img/undraw_futuristic_interface.svg',
description: (
<>
Written in pure C++17 and providing a low-level HTTP abstraction,
Pistache makes playing with its modern API fun and easy,
just take a look at the quickstart
</>
),
},
{
title: 'What\'s in the box',
imageUrl: 'img/undraw_accept_request.svg',
description: (
<>
<ul>
<li>A multi-threaded HTTP server to build your APIs</li>
<li>An asynchronous HTTP client to request APIs</li>
<li>An HTTP router to dispatch requests to C++ functions</li>
<li>A REST description DSL to easily define your APIs</li>
<li>Type-safe headers and MIME types implementation</li>
</ul>
</>
),
},
{
title: 'Use it',
imageUrl: 'img/undraw_version_control.svg',
description: (
<>
<ul>
<li>Clone it on <a href="https://github.com/pistacheio/pistache">GitHub</a></li>
<li>Start with the <a href="docs/">quickstart</a></li>
<li>Read the full user's <a href="docs/http-handler">guide</a></li>
<li>Have issues with it? Fill an <a href="https://github.com/pistacheio/pistache/issues">issue</a></li>
</ul>
</>
),
},
];
function Feature({imageUrl, title, description}) {
const imgUrl = useBaseUrl(imageUrl);
return ( return (
<div className={clsx('col col--4', styles.feature)}> <header className={clsx('hero hero--primary', styles.heroBanner)}>
{imgUrl && ( <div className="container">
<div className="text--center"> <h1 className="hero__title">{siteConfig.title}</h1>
<img className={styles.featureImage} src={imgUrl} alt={title} /> <p className="hero__subtitle">{siteConfig.tagline}</p>
<div className={styles.buttons}>
<Link
className={clsx(
'button button--outline button--secondary button--lg',
styles.getStarted,
)}
to="/docs/">
Get Started
</Link>
</div> </div>
)} </div>
<h3>{title}</h3> </header>
<p>{description}</p>
</div>
); );
} }
function Home() { export default function Home() {
const context = useDocusaurusContext(); const {siteConfig} = useDocusaurusContext();
const {siteConfig = {}} = context;
return ( return (
<Layout <Layout
description="Description will go into a meta tag in <head />"> //title={`Hello from ${siteConfig.title}`}
<header className={clsx('hero hero--primary', styles.heroBanner)}> //description="Description will go into a meta tag in <head />"
<div className="container"> >
<h1 className="hero__title">{siteConfig.title}</h1> <HomepageHeader />
<p className="hero__subtitle">{siteConfig.tagline}</p>
<div className={styles.buttons}>
<Link
className={clsx(
'button button--outline button--secondary button--lg',
styles.getStarted,
)}
to={useBaseUrl('docs/')}>
Get Started
</Link>
</div>
</div>
</header>
<main> <main>
{features && features.length > 0 && ( <HomepageFeatures />
<section className={styles.features}>
<div className="container">
<div className="row">
{features.map((props, idx) => (
<Feature key={idx} {...props} />
))}
</div>
</div>
</section>
)}
</main> </main>
</Layout> </Layout>
); );
} }
export default Home;
...@@ -23,15 +23,3 @@ ...@@ -23,15 +23,3 @@
align-items: center; align-items: center;
justify-content: center; justify-content: center;
} }
.features {
display: flex;
align-items: center;
padding: 2rem 0;
width: 100%;
}
.featureImage {
height: 200px;
width: 200px;
}
This source diff could not be displayed because it is too large. You can view the blob instead.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment