diff --git a/.wordlist.txt b/.wordlist.txt
index bff8d06..9b3e31c 100644
--- a/.wordlist.txt
+++ b/.wordlist.txt
@@ -1,4 +1,8 @@
mongodb
+jsx
+src
+img
+png
eventtracker
eventtrackerpolicies
portalScope
diff --git a/website/.prettierrc b/website/.prettierrc
new file mode 100644
index 0000000..1e8a6ed
--- /dev/null
+++ b/website/.prettierrc
@@ -0,0 +1,12 @@
+
+{
+ "printWidth": 120,
+ "useTabs": true,
+ "trailingComma": "none",
+ "bracketSpacing": true,
+ "tabWidth": 2,
+ "semi": false,
+ "singleQuote": true,
+ "jsxBracketSameLine": true,
+ "arrowParens": "always"
+}
\ No newline at end of file
diff --git a/website/docs/assets/arrow.png b/website/docs/assets/arrow.png
new file mode 100644
index 0000000..89f1b06
Binary files /dev/null and b/website/docs/assets/arrow.png differ
diff --git a/website/docs/assets/chaos-hub.png b/website/docs/assets/chaos-hub.png
new file mode 100644
index 0000000..d945f3d
Binary files /dev/null and b/website/docs/assets/chaos-hub.png differ
diff --git a/website/docs/assets/tutorials.png b/website/docs/assets/tutorials.png
new file mode 100644
index 0000000..bceb2dc
Binary files /dev/null and b/website/docs/assets/tutorials.png differ
diff --git a/website/docs/chaos-hub.md b/website/docs/chaos-hub.md
new file mode 100644
index 0000000..8788e9a
--- /dev/null
+++ b/website/docs/chaos-hub.md
@@ -0,0 +1,9 @@
+---
+id: chaos-hub
+title: ChaosHub
+sidebar_label: ChaosHub
+---
+
+import {ChaosHub} from '@site/src/components/section/ChaosHub/ChaosHub.jsx'
+
+
+
+
+
Terminal
+
+
+
+
+
+
+ {({ className, style, tokens, getLineProps, getTokenProps }) => (
+
+ {tokens.map((line, i) => (
+
+ {line.map((token, key) => (
+
+ ))}
+
+ )}
+
+
+
{children} ;
+
+const Column = ({children}) => {children}
;
+
+const ColumnCenter = ({children}) => {children}
;
+
+const Center = ({children}) => {children}
;
+
+export { Row, Column, ColumnCenter, Center };
diff --git a/website/src/components/layout/ResponsiveRow.jsx b/website/src/components/layout/ResponsiveRow.jsx
new file mode 100644
index 0000000..558d2ae
--- /dev/null
+++ b/website/src/components/layout/ResponsiveRow.jsx
@@ -0,0 +1,6 @@
+import React from 'react';
+import '../../css/responsiveRow.css';
+
+const ResponsiveRow = ({ children }) => {children}
;
+
+export { ResponsiveRow };
diff --git a/website/src/components/layout/Sections.jsx b/website/src/components/layout/Sections.jsx
new file mode 100644
index 0000000..41fc1ef
--- /dev/null
+++ b/website/src/components/layout/Sections.jsx
@@ -0,0 +1,8 @@
+import React from 'react';
+import '../../css/sections.css';
+
+const SectionLight = ({children}) => {children}
+
+const SectionDark = ({children}) => {children}
+
+export { SectionLight, SectionDark };
diff --git a/website/src/components/layout/index.js b/website/src/components/layout/index.js
new file mode 100644
index 0000000..28e2290
--- /dev/null
+++ b/website/src/components/layout/index.js
@@ -0,0 +1,4 @@
+export * from "./Flex";
+export * from "./ResponsiveRow";
+export * from "./Sections";
+
diff --git a/website/src/components/link/Link.jsx b/website/src/components/link/Link.jsx
new file mode 100644
index 0000000..502c5d0
--- /dev/null
+++ b/website/src/components/link/Link.jsx
@@ -0,0 +1,6 @@
+import React from 'react';
+import '../../css/link.css';
+
+const Link = ({children, to}) => {children} ;
+
+export { Link };
diff --git a/website/src/components/link/__tests__/__snapshots__/link.test.tsx.snap b/website/src/components/link/__tests__/__snapshots__/link.test.tsx.snap
new file mode 100644
index 0000000..b78f899
--- /dev/null
+++ b/website/src/components/link/__tests__/__snapshots__/link.test.tsx.snap
@@ -0,0 +1,12 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`matches snapshot 1`] = `
+
+
+ Home
+
+
+`;
diff --git a/website/src/components/link/__tests__/link.test.tsx b/website/src/components/link/__tests__/link.test.tsx
new file mode 100644
index 0000000..23ce913
--- /dev/null
+++ b/website/src/components/link/__tests__/link.test.tsx
@@ -0,0 +1,8 @@
+import { render } from "@testing-library/react";
+import React from "react";
+import { Link } from "../Link";
+
+it("matches snapshot", () => {
+ const { asFragment } = render(
+
+
+
+
Do you like our Litmus Docs ?
+
+ We are always trying to improve our docs. If you like the documentation we would want you to become our
+ stargazer.
+
+
+
+
+
+
+
+
+
+
+
+
+ We are a{' '}
+
+ CNCF
+ {' '}
+ sandbox project
+
+
+
+
+
Page Under Construction
+
Will be available soon. Stay tuned for updates
+
+
+ )
+}
+
+export { UnderConstructionHeader }
diff --git a/website/src/components/section/ChaosHub/ChaosHub.jsx b/website/src/components/section/ChaosHub/ChaosHub.jsx
new file mode 100644
index 0000000..4e96027
--- /dev/null
+++ b/website/src/components/section/ChaosHub/ChaosHub.jsx
@@ -0,0 +1,36 @@
+import useBaseUrl from '@docusaurus/useBaseUrl'
+import React from 'react'
+import '../../../css/home.css'
+
+const ChaosHub = () => {
+ return (
+
+
Litmus ChaosHub hosts chaos experiments for Kubernetes
+
+
+
+
+
+
+
+
Explore using Litmus
+
+ {exploreLitmusData.map((exploreData) => (
+
+
+
+
+ {exploreData.heading}
+
+
{exploreData.description}
+
+ ))}
+
+
+
Litmus for Advanced Users
+
+ {advancedLitmusData.map((exploreData) => (
+
+
+
+
+ {exploreData.heading}
+
+
{exploreData.description}
+
+ ))}
+
+
+
Getting Started
+
+ Litmus is used by devs & SREs alike to create, manage and monitor chaos workflows by extending Kubernetes
+ itself. Find everything that you need for creating and running chaos workflows on and around Kubernetes.
+
+
+
+
+
+
+ )
+}
+
+export { GetStartedHeader }
diff --git a/website/src/components/section/Home/Header.jsx b/website/src/components/section/Home/Header.jsx
new file mode 100644
index 0000000..89232b7
--- /dev/null
+++ b/website/src/components/section/Home/Header.jsx
@@ -0,0 +1,30 @@
+import useBaseUrl from '@docusaurus/useBaseUrl'
+import React from 'react'
+import '../../../css/home.css'
+import { ResponsiveRow } from '../../layout'
+import { Heading, Paragraph, SubText } from '../../texts'
+
+const Header = () => {
+ return (
+
+
+
+ What is Litmus Chaos ?
+
+
+
+ Litmus is a control-plane to orchestrate chaos on Kubernetes to help developers and SREs find weaknesses in
+ their application deployments.
+
+
+
+ Litmus is one of the most promising open source chaos engineering frameworks that takes into account proper
+ chaos engineering principles while providing autonomy and extensibility to the users.
+
+
+ )
+}
+
+export { Header }
diff --git a/website/src/components/section/Home/MoreResources.jsx b/website/src/components/section/Home/MoreResources.jsx
new file mode 100644
index 0000000..b009cba
--- /dev/null
+++ b/website/src/components/section/Home/MoreResources.jsx
@@ -0,0 +1,28 @@
+import React from 'react'
+import { Link } from '../../../components/link'
+import '../../../css/home.css'
+import { Paragraph, SubHeading } from '../../texts'
+import { moreResources } from './data'
+import useBaseUrl from '@docusaurus/useBaseUrl'
+
+const MoreResources = () => {
+ return (
+
+
More Resources
+
+
+ {moreResources.map((exploreData) => (
+
+
+
+
{exploreData.heading}
+
{exploreData.description}
+
+
+ ))}
+
+
{children}
+
+const SubHeading = ({children, textAlign}) => {children}
+
+const Paragraph = ({children, textAlign}) => {children}
+
+const SubText = ({children, textAlign, color, fontWeight}) => {children}
+
+export {
+ Heading,
+ SubHeading,
+ Paragraph,
+ SubText
+};
diff --git a/website/src/components/texts/index.js b/website/src/components/texts/index.js
new file mode 100644
index 0000000..886fc8a
--- /dev/null
+++ b/website/src/components/texts/index.js
@@ -0,0 +1 @@
+export * from "./Texts";
diff --git a/website/src/components/tutorials/TutorialCard/TutorialCard.jsx b/website/src/components/tutorials/TutorialCard/TutorialCard.jsx
new file mode 100644
index 0000000..117fad4
--- /dev/null
+++ b/website/src/components/tutorials/TutorialCard/TutorialCard.jsx
@@ -0,0 +1,25 @@
+import useBaseUrl from '@docusaurus/useBaseUrl'
+import React from 'react'
+import '../../../css/home.css'
+
+const TutorialCard = ({ props }) => {
+ return (
+
+ )
+}
+export { TutorialCard }
diff --git a/website/src/components/tutorials/Tutorials/Tutorials.jsx b/website/src/components/tutorials/Tutorials/Tutorials.jsx
new file mode 100644
index 0000000..ccee8d9
--- /dev/null
+++ b/website/src/components/tutorials/Tutorials/Tutorials.jsx
@@ -0,0 +1,15 @@
+import React from 'react'
+import '../../../css/home.css'
+import { TutorialData } from '../data'
+import { TutorialCard } from '../TutorialCard/TutorialCard'
+
+const Tutorials = () => {
+ return (
+
+ {TutorialData.map((tutorials) => (
+
+ )
+}
+export { Tutorials }
diff --git a/website/src/components/tutorials/data.js b/website/src/components/tutorials/data.js
new file mode 100644
index 0000000..46319d3
--- /dev/null
+++ b/website/src/components/tutorials/data.js
@@ -0,0 +1,45 @@
+export const TutorialData = [
+ {
+ heading: 'LitmusChaos: Getting Started',
+ description: 'Installation of Litmus, Portal Set Up, Chaos Execution with Podtato Head Chaos',
+ image: '/img/Tutorials/get-started.png',
+ isAvailable: true,
+ link: 'https://litmuschaos.github.io/tutorials/tutorial-getting-started/index.html#0'
+ },
+ {
+ heading: 'Creating Custom Chaos Workflows',
+ description: 'Usage MyHub and Asset Discovery to create Custom Workflows',
+ image: '/img//Tutorials/custom-chaos.png',
+ isAvailable: false
+ },
+ {
+ heading: 'Running Chaos Workflows On Remote Clusters',
+ description: 'Usage MyHub and Asset Discovery to create Custom Workflows',
+ image: '/img/Tutorials/remote-cluster.png',
+ isAvailable: false
+ },
+ {
+ heading: 'Defining Steady-State Hypothesis',
+ description: 'Usage of Litmus Probes to Create Constraints for Experiment Success',
+ image: '/img/Tutorials/probes.png',
+ isAvailable: false
+ },
+ {
+ heading: 'Observing Chaos Impact On Services',
+ description: 'Instrument Grafana Dashboards with LitmusChaos Prometheus Metrics',
+ image: '/img/Tutorials/monitoring.png',
+ isAvailable: false
+ },
+ {
+ heading: 'Integrating with GitOps',
+ description: 'Usage of Git as Golden Copy for Chaos Workflows and Automated Trigger of Chaos',
+ image: '/img/Tutorials/gitops.png',
+ isAvailable: false
+ },
+ {
+ heading: 'Teaming in LitmusChaos',
+ description: 'Invite Team Members and Assign Roles in Chaos Project.',
+ image: '/img/Tutorials/teaming.png',
+ isAvailable: false
+ }
+]
diff --git a/website/src/css/404.css b/website/src/css/404.css
new file mode 100644
index 0000000..7debe2a
--- /dev/null
+++ b/website/src/css/404.css
@@ -0,0 +1,31 @@
+.spacing {
+ margin: auto;
+}
+
+.left {
+ width: 45%;
+ margin: auto;
+}
+
+.underConstructionImage {
+ width: 40%;
+}
+
+@media (min-width: 2000px) {
+ .left {
+ width: 30%;
+ }
+ .underConstructionImage {
+ width: 20%;
+ }
+}
+
+@media (max-width: 890px) {
+ .left {
+ width: 100%;
+ }
+ .underConstructionImage {
+ width: 20%;
+ }
+}
+/*# sourceMappingURL=404.css.map */
\ No newline at end of file
diff --git a/website/src/css/404.css.map b/website/src/css/404.css.map
new file mode 100644
index 0000000..50348cb
--- /dev/null
+++ b/website/src/css/404.css.map
@@ -0,0 +1,11 @@
+{
+ "version": 3,
+ "mappings": "AAKA,AAAA,QAAQ,CAAC;EACR,MAAM,EAAE,IAAI;CACZ;;AAED,AAAA,KAAK,CAAC;EACL,KAAK,EAAE,GAAG;EACV,MAAM,EAAE,IAAI;CACZ;;AAED,AAAA,uBAAuB,CAAC;EACvB,KAAK,EAAE,GAAG;CACV;;AAED,MAAM,EAAE,SAAS,EAAE,MAAM;EACxB,AAAA,KAAK,CAAC;IACL,KAAK,EAAE,GAAG;GACV;EAED,AAAA,uBAAuB,CAAC;IACvB,KAAK,EAAE,GAAG;GACV;;;AAGF,MAAM,EAAE,SAAS,EAAE,KAAK;EACvB,AAAA,KAAK,CAAC;IACL,KAAK,EAAE,IAAI;GACX;EAED,AAAA,uBAAuB,CAAC;IACvB,KAAK,EAAE,GAAG;GACV",
+ "sources": [
+ "../scss/underConstruction/404.scss",
+ "../scss/_theme.scss",
+ "../scss/_mixin.scss"
+ ],
+ "names": [],
+ "file": "404.css"
+}
\ No newline at end of file
diff --git a/website/src/css/custom.css b/website/src/css/custom.css
deleted file mode 100644
index 1fd917e..0000000
--- a/website/src/css/custom.css
+++ /dev/null
@@ -1,61 +0,0 @@
-/* stylelint-disable docusaurus/copyright-header */
-/**
- * Any CSS included here will be global. The classic template
- * bundles Infima by default. Infima is a CSS framework designed to
- * work well for content-centric websites.
- */
-
-/* You can override the default Infima variables here. */
-:root {
- --ifm-color-primary: #3578e5;
- --ifm-color-primary-dark: #1d68e1;
- --ifm-color-primary-darker: #1b62d4;
- --ifm-color-primary-darkest: #1751af;
- --ifm-color-primary-light: #4e89e8;
- --ifm-color-primary-lighter: #5a91ea;
- --ifm-color-primary-lightest: #80aaef;
- --ifm-code-font-size: 95%;
-}
-
-.docusaurus-highlight-code-line {
- background-color: rgb(72, 77, 91);
- display: block;
- margin: 0 calc(-1 * var(--ifm-pre-padding));
- padding: 0 var(--ifm-pre-padding);
-}
-
-/* your custom css */
-@media only screen and (max-width: 735px) {
- .nav-footer .sitemap > div {
- padding-right: 32px;
- padding-left: 0;
- }
-}
-
-@media only screen and (min-width: 735px) {
- .nav-footer .sitemap > div {
- padding: 0 32px;
- }
-}
-
-.fixedHeaderContainer {
- background: #23232a;
-}
-
-/* .fixedHeaderContainer header .headerTitleWithLogo { */
-/* font-size: 2em; */
-/* font-weight: 100; */
-/* } */
-
-.footerText {
- text-align: left;
- color: white;
-}
-
-.nav-footer .sitemap div:first-child {
- flex-grow: 4;
-}
-
-.nav-footer .sitemap div:last-child {
- padding-left: 0;
-}
diff --git a/website/src/css/docs.css b/website/src/css/docs.css
new file mode 100644
index 0000000..96bd503
--- /dev/null
+++ b/website/src/css/docs.css
@@ -0,0 +1,124 @@
+.code {
+ border-radius: 5px;
+ margin-bottom: 8em;
+ -webkit-box-sizing: border-box;
+ box-sizing: border-box;
+}
+
+.code .titleGroup {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-orient: horizontal;
+ -webkit-box-direction: normal;
+ -ms-flex-direction: row;
+ flex-direction: row;
+ width: 100%;
+ -webkit-box-pack: justify;
+ -ms-flex-pack: justify;
+ justify-content: space-between;
+ -webkit-box-sizing: border-box;
+ box-sizing: border-box;
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ color: #777288;
+ background: #16102d;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+ padding: 0.75em 1.25em;
+ line-height: 0;
+}
+
+.code .titleGroup .title {
+ padding-left: 0.5rem;
+ justify-self: flex-start;
+ font-size: 12px;
+ font-weight: 500;
+}
+
+.code .titleGroup .copyBtn {
+ -ms-flex-item-align: end;
+ align-self: flex-end;
+ justify-self: flex-end;
+ background: #16102d;
+ border: none;
+ border-radius: 2px;
+}
+
+.code .coding {
+ padding: 1em 0.75em;
+ background: #2e225d;
+ overflow: auto;
+}
+
+.code .coding::-webkit-scrollbar {
+ width: 6px;
+ height: 6px;
+ opacity: 0;
+}
+
+.coding.coding.coding pre {
+ background: #2e225d;
+ background-size: 100% 4.5em;
+ border: none;
+ border-radius: 0;
+ font-family: monospace;
+ font-size: 1.3em;
+ line-height: 1.5;
+ padding-top: 0.6em;
+ margin-bottom: 0;
+ white-space: pre-wrap;
+}
+
+.code :global pre[class*='language-'].line-numbers {
+ position: relative;
+ padding-left: 3.8em;
+ counter-reset: linenumber;
+}
+
+.code :global pre[class*='language-'].line-numbers > code {
+ position: relative;
+ white-space: inherit;
+}
+
+.code :global .line-numbers .line-numbers-rows {
+ position: absolute;
+ pointer-events: none;
+ top: 0;
+ font-size: 100%;
+ left: -3.8em;
+ width: 3em;
+ /* works for line-numbers below 1000 lines */
+ letter-spacing: -1px;
+ border-right: 1px solid #999;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+}
+
+.code :global .line-numbers-rows > span {
+ pointer-events: none;
+ display: block;
+ counter-increment: linenumber;
+}
+
+.code :global .line-numbers-rows > span:before {
+ content: counter(linenumber);
+ color: #999;
+ display: block;
+ padding-right: 0.8em;
+ text-align: right;
+}
+
+html[data-theme='dark'] .code.code {
+ background: #0f1315;
+}
+
+html[data-theme='dark'] .code.code .titleGroup {
+ background: #151b1e;
+}
+/*# sourceMappingURL=docs.css.map */
\ No newline at end of file
diff --git a/website/src/css/docs.css.map b/website/src/css/docs.css.map
new file mode 100644
index 0000000..62c5856
--- /dev/null
+++ b/website/src/css/docs.css.map
@@ -0,0 +1,9 @@
+{
+ "version": 3,
+ "mappings": "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",
+ "sources": [
+ "../scss/docs/docs.scss"
+ ],
+ "names": [],
+ "file": "docs.css"
+}
\ No newline at end of file
diff --git a/website/src/css/flex.css b/website/src/css/flex.css
new file mode 100644
index 0000000..c8ac8a2
--- /dev/null
+++ b/website/src/css/flex.css
@@ -0,0 +1,43 @@
+.row {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ margin: 0;
+}
+
+.column {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-orient: vertical;
+ -webkit-box-direction: normal;
+ -ms-flex-direction: column;
+ flex-direction: column;
+ -webkit-box-align: start;
+ -ms-flex-align: start;
+ align-items: start;
+}
+
+.columnCenter {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-orient: vertical;
+ -webkit-box-direction: normal;
+ -ms-flex-direction: column;
+ flex-direction: column;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ width: 100%;
+ height: 100%;
+}
+
+.center {
+ display: -ms-grid;
+ display: grid;
+ place-items: center;
+ width: 100%;
+ height: 100%;
+}
+/*# sourceMappingURL=flex.css.map */
\ No newline at end of file
diff --git a/website/src/css/flex.css.map b/website/src/css/flex.css.map
new file mode 100644
index 0000000..f7312c7
--- /dev/null
+++ b/website/src/css/flex.css.map
@@ -0,0 +1,9 @@
+{
+ "version": 3,
+ "mappings": "AAAA,AAAA,IAAI,CAAC;EACD,OAAO,EAAE,IAAI;EACb,MAAM,EAAE,CAAC;CACZ;;AAED,AAAA,OAAO,CAAC;EACJ,OAAO,EAAE,IAAI;EACb,cAAc,EAAE,MAAM;EACtB,WAAW,EAAE,KAAK;CACrB;;AAED,AAAA,aAAa,CAAC;EACV,OAAO,EAAE,IAAI;EACb,cAAc,EAAE,MAAM;EACtB,eAAe,EAAE,MAAM;EACvB,KAAK,EAAE,IAAI;EACX,MAAM,EAAE,IAAI;CACf;;AAED,AAAA,OAAO,CAAC;EACJ,OAAO,EAAE,IAAI;EACb,WAAW,EAAE,MAAM;EACnB,KAAK,EAAE,IAAI;EACX,MAAM,EAAE,IAAI;CACf",
+ "sources": [
+ "../scss/components/flex.scss"
+ ],
+ "names": [],
+ "file": "flex.css"
+}
\ No newline at end of file
diff --git a/website/src/css/global.css b/website/src/css/global.css
new file mode 100644
index 0000000..c48fc3f
--- /dev/null
+++ b/website/src/css/global.css
@@ -0,0 +1,55 @@
+@import url("https://fonts.googleapis.com/css2?family=Ubuntu&display=swap");
+
+html {
+ font-family: "Ubuntu", sans-serif;
+}
+
+body {
+ margin: 0;
+ padding: 0;
+ background: #f4f5f7;
+}
+
+a {
+ text-decoration: none;
+ color: #000;
+}
+
+/* SVGs font work differenly than normal HTML elements. So this rule is required. */
+svg,
+text {
+ font-family: Ubuntu !important;
+ font-weight: 300;
+}
+
+/* ScrollBar css */
+
+::-webkit-scrollbar {
+ width: 0.8rem;
+}
+
+::-webkit-scrollbar-track {
+ background: #f1f1f1;
+}
+
+::-webkit-scrollbar-thumb {
+ background: #858cdd;
+ border-radius: 3rem;
+}
+
+::-webkit-scrollbar-thumb:hover {
+ background: #5b44ba;
+ cursor: pointer;
+}
+
+/* Text Selection Colours */
+
+::-moz-selection {
+ color: white;
+ background: #858cdd;
+}
+
+::selection {
+ color: white;
+ background: #858cdd;
+}
\ No newline at end of file
diff --git a/website/src/css/home.css b/website/src/css/home.css
new file mode 100644
index 0000000..f04970a
--- /dev/null
+++ b/website/src/css/home.css
@@ -0,0 +1,230 @@
+.spacing {
+ margin: 1rem 0;
+}
+
+.grid {
+ display: -ms-grid;
+ display: grid;
+ -ms-grid-columns: (minmax(15rem, 1fr))[auto-fit];
+ grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));
+ grid-gap: 2rem;
+ row-gap: 1rem;
+}
+
+.subHeading {
+ padding: 0.5rem 0;
+}
+
+.left {
+ width: 45%;
+}
+
+.purple {
+ color: #5b44ba;
+}
+
+.headerImage {
+ width: 55%;
+}
+
+@media (min-width: 2000px) {
+ .left {
+ width: 30%;
+ }
+ .headerImage {
+ width: 35%;
+ }
+}
+
+@media (max-width: 890px) {
+ .left {
+ width: 100%;
+ }
+ .headerImage {
+ width: 100%;
+ }
+}
+
+.homeMainContent {
+ margin-bottom: 3rem;
+}
+
+.right {
+ width: 50%;
+ margin-top: 3rem;
+}
+
+.getStartedImage {
+ width: 40%;
+}
+
+@media (min-width: 2000px) {
+ .right {
+ width: 35%;
+ }
+ .getStartedImage {
+ width: 30%;
+ }
+}
+
+@media (max-width: 890px) {
+ .right {
+ width: 100%;
+ }
+ .getStartedImage {
+ width: 100%;
+ }
+}
+
+.exploreLitmusDiv {
+ height: 100%;
+ margin: 1rem 0;
+}
+
+.footerDiv {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-pack: justify;
+ -ms-flex-pack: justify;
+ justify-content: space-between;
+ padding: 2% 20%;
+}
+
+.cncfDiv {
+ margin-top: 30px;
+}
+
+.cncfText {
+ font-size: 14px;
+ text-align: center;
+ margin-top: 20px;
+ color: #1c1438;
+}
+
+.cncfLink {
+ color: #5b44ba;
+}
+
+.preFooterRight {
+ width: 50%;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-pack: justify;
+ -ms-flex-pack: justify;
+ justify-content: space-between;
+}
+
+.preFooterButton {
+ height: 3rem;
+ min-width: 10rem;
+ width: 18rem;
+ border: none;
+ background: linear-gradient(133.06deg, #7c6ac8 1.78%, #5b44ba 64.41%);
+ color: white;
+ border-radius: 0.25rem;
+ cursor: pointer;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ padding: 10px;
+}
+
+.preFooterButton :disabled {
+ background: lightgray;
+}
+
+.tutorialCardDiv {
+ width: 350px;
+ margin: 20px;
+ -webkit-box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.2);
+ box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.2);
+ cursor: pointer;
+}
+
+.tutorialLink {
+ text-decoration: none;
+}
+
+.cardContent {
+ padding: 20px;
+}
+
+.cardHeading {
+ font-size: 16px;
+ font-weight: bold;
+ margin-top: 20px;
+ margin-bottom: 10px;
+}
+
+.cardDescription {
+ color: #777288;
+}
+
+.tutorialAvailable {
+ padding: 6px 12px;
+ border-radius: 26px;
+ background-color: rgba(143, 150, 224, 0.25);
+ width: 100px;
+ margin-top: 11px;
+}
+
+.comingSoon {
+ font-size: 12px;
+ color: #5b44ba;
+}
+
+.tutorialContainer {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-orient: horizontal;
+ -webkit-box-direction: normal;
+ -ms-flex-direction: row;
+ flex-direction: row;
+ -ms-flex-wrap: wrap;
+ flex-wrap: wrap;
+}
+
+.chaosHubHeader {
+ font-size: 24px;
+ color: #777288;
+}
+
+.chaosHubDiv {
+ margin-top: 60px;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+}
+
+.chaosHubInfo {
+ margin: auto;
+}
+
+.chaosHubDescription {
+ max-width: 600px;
+ margin-top: 20px;
+ color: #777288;
+}
+
+.chaosHubExplore {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ margin-top: 20px;
+}
+
+.chaosHubExploreText {
+ color: #5b44ba;
+}
+
+.chaosHubImage {
+ margin-left: 5px;
+ margin-top: 5px;
+}
+/*# sourceMappingURL=home.css.map */
\ No newline at end of file
diff --git a/website/src/css/home.css.map b/website/src/css/home.css.map
new file mode 100644
index 0000000..aa50a5b
--- /dev/null
+++ b/website/src/css/home.css.map
@@ -0,0 +1,11 @@
+{
+ "version": 3,
+ "mappings": "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",
+ "sources": [
+ "../scss/home/home.scss",
+ "../scss/_theme.scss",
+ "../scss/_mixin.scss"
+ ],
+ "names": [],
+ "file": "home.css"
+}
\ No newline at end of file
diff --git a/website/src/css/link.css b/website/src/css/link.css
new file mode 100644
index 0000000..0eb51d5
--- /dev/null
+++ b/website/src/css/link.css
@@ -0,0 +1,12 @@
+.link {
+ display: block;
+ color: #5b44ba;
+ text-decoration: none;
+ cursor: pointer;
+}
+
+.link:hover {
+ text-decoration: none;
+ list-style: none;
+}
+/*# sourceMappingURL=link.css.map */
\ No newline at end of file
diff --git a/website/src/css/link.css.map b/website/src/css/link.css.map
new file mode 100644
index 0000000..e04e5a5
--- /dev/null
+++ b/website/src/css/link.css.map
@@ -0,0 +1,10 @@
+{
+ "version": 3,
+ "mappings": "AAEA,AAAA,KAAK,CAAC;EACF,OAAO,EAAE,KAAK;EACd,KAAK,ECuCS,OAAO;EDtCrB,eAAe,EAAE,IAAI;EACrB,MAAM,EAAE,OAAO;CAKlB;;AATD,AAKI,KALC,AAKA,MAAM,CAAC;EACJ,eAAe,EAAE,IAAI;EACrB,UAAU,EAAE,IAAI;CACnB",
+ "sources": [
+ "../scss/components/link.scss",
+ "../scss/_theme.scss"
+ ],
+ "names": [],
+ "file": "link.css"
+}
\ No newline at end of file
diff --git a/website/src/css/responsiveRow.css b/website/src/css/responsiveRow.css
new file mode 100644
index 0000000..cfe075d
--- /dev/null
+++ b/website/src/css/responsiveRow.css
@@ -0,0 +1,23 @@
+.responsiveRow {
+ width: 100%;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-pack: justify;
+ -ms-flex-pack: justify;
+ justify-content: space-between;
+}
+
+@media (max-width: 890px) {
+ .responsiveRow {
+ -webkit-box-orient: vertical;
+ -webkit-box-direction: normal;
+ -ms-flex-direction: column;
+ flex-direction: column;
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ text-align: center;
+ }
+}
+/*# sourceMappingURL=responsiveRow.css.map */
\ No newline at end of file
diff --git a/website/src/css/responsiveRow.css.map b/website/src/css/responsiveRow.css.map
new file mode 100644
index 0000000..f72be29
--- /dev/null
+++ b/website/src/css/responsiveRow.css.map
@@ -0,0 +1,10 @@
+{
+ "version": 3,
+ "mappings": "AAEA,AAAA,cAAc,CAAC;EACd,KAAK,EAAE,IAAI;EACR,OAAO,EAAE,IAAI;EACb,eAAe,EAAE,aAAa;CACjC;;AAED,MAAM,EAAE,SAAS,EAAE,KAAK;EACpB,AAAA,cAAc,CAAC;IACX,cAAc,EAAE,MAAM;IACtB,WAAW,EAAE,MAAM;IACnB,UAAU,EAAE,MAAM;GACrB",
+ "sources": [
+ "../scss/components/responsiveRow.scss",
+ "../scss/_theme.scss"
+ ],
+ "names": [],
+ "file": "responsiveRow.css"
+}
\ No newline at end of file
diff --git a/website/src/css/sections.css b/website/src/css/sections.css
new file mode 100644
index 0000000..8a6357b
--- /dev/null
+++ b/website/src/css/sections.css
@@ -0,0 +1,35 @@
+.sectionLight {
+ background-color: #f9fafc;
+ padding: 3rem 2rem;
+}
+
+.sectionLight > div {
+ width: 70%;
+ margin: 0 auto;
+}
+
+.sectionDark {
+ background-color: #f4f5f7;
+ padding: 3rem 2rem;
+}
+
+.sectionDark > div {
+ width: 70%;
+ margin: 0 auto;
+}
+
+@media (max-width: 890px) {
+ .sectionLight {
+ padding: 1rem 10%;
+ }
+ .sectionLight > div {
+ width: 100%;
+ }
+ .sectionDark {
+ padding: 1rem 10%;
+ }
+ .sectionDark > div {
+ width: 100%;
+ }
+}
+/*# sourceMappingURL=sections.css.map */
\ No newline at end of file
diff --git a/website/src/css/sections.css.map b/website/src/css/sections.css.map
new file mode 100644
index 0000000..fbef8e4
--- /dev/null
+++ b/website/src/css/sections.css.map
@@ -0,0 +1,10 @@
+{
+ "version": 3,
+ "mappings": "AAEA,AAAA,aAAa,CAAC;EACV,gBAAgB,ECkCA,OAAO;EDjCvB,OAAO,EAAE,SAAS;CAKrB;;AAPD,AAGI,aAHS,GAGP,GAAG,CAAC;EACF,KAAK,EAAE,GAAG;EACV,MAAM,EAAE,MAAM;CACjB;;AAGL,AAAA,YAAY,CAAC;EACT,gBAAgB,EC0BD,OAAO;EDzBtB,OAAO,EAAE,SAAS;CAKrB;;AAPD,AAGI,YAHQ,GAGN,GAAG,CAAC;EACF,KAAK,EAAE,GAAG;EACV,MAAM,EAAE,MAAM;CACjB;;AAGL,MAAM,EAAE,SAAS,EAAE,KAAK;EACpB,AAAA,aAAa,CAAC;IACV,OAAO,EAAE,QAAQ;GAIpB;EALD,AAEI,aAFS,GAEP,GAAG,CAAC;IACF,KAAK,EAAE,IAAI;GACd;EAGL,AAAA,YAAY,CAAC;IACT,OAAO,EAAE,QAAQ;GAIpB;EALD,AAEI,YAFQ,GAEN,GAAG,CAAC;IACF,KAAK,EAAE,IAAI;GACd",
+ "sources": [
+ "../scss/components/sections.scss",
+ "../scss/_theme.scss"
+ ],
+ "names": [],
+ "file": "sections.css"
+}
\ No newline at end of file
diff --git a/website/src/css/texts.css b/website/src/css/texts.css
new file mode 100644
index 0000000..51994f0
--- /dev/null
+++ b/website/src/css/texts.css
@@ -0,0 +1,38 @@
+.heading {
+ line-height: 130%;
+ text-align: left;
+ font-size: 2rem;
+}
+
+.subheading {
+ font-weight: 600;
+ font-size: 1.3rem;
+}
+
+.paragraph {
+ line-height: 170%;
+ color: #6f6f6f;
+ font-size: 0.9rem;
+}
+
+.subText {
+ line-height: 150%;
+ font-size: 1.1rem;
+}
+
+@media (max-width: 890px) {
+ .heading {
+ text-align: center;
+ font-size: 1.5rem;
+ }
+ .subheading {
+ font-size: 1.1rem;
+ }
+ .paragraph {
+ font-size: 0.7rem;
+ }
+ .subText {
+ font-size: 0.9rem;
+ }
+}
+/*# sourceMappingURL=texts.css.map */
\ No newline at end of file
diff --git a/website/src/css/texts.css.map b/website/src/css/texts.css.map
new file mode 100644
index 0000000..af68956
--- /dev/null
+++ b/website/src/css/texts.css.map
@@ -0,0 +1,10 @@
+{
+ "version": 3,
+ "mappings": "AAEA,AAAA,QAAQ,CAAC;EACL,WAAW,EAAE,IAAI;EACjB,UAAU,EAAE,IAAI;EAChB,SAAS,ECSL,IAAI;CDRX;;AAED,AAAA,WAAW,CAAC;EACR,WAAW,EAAE,GAAG;EAChB,SAAS,ECQL,MAAM;CDPb;;AAED,AAAA,UAAU,CAAC;EACP,WAAW,EAAE,IAAI;EACjB,KAAK,EC0BI,OAAO;EDzBhB,SAAS,ECML,MAAM;CDLb;;AAED,AAAA,QAAQ,CAAC;EACL,WAAW,EAAE,IAAI;EACjB,SAAS,ECKL,MAAM;CDJb;;AAED,MAAM,EAAE,SAAS,EAAE,KAAK;EACpB,AAAA,QAAQ,CAAC;IACL,UAAU,EAAE,MAAM;IAClB,SAAS,ECZT,MAAM;GDaT;EAED,AAAA,WAAW,CAAC;IACR,SAAS,ECZT,MAAM;GDaT;EAED,AAAA,UAAU,CAAC;IACP,SAAS,ECZT,MAAM;GDaT;EAED,AAAA,QAAQ,CAAC;IACL,SAAS,ECZT,MAAM;GDaT",
+ "sources": [
+ "../scss/components/texts.scss",
+ "../scss/_theme.scss"
+ ],
+ "names": [],
+ "file": "texts.css"
+}
\ No newline at end of file
diff --git a/website/src/pages/index.js b/website/src/pages/index.js
index 395d13b..ea057a7 100644
--- a/website/src/pages/index.js
+++ b/website/src/pages/index.js
@@ -1,7 +1,35 @@
+import useDocusaurusContext from "@docusaurus/useDocusaurusContext";
+import Layout from "@theme/Layout";
import React from "react";
-import { Redirect } from "@docusaurus/router";
-function Home() {
- return
+
+ {/* Pages Components */}
+
+
+
+
+
+
+
+
+
+ );
+}
diff --git a/website/src/pages/styles.module.css b/website/src/pages/styles.module.css
index 87fe55d..82721bc 100644
--- a/website/src/pages/styles.module.css
+++ b/website/src/pages/styles.module.css
@@ -6,44 +6,44 @@
*/
.heroBanner {
- padding: 4rem 0;
- text-align: center;
- position: relative;
- overflow: hidden;
+ padding: 4rem 0;
+ text-align: center;
+ position: relative;
+ overflow: hidden;
}
@media screen and (max-width: 966px) {
- .heroBanner {
- padding: 2rem;
- }
+ .heroBanner {
+ padding: 2rem;
+ }
}
.buttons {
- display: flex;
- align-items: center;
- justify-content: center;
+ display: flex;
+ align-items: center;
+ justify-content: center;
}
.features {
- display: flex;
- align-items: center;
- padding: 2rem 0;
- width: 100%;
+ display: flex;
+ align-items: center;
+ padding: 2rem 0;
+ width: 100%;
}
.featureImage {
- height: 200px;
- width: 200px;
+ height: 200px;
+ width: 200px;
}
.main {
- padding: 12px;
+ padding: 12px;
}
.heading {
- font-weight: bold;
+ font-weight: bold;
}
.contents {
- color: #ccc;
+ color: #ccc;
}
diff --git a/website/src/pages/underConstruction.js b/website/src/pages/underConstruction.js
new file mode 100644
index 0000000..29ba972
--- /dev/null
+++ b/website/src/pages/underConstruction.js
@@ -0,0 +1,25 @@
+import useDocusaurusContext from '@docusaurus/useDocusaurusContext'
+import Layout from '@theme/Layout'
+import React from 'react'
+import { SectionDark, SectionLight } from '../components/layout'
+import { MoreResources } from '../components/section/Home/MoreResources'
+import { UnderConstructionHeader } from '../components/section/404'
+
+export default function Home() {
+ const { siteConfig } = useDocusaurusContext()
+ return (
+
+
+ {/* Pages Components */}
+
+
+
+
+
+
+
+
+ )
+}
diff --git a/website/src/scss/_mixin.scss b/website/src/scss/_mixin.scss
new file mode 100644
index 0000000..ebaf626
--- /dev/null
+++ b/website/src/scss/_mixin.scss
@@ -0,0 +1,6 @@
+@mixin grid {
+ display: grid;
+ grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));
+ grid-gap: 2rem;
+ row-gap: 1rem;
+}
\ No newline at end of file
diff --git a/website/src/scss/_theme.scss b/website/src/scss/_theme.scss
new file mode 100644
index 0000000..4fd5d3d
--- /dev/null
+++ b/website/src/scss/_theme.scss
@@ -0,0 +1,46 @@
+$screens: (
+ 'xs': 450px,
+ 'sm': 640px,
+ 'md': 768px,
+ 'mmd': 890px,
+ 'lg': 1024px,
+ 'xl': 1280px,
+ 'xxl': 1350px,
+ 'xxxl': 1600px,
+ 'xxxxl': 1800px
+);
+
+$fontSize: (
+ 'heading': (
+ 'lg': 2rem,
+ 'md': 1.5rem
+ ),
+ 'subHeading': (
+ 'lg': 1.3rem,
+ 'md': 1.1rem
+ ),
+ 'paragraph': (
+ 'lg': 0.9rem,
+ 'md': 0.7rem
+ ),
+ 'subText': (
+ 'lg': 1.1rem,
+ 'md': 0.9rem
+ ),
+ 'small': (
+ 'lg': 0.7rem,
+ 'md': 0.6rem
+ ),
+ 'button': 1rem
+);
+
+$colors: (
+ 'backgroundLight': #f9fafc,
+ 'backgroundDark': #f4f5f7,
+ 'spaceGrey': #f1f2f6,
+ 'lightGray': #ebebeb,
+ 'darkGray': #6f6f6f,
+ 'textPrimary': #042a2b,
+ 'textSecondary': #5b44ba,
+ 'textFooter': #1c1438
+);
diff --git a/website/src/scss/components/flex.scss b/website/src/scss/components/flex.scss
new file mode 100644
index 0000000..989a002
--- /dev/null
+++ b/website/src/scss/components/flex.scss
@@ -0,0 +1,25 @@
+.row {
+ display: flex;
+ margin: 0;
+}
+
+.column {
+ display: flex;
+ flex-direction: column;
+ align-items: start;
+}
+
+.columnCenter {
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ width: 100%;
+ height: 100%;
+}
+
+.center {
+ display: grid;
+ place-items: center;
+ width: 100%;
+ height: 100%;
+}
\ No newline at end of file
diff --git a/website/src/scss/components/link.scss b/website/src/scss/components/link.scss
new file mode 100644
index 0000000..0d375c6
--- /dev/null
+++ b/website/src/scss/components/link.scss
@@ -0,0 +1,12 @@
+@import '../theme';
+
+.link {
+ display: block;
+ color: map-get($colors, textSecondary);
+ text-decoration: none;
+ cursor: pointer;
+ &:hover {
+ text-decoration: none;
+ list-style: none;
+ }
+}
\ No newline at end of file
diff --git a/website/src/scss/components/responsiveRow.scss b/website/src/scss/components/responsiveRow.scss
new file mode 100644
index 0000000..6613e51
--- /dev/null
+++ b/website/src/scss/components/responsiveRow.scss
@@ -0,0 +1,15 @@
+@import '../theme';
+
+.responsiveRow {
+ width: 100%;
+ display: flex;
+ justify-content: space-between;
+}
+
+@media (max-width: map-get($screens, mmd)) {
+ .responsiveRow {
+ flex-direction: column;
+ align-items: center;
+ text-align: center;
+ }
+}
\ No newline at end of file
diff --git a/website/src/scss/components/sections.scss b/website/src/scss/components/sections.scss
new file mode 100644
index 0000000..c7f4156
--- /dev/null
+++ b/website/src/scss/components/sections.scss
@@ -0,0 +1,35 @@
+@import '../theme';
+
+.sectionLight {
+ background-color: map-get($colors, backgroundLight);
+ padding: 3rem 2rem;
+ > div {
+ width: 70%;
+ margin: 0 auto;
+ }
+}
+
+.sectionDark {
+ background-color: map-get($colors, backgroundDark);
+ padding: 3rem 2rem;
+ > div {
+ width: 70%;
+ margin: 0 auto;
+ }
+}
+
+@media (max-width: map-get($screens, mmd)) {
+ .sectionLight {
+ padding: 1rem 10%;
+ > div {
+ width: 100%;
+ }
+ }
+
+ .sectionDark {
+ padding: 1rem 10%;
+ > div {
+ width: 100%;
+ }
+ }
+}
\ No newline at end of file
diff --git a/website/src/scss/components/texts.scss b/website/src/scss/components/texts.scss
new file mode 100644
index 0000000..a12e674
--- /dev/null
+++ b/website/src/scss/components/texts.scss
@@ -0,0 +1,42 @@
+@import '../theme';
+
+.heading {
+ line-height: 130%;
+ text-align: left;
+ font-size: map-get(map-get($fontSize, heading), lg);
+}
+
+.subheading {
+ font-weight: 600;
+ font-size: map-get(map-get($fontSize, subHeading), lg);
+}
+
+.paragraph {
+ line-height: 170%;
+ color: map-get($colors, 'darkGray');
+ font-size: map-get(map-get($fontSize, paragraph), lg);
+}
+
+.subText {
+ line-height: 150%;
+ font-size: map-get(map-get($fontSize, subText), lg);
+}
+
+@media (max-width: map-get($screens, mmd)) {
+ .heading {
+ text-align: center;
+ font-size: map-get(map-get($fontSize, heading), md);
+ }
+
+ .subheading {
+ font-size: map-get(map-get($fontSize, subHeading), md);
+ }
+
+ .paragraph {
+ font-size: map-get(map-get($fontSize, paragraph), md);
+ }
+
+ .subText {
+ font-size: map-get(map-get($fontSize, subText), md);
+ }
+}
\ No newline at end of file
diff --git a/website/src/scss/docs/docs.scss b/website/src/scss/docs/docs.scss
new file mode 100644
index 0000000..fe56081
--- /dev/null
+++ b/website/src/scss/docs/docs.scss
@@ -0,0 +1,115 @@
+.code {
+ border-radius: 5px;
+ margin-bottom: 8em;
+ box-sizing: border-box;
+
+ .titleGroup {
+ display: flex;
+ flex-direction: row;
+ width: 100%;
+ justify-content: space-between;
+ box-sizing: border-box;
+ align-items: center;
+ color: #777288;
+ background: #16102d;
+ user-select: none;
+ padding: 0.75em 1.25em;
+ line-height: 0;
+
+ .title {
+ padding-left: 0.5rem;
+ justify-self: flex-start;
+ font-size: 12px;
+ font-weight: 500;
+ }
+
+ .copyBtn {
+ align-self: flex-end;
+ justify-self: flex-end;
+ background: #16102d;
+ border: none;
+ border-radius: 2px;
+ }
+ }
+
+ .coding {
+ padding: 1em 0.75em;
+ background: #2e225d;
+
+ overflow: auto;
+
+ &::-webkit-scrollbar {
+ width: 6px;
+ height: 6px;
+ opacity: 0;
+ }
+ }
+}
+
+.coding.coding.coding pre {
+ background: #2e225d;
+ background-size: 100% 4.5em;
+ border: none;
+ border-radius: 0;
+ font-family: monospace;
+ font-size: 1.3em;
+ line-height: 1.5;
+ padding-top: 0.6em;
+ margin-bottom: 0;
+ white-space: pre-wrap;
+}
+
+.code {
+ :global {
+ pre[class*='language-'].line-numbers {
+ position: relative;
+ padding-left: 3.8em;
+ counter-reset: linenumber;
+ }
+
+ pre[class*='language-'].line-numbers > code {
+ position: relative;
+ white-space: inherit;
+ }
+
+ .line-numbers .line-numbers-rows {
+ position: absolute;
+ pointer-events: none;
+ top: 0;
+ font-size: 100%;
+ left: -3.8em;
+ width: 3em; /* works for line-numbers below 1000 lines */
+ letter-spacing: -1px;
+ border-right: 1px solid #999;
+
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+ }
+
+ .line-numbers-rows > span {
+ pointer-events: none;
+ display: block;
+ counter-increment: linenumber;
+ }
+
+ .line-numbers-rows > span:before {
+ content: counter(linenumber);
+ color: #999;
+ display: block;
+ padding-right: 0.8em;
+ text-align: right;
+ }
+ }
+}
+
+html[data-theme='dark'] {
+ .code.code {
+ background: hsla(200, 18%, 7%, 1);
+
+ .titleGroup {
+ background: hsla(200, 17%, 10%, 1);
+ }
+ }
+}
diff --git a/website/src/scss/home/home.scss b/website/src/scss/home/home.scss
new file mode 100644
index 0000000..5e8da1b
--- /dev/null
+++ b/website/src/scss/home/home.scss
@@ -0,0 +1,219 @@
+@import '../theme';
+@import '../mixin';
+
+// Global
+
+.spacing {
+ margin: 1rem 0;
+}
+
+.grid {
+ @include grid();
+}
+
+.subHeading {
+ padding: 0.5rem 0;
+}
+
+// Header
+
+.left {
+ width: 45%;
+}
+
+.purple {
+ color: map-get($colors, textSecondary);
+}
+
+.headerImage {
+ width: 55%;
+}
+
+@media (min-width: 2000px) {
+ .left {
+ width: 30%;
+ }
+
+ .headerImage {
+ width: 35%;
+ }
+}
+
+@media (max-width: 890px) {
+ .left {
+ width: 100%;
+ }
+
+ .headerImage {
+ width: 100%;
+ }
+}
+
+// Homepage main content
+.homeMainContent {
+ margin-bottom: 3rem;
+}
+
+// Get Started Header
+
+.right {
+ width: 50%;
+ margin-top: 3rem;
+}
+
+.getStartedImage {
+ width: 40%;
+}
+
+@media (min-width: 2000px) {
+ .right {
+ width: 35%;
+ }
+
+ .getStartedImage {
+ width: 30%;
+ }
+}
+
+@media (max-width: map-get($screens, mmd)) {
+ .right {
+ width: 100%;
+ }
+
+ .getStartedImage {
+ width: 100%;
+ }
+}
+
+// Explore Litmus
+
+.exploreLitmusDiv {
+ height: 100%;
+ margin: 1rem 0;
+}
+
+// footer
+.footerDiv {
+ display: flex;
+ justify-content: space-between;
+ padding: 2% 20%;
+}
+
+.cncfDiv {
+ margin-top: 30px;
+}
+
+.cncfText {
+ font-size: 14px;
+ text-align: center;
+ margin-top: 20px;
+ color: map-get($colors, textFooter);
+}
+
+.cncfLink {
+ color: map-get($colors, textSecondary);
+}
+
+.preFooterRight {
+ width: 50%;
+ display: flex;
+ justify-content: space-between;
+}
+
+.preFooterButton {
+ height: 3rem;
+ min-width: 10rem;
+ width: 18rem;
+ border: none;
+ background: linear-gradient(133.06deg, #7c6ac8 1.78%, #5b44ba 64.41%);
+ color: white;
+ border-radius: 0.25rem;
+ cursor: pointer;
+ :disabled {
+ background: lightgray;
+ }
+ display: flex;
+ justify-content: center;
+ padding: 10px;
+}
+
+// Tutorials
+.tutorialCardDiv {
+ width: 350px;
+ margin: 20px;
+ box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.2);
+ cursor: pointer;
+}
+
+.tutorialLink {
+ text-decoration: none;
+}
+
+.cardContent {
+ padding: 20px;
+}
+
+.cardHeading {
+ font-size: 16px;
+ font-weight: bold;
+ margin-top: 20px;
+ margin-bottom: 10px;
+}
+
+.cardDescription {
+ color: #777288;
+}
+
+.tutorialAvailable {
+ padding: 6px 12px;
+ border-radius: 26px;
+ background-color: rgba(143, 150, 224, 0.25);
+ width: 100px;
+ margin-top: 11px;
+}
+
+.comingSoon {
+ font-size: 12px;
+ color: #5b44ba;
+}
+
+.tutorialContainer {
+ display: flex;
+ flex-direction: row;
+ flex-wrap: wrap;
+}
+
+// ChaosHub Page
+.chaosHubHeader {
+ font-size: 24px;
+ color: #777288;
+}
+
+.chaosHubDiv {
+ margin-top: 60px;
+ display: flex;
+}
+
+.chaosHubInfo {
+ margin: auto;
+}
+
+.chaosHubDescription {
+ max-width: 600px;
+ margin-top: 20px;
+ color: #777288;
+}
+
+.chaosHubExplore {
+ display: flex;
+ margin-top: 20px;
+}
+
+.chaosHubExploreText {
+ color: #5b44ba;
+}
+
+.chaosHubImage {
+ margin-left: 5px;
+ margin-top: 5px;
+}
diff --git a/website/src/scss/underConstruction/404.scss b/website/src/scss/underConstruction/404.scss
new file mode 100644
index 0000000..d1233ce
--- /dev/null
+++ b/website/src/scss/underConstruction/404.scss
@@ -0,0 +1,37 @@
+@import '../theme';
+@import '../mixin';
+
+// Header
+
+.spacing {
+ margin: auto;
+}
+
+.left {
+ width: 45%;
+ margin: auto;
+}
+
+.underConstructionImage {
+ width: 40%;
+}
+
+@media (min-width: 2000px) {
+ .left {
+ width: 30%;
+ }
+
+ .underConstructionImage {
+ width: 20%;
+ }
+}
+
+@media (max-width: 890px) {
+ .left {
+ width: 100%;
+ }
+
+ .underConstructionImage {
+ width: 20%;
+ }
+}
diff --git a/website/static/404.html b/website/static/404.html
new file mode 100644
index 0000000..f77a9c5
--- /dev/null
+++ b/website/static/404.html
@@ -0,0 +1,26 @@
+
+
+
+Litmus Docs | Litmus Docs
+
Skip to main content Page Under Construction
Will be available soon. Stay tuned for updates
More Resources
Glossary All Litmus and chaos engineering terms and explanations in one place.
FAQs All common Frequently Asked Questions curated in one place
+
diff --git a/website/static/img/AdvanceLitmus/air-gapped.svg b/website/static/img/AdvanceLitmus/air-gapped.svg
new file mode 100644
index 0000000..9f868c6
--- /dev/null
+++ b/website/static/img/AdvanceLitmus/air-gapped.svg
@@ -0,0 +1,17 @@
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/website/static/img/AdvanceLitmus/design.svg b/website/static/img/AdvanceLitmus/design.svg
new file mode 100644
index 0000000..94034f5
--- /dev/null
+++ b/website/static/img/AdvanceLitmus/design.svg
@@ -0,0 +1,24 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/website/static/img/AdvanceLitmus/dev-resource.svg b/website/static/img/AdvanceLitmus/dev-resource.svg
new file mode 100644
index 0000000..3258f8f
--- /dev/null
+++ b/website/static/img/AdvanceLitmus/dev-resource.svg
@@ -0,0 +1,19 @@
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/website/static/img/AdvanceLitmus/git-ops.svg b/website/static/img/AdvanceLitmus/git-ops.svg
new file mode 100644
index 0000000..b4dcf24
--- /dev/null
+++ b/website/static/img/AdvanceLitmus/git-ops.svg
@@ -0,0 +1,21 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/website/static/img/AdvanceLitmus/integration.svg b/website/static/img/AdvanceLitmus/integration.svg
new file mode 100644
index 0000000..47a2fdc
--- /dev/null
+++ b/website/static/img/AdvanceLitmus/integration.svg
@@ -0,0 +1,12 @@
+
+
+
+
+
+
+
+
diff --git a/website/static/img/AdvanceLitmus/multi-tenancy.svg b/website/static/img/AdvanceLitmus/multi-tenancy.svg
new file mode 100644
index 0000000..020e5f1
--- /dev/null
+++ b/website/static/img/AdvanceLitmus/multi-tenancy.svg
@@ -0,0 +1,22 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/website/static/img/AdvanceLitmus/observability.svg b/website/static/img/AdvanceLitmus/observability.svg
new file mode 100644
index 0000000..63cb098
--- /dev/null
+++ b/website/static/img/AdvanceLitmus/observability.svg
@@ -0,0 +1,17 @@
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/website/static/img/Resources/FAQs.svg b/website/static/img/Resources/FAQs.svg
new file mode 100644
index 0000000..f1ee533
--- /dev/null
+++ b/website/static/img/Resources/FAQs.svg
@@ -0,0 +1,11 @@
+
+
+
+
+
+
+
+
diff --git a/website/static/img/Resources/glossary.svg b/website/static/img/Resources/glossary.svg
new file mode 100644
index 0000000..8881f83
--- /dev/null
+++ b/website/static/img/Resources/glossary.svg
@@ -0,0 +1,11 @@
+
+
+
+
+
+
+
+
diff --git a/website/static/img/Resources/troubleshooting.svg b/website/static/img/Resources/troubleshooting.svg
new file mode 100644
index 0000000..fd179e3
--- /dev/null
+++ b/website/static/img/Resources/troubleshooting.svg
@@ -0,0 +1,11 @@
+
+
+
+
+
+
+
+
diff --git a/website/static/img/Socials/github-white.svg b/website/static/img/Socials/github-white.svg
new file mode 100644
index 0000000..7ffdf13
--- /dev/null
+++ b/website/static/img/Socials/github-white.svg
@@ -0,0 +1,3 @@
+
+
diff --git a/website/static/img/Tutorials/custom-chaos.png b/website/static/img/Tutorials/custom-chaos.png
new file mode 100644
index 0000000..249d411
Binary files /dev/null and b/website/static/img/Tutorials/custom-chaos.png differ
diff --git a/website/static/img/Tutorials/get-started.png b/website/static/img/Tutorials/get-started.png
new file mode 100644
index 0000000..c5237c1
Binary files /dev/null and b/website/static/img/Tutorials/get-started.png differ
diff --git a/website/static/img/Tutorials/gitops.png b/website/static/img/Tutorials/gitops.png
new file mode 100644
index 0000000..992790c
Binary files /dev/null and b/website/static/img/Tutorials/gitops.png differ
diff --git a/website/static/img/Tutorials/monitoring.png b/website/static/img/Tutorials/monitoring.png
new file mode 100644
index 0000000..11c84e0
Binary files /dev/null and b/website/static/img/Tutorials/monitoring.png differ
diff --git a/website/static/img/Tutorials/probes.png b/website/static/img/Tutorials/probes.png
new file mode 100644
index 0000000..f11577a
Binary files /dev/null and b/website/static/img/Tutorials/probes.png differ
diff --git a/website/static/img/Tutorials/remote-cluster.png b/website/static/img/Tutorials/remote-cluster.png
new file mode 100644
index 0000000..4cb19e7
Binary files /dev/null and b/website/static/img/Tutorials/remote-cluster.png differ
diff --git a/website/static/img/Tutorials/teaming.png b/website/static/img/Tutorials/teaming.png
new file mode 100644
index 0000000..1cec23b
Binary files /dev/null and b/website/static/img/Tutorials/teaming.png differ
diff --git a/website/static/img/advantages.svg b/website/static/img/advantages.svg
new file mode 100644
index 0000000..61b620c
--- /dev/null
+++ b/website/static/img/advantages.svg
@@ -0,0 +1,20 @@
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/website/static/img/arrow.png b/website/static/img/arrow.png
new file mode 100644
index 0000000..a585022
Binary files /dev/null and b/website/static/img/arrow.png differ
diff --git a/website/static/img/chaos-bird.png b/website/static/img/chaos-bird.png
new file mode 100644
index 0000000..e605dd5
Binary files /dev/null and b/website/static/img/chaos-bird.png differ
diff --git a/website/static/img/chaos-hub.png b/website/static/img/chaos-hub.png
new file mode 100644
index 0000000..d945f3d
Binary files /dev/null and b/website/static/img/chaos-hub.png differ
diff --git a/website/static/img/chaos-hub.svg b/website/static/img/chaos-hub.svg
new file mode 100644
index 0000000..81de59c
--- /dev/null
+++ b/website/static/img/chaos-hub.svg
@@ -0,0 +1,5 @@
+
+
diff --git a/website/static/img/cncf-color.svg b/website/static/img/cncf-color.svg
new file mode 100644
index 0000000..4b85d6a
--- /dev/null
+++ b/website/static/img/cncf-color.svg
@@ -0,0 +1,5 @@
+
+
diff --git a/website/static/img/code_block_header.svg b/website/static/img/code_block_header.svg
new file mode 100644
index 0000000..1e9a8c8
--- /dev/null
+++ b/website/static/img/code_block_header.svg
@@ -0,0 +1,3 @@
+
+
diff --git a/website/static/img/copy.svg b/website/static/img/copy.svg
new file mode 100644
index 0000000..96ce16a
--- /dev/null
+++ b/website/static/img/copy.svg
@@ -0,0 +1,3 @@
+
+
diff --git a/website/static/img/getting-started.svg b/website/static/img/getting-started.svg
new file mode 100644
index 0000000..70ea3e2
--- /dev/null
+++ b/website/static/img/getting-started.svg
@@ -0,0 +1,5 @@
+
+
diff --git a/website/static/img/header-2.png b/website/static/img/header-2.png
new file mode 100644
index 0000000..a6ea9fd
Binary files /dev/null and b/website/static/img/header-2.png differ
diff --git a/website/static/img/header.png b/website/static/img/header.png
new file mode 100644
index 0000000..33e8f75
Binary files /dev/null and b/website/static/img/header.png differ
diff --git a/website/static/img/logo-with-text.svg b/website/static/img/logo-with-text.svg
new file mode 100644
index 0000000..9a6b0ec
--- /dev/null
+++ b/website/static/img/logo-with-text.svg
@@ -0,0 +1,12 @@
+
+
diff --git a/website/static/img/tutorials.svg b/website/static/img/tutorials.svg
new file mode 100644
index 0000000..27f4fe5
--- /dev/null
+++ b/website/static/img/tutorials.svg
@@ -0,0 +1,19 @@
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/website/static/img/under-construction.png b/website/static/img/under-construction.png
new file mode 100644
index 0000000..40ae132
Binary files /dev/null and b/website/static/img/under-construction.png differ
diff --git a/website/versioned_docs/version-2.0.0-Beta-3/introduction.md b/website/versioned_docs/version-2.0.0-Beta-3/introduction.md
index cb52557..d0f6330 100644
--- a/website/versioned_docs/version-2.0.0-Beta-3/introduction.md
+++ b/website/versioned_docs/version-2.0.0-Beta-3/introduction.md
@@ -12,18 +12,18 @@ Welcome to the documentation for the **LitmusChaos** project. Litmus is used by
Service downtimes are always expensive and they are very difficult to predict and respond to. Certifying if a given change is going to break the services that are functioning well has become increasingly challenging for IT teams. What's more? With the evolution of modern cloud-native micro services these changes have become more dynamic. In such an atmosphere, Chaos Engineering is increasingly becoming the go-to solution within cloud-native ecosystems for asserting the resilience of a service or application at any stage of rolling out changes.
-LitmusChaos is a complete framework to implement chaos engineering within a cloud-native ecosystem. It helps both Developers and SREs automate the chaos experiments at different stages within the DevOps pipeline like development, during CI/CD, & in production.
+LitmusChaos is a complete framework to implement chaos engineering within a cloud-native ecosystem. It helps both Developers and SREs automate the chaos experiments at different stages within the DevOps pipeline like development, during CI/CD, & in production.
- What is a Chaos Experiment?
-Chaos Experiments are fundamental units within the LitmusChaos architecture. Users can choose between readily available chaos experiments or create new ones to construct a required chaos workflow.
+Chaos Experiments are fundamental units within the LitmusChaos architecture. Users can choose between readily available chaos experiments or create new ones to construct a required chaos workflow.
- What is a Chaos Workflow?
A chaos workflow is much more than a simple chaos experiment. It supports the user in defining the expected result, observing the result, analysing the overall system behaviour, and in the decision-making process if the system needs to be tuned for improving the resilience.
LitmusChaos provides necessary infrastructure to develop, use, and manage chaos workflows for a typical development or operations team. Teaming and GitOps features of Litmus help greatly to collaborate the chaos workflows management within the teams or software organisations.
-## Litmus 2.0 Prologue
+### Litmus 2.0 Prologue {#litmus-20-prologue}
The goal of the LitmusChaos project is to create a complete solution to implement chaos engineering at scale, the Kubernetes way! Of course this had to be done incrementally by first creating a toolset for chaos injection and then adding additional features to make it a platform. Litmus 1.x achieved the goal of keeping it completely open source, creating a ChaosHub and the required CRDs, Operators, and Schedulers. With Litmus 1.x, users have a working chaos engineering toolset aligned with the original goals. Over time, the monthly cadence releases added the following features.
diff --git a/website/versions.json b/website/versions.json
index 0dc8b9b..2ee7b59 100644
--- a/website/versions.json
+++ b/website/versions.json
@@ -1,4 +1 @@
-[
- "2.0.0-Beta-8",
- "2.0.0-Beta-3"
-]
+["2.0.0-Beta-8"]
+ Become our stargazer
+ 
+ 
+ })
+ ![Chaos hub]({useBaseUrl("/img/arrow.png")}){kind=icon}
+ ![Chaos hub]({useBaseUrl("/img/chaos-hub.png")})
+ ![Get_Started Image]({useBaseUrl("/img/header-2.png")})
+ })
+ 
+ 
