From bda152f6547b3524cf66ecb9e43175749a65407d Mon Sep 17 00:00:00 2001 From: 0xSage Date: Thu, 21 Sep 2023 19:25:24 +0800 Subject: [PATCH] chore: changed hero layout --- docs/docusaurus.config.js | 2 +- docs/src/components/Homepage/features.js | 76 +++++++- docs/src/components/Homepage/hero.js | 197 ++++++++------------ docs/src/components/Homepage/usecases.js | 72 ++++++- docs/static/img/jan-app-screenshot-dark.png | Bin 0 -> 400348 bytes 5 files changed, 222 insertions(+), 125 deletions(-) create mode 100644 docs/static/img/jan-app-screenshot-dark.png diff --git a/docs/docusaurus.config.js b/docs/docusaurus.config.js index 8d8b64cac..59223416b 100644 --- a/docs/docusaurus.config.js +++ b/docs/docusaurus.config.js @@ -240,7 +240,7 @@ const config = { additionalLanguages: ["python"], }, colorMode: { - defaultMode: "light", + defaultMode: "dark", disableSwitch: false, respectPrefersColorScheme: false, }, diff --git a/docs/src/components/Homepage/features.js b/docs/src/components/Homepage/features.js index e710f57e5..2bca1358b 100644 --- a/docs/src/components/Homepage/features.js +++ b/docs/src/components/Homepage/features.js @@ -1,8 +1,80 @@ import React from "react"; import { useColorMode } from "@docusaurus/theme-common"; +import { + ArrowPathIcon, + CloudArrowUpIcon, + LockClosedIcon, +} from "@heroicons/react/20/solid"; + +const features = [ + { + name: "Powerful models", + description: + "Commodo nec sagittis tortor mauris sed. Turpis tortor quis scelerisque diam id accumsan nullam tempus. Pulvinar etiam lacus volutpat eu. Phasellus praesent ligula sit faucibus.", + href: "#", + icon: CloudArrowUpIcon, + }, + { + name: "AI that you control", + description: + "Pellentesque enim a commodo malesuada turpis eleifend risus. Facilisis donec placerat sapien consequat tempor fermentum nibh.", + href: "#", + icon: LockClosedIcon, + }, + { + name: "Unlimited use", + description: + "Pellentesque sit elit congue ante nec amet. Dolor aenean curabitur viverra suspendisse iaculis eget. Nec mollis placerat ultricies euismod ut condimentum.", + href: "#", + icon: ArrowPathIcon, + }, +]; export default function HomepageFeatures() { const { isDarkTheme } = useColorMode(); - - return
Features section
; + return ( +
+
+
+

+ Deploy faster +

+

+ Why Jan +

+

+ Quis tellus eget adipiscing convallis sit sit eget aliquet quis. + Suspendisse eget egestas a elementum pulvinar et feugiat blandit at. + In mi viverra elit nunc. +

+
+
+
+ {features.map((feature) => ( +
+
+
+
+

{feature.description}

+

+ + Learn more + +

+
+
+ ))} +
+
+
+
+ ); } diff --git a/docs/src/components/Homepage/hero.js b/docs/src/components/Homepage/hero.js index 37c5d2f44..a7c367cb3 100644 --- a/docs/src/components/Homepage/hero.js +++ b/docs/src/components/Homepage/hero.js @@ -6,137 +6,92 @@ export default function HomepageHero() { const { isDarkTheme } = useColorMode(); return ( -
- {/* Background grid pattern */} - {isDarkTheme ? ( -
+ {/* Background top gradient styling */} + {isDarkTheme ? ( +