From 8c7494ce70cb63fce37e1a49db22c99d7bbf9067 Mon Sep 17 00:00:00 2001 From: Hossein Mehrabi Date: Fri, 7 Oct 2022 10:32:24 +0330 Subject: [PATCH] make docs' index page the landing page. --- docs/index.mdx | 52 ++++++++++++++++++++ docusaurus.config.js | 97 +++++++++++++++++++------------------- src/pages/index.module.css | 23 --------- src/pages/index.tsx | 43 ----------------- 4 files changed, 101 insertions(+), 114 deletions(-) create mode 100644 docs/index.mdx delete mode 100644 src/pages/index.module.css delete mode 100644 src/pages/index.tsx diff --git a/docs/index.mdx b/docs/index.mdx new file mode 100644 index 0000000..a51c7a2 --- /dev/null +++ b/docs/index.mdx @@ -0,0 +1,52 @@ +--- +sidebar_position: 1 +--- + +# Home + +import HomepageFeatures from '@site/src/components/HomepageFeatures' + + + +Let's discover **Docusaurus in less than 5 minutes**. + +## Getting Started + +Get started by **creating a new site**. + +Or **try Docusaurus immediately** with **[docusaurus.new](https://docusaurus.new)**. + +### What you'll need + +- [Node.js](https://nodejs.org/en/download/) version 16.14 or above: + - When installing Node.js, you are recommended to check all checkboxes related to dependencies. + +## Generate a new site + +Generate a new Docusaurus site using the **classic template**. + +The classic template will automatically be added to your project after you run the command: + +```bash +npm init docusaurus@latest my-website classic +``` + +You can type this command into Command Prompt, Powershell, Terminal, or any other integrated terminal of your code editor. + +The command also installs all necessary dependencies you need to run Docusaurus. + +## Start your site + +Run the development server: + +```bash +cd my-website +npm run start +``` + +The `cd` command changes the directory you're working with. In order to work with your newly created Docusaurus site, you'll need to navigate the terminal there. + +The `npm run start` command builds your website locally and serves it through a development server, ready for you to view at http://localhost:3000/. + +Open `docs/intro.md` (this page) and edit some lines: the site **reloads automatically** and displays your changes. + diff --git a/docusaurus.config.js b/docusaurus.config.js index 99a015d..21c506f 100644 --- a/docusaurus.config.js +++ b/docusaurus.config.js @@ -1,53 +1,54 @@ // @ts-check // Note: type annotations allow type checking and IDEs autocompletion -const lightCodeTheme = require("prism-react-renderer/themes/github"); -const darkCodeTheme = require("prism-react-renderer/themes/dracula"); +const lightCodeTheme = require('prism-react-renderer/themes/github') +const darkCodeTheme = require('prism-react-renderer/themes/dracula') /** @type {import('@docusaurus/types').Config} */ const config = { - title: "My Site", - tagline: "Dinosaurs are cool", - url: "https://your-docusaurus-test-site.com", - baseUrl: "/", - onBrokenLinks: "throw", - onBrokenMarkdownLinks: "warn", - favicon: "img/favicon.ico", + title: 'My Site', + tagline: 'Dinosaurs are cool', + url: 'https://your-docusaurus-test-site.com', + baseUrl: '/', + onBrokenLinks: 'throw', + onBrokenMarkdownLinks: 'warn', + favicon: 'img/favicon.ico', // GitHub pages deployment config. // If you aren't using GitHub pages, you don't need these. - organizationName: "facebook", // Usually your GitHub org/user name. - projectName: "docusaurus", // Usually your repo name. + organizationName: 'facebook', // Usually your GitHub org/user name. + projectName: 'docusaurus', // Usually your repo name. // Even if you don't use internalization, you can use this field to set useful // metadata like html lang. For example, if your site is Chinese, you may want // to replace "en" with "zh-Hans". i18n: { - defaultLocale: "en", - locales: ["en"], + defaultLocale: 'en', + locales: ['en'], }, presets: [ [ - "classic", + 'classic', /** @type {import('@docusaurus/preset-classic').Options} */ ({ docs: { - sidebarPath: require.resolve("./sidebars.js"), + routeBasePath: '/', + sidebarPath: require.resolve('./sidebars.js'), // Please change this to your repo. // Remove this to remove the "edit this page" links. editUrl: - "https://github.com/facebook/docusaurus/tree/main/packages/create-docusaurus/templates/shared/", + 'https://github.com/facebook/docusaurus/tree/main/packages/create-docusaurus/templates/shared/', }, blog: { showReadingTime: true, // Please change this to your repo. // Remove this to remove the "edit this page" links. editUrl: - "https://github.com/facebook/docusaurus/tree/main/packages/create-docusaurus/templates/shared/", + 'https://github.com/facebook/docusaurus/tree/main/packages/create-docusaurus/templates/shared/', }, theme: { - customCss: require.resolve("./src/css/custom.css"), + customCss: require.resolve('./src/css/custom.css'), }, }), ], @@ -57,65 +58,65 @@ const config = { /** @type {import('@docusaurus/preset-classic').ThemeConfig} */ ({ navbar: { - title: "My Site", + title: 'My Site', logo: { - alt: "My Site Logo", - src: "img/logo.svg", + alt: 'My Site Logo', + src: 'img/logo.svg', }, items: [ { - type: "doc", - docId: "intro", - position: "left", - label: "Tutorial", + type: 'doc', + docId: 'intro', + position: 'left', + label: 'Tutorial', }, - { to: "/blog", label: "Blog", position: "left" }, + { to: '/blog', label: 'Blog', position: 'left' }, { - href: "https://github.com/facebook/docusaurus", - label: "GitHub", - position: "right", + href: 'https://github.com/facebook/docusaurus', + label: 'GitHub', + position: 'right', }, ], }, footer: { - style: "dark", + style: 'dark', links: [ { - title: "Docs", + title: 'Docs', items: [ { - label: "Tutorial", - to: "/docs/intro", + label: 'Tutorial', + to: '/docs/intro', }, ], }, { - title: "Community", + title: 'Community', items: [ { - label: "Stack Overflow", - href: "https://stackoverflow.com/questions/tagged/docusaurus", + label: 'Stack Overflow', + href: 'https://stackoverflow.com/questions/tagged/docusaurus', }, { - label: "Discord", - href: "https://discordapp.com/invite/docusaurus", + label: 'Discord', + href: 'https://discordapp.com/invite/docusaurus', }, { - label: "Twitter", - href: "https://twitter.com/docusaurus", + label: 'Twitter', + href: 'https://twitter.com/docusaurus', }, ], }, { - title: "More", + title: 'More', items: [ { - label: "Blog", - to: "/blog", + label: 'Blog', + to: '/blog', }, { - label: "GitHub", - href: "https://github.com/facebook/docusaurus", + label: 'GitHub', + href: 'https://github.com/facebook/docusaurus', }, ], }, @@ -127,7 +128,7 @@ const config = { darkTheme: darkCodeTheme, }, }), - plugins: ["docusaurus-plugin-sass"], -}; + plugins: ['docusaurus-plugin-sass'], +} -module.exports = config; +module.exports = config diff --git a/src/pages/index.module.css b/src/pages/index.module.css deleted file mode 100644 index 9f71a5d..0000000 --- a/src/pages/index.module.css +++ /dev/null @@ -1,23 +0,0 @@ -/** - * CSS files with the .module.css suffix will be treated as CSS modules - * and scoped locally. - */ - -.heroBanner { - padding: 4rem 0; - text-align: center; - position: relative; - overflow: hidden; -} - -@media screen and (max-width: 996px) { - .heroBanner { - padding: 2rem; - } -} - -.buttons { - display: flex; - align-items: center; - justify-content: center; -} diff --git a/src/pages/index.tsx b/src/pages/index.tsx deleted file mode 100644 index 44fa4fc..0000000 --- a/src/pages/index.tsx +++ /dev/null @@ -1,43 +0,0 @@ -import React from "react"; -import clsx from "clsx"; -import Link from "@docusaurus/Link"; -import useDocusaurusContext from "@docusaurus/useDocusaurusContext"; -import Layout from "@theme/Layout"; -import HomepageFeatures from "@site/src/components/HomepageFeatures"; - -import styles from "./index.module.css"; - -function HomepageHeader() { - const { siteConfig } = useDocusaurusContext(); - return ( -
-
-

{siteConfig.title}

-

{siteConfig.tagline}

-
- - Docusaurus Tutorial - 5min ⏱️ - -
-
-
- ); -} - -export default function Home(): JSX.Element { - const { siteConfig } = useDocusaurusContext(); - return ( - - -
- -
-
- ); -}