You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@pinot.apache.org by xi...@apache.org on 2021/04/15 05:14:02 UTC
[incubator-pinot-site] branch asf-site updated (d46c4c1 -> d0120fe)
This is an automated email from the ASF dual-hosted git repository.
xiangfu pushed a change to branch asf-site
in repository https://gitbox.apache.org/repos/asf/incubator-pinot-site.git.
discard d46c4c1 add website builder source
new d0120fe add website builder source
This update added new revisions after undoing existing revisions.
That is to say, some revisions that were in the old version of the
branch are not in the new version. This situation occurs
when a user --force pushes a change and generates a repository
containing something like this:
* -- * -- B -- O -- O -- O (d46c4c1)
\
N -- N -- N refs/heads/asf-site (d0120fe)
You should already have received notification emails for all of the O
revisions, and so the following emails describe only the N revisions
from the common base, B.
Any revisions marked "omit" are not gone; other references still
refer to them. Any revisions marked "discard" are gone forever.
The 1 revisions listed above as "new" are entirely new to this
repository and will be described in separate emails. The revisions
listed as "add" were already present in the repository and have only
been added to this reference.
Summary of changes:
website-builder/scripts/build-site.sh | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@pinot.apache.org
For additional commands, e-mail: commits-help@pinot.apache.org
[incubator-pinot-site] 01/01: add website builder source
Posted by xi...@apache.org.
This is an automated email from the ASF dual-hosted git repository.
xiangfu pushed a commit to branch asf-site
in repository https://gitbox.apache.org/repos/asf/incubator-pinot-site.git
commit d0120fe565320c17d4c022f2f8930ed138977ad5
Author: Xiang Fu <fx...@gmail.com>
AuthorDate: Wed Apr 14 22:07:14 2021 -0700
add website builder source
---
website-builder/.gitignore | 28 +
website-builder/README.md | 48 +
website-builder/docs/about.md | 14 +
website-builder/docs/about/features_of_pinot.md | 40 +
website-builder/docs/about/what_is_pinot.md | 35 +
website-builder/docs/about/who_use_pinot.md | 26 +
website-builder/docs/administration.md | 14 +
.../docs/administration/guides/troubleshooting.md | 6 +
.../docs/administration/installation/cloud/aws.md | 150 ++
.../administration/installation/cloud/azure.md | 129 ++
.../docs/administration/installation/cloud/gcp.md | 134 ++
.../installation/cloud/on-premise.md | 287 +++
.../docs/administration/installation/containers.md | 12 +
.../installation/containers/docker.md | 136 ++
.../installation/operating-systems/macos.md | 11 +
.../installation/operating-systems/ubuntu.md | 14 +
.../docs/administration/running_locally.md | 60 +
website-builder/docs/components.md | 14 +
website-builder/docs/components/broker.md | 13 +
website-builder/docs/components/cluster.md | 137 ++
website-builder/docs/components/controller.md | 7 +
website-builder/docs/components/minion.md | 0
website-builder/docs/components/schema.md | 0
website-builder/docs/components/segments.md | 0
website-builder/docs/components/server.md | 0
website-builder/docs/components/tables.md | 0
website-builder/docs/components/tenants.md | 0
website-builder/docs/concepts.md | 14 +
.../docs/concepts/pinot-architecture.md | 17 +
website-builder/docs/how-to.md | 14 +
website-builder/docs/misc.md | 14 +
website-builder/docs/misc/build-docker.md | 184 ++
website-builder/docs/user-guide.md | 14 +
website-builder/docs/user-guide/clients/golang.md | 166 ++
website-builder/docs/user-guide/clients/java.md | 132 ++
website-builder/docs/user-guide/pql.md | 254 +++
website-builder/docs/user-guide/query-pinot.md | 77 +
website-builder/docs/user-guide/response-format.md | 381 ++++
.../docs/user-guide/rest-admin-interface.md | 7 +
website-builder/docusaurus.config.js | 196 ++
website-builder/package.json | 67 +
website-builder/scripts/build-site.sh | 36 +
website-builder/scripts/publish_site.sh | 51 +
website-builder/sidebars.js | 73 +
website-builder/src/components/Alert/index.js | 65 +
website-builder/src/components/Alert/styles.css | 65 +
.../src/components/BlogPostTags/index.js | 49 +
.../src/components/BlogPostTags/styles.module.css | 3 +
website-builder/src/components/Changelog/index.js | 214 +++
.../src/components/CheckboxList/index.js | 70 +
.../src/components/CheckboxList/styles.css | 0
website-builder/src/components/CodeHeader/index.js | 42 +
.../src/components/CodeHeader/styles.css | 17 +
website-builder/src/components/Field/index.js | 270 +++
website-builder/src/components/Fields/index.js | 141 ++
website-builder/src/components/Fields/styles.css | 31 +
website-builder/src/components/Jump/index.js | 65 +
website-builder/src/components/Jump/styles.css | 109 ++
website-builder/src/components/Step/index.js | 27 +
website-builder/src/components/Step/styles.css | 0
website-builder/src/components/Steps/index.js | 27 +
website-builder/src/components/Steps/styles.css | 15 +
website-builder/src/css/custom.css | 1865 ++++++++++++++++++++
website-builder/src/exports/animatedGraph.js | 91 +
website-builder/src/exports/cloudify.js | 342 ++++
website-builder/src/exports/newPost.js | 53 +
website-builder/src/exports/newRelease.js | 56 +
website-builder/src/exports/repoUrl.js | 26 +
website-builder/src/pages/download.css | 28 +
website-builder/src/pages/download.js | 371 ++++
website-builder/src/pages/index.css | 143 ++
website-builder/src/pages/index.js | 405 +++++
website-builder/src/pages/index.module.css | 344 ++++
website-builder/static/img/companies/factual.svg | 1 +
website-builder/static/img/companies/linkedin.svg | 1 +
.../static/img/companies/microsoft-teams.svg | 21 +
website-builder/static/img/companies/slack.svg | 1 +
website-builder/static/img/companies/uber.svg | 9 +
website-builder/static/img/companies/weibo.svg | 1 +
website-builder/static/img/components/Broker.png | Bin 0 -> 16477 bytes
.../static/img/components/ClusterLogical.png | Bin 0 -> 10056 bytes
.../static/img/components/TimeBoundary.jpg | Bin 0 -> 34893 bytes
.../static/img/components/components.png | Bin 0 -> 8582 bytes
website-builder/static/img/dynamic-table.png | Bin 0 -> 241500 bytes
website-builder/static/img/favicon-16x16.png | Bin 0 -> 1535 bytes
website-builder/static/img/favicon-32x32.png | Bin 0 -> 2576 bytes
website-builder/static/img/favicon-96x96.png | Bin 0 -> 8369 bytes
website-builder/static/img/favicon.ico | Bin 0 -> 1150 bytes
website-builder/static/img/ingest-query.svg | 321 ++++
website-builder/static/img/logo.svg | 1 +
website-builder/static/img/pinot-320x320.png | Bin 0 -> 32566 bytes
website-builder/static/img/pinot-architecture.png | Bin 0 -> 58474 bytes
website-builder/static/img/pinot-components.svg | 247 +++
.../static/img/pinot-navbar-logo-722f37.png | Bin 0 -> 42885 bytes
.../static/img/pinot-navbar-logo-722f37.svg | 21 +
website-builder/static/img/pinot-navbar-logo.svg | 19 +
website-builder/static/img/pinot-overview-dark.png | Bin 0 -> 317730 bytes
.../static/img/pinot-overview-light.png | Bin 0 -> 145510 bytes
website-builder/static/img/pinot-overview.png | Bin 0 -> 128920 bytes
website-builder/static/img/pinot-overview.svg | 247 +++
website-builder/static/img/pinot-query.svg | 277 +++
website-builder/static/img/pinot.png | Bin 0 -> 124842 bytes
website-builder/static/img/pql-query.png | Bin 0 -> 138225 bytes
.../static/img/pql/pql-query-console.png | Bin 0 -> 301189 bytes
.../static/img/undraw_docusaurus_mountain.svg | 170 ++
.../static/img/undraw_docusaurus_react.svg | 169 ++
.../static/img/undraw_docusaurus_tree.svg | 1 +
107 files changed, 9453 insertions(+)
diff --git a/website-builder/.gitignore b/website-builder/.gitignore
new file mode 100755
index 0000000..dea10e4
--- /dev/null
+++ b/website-builder/.gitignore
@@ -0,0 +1,28 @@
+# Dependencies
+/node_modules
+package-lock.json
+yarn.lock
+.node_modules/
+# Production
+/build
+
+# Generated files
+.docusaurus
+.cache-loader
+
+# Misc
+.DS_Store
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# IDE
+.vscode
+.idea
+*.code-workspace
+.changelog
\ No newline at end of file
diff --git a/website-builder/README.md b/website-builder/README.md
new file mode 100755
index 0000000..1fa1369
--- /dev/null
+++ b/website-builder/README.md
@@ -0,0 +1,48 @@
+# Website
+
+This website is built using [Docusaurus 2](https://v2.docusaurus.io/), a modern static website generator.
+
+NOTE: You need to install [YARN](https://classic.yarnpkg.com/en/docs/install)
+
+## Installation
+
+```bash
+$ yarn
+```
+
+### Local Development
+
+```bash
+$ yarn start
+```
+
+Link Check:
+
+```bash
+yarn lint-check
+-> All matched files use Prettier code style!
+```
+
+Then try out:
+
+```bash
+yarn run serve --build --port 3001 --host 0.0.0.0
+```
+
+This command starts a local development server and open up a browser window. Most changes are reflected live without having to restart the server.
+
+### Build
+
+```bash
+$ yarn build
+```
+
+This command generates static content into the `build` directory and can be served using any static contents hosting service.
+
+### Deployment
+
+```bash
+$ GIT_USER=[USER_ID] USE_SSH=true yarn deploy
+```
+
+If you are using GitHub pages for hosting, this command is a convenient way to build the website and push to the `gh-pages` branch.
diff --git a/website-builder/docs/about.md b/website-builder/docs/about.md
new file mode 100644
index 0000000..2ff8897
--- /dev/null
+++ b/website-builder/docs/about.md
@@ -0,0 +1,14 @@
+---
+title: About
+description: "About Pinot"
+sidebar_label: hidden
+hide_pagination: true
+---
+
+Provide basic foundation of Pinot.
+
+import Jump from '@site/src/components/Jump';
+
+<Jump to="/docs/about/what_is_pinot/">What is Pinot?</Jump>
+<Jump to="/docs/about/features_of_pinot/">Features of Pinot</Jump>
+<Jump to="/docs/about/guarantees/">Who is using Pinot?</Jump>
diff --git a/website-builder/docs/about/features_of_pinot.md b/website-builder/docs/about/features_of_pinot.md
new file mode 100644
index 0000000..1e9f6b1
--- /dev/null
+++ b/website-builder/docs/about/features_of_pinot.md
@@ -0,0 +1,40 @@
+---
+id: features_of_pinot
+title: Features of Pinot
+sidebar_label: Features of Pinot
+---
+
+# Features of Pinot
+
+- A column-oriented database with various compression schemes such as Run Length, Fixed Bit Length
+- Pluggable indexing technologies - Sorted Index, Bitmap Index, Inverted Index
+- Ability to optimize query/execution plan based on query and segment metadata .
+- Near real time ingestion from streams and batch ingestion from Hadoop
+- SQL like language that supports selection, aggregation, filtering, group by, order by, distinct queries on data.
+- Support for multivalued fields
+- Horizontally scalable and fault tolerant
+
+Because of the design choices we made to achieve these goals, there are certain limitations in Pinot:
+
+Pinot is not a replacement for database i.e it cannot be used as source of truth store, cannot mutate data
+Not a replacement for search engine i.e Full text search, relevance not supported
+Query cannot span across multiple tables.
+Pinot works very well for querying time series data with lots of Dimensions and Metrics. <br />
+
+For example:
+
+```SQL
+SELECT sum(clicks), sum(impressions) FROM AdAnalyticsTable
+ WHERE ((daysSinceEpoch >= 17849 AND daysSinceEpoch <= 17856)) AND accountId IN (123456789)
+ GROUP BY daysSinceEpoch TOP 100
+```
+
+```SQL
+SELECT sum(impressions) FROM AdAnalyticsTable
+ WHERE (daysSinceEpoch >= 17824 and daysSinceEpoch <= 17854) AND adveriserId = '1234356789'
+ GROUP BY daysSinceEpoch,advertiserId TOP 100
+```
+
+```SQL
+SELECT sum(cost) FROM AdAnalyticsTable GROUP BY advertiserId TOP 50
+```
\ No newline at end of file
diff --git a/website-builder/docs/about/what_is_pinot.md b/website-builder/docs/about/what_is_pinot.md
new file mode 100644
index 0000000..3512e85
--- /dev/null
+++ b/website-builder/docs/about/what_is_pinot.md
@@ -0,0 +1,35 @@
+---
+id: what_is_pinot
+title: What is Pinot
+sidebar_label: What is Pinot
+---
+
+Apache Pinot is a realtime distributed OLAP datastore, which is used to deliver scalable real time analytics with low latency. It can ingest data from batch data sources (such as HDFS, S3, Azure Data Lake, Google Cloud Storage) as well as streaming sources (such as Kafka). Pinot is designed to scale horizontally, so that it can scale to larger data sets and higher query rates as needed.
+
+
+
+## When should I use it?
+
+Pinot is designed to answer OLAP queries with low latency. It is suited in contexts where fast analytics, such as aggregations, are needed on immutable data, possibly, with real-time data ingestion.
+
+## When should I not use it?
+
+Pinot is not a replacement for your database, nor a search engine. It addresses fast analytics on immutable data and it is not thought by design, to handle data updates or deletions. Joins are currently not supported, but this problem can be overcome by using [PrestoDB]((https://prestodb.io/)) for querying Pinot.
+
+For more information about PrestoDB connector for Pinot see the [Helm Chart of Pinot with Presto](https://github.com/apache/incubator-pinot/tree/master/kubernetes/examples/helm#access-pinot-using-presto)
+Pinot-Presto connector is avilable with version [0.229](https://github.com/prestodb/presto/pull/13504)
+
+## Quick example
+
+Pinot works very well for querying time series data with lots of Dimensions and Metrics.
+Filters and aggregations are easy and fast.
+
+```SQL
+SELECT sum(clicks), sum(impressions) FROM AdAnalyticsTable
+ WHERE ((daysSinceEpoch >= 17849 AND daysSinceEpoch <= 17856)) AND accountId IN (123456789)
+ GROUP BY daysSinceEpoch TOP 100
+```
+
+## Who uses Pinot?
+
+Pinot powers several big players, including LinkedIn, Uber, Factual, Weibo, Slack and more..
\ No newline at end of file
diff --git a/website-builder/docs/about/who_use_pinot.md b/website-builder/docs/about/who_use_pinot.md
new file mode 100644
index 0000000..5562963
--- /dev/null
+++ b/website-builder/docs/about/who_use_pinot.md
@@ -0,0 +1,26 @@
+---
+id: who_use_pinot
+title: Companies using Pinot
+sidebar_label: Companies using Pinot
+---
+
+## Companies using Pinot
+
+| Company | Notes |
+| ------------- |:-------------:|
+| LinkedIn | LinkedIn uses Pinot for delivering fast analytics. |
+| Uber | Uber uses Apache Pinot (incubating) |
+| Microsoft | Microsoft uses Apache Pinot (incubating) |
+| Weibo | Weibo uses Apache Pinot (incubating) |
+| Factual | Factual uses Apache Pinot (incubating) |
+
+### LinkedIn
+
+- Pinot originated at LinkedIn and it powers more 50+ user facing applications such as Who Viewed My Profile, Talent Analytics, Company Analytics, Ad Analytics and many more. Pinot also serves as the backend for to visualize and monitor 10,000+ business metrics.
+- Pinot runs on 1000+ nodes serving 100k+ queries while ingesting 1.5M+ events per second.
+
+### Uber
+
+- Pinot powers both internal and external site facing analytics applications like Uber Eats Restaurant Analytics.
+
+## Companies using Thirdeye
diff --git a/website-builder/docs/administration.md b/website-builder/docs/administration.md
new file mode 100644
index 0000000..194b623
--- /dev/null
+++ b/website-builder/docs/administration.md
@@ -0,0 +1,14 @@
+---
+title: Adminstration
+description: "Adminstration"
+sidebar_label: hidden
+hide_pagination: true
+---
+
+Provide basic foundation of Pinot.
+
+import Jump from '@site/src/components/Jump';
+
+<Jump to="/docs/about/what_is_pinot/">Running Pinot locally</Jump>
+<Jump to="/docs/about/features_of_pinot/">Features of Pinot</Jump>
+<Jump to="/docs/about/guarantees/">Who is using Pinot?</Jump>
diff --git a/website-builder/docs/administration/guides/troubleshooting.md b/website-builder/docs/administration/guides/troubleshooting.md
new file mode 100644
index 0000000..8d0f816
--- /dev/null
+++ b/website-builder/docs/administration/guides/troubleshooting.md
@@ -0,0 +1,6 @@
+---
+title: Troubleshooting Guide
+sidebar_label: Troubleshooting
+description: A guide on debugging and troubleshooting
+---
+
diff --git a/website-builder/docs/administration/installation/cloud/aws.md b/website-builder/docs/administration/installation/cloud/aws.md
new file mode 100644
index 0000000..ef731eb
--- /dev/null
+++ b/website-builder/docs/administration/installation/cloud/aws.md
@@ -0,0 +1,150 @@
+---
+title: AWS Quickstart
+sidebar_label: AWS
+description: Run Pinot on AWS
+---
+
+This document provides the basic instruction to set up a Kubernetes Cluster on [Amazon Elastic Kubernetes Service (Amazon EKS)](https://aws.amazon.com/eks/)
+
+import Alert from '@site/src/components/Alert';
+
+<Alert type="info"> Because Pinot must be manually updated on Nix, new Pinot releases will be
+delayed. Generally new Pinot releases are made available within a few days.</Alert>
+
+## Tooling Installation
+
+1. Install Pinot
+
+ Please follow this link (https://kubernetes.io/docs/tasks/tools/install-kubectl) to install kubectl.
+
+ For Mac User
+
+ ```bash
+ brew install kubernetes-cli
+ ```
+
+ Please check kubectl version after installation:
+
+ ```bash
+ kubectl version
+ ```
+
+ <Alert icon={false} type="info">
+ QuickStart scripts are tested under kubectl client version v1.16.3 and server version v1.13.12
+ </Alert>
+
+1. Install Helm
+
+ Please follow this link (https://helm.sh/docs/using_helm/#installing-helm) to install helm.
+
+ For Mac User
+
+ ```bash
+ brew install kubernetes-helm
+ ```
+
+ Please check helm version after installation.
+
+ ```bash
+ helm version
+ ```
+
+ <Alert icon={false} type="info">
+
+ * This QuickStart provides helm supports for helm v3.0.0 and v2.12.1.
+ * Please pick the script based on your helm version.
+
+ </Alert>
+
+1. Install AWS CLI
+
+ [Install AWS CLI]((https://docs.aws.amazon.com/cli/latest/userguide/cli-chap-install.html#install-tool-bundled))
+
+ For Mac User
+
+ ```bash
+ curl "https://d1vvhvl2y92vvt.cloudfront.net/awscli-exe-macos.zip" -o "awscliv2.zip"
+ unzip awscliv2.zip
+ sudo ./aws/install
+ ```
+
+1. Install Eksctl
+
+ Install [AWS CLI](https://docs.aws.amazon.com/eks/latest/userguide/eksctl.html#installing-eksctl)
+
+ For Mac User
+
+ ```bash
+ brew tap weaveworks/tap
+ brew install weaveworks/tap/eksctl
+ ```
+
+## (Optional) Login to your AWS account
+
+For first time AWS user, please register your [aws account](https://aws.amazon.com/)
+
+Once created the account, you can go to [AWS Identity and Access Management (IAM)](https://console.aws.amazon.com/iam/home#/home) to create a user and create access keys under Security Credential tab.
+
+```bash
+aws configure
+```
+
+<Alert type="info"> Environment variables AWS_ACCESS_KEY_ID and AWS_SECRET_ACCESS_KEY will override AWS configuration stored in file ~/.aws/credentials</Alert>
+
+### (Optional) Create a Kubernetes cluster(EKS) in AWS
+
+Below script will create a 3 nodes cluster named pinot-quickstart in us-west-2 with t3.small machines for demo purposes.
+Please modify the parameters in the example command below:
+
+```bash
+EKS_CLUSTER_NAME=pinot-quickstart
+eksctl create cluster \
+ --name ${EKS_CLUSTER_NAME} \
+ --version 1.14 \
+ --region us-west-2 \
+ --nodegroup-name standard-workers \
+ --node-type t3.small \
+ --nodes 3 \
+ --nodes-min 3 \
+ --nodes-max 4 \
+ --node-ami auto
+```
+
+You can monitor cluster status by command:
+
+```bash
+EKS_CLUSTER_NAME=pinot-quickstart
+aws eks describe-cluster --name ${EKS_CLUSTER_NAME}
+```
+
+Once the cluster is in ACTIVE status, it's ready to be used.
+
+## Connect to an existing cluster
+
+Simply run below command to get the credential for the cluster pinot-quickstart that you just created or your existing cluster.
+
+```bash
+EKS_CLUSTER_NAME=pinot-quickstart
+aws eks update-kubeconfig --name ${EKS_CLUSTER_NAME}
+```
+
+To verify the connection, you can run:
+
+```bash
+kubectl get nodes
+```
+
+## Pinot Quickstart
+
+Please follow this [Kubernetes QuickStart](/docs/administration/installation/cloud/on-premises) to deploy your Pinot Demo.
+
+import Jump from '@site/src/components/Jump';
+
+<Jump to="/docs/administration/installation/cloud/on-premises">Kubernetes Quickstart</Jump>
+
+## Delete a Kubernetes Cluster
+
+```bash
+EKS_CLUSTER_NAME=pinot-quickstart
+aws eks delete-cluster --name ${EKS_CLUSTER_NAME}
+```
diff --git a/website-builder/docs/administration/installation/cloud/azure.md b/website-builder/docs/administration/installation/cloud/azure.md
new file mode 100644
index 0000000..027ac02
--- /dev/null
+++ b/website-builder/docs/administration/installation/cloud/azure.md
@@ -0,0 +1,129 @@
+---
+title: Azure Quickstart
+sidebar_label: Azure
+description: Run Pinot on Azure
+---
+
+import Tabs from '@theme/Tabs';
+import TabItem from '@theme/TabItem';
+import Alert from '@site/src/components/Alert';
+import Jump from '@site/src/components/Jump';
+
+To set up a Kubernetes Cluster on [Azure Kubernetes Service (AKS)](https://azure.microsoft.com/en-us/services/kubernetes-service/)
+
+## Install Kubectl
+
+Please follow this link (https://kubernetes.io/docs/tasks/tools/install-kubectl) to install kubectl.
+
+- For Mac User
+
+```bash
+brew install kubernetes-cli
+```
+
+Please check kubectl version after installation.
+
+```bash
+kubectl version
+```
+
+<Alert icon={false} type="info">
+QuickStart scripts are tested under kubectl client version v1.16.3 and server version v1.13.12
+</Alert>
+
+- Install Helm
+
+Please follow this link (https://helm.sh/docs/using_helm/#installing-helm) to install helm.
+
+For Mac User
+
+```bash
+brew install kubernetes-helm
+```
+
+Please check helm version after installation.
+
+```bash
+helm version
+```
+
+<Alert icon={false} type="info">
+This QuickStart provides helm supports for helm v3.0.0 and v2.12.1.
+Please pick the script based on your helm version.
+</Alert>
+
+- Install Azure CLI
+
+Please follow this link to [install Azure CLI](https://docs.microsoft.com/en-us/cli/azure/install-azure-cli?view=azure-cli-latest)
+
+- For Mac User
+
+```bash
+brew update && brew install azure-cli
+```
+
+## (Optional) Login to your Azure account
+
+Below script will open default browser to sign-in to **your Azure Account**.
+
+```bash
+az login
+```
+
+## (Optional) Create a Resource Group
+
+Below script will create a resource group in location `eastus`.
+
+```bash
+AKS_RESOURCE_GROUP=pinot-demo
+AKS_RESOURCE_GROUP_LOCATION=eastus
+az group create --name ${AKS_RESOURCE_GROUP} \
+ --location ${AKS_RESOURCE_GROUP_LOCATION}
+```
+
+## (Optional) Create a Kubernetes cluster(AKS) in Azure
+
+Below script will create a **3 nodes** cluster named **pinot-quickstart** for demo purposes.
+Please modify the parameters in the example command below:
+
+```bash
+AKS_RESOURCE_GROUP=pinot-demo
+AKS_CLUSTER_NAME=pinot-quickstart
+az aks create --resource-group ${AKS_RESOURCE_GROUP} \
+ --name ${AKS_CLUSTER_NAME} \
+ --node-count 3
+```
+
+Once the command is succeed, it's ready to be used.
+
+## Connect to an existing cluster
+
+Simply run below command to get the credential for the cluster **pinot-quickstart** that you just created or your existing cluster.
+
+```bash
+AKS_RESOURCE_GROUP=pinot-demo
+AKS_CLUSTER_NAME=pinot-quickstart
+az aks get-credentials --resource-group ${AKS_RESOURCE_GROUP} \
+ --name ${AKS_CLUSTER_NAME}
+```
+
+To verify the connection, you can run:
+
+```bash
+kubectl get nodes
+```
+
+## Pinot Quickstart
+
+Please follow this [Kubernetes QuickStart](/docs/administration/installation/cloud/on-premises) to deploy your Pinot Demo.
+
+<Jump to="/docs/administration/installation/cloud/on-premises">Kubernetes Quickstart</Jump>
+
+## Delete a Kubernetes Cluster
+
+```bash
+AKS_RESOURCE_GROUP=pinot-demo
+AKS_CLUSTER_NAME=pinot-quickstart
+az aks delete --resource-group ${AKS_RESOURCE_GROUP} \
+ --name ${AKS_CLUSTER_NAME}
+```
diff --git a/website-builder/docs/administration/installation/cloud/gcp.md b/website-builder/docs/administration/installation/cloud/gcp.md
new file mode 100644
index 0000000..467fb34
--- /dev/null
+++ b/website-builder/docs/administration/installation/cloud/gcp.md
@@ -0,0 +1,134 @@
+---
+title: GCP Quickstart
+sidebar_label: GCP
+description: Run Pinot on GCP
+---
+
+import Alert from '@site/src/components/Alert';
+
+To have basic set with [Google Kubernetes Engine(GKE)](https://cloud.google.com/kubernetes-engine) on GCP:
+
+## Tooling Installation
+
+### Install Kubectl
+
+Please follow this link (https://kubernetes.io/docs/tasks/tools/install-kubectl) to install kubectl.
+
+For Mac User
+
+```bash
+brew install kubernetes-cli
+```
+
+Please check kubectl version after installation.
+
+```bash
+kubectl version
+```
+
+QuickStart scripts are tested under kubectl client version v1.16.3 and server version v1.13.12
+
+### Install Helm
+
+Please follow this [link to install helm](https://helm.sh/docs/using_helm/#installing-helm)
+
+For Mac User
+
+```bash
+brew install kubernetes-helm
+```
+
+Please check helm version after installation.
+
+```bash
+helm version
+```
+
+<Alert icon={false} type="info">
+This QuickStart provides helm supports for helm v3.0.0 and v2.12.1.
+Please pick the script based on your helm version.
+</Alert>
+
+
+## Install Google Cloud SDK
+
+Please follow this link to [install Google Cloud SDK](https://cloud.google.com/sdk/install)
+
+### For Mac User
+
+- Install Google Cloud SDK
+
+```bash
+curl https://sdk.cloud.google.com | bash
+```
+
+- Restart your shell
+
+```bash
+exec -l $SHELL
+```
+
+### (Optional) Initialize Google Cloud Environment
+
+```bash
+gcloud init
+```
+
+### (Optional) Create a Kubernetes cluster(GKE) in Google Cloud
+
+Below script will create a 3 nodes cluster named pinot-quickstart in `us-west1-b` with `n1-standard-2` machines for demo purposes.
+
+Please modify the parameters in the example command below:
+
+```bash
+GCLOUD_PROJECT=[your gcloud project name]
+GCLOUD_ZONE=us-west1-b
+GCLOUD_CLUSTER=pinot-quickstart
+GCLOUD_MACHINE_TYPE=n1-standard-2
+GCLOUD_NUM_NODES=3
+gcloud container clusters create ${GCLOUD_CLUSTER} \
+ --num-nodes=${GCLOUD_NUM_NODES} \
+ --machine-type=${GCLOUD_MACHINE_TYPE} \
+ --zone=${GCLOUD_ZONE} \
+ --project=${GCLOUD_PROJECT}
+```
+
+You can monitor cluster status by command:
+
+```bash
+gcloud compute instances list
+```
+
+Once the cluster is in RUNNING status, it's ready to be used.
+
+### Connect to an existing cluster
+
+Simply run below command to get the credential for the cluster pinot-quickstart that you just created or your existing cluster.
+
+```bash
+GCLOUD_PROJECT=[your gcloud project name]
+GCLOUD_ZONE=us-west1-b
+GCLOUD_CLUSTER=pinot-quickstart
+gcloud container clusters get-credentials ${GCLOUD_CLUSTER} --zone ${GCLOUD_ZONE} --project ${GCLOUD_PROJECT}
+```
+
+To verify the connection, you can run:
+
+```bash
+kubectl get nodes
+```
+
+### Pinot Quickstart
+
+Please follow this [Kubernetes QuickStart](/docs/administration/installation/cloud/on-premises) to deploy your Pinot Demo.
+
+import Jump from '@site/src/components/Jump';
+
+<Jump to="/docs/administration/installation/cloud/on-premises">Kubernetes Quickstart</Jump>
+
+### Delete a Kubernetes Cluster
+
+```bash
+GCLOUD_ZONE=us-west1-b
+gcloud container clusters delete pinot-quickstart --zone=${GCLOUD_ZONE}
+```
diff --git a/website-builder/docs/administration/installation/cloud/on-premise.md b/website-builder/docs/administration/installation/cloud/on-premise.md
new file mode 100644
index 0000000..e49f69c
--- /dev/null
+++ b/website-builder/docs/administration/installation/cloud/on-premise.md
@@ -0,0 +1,287 @@
+---
+title: Running Pinot in Kubernetes
+sidebar_label: Kubernetes
+description: Running Pinot in Kubernetes
+---
+
+This QuickStart assumes the existence of Kubernetes Cluster. Please follow below links to setup your Kubernetes cluster in local or major cloud vendors.
+
+> <b>Prerequisites:</b> <br/>
+> <p> <a href="https://docs.docker.com/docker-for-mac/kubernetes/" target="_blank">Enable Kubernetes on Docker-Desktop</a><br/>
+> <a href="https://kubernetes.io/docs/tasks/tools/install-minikube/" target="_blank">Setup a Kubernetes Cluster using Amazon Elastic Kubernetes Service (Amazon EKS)</a> <br/>
+> <a href="https://kubernetes.io/docs/tasks/tools/install-minikube/" target="_blank">Setup a Kubernetes Cluster using Google Kubernetes Engine(GKE)</a> <br/>
+> <a href="https://kubernetes.io/docs/tasks/tools/install-minikube/" target="_blank">Setup a Kubernetes Cluster using Azure Kubernetes Service (AKS)</a> <br/> </p>
+
+import Tabs from '@theme/Tabs';
+import TabItem from '@theme/TabItem';
+
+## Setup a Pinot cluster for demo
+
+### Update helm dependency
+
+```bash
+helm dependency update
+```
+
+### Start Pinot with Helm
+
+- For Helm v2.12.1
+
+If cluster is just initialized, ensure helm is initialized by running:
+
+```bash
+helm init --service-account tiller
+```
+
+Then deploy pinot cluster by:
+
+```bash
+helm install --namespace "pinot-quickstart" --name "pinot" .
+```
+
+- For Helm v3.0.0
+
+```bash
+kubectl create ns pinot-quickstart
+helm install -n pinot-quickstart pinot .
+```
+
+## Troubleshooting (For helm v2.12.1)
+
+- Error: Please run below command if encountering issue:
+
+```bash
+Error: could not find tiller".
+```
+
+- Resolution:
+
+```bash
+kubectl -n kube-system delete deployment tiller-deploy
+kubectl -n kube-system delete service/tiller-deploy
+helm init --service-account tiller
+```
+
+- Error: Please run below command if encountering permission issue:
+
+```bash
+Error: release pinot failed: namespaces "pinot-quickstart" is forbidden: User "system:serviceaccount:kube-system:default" cannot get resource "namespaces" in API group "" in the namespace "pinot-quickstart"
+```
+
+- Resolution:
+
+```bash
+kubectl apply -f helm-rbac.yaml
+```
+
+- Check deployment status
+
+```bash
+kubectl get all -n pinot-quickstart
+```
+
+## Load data into Pinot through Kafka
+
+### Bring up a Kafka Cluster for realtime data ingestion
+
+- For helm v2.12.1
+
+```bash
+helm repo add incubator https://charts.helm.sh/incubator
+helm install --namespace "pinot-quickstart" --name kafka incubator/kafka
+```
+
+- For helm v3.0.0
+
+```bash
+helm repo add incubator https://charts.helm.sh/incubator
+helm install -n pinot-quickstart kafka incubator/kafka --set replicas=1
+```
+
+### Check Kafka deployment status
+
+```bash
+kubectl get all -n pinot-quickstart |grep kafka
+```
+
+Ensure Kafka deployment is ready before executing the scripts in next steps:
+
+```bash
+pod/kafka-0 1/1 Running 0 2m
+pod/kafka-zookeeper-0 1/1 Running 0 10m
+pod/kafka-zookeeper-1 1/1 Running 0 9m
+pod/kafka-zookeeper-2 1/1 Running 0 8m
+```
+
+
+### Create Kafka topics
+
+Below scripts will create two Kafka topics for data ingestion:
+
+```bash
+kubectl -n pinot-quickstart exec kafka-0 -- kafka-topics --zookeeper kafka-zookeeper:2181 --topic flights-realtime --create --partitions 1 --replication-factor 1
+kubectl -n pinot-quickstart exec kafka-0 -- kafka-topics --zookeeper kafka-zookeeper:2181 --topic flights-realtime-avro --create --partitions 1 --replication-factor 1
+```
+
+### Load data into Kafka and Create Pinot Schema/Tables
+
+Below script will deploy 3 batch jobs
+
+- Ingest 19492 Json messages to Kafka topic `flights-realtime` at a speed of 1 msg/sec
+- Ingest 19492 Avro messages to Kafka topic `flights-realtime-avro` at a speed of 1 msg/sec
+- Upload Pinot schema `airlineStats`
+- Create Pinot Table `airlineStats` to ingest data from Json encoded Kafka topic `flights-realtime`
+- Create Pinot Table `airlineStatsAvro` to ingest data from Avro encoded Kafka topic `flights-realtime-avro`
+
+```bash
+kubectl apply -f pinot-realtime-quickstart.yml
+```
+
+## How to query pinot data
+
+### Pinot Query Console
+
+Please use below script to do local port-forwarding and open Pinot query console on your web browser.
+
+```bash
+./query-pinot-data.sh
+```
+
+## Use Superset to query Pinot
+
+### Bring up Superset
+
+```bash
+kubectl apply -f superset.yaml
+```
+
+### (First time) Set up Admin account
+
+```bash
+kubectl exec -it pod/superset-0 -n pinot-quickstart -- bash -c 'export FLASK_APP=superset:app && flask fab create-admin'
+```
+
+### (First time) Init Superset
+
+```bash
+kubectl exec -it pod/superset-0 -n pinot-quickstart -- bash -c 'superset db upgrade'
+kubectl exec -it pod/superset-0 -n pinot-quickstart -- bash -c 'superset init'
+```
+
+### Load Demo Data source
+
+```bash
+kubectl exec -it pod/superset-0 -n pinot-quickstart -- bash -c 'superset import_datasources -p /etc/superset/pinot_example_datasource.yaml'
+kubectl exec -it pod/superset-0 -n pinot-quickstart -- bash -c 'superset import_dashboards -p /etc/superset/pinot_example_dashboard.json'
+```
+
+### Access Superset UI
+
+```bash
+./open-superset-ui.sh
+```
+
+You can open the imported dashboard by click Dashboards banner then click on AirlineStats.
+
+## Access Pinot Using Presto
+
+### Deploy Presto with Pinot Plugin
+
+You can run below command to deploy a customized Presto with Pinot plugin.
+
+```bash
+kubectl apply -f presto-coordinator.yaml
+```
+
+### Query Presto using Presto CLI
+
+Once Presto is deployed, you could run below command.
+
+```bash
+./pinot-presto-cli.sh
+```
+
+### Sample queries to execute
+
+- List all catalogs
+
+```SQL
+presto:default> show catalogs;
+```
+
+```bash
+Catalog
+---------
+ pinot
+ system
+(2 rows)
+
+Query 20191112_050827_00003_xkm4g, FINISHED, 1 node
+Splits: 19 total, 19 done (100.00%)
+0:01 [0 rows, 0B] [0 rows/s, 0B/s]
+```
+
+- List All tables
+
+```SQL
+presto:default> show tables;
+```
+
+```bash
+ Table
+--------------
+ airlinestats
+(1 row)
+
+Query 20191112_050907_00004_xkm4g, FINISHED, 1 node
+Splits: 19 total, 19 done (100.00%)
+0:01 [1 rows, 29B] [1 rows/s, 41B/s]
+```
+
+- Show schema
+
+```sql
+presto:default> DESCRIBE pinot.dontcare.airlinestats;
+```
+
+```bash
+ Column | Type | Extra | Comment
+----------------------+---------+-------+---------
+ flightnum | integer | |
+ origin | varchar | |
+ quarter | integer | |
+ lateaircraftdelay | integer | |
+ divactualelapsedtime | integer | |
+......
+
+Query 20191112_051021_00005_xkm4g, FINISHED, 1 node
+Splits: 19 total, 19 done (100.00%)
+0:02 [80 rows, 6.06KB] [35 rows/s, 2.66KB/s]
+```
+
+- Count total documents
+
+```SQL
+presto:default> select count(*) as cnt from pinot.dontcare.airlinestats limit 10;
+```
+
+```bash
+ cnt
+------
+ 9745
+(1 row)
+
+Query 20191112_051114_00006_xkm4g, FINISHED, 1 node
+Splits: 17 total, 17 done (100.00%)
+0:00 [1 rows, 8B] [2 rows/s, 19B/s]
+```
+
+### How to clean up Pinot deployment
+
+```bash
+kubectl delete ns pinot-quickstart
+```
+
+import Jump from '@site/src/components/Jump';
+
+<Jump to="/docs/administration/">Administration</Jump>
diff --git a/website-builder/docs/administration/installation/containers.md b/website-builder/docs/administration/installation/containers.md
new file mode 100644
index 0000000..df76285
--- /dev/null
+++ b/website-builder/docs/administration/installation/containers.md
@@ -0,0 +1,12 @@
+---
+title: Install Pinot On Containers
+sidebar_label: hidden
+hide_pagination: true
+---
+
+import Jump from '@site/src/components/Jump';
+
+<Jump to="/docs/setup/installation/containers/docker/">Docker</Jump>
+
+
+Pinot on contianers
diff --git a/website-builder/docs/administration/installation/containers/docker.md b/website-builder/docs/administration/installation/containers/docker.md
new file mode 100644
index 0000000..b8ff648
--- /dev/null
+++ b/website-builder/docs/administration/installation/containers/docker.md
@@ -0,0 +1,136 @@
+---
+title: Running Pinot in Docker
+sidebar_label: Docker
+description: Using Pinot on Docker
+source_url: https://github.com/
+
+---
+
+Apache Pinot started maintaing the [`apachepinot/pinot`](https://hub.docker.com/r/apachepinot/pinot) Docker images
+available on [Docker Hub](https://hub.docker.com/r/apachepinot/pinot/tags)
+
+> <b>Prerequisites:</b> <br/> <p> <a href="https://hub.docker.com/editions/community/docker-ce-desktop-mac" target="_blank">Install Docker</a><br/> Try <a href="https://hub.docker.com/editions/community/docker-ce-desktop-mac" target="_blank">Kubernetes Quickstart</a> if you already have a minikube cluster or docker kubernetes setup.</p>
+
+## Running
+
+Create an isolated bridge network in docker
+
+```bash
+docker network create -d bridge pinot-demo
+```
+
+We'll be running a docker image apachepinot/pinot:latest to run a quick start, which does the following:
+
+- Sets up the Pinot cluster QuickStartCluster
+- Creates a sample table and loads sample data
+
+There's 3 types of quick start
+
+import Tabs from '@theme/Tabs';
+import TabItem from '@theme/TabItem';
+
+<Tabs
+ block={true}
+ defaultValue="Batch"
+ urlKey="arch"
+ values={[{"label":"Batch","value":"Batch"},{"label":"Streaming","value":"Streaming"},{"label":"Hybrid","value":"Hybrid"}]}>
+
+<TabItem value="Batch">
+
+Batch
+
+1. Starts Pinot deployment by starting:
+
+ - Apache Zookeeper
+ - Pinot Controller
+ - Pinot Broker
+ - Pinot Server
+
+2. Creates a demo table:
+
+ - baseballStats
+
+3. Launches a standalone data ingestion job:
+
+ - build one Pinot segment for a given csv data file for table baseballStats
+ - push built segment to Pinot controller
+
+4. Issues sample queries to Pinot
+
+ ```bash
+ docker run \
+ --network=pinot-demo \
+ --name pinot-quickstart \
+ -p 9000:9000 \
+ -d apachepinot/pinot:latest QuickStart \
+ -type batch
+ ```
+
+</TabItem>
+
+<TabItem value="Streaming">
+
+Streaming:
+
+1. Starts Pinot deployment by starting:
+
+ - Apache Kafka
+ - Apache Zookeeper
+ - Pinot Controller
+ - Pinot Broker
+ - Pinot Server
+
+1. Creates a demo table: **meetupRsvp**
+
+1. Launches a **meetup** stream and publish data to a Kafka: **meetupRSVPEvents** to be subscribed by Pinot
+
+1. Issues sample queries to Pinot
+
+</TabItem>
+
+<TabItem value="Hybrid">
+
+Hybrid:
+
+1. Starts Pinot deployment by starting:
+
+ - Apache Kafka
+ - Apache Zookeeper
+ - Pinot Controller
+ - Pinot Broker
+ - Pinot Server
+
+1. Creates a demo table: **airlineStats**
+
+1. Launches a standalone data ingestion job:
+
+ - build Pinot segments under a given directory of Avro files for table airlineStats
+ - push built segments to Pinot controller
+
+1. Launches a stream of flights stats and publish data to a Kafka topic airlineStatsEvents to be subscribed by Pinot
+
+1. Issues sample queries to Pinot
+
+```bash
+# Stop previous container, if any, or use different network
+docker run \
+ --network=pinot-demo \
+ --name pinot-quickstart \
+ -p 9000:9000 \
+ -d apachepinot/pinot:latest QuickStart \
+ -type hybrid
+```
+
+</TabItem>
+
+</Tabs>
+
+That's it! We've spun up a Pinot cluster.
+
+It may take a while for all Pinot components to start and for the sample data to be loaded. Use the below command to check the container logs
+
+```bash
+docker logs pinot-quickstart -f
+```
+
+You can head over to Exploring Pinot to check out the data in the `baseballStats`, `meetupRSVP` or the `airlineStats` table.
diff --git a/website-builder/docs/administration/installation/operating-systems/macos.md b/website-builder/docs/administration/installation/operating-systems/macos.md
new file mode 100644
index 0000000..0f385c3
--- /dev/null
+++ b/website-builder/docs/administration/installation/operating-systems/macos.md
@@ -0,0 +1,11 @@
+---
+title: Install Pinot On MacOS
+sidebar_label: MacOS
+description: Install Pinot on MacOS
+---
+
+
+<!-- <InstallChoices docker={true} os="MacOS" packageManager="Homebrew" /> -->
+
+
+
diff --git a/website-builder/docs/administration/installation/operating-systems/ubuntu.md b/website-builder/docs/administration/installation/operating-systems/ubuntu.md
new file mode 100644
index 0000000..9b10f5f
--- /dev/null
+++ b/website-builder/docs/administration/installation/operating-systems/ubuntu.md
@@ -0,0 +1,14 @@
+---
+title: Install Pinot On Ubuntu
+sidebar_label: Ubuntu
+description: Install Pinot on the Ubuntu operating system
+---
+
+Pinot can be installed on the Ubuntu through the following methods:
+
+<!-- import InstallChoices from '@site/src/components/InstallChoices'; -->
+
+<!-- <InstallChoices docker={true} os="Linux" packageManager="DPKG" /> -->
+
+
+
diff --git a/website-builder/docs/administration/running_locally.md b/website-builder/docs/administration/running_locally.md
new file mode 100644
index 0000000..5c5ad0e
--- /dev/null
+++ b/website-builder/docs/administration/running_locally.md
@@ -0,0 +1,60 @@
+---
+id: running_locally
+title: Running Pinot locally
+sidebar_label: Running Pinot locally
+---
+
+## Running Pinot locally
+
+Pinot Quickstart local
+
+### Getting Pinot
+
+First, let's get Pinot. You can either build it, or download it
+
+> <b>Prerequisites:</b> <br/> <p> <a href="https://linuxize.com/post/install-java-on-ubuntu-18-04/#installing-openjdk-8" target="_blank">Install Java 8 or higher...</a> </p>
+
+### Build
+
+Follow these steps to checkout code from [Github](https://github.com/apache/incubator-pinot) and build Pinot locally
+
+> <b>Prerequisites:</b> <br/> <p> Install <a href="https://maven.apache.org/install.html" target="_blank">Apache Maven</a> 3.6 or higher. </p>
+
+```bash
+# checkout pinot
+git clone https://github.com/apache/incubator-pinot.git
+cd incubator-pinot
+
+# build pinot
+mvn install package -DskipTests -Pbin-dist
+
+# navigate to directory containing the setup scripts
+cd pinot-distribution/target/apache-pinot-incubating-${pinot.version}-bin/apache-pinot-incubating-${pinot.version}-bin
+```
+
+### Download
+
+Download the latest binary release from Apache Pinot, or use this command
+
+```bash
+wget https://downloads.apache.org/incubator/pinot/apache-pinot-incubating-${pinot.version}/apache-pinot-incubating-${pinot.version}-bin.tar.gz
+```
+
+Once you have the tar file,
+
+```bash
+# untar it
+tar -zxvf apache-pinot-incubating-${pinot.version}-bin.tar.gz
+
+# navigate to directory containing the launcher scripts
+cd apache-pinot-incubating-${pinot.version}-bin
+```
+
+If you want to run Pinot using a Docker image instead, head over to Running Pinot in Docker
+
+<Alert type="info">
+
+Pro-tip: These field names can be controlled via the
+[global `log_schema` options][docs.reference.global-options#log_schema].
+
+</Alert>
\ No newline at end of file
diff --git a/website-builder/docs/components.md b/website-builder/docs/components.md
new file mode 100644
index 0000000..9ada314
--- /dev/null
+++ b/website-builder/docs/components.md
@@ -0,0 +1,14 @@
+---
+title: Components
+description: "Components"
+sidebar_label: hidden
+hide_pagination: true
+---
+
+Provide basic foundation of Pinot.
+
+import Jump from '@site/src/components/Jump';
+
+<Jump to="/docs/about/what_is_pinot/">What is Pinot?</Jump>
+<Jump to="/docs/about/features_of_pinot/">Features of Pinot</Jump>
+<Jump to="/docs/about/guarantees/">Who is using Pinot?</Jump>
\ No newline at end of file
diff --git a/website-builder/docs/components/broker.md b/website-builder/docs/components/broker.md
new file mode 100644
index 0000000..5fc72d0
--- /dev/null
+++ b/website-builder/docs/components/broker.md
@@ -0,0 +1,13 @@
+---
+title: Broker
+sidebar_label: broker
+description: Broker
+---
+
+import Alert from '@site/src/components/Alert';
+import Tabs from '@theme/Tabs';
+import TabItem from '@theme/TabItem';
+
+Brokers are the components that handle Pinot queries. They accept queries from clients and forward them to the right servers. They collect results back from the servers and consolidate them into a single response, to sent it back to the client.
+
+
\ No newline at end of file
diff --git a/website-builder/docs/components/cluster.md b/website-builder/docs/components/cluster.md
new file mode 100644
index 0000000..ea46d70
--- /dev/null
+++ b/website-builder/docs/components/cluster.md
@@ -0,0 +1,137 @@
+---
+title: Cluster
+sidebar_label: cluster
+description: Cluster
+---
+
+import Alert from '@site/src/components/Alert';
+import Tabs from '@theme/Tabs';
+import TabItem from '@theme/TabItem';
+
+Cluster is a set a nodes comprising of servers, brokers, controllers and minions.
+
+Pinot leverages [Apache Helix](http://helix.apache.org) for cluster management. Helix is a cluster management framework to manage replicated, partitioned resources in a distributed system. Helix uses Zookeeper to store cluster state and metadata.
+
+
+
+## Cluster components
+
+Briefly, Helix divides nodes into three logical components based on their responsibilities
+
+### Participant
+
+The nodes that host distributed, partitioned resources
+
+### Spectator
+
+The nodes that observe the current state of each Participant and use that information to access the resources. Spectators are notified of state changes in the cluster (state of a participant, or that of a partition in a participant).
+
+### Controller
+
+The node that observes and controls the Participant nodes. It is responsible for coordinating all transitions in the cluster and ensuring that state constraints are satisfied while maintaining cluster stability.
+
+- Pinot Servers are modeled as Participants, more details about server nodes can be found in [Server](../../docs/components/server)
+- Pinot Brokers are modeled as Spectators, more details about broker nodes can be found in [Broker](../../docs/components/broker)
+- Pinot Controllers are modeled as Controllers, more details about controller nodes can be found in [Controller](../../docs/components/controller)
+
+## Logical view
+
+Another way to visualize the cluster is a logical view, wherein a cluster contains [tenants](../../docs/components/segments), tenants contain [tables](../../docs/components/tables), and tables contain [segments](../../docs/components/segments).
+
+
+
+## Setup a Pinot Cluster
+
+Typically, there is only cluster per environment/data center. There is no needed to create multiple Pinot clusters since Pinot supports the concept of [tenants](../../docs/components/tenants).
+
+At LinkedIn, the largest Pinot cluster consists of 1000+ nodes.
+
+To setup a Pinot cluster, we need to first start Zookeeper:
+
+<Tabs
+ className="Install"
+ defaultValue="Using launcher scripts"
+ values={[
+ { label: <><i className="Using docker images"></i> Using docker images</>, value: 'docker', },
+ { label: <><i className="Using launcher scripts"></i> Using launcher scripts</>, value: 'launcer', },
+ ]
+}>
+
+<TabItem value="docker">
+
+1. Create a Network
+Create an isolated bridge network in docker
+
+```bash
+docker network create -d bridge pinot-demo
+```
+
+2. Start Zookeeper
+
+Start Zookeeper in daemon.
+
+```bash
+docker run \
+ --network=pinot-demo \
+ --name pinot-zookeeper \
+ --restart always \
+ -p 2181:2181 \
+ -d zookeeper:3.5.6
+```
+
+3. Start Zookeeper UI
+Start ZKUI to browse Zookeeper data at http://localhost:9090.
+
+```bash
+docker run \
+ --network pinot-demo --name=zkui \
+ -p 9090:9090 \
+ -e ZK_SERVER=pinot-zookeeper:2181 \
+ -d qnib/plain-zkui:latest
+```
+
+4.
+
+</TabItem>
+
+<TabItem value="launcer">
+
+Download Pinot Distribution using instructions in Download
+
+Start Zookeeper
+
+```bash
+bin/pinot-admin.sh StartZookeeper
+```
+
+2. Start Zooinspector
+
+Install [zooinspector](https://github.com/jfim/zooinspector) to view the data in Zookeeper, and connect to localhost:2181
+
+</TabItem>
+
+</Tabs>
+
+Once we've started Zookeeper, we can start other components to join this cluster. If you're using docker, pull the latest `apachepinot/pinot` image.
+
+### Using docker images
+
+#### Pull pinot docker image
+
+(Optional) You can also follow the instructions here to build your own images.<br />
+
+You can try out pre-built Pinot all-in-one docker image.
+
+```sql
+export PINOT_VERSION=0.3.0-SNAPSHOT
+export PINOT_IMAGE=apachepinot/pinot:${PINOT_VERSION}
+docker pull ${PINOT_IMAGE}
+```
+
+To start other components to join the cluster
+
+- Start Controller
+- Start Broker
+- Start Server
+
+Explore your cluster via Pinot Data Explorer
diff --git a/website-builder/docs/components/controller.md b/website-builder/docs/components/controller.md
new file mode 100644
index 0000000..9a948ca
--- /dev/null
+++ b/website-builder/docs/components/controller.md
@@ -0,0 +1,7 @@
+---
+title: Pinot Query Language (PQL)
+sidebar_label: PQL
+description: Pinot Query Language
+---
+
+A
\ No newline at end of file
diff --git a/website-builder/docs/components/minion.md b/website-builder/docs/components/minion.md
new file mode 100644
index 0000000..e69de29
diff --git a/website-builder/docs/components/schema.md b/website-builder/docs/components/schema.md
new file mode 100644
index 0000000..e69de29
diff --git a/website-builder/docs/components/segments.md b/website-builder/docs/components/segments.md
new file mode 100644
index 0000000..e69de29
diff --git a/website-builder/docs/components/server.md b/website-builder/docs/components/server.md
new file mode 100644
index 0000000..e69de29
diff --git a/website-builder/docs/components/tables.md b/website-builder/docs/components/tables.md
new file mode 100644
index 0000000..e69de29
diff --git a/website-builder/docs/components/tenants.md b/website-builder/docs/components/tenants.md
new file mode 100644
index 0000000..e69de29
diff --git a/website-builder/docs/concepts.md b/website-builder/docs/concepts.md
new file mode 100644
index 0000000..3dbf200
--- /dev/null
+++ b/website-builder/docs/concepts.md
@@ -0,0 +1,14 @@
+---
+title: Concepts
+description: "Concepts"
+sidebar_label: hidden
+hide_pagination: true
+---
+
+Provide basic foundation of Pinot.
+
+import Jump from '@site/src/components/Jump';
+
+<Jump to="/docs/about/what_is_pinot/">What is Pinot?</Jump>
+<Jump to="/docs/about/features_of_pinot/">Features of Pinot</Jump>
+<Jump to="/docs/about/guarantees/">Who is using Pinot?</Jump>
diff --git a/website-builder/docs/concepts/pinot-architecture.md b/website-builder/docs/concepts/pinot-architecture.md
new file mode 100644
index 0000000..6119181
--- /dev/null
+++ b/website-builder/docs/concepts/pinot-architecture.md
@@ -0,0 +1,17 @@
+---
+id: pinot-architecture
+title: Pinot Architecture
+sidebar_label: Pinot Architecture
+---
+
+
+
+- Terminology:
+First, a bit of naming notions. Pinot has has different components, and different ways of representing the data. In particular, data is represented by:
+
+- Table:
+A table is a logical abstraction to refer to a collection of related data. It consists of columns and rows (documents).
+
+- Segment:
+Data in table is divided into (horizontal) shards referred to as segments.
+
diff --git a/website-builder/docs/how-to.md b/website-builder/docs/how-to.md
new file mode 100644
index 0000000..4630f90
--- /dev/null
+++ b/website-builder/docs/how-to.md
@@ -0,0 +1,14 @@
+---
+title: How To
+description: "how to guides"
+sidebar_label: hidden
+hide_pagination: true
+---
+
+Provide basic foundation of Pinot.
+
+import Jump from '@site/src/components/Jump';
+
+<Jump to="/docs/about/what_is_pinot/">What is Pinot?</Jump>
+<Jump to="/docs/about/features_of_pinot/">Features of Pinot</Jump>
+<Jump to="/docs/about/guarantees/">Who is using Pinot?</Jump>
diff --git a/website-builder/docs/misc.md b/website-builder/docs/misc.md
new file mode 100644
index 0000000..5de25fd
--- /dev/null
+++ b/website-builder/docs/misc.md
@@ -0,0 +1,14 @@
+---
+title: Misc Content
+description: "Misc content"
+sidebar_label: hidden
+hide_pagination: true
+---
+
+Provide basic foundation of Pinot.
+
+import Jump from '@site/src/components/Jump';
+
+<Jump to="/docs/about/what_is_pinot/">What is Pinot?</Jump>
+<Jump to="/docs/about/features_of_pinot/">Features of Pinot</Jump>
+<Jump to="/docs/about/guarantees/">Who is using Pinot?</Jump>
diff --git a/website-builder/docs/misc/build-docker.md b/website-builder/docs/misc/build-docker.md
new file mode 100644
index 0000000..a881e39
--- /dev/null
+++ b/website-builder/docs/misc/build-docker.md
@@ -0,0 +1,184 @@
+---
+title: Build Docker Images
+sidebar_label: build-docker
+description: Build Docker Images
+---
+
+The scripts to build Pinot related docker images is located at [here](https://github.com/apache/incubator-pinot/tree/master/docker/images)
+
+You can access those scripts by running below command to checkout Pinot repo:
+
+```bash
+git clone git@github.com:apache/incubator-pinot.git pinot
+cd pinot/docker/images
+```
+
+You can find current supported 3 images in this directory:
+
+- Pinot: Pinot all-in-one distribution image
+- Pinot-Presto: Presto image with Presto-Pinot Connector built-in.
+- Pinot-Superset: Superset image with Pinot connector built-in.
+
+## Pinot
+
+This is a docker image of [Apache Pinot](https://github.com/apache/incubator-pinot)
+
+### How to build a docker image
+
+There is a docker build script which will build a given Git repo/branch and tag the image.
+
+Usage:
+
+```bash
+./docker-build.sh [Docker Tag] [Git Branch] [Pinot Git URL]
+```
+
+This script will check out Pinot Repo `[Pinot Git URL]` on branch `[Git Branch]` and build the docker image for that. <br />
+The docker image is tagged as `[Docker Tag]`. <br />
+Docker Tag: Name and tag your docker image. Default is `pinot:latest`. <br />
+Git Branch: The Pinot branch to build. Default is master. <br />
+Pinot Git URL: The Pinot Git Repo to build, users can set it to their own fork. <br />
+Please note that, the URL is `https://` based, not `git://`. <br />
+Default is the [Apache Repo: https://github.com/apache/incubator-pinot.git](https://github.com/apache/incubator-pinot.git). <br />
+
+- Example of building and tagging a snapshot on your own fork:
+
+```bash
+./docker-build.sh pinot_fork:snapshot-5.2 snapshot-5.2 https://github.com/your_own_fork/pinot.git
+```
+
+- Example of building a release version:
+
+```bash
+./docker-build.sh pinot:release-0.1.0 release-0.1.0 https://github.com/apache/incubator-pinot.git
+```
+
+- Example of building current master branch as a snapshot:
+
+```bash
+./docker-build.sh apachepinot/pinot:0.3.0-SNAPSHOT master
+```
+
+## How to publish a docker image
+
+Script `docker-push.sh` publishes a given docker image to your docker registry.
+In order to push to your own repo, the image needs to be explicitly tagged with the repo name.
+
+- Example of publishing an image to `[apachepinot/pinot](https://hub.docker.com/u/apachepinot/repository/docker/apachepinot/pinot)` dockerHub repo.
+
+```bash
+./docker-push.sh apachepinot/pinot:latest
+```
+
+- You can also tag a built image, then push it.
+
+```bash
+docker tag pinot:release-0.1.0 apachepinot/pinot:release-0.1.0
+docker push apachepinot/pinot:release-0.1.0
+```
+
+- Script docker-build-and-push.sh builds and publishes this docker image to your docker registry after build.
+
+- Example of building and publishing an image to `[apachepinot/pinot](https://hub.docker.com/u/apachepinot/repository/docker/apachepinot/pinot)` dockerHub repo.
+
+```bash
+./docker-build-and-push.sh apachepinot/pinot:latest master https://github.com/apache/incubator-pinot.git
+```
+
+## Kubernetes Examples
+
+Please refer to [Kubernetes Quickstart](../administration/installation/cloud/on-premise.md) for deployment examples.
+
+[Kubernetes Quickstart](../administration/installation/cloud/on-premise.md)
+
+
+## Pinot Presto
+
+Docker image for Presto with Pinot integration.
+This docker build project is specialized for Pinot.
+
+### How to build
+
+Usage:
+
+```bash
+./docker-build.sh [Docker Tag] [Git Branch] [Presto Git URL]
+```
+
+This script will check out Pinot Repo `[Pinot Git URL]` on branch `[Git Branch]` and build the docker image for that. <br />
+The docker image is tagged as `[Docker Tag]`. <br />
+Docker Tag: Name and tag your docker image. Default is `pinot:latest`. <br />
+Git Branch: The Pinot branch to build. Default is master. <br />
+Pinot Git URL: The Pinot Git Repo to build, users can set it to their own fork. <br />
+Please note that, the URL is `https://` based, not `git://`. <br />
+Default is the [Apache Repo: https://github.com/apache/incubator-pinot.git](https://github.com/apache/incubator-pinot.git). <br />
+
+### How to push
+
+```bash
+docker push apachepinot/pinot-presto:latest
+```
+
+### Configuration
+
+Follow the instructions provided by Presto for writing your own configuration files under etc directory.
+
+### Volumes
+
+The image defines two data volumes: one for mounting configuration into the container, and one for data.
+The configuration volume is located alternatively at `/home/presto/etc`, which contains all the configuration and plugins.
+The data volume is located at `/home/presto/data`.
+
+### Kubernetes Examples
+
+Please refer to presto-coordinator.yaml as k8s deployment example.
+
+## Pinot Superset
+
+Docker image for Superset with Pinot integration.
+This docker build project is based on Project docker-superset and specialized for Pinot.
+
+### How to build
+
+Please modify file `Makefile` to change image and `superset_version` accordingly.
+Below command will build docker image and tag it as `superset_version` and `latest`.
+
+```bash
+make latest
+```
+
+You can also build directly with `docker build` command by setting arguments:
+
+```bash
+docker build \
+ --build-arg NODE_VERSION=latest \
+ --build-arg PYTHON_VERSION=3.6 \
+ --build-arg SUPERSET_VERSION=0.34.1 \
+ --tag apachepinot/pinot-superset:0.34.1 \
+ --target build .
+```
+
+How to push
+
+```bash
+make push
+```
+
+### Configuration
+
+Follow the [instructions](https://superset.incubator.apache.org/installation.html#configuration) provided by Apache Superset for writing your own superset_config.py.
+
+Place this file in a local directory and mount this directory to /etc/superset inside the container. This location
+is included in the image's `PYTHONPATH`. Mounting this file to a different location is possible, but it will need to be in the PYTHONPATH.
+
+### Volumes
+
+The image defines two data volumes: one for mounting configuration into the container, and one for data (logs, SQLite DBs, &c).
+
+The configuration volume is located alternatively at `/etc/superset` or `/home/superset`; either is acceptable. Both of these directories are included in the PYTHONPATH of the image. Mount any configuration (specifically the superset_config.py file) here to have it read by the app on startup.
+
+The data volume is located at `/var/lib/superset` and it is where you would mount your SQLite file (if you are using that as your backend), or a volume to collect any logs that are routed there. This location is used as the value of the `SUPERSET_HOME` environmental variable.
+
+### Kubernetes Examples
+
+Please refer to superset.yaml as k8s deployment example.
diff --git a/website-builder/docs/user-guide.md b/website-builder/docs/user-guide.md
new file mode 100644
index 0000000..28ef23a
--- /dev/null
+++ b/website-builder/docs/user-guide.md
@@ -0,0 +1,14 @@
+---
+title: User Guide
+description: "User Guide"
+sidebar_label: hidden
+hide_pagination: true
+---
+
+Provide basic foundation of Pinot.
+
+import Jump from '@site/src/components/Jump';
+
+<Jump to="/docs/about/what_is_pinot/">What is Pinot?</Jump>
+<Jump to="/docs/about/features_of_pinot/">Features of Pinot</Jump>
+<Jump to="/docs/about/guarantees/">Who is using Pinot?</Jump>
diff --git a/website-builder/docs/user-guide/clients/golang.md b/website-builder/docs/user-guide/clients/golang.md
new file mode 100644
index 0000000..43f7d6a
--- /dev/null
+++ b/website-builder/docs/user-guide/clients/golang.md
@@ -0,0 +1,166 @@
+---
+title: GoLang
+sidebar_label: golang
+description: Pinot Client for Golang
+---
+
+import Alert from '@site/src/components/Alert';
+
+Applications can use this golang client library to query Apache Pinot.
+
+Source Code Repo: https://github.com/fx19880617/pinot-client-go
+
+## Examples
+
+Please follow this Pinot Quickstart link to install and start Pinot batch QuickStart locally.
+
+```bash
+bin/quick-start-batch.sh
+```
+
+Check out Client library Github Repo
+
+```bash
+git clone git@github.com:fx19880617/pinot-client-go.git
+cd pinot-client-go
+```
+
+Build and run the example application to query from Pinot Batch Quickstart
+
+```bash
+go build ./examples/batch-quickstart
+./batch-quickstart
+```
+
+## Usage
+
+### Create a Pinot Connection
+
+Pinot client could be initialized through:
+
+1. Zookeeper Path
+
+```go
+pinotClient := pinot.NewFromZookeeper([]string{"localhost:2123"}, "", "QuickStartCluster")
+```
+
+1. A list of broker addresses.
+
+```go
+pinotClient := pinot.NewFromBrokerList([]string{"localhost:8000"})
+```
+
+1. ClientConfig
+
+```go
+pinotClient := pinot.NewWithConfig(&pinot.ClientConfig{
+ ZkConfig: &pinot.ZookeeperConfig{
+ ZookeeperPath: zkPath,
+ PathPrefix: strings.Join([]string{zkPathPrefix, pinotCluster}, "/"),
+ SessionTimeoutSec: defaultZkSessionTimeoutSec,
+ },
+ ExtraHTTPHeader: map[string]string{
+ "extra-header":"value",
+ },
+})
+```
+
+## Query Pinot
+
+Please see this [example](https://github.com/fx19880617/pinot-client-go/blob/master/examples/batch-quickstart/main.go) for your reference.
+
+Code snippet:
+
+```go
+pinotClient, err := pinot.NewFromZookeeper([]string{"localhost:2123"}, "", "QuickStartCluster")
+if err != nil {
+ log.Error(err)
+}
+brokerResp, err := pinotClient.ExecuteSQL("baseballStats", "select count(*) as cnt, sum(homeRuns) as sum_homeRuns from baseballStats group by teamID limit 10")
+if err != nil {
+ log.Error(err)
+}
+log.Infof("Query Stats: response time - %d ms, scanned docs - %d, total docs - %d", brokerResp.TimeUsedMs, brokerResp.NumDocsScanned, brokerResp.TotalDocs)
+```
+
+Response Format
+
+Query Response is defined as the struct of following:
+
+```go
+type BrokerResponse struct {
+ AggregationResults []*AggregationResult `json:"aggregationResults,omitempty"`
+ SelectionResults *SelectionResults `json:"SelectionResults,omitempty"`
+ ResultTable *ResultTable `json:"resultTable,omitempty"`
+ Exceptions []Exception `json:"exceptions"`
+ TraceInfo map[string]string `json:"traceInfo,omitempty"`
+ NumServersQueried int `json:"numServersQueried"`
+ NumServersResponded int `json:"numServersResponded"`
+ NumSegmentsQueried int `json:"numSegmentsQueried"`
+ NumSegmentsProcessed int `json:"numSegmentsProcessed"`
+ NumSegmentsMatched int `json:"numSegmentsMatched"`
+ NumConsumingSegmentsQueried int `json:"numConsumingSegmentsQueried"`
+ NumDocsScanned int64 `json:"numDocsScanned"`
+ NumEntriesScannedInFilter int64 `json:"numEntriesScannedInFilter"`
+ NumEntriesScannedPostFilter int64 `json:"numEntriesScannedPostFilter"`
+ NumGroupsLimitReached bool `json:"numGroupsLimitReached"`
+ TotalDocs int64 `json:"totalDocs"`
+ TimeUsedMs int `json:"timeUsedMs"`
+ MinConsumingFreshnessTimeMs int64 `json:"minConsumingFreshnessTimeMs"`
+}
+```
+
+Note that `AggregationResults` and `SelectionResults` are holders for PQL queries.
+
+Meanwhile `ResultTable` is the holder for SQL queries. `ResultTable` is defined as:
+
+```go
+// ResultTable is a ResultTable
+type ResultTable struct {
+ DataSchema RespSchema `json:"dataSchema"`
+ Rows [][]interface{} `json:"rows"`
+}
+```
+
+`RespSchema` is defined as:
+
+```go
+// RespSchema is response schema
+type RespSchema struct {
+ ColumnDataTypes []string `json:"columnDataTypes"`
+ ColumnNames []string `json:"columnNames"`
+}
+```
+
+There are multiple functions defined for `ResultTable`, like:
+
+```go
+func (r ResultTable) GetRowCount() int
+func (r ResultTable) GetColumnCount() int
+func (r ResultTable) GetColumnName(columnIndex int) string
+func (r ResultTable) GetColumnDataType(columnIndex int) string
+func (r ResultTable) Get(rowIndex int, columnIndex int) interface{}
+func (r ResultTable) GetString(rowIndex int, columnIndex int) string
+func (r ResultTable) GetInt(rowIndex int, columnIndex int) int
+func (r ResultTable) GetLong(rowIndex int, columnIndex int) int64
+func (r ResultTable) GetFloat(rowIndex int, columnIndex int) float32
+func (r ResultTable) GetDouble(rowIndex int, columnIndex int) float64
+```
+
+Sample Usage is [here](https://github.com/fx19880617/pinot-client-go/blob/master/examples/batch-quickstart/main.go#L58)
+
+```go
+// Print Response Schema
+for c := 0; c < brokerResp.ResultTable.GetColumnCount(); c++ {
+ fmt.Printf("%s(%s)\t", brokerResp.ResultTable.GetColumnName(c), brokerResp.ResultTable.GetColumnDataType(c))
+}
+fmt.Println()
+
+// Print Row Table
+for r := 0; r < brokerResp.ResultTable.GetRowCount(); r++ {
+ for c := 0; c < brokerResp.ResultTable.GetColumnCount(); c++ {
+ fmt.Printf("%v\t", brokerResp.ResultTable.Get(r, c))
+ }
+ fmt.Println()
+}
+```
diff --git a/website-builder/docs/user-guide/clients/java.md b/website-builder/docs/user-guide/clients/java.md
new file mode 100644
index 0000000..8afa517
--- /dev/null
+++ b/website-builder/docs/user-guide/clients/java.md
@@ -0,0 +1,132 @@
+---
+title: Java
+sidebar_label: java
+description: Pinot Java Client
+---
+
+import Alert from '@site/src/components/Alert';
+
+The java client can be found in pinot-clients/pinot-java-client. Here's an example of how to use the pinot-java-client to query Pinot.
+
+```java
+import org.apache.pinot.client.Connection;
+import org.apache.pinot.client.ConnectionFactory;
+import org.apache.pinot.client.Request;
+import org.apache.pinot.client.ResultSetGroup;
+import org.apache.pinot.client.ResultSet;
+
+/**
+ * Demonstrates the use of the pinot-client to query Pinot from Java
+ */
+public class PinotClientExample {
+
+ public static void main(String[] args) {
+
+ // pinot connection
+ String zkUrl = "localhost:2181";
+ String pinotClusterName = "PinotCluster";
+ Connection pinotConnection = ConnectionFactory.fromZookeeper(zkUrl + "/" + pinotClusterName);
+
+ String query = "SELECT COUNT(*) FROM myTable GROUP BY foo";
+
+ // set queryType=sql for querying the sql endpoint
+ Request pinotClientRequest = new Request("sql", query);
+ ResultSetGroup pinotResultSetGroup = pinotConnection.execute(pinotClientRequest);
+ ResultSet resultTableResultSet = pinotResultSetGroup.getResultSet(0);
+
+ int numRows = resultTableResultSet.getRowCount();
+ int numColumns = resultTableResultSet.getColumnCount();
+ String columnValue = resultTableResultSet.getString(0, 1);
+ String columnName = resultTableResultSet.getColumnName(1);
+
+ System.out.println("ColumnName: " + columnName + ", ColumnValue: " + columnValue);
+ }
+}
+```
+
+Connections to Pinot are created using the ConnectionFactory class' utility methods to create connections to a Pinot cluster given a Zookeeper URL, a Java Properties object or a list of broker addresses to connect to.
+
+```java
+Connection connection = ConnectionFactory.fromZookeeper
+ ("some-zookeeper-server:2191/zookeeperPath");
+
+Connection connection = ConnectionFactory.fromProperties("demo.properties");
+
+Connection connection = ConnectionFactory.fromHostList
+ ("some-server:1234", "some-other-server:1234", ...);
+```
+
+Queries can be sent directly to the Pinot cluster using the `Connection.execute(org.apache.pinot.client.Request)` and `Connection.executeAsync(org.apache.pinot.client.Request)` methods of Connection:
+
+```java
+ResultSetGroup resultSetGroup =
+ connection.execute(new Request("sql", "select * from foo..."));
+// OR
+Future<ResultSetGroup> futureResultSetGroup =
+ connection.executeAsync(new Request("sql", "select * from foo..."));
+```
+
+Queries can also use a `PreparedStatement` to escape query parameters:
+
+```java
+PreparedStatement statement =
+ connection.prepareStatement(new Request("sql", "select * from foo where a = ?"));
+statement.setString(1, "bar");
+
+ResultSetGroup resultSetGroup = statement.execute();
+// OR
+Future<ResultSetGroup> futureResultSetGroup = statement.executeAsync();
+```
+
+Results can be obtained with the various get methods in the first ResultSet, obtained through the getResultSet(int) method:
+
+```java
+Request request = new Request("sql", "select foo, bar from baz where quux = 'quuux'");
+ResultSetGroup resultSetGroup = connection.execute(request);
+ResultSet resultTableResultSet = pinotResultSetGroup.getResultSet(0);
+
+for (int i = 0; i < resultSet.getRowCount(); ++i) {
+ System.out.println("foo: " + resultSet.getString(i, 0));
+ System.out.println("bar: " + resultSet.getInt(i, 1));
+}
+```
+
+<Alert type="info"> The examples for the sections below this note, are for querying the PQL endpoint, which is deprecated and will be deleted soon. For more information about the 2 endpoints, visit [Querying Pinot](../../user-guide/query-pinot.md).</Alert>
+
+If queryFormat pql is used in the Request, there are some differences in how the results can be accessed, depending on the query.
+In the case of aggregation, each aggregation function is within its own ResultSet. A query with multiple aggregation function will return one result set per aggregation function, as they are computed in parallel.
+
+```java
+ResultSetGroup resultSetGroup =
+ connection.execute(new Request("pql", "select max(foo), min(foo) from bar"));
+
+System.out.println("Number of result groups:" +
+ resultSetGroup.getResultSetCount(); // 2, min(foo) and max(foo)
+ResultSet resultSetMax = resultSetGroup.getResultSet(0);
+System.out.println("Max foo: " + resultSetMax.getInt(0));
+ResultSet resultSetMin = resultSetGroup.getResultSet(1);
+System.out.println("Min foo: " + resultSetMin.getInt(0));
+```
+
+In case of aggregation group by, there will be as many ResultSets as the number of aggregations, each of which will contain multiple results grouped by a group key.
+
+```java
+ResultSetGroup resultSetGroup =
+ connection.execute(
+ new Request("pql", "select min(foo), max(foo) from bar group by baz"));
+
+System.out.println("Number of result groups:" +
+ resultSetGroup.getResultSetCount(); // 2, min(foo) and max(foo)
+
+ResultSet minResultSet = resultSetGroup.getResultSet(0);
+for(int i = 0; i < minResultSet.length(); ++i) {
+ System.out.println("Minimum foo for " + minResultSet.getGroupKeyString(i, 1) +
+ ": " + minResultSet.getInt(i));
+}
+
+ResultSet maxResultSet = resultSetGroup.getResultSet(1);
+for(int i = 0; i < maxResultSet.length(); ++i) {
+ System.out.println("Maximum foo for " + maxResultSet.getGroupKeyString(i, 1) +
+ ": " + maxResultSet.getInt(i));
+}
+```
diff --git a/website-builder/docs/user-guide/pql.md b/website-builder/docs/user-guide/pql.md
new file mode 100644
index 0000000..554b89d
--- /dev/null
+++ b/website-builder/docs/user-guide/pql.md
@@ -0,0 +1,254 @@
+---
+title: PQL
+sidebar_label: PQL
+description: Pinot Query Language
+---
+
+import Alert from '@site/src/components/Alert';
+
+PQL is a derivative of SQL derivative that supports selection, projection, aggregation, grouping aggregation. There is no support for Joins or Subqueries. Specifically, for Pinot:
+
+- Aggregations are computed in parallel
+- Results of aggregations with large amounts of group keys (>1M) are approximated
+
+## PQL Limitations
+
+PQL is only a derivative of SQL, and it does not support Joins nor Subqueries. In order to support them, we suggest to rely on [PrestoDB](https://prestodb.io/), although Subqueries are not completely supported by PrestoDB at the moment of writing.
+
+## PQL Examples
+
+The Pinot Query Language (PQL) is very similar to standard SQL:
+
+```sql
+SELECT COUNT(*) FROM myTable
+```
+
+### Aggregation
+
+```sql
+SELECT COUNT(*), MAX(foo), SUM(bar) FROM myTable
+```
+
+### Grouping on Aggregation
+
+```sql
+SELECT MIN(foo), MAX(foo), SUM(foo), AVG(foo) FROM myTable
+ GROUP BY bar, baz LIMIT 50
+```
+
+### Ordering on Aggregation
+
+```sql
+SELECT MIN(foo), MAX(foo), SUM(foo), AVG(foo) FROM myTable
+ GROUP BY bar, baz
+ ORDER BY bar, MAX(foo) DESC LIMIT 50
+```
+
+### Filtering
+
+```sql
+SELECT COUNT(*) FROM myTable
+ WHERE foo = 'foo'
+ AND bar BETWEEN 1 AND 20
+ OR (baz < 42 AND quux IN ('hello', 'goodbye') AND quuux NOT IN (42, 69))
+```
+
+### Selection (Projection)
+
+```sql
+SELECT * FROM myTable
+ WHERE quux < 5
+ LIMIT 50
+```
+
+### Ordering on Selection
+
+```sql
+SELECT foo, bar FROM myTable
+ WHERE baz > 20
+ ORDER BY bar DESC
+ LIMIT 100
+```
+
+### Pagination on Selection
+
+Note: results might not be consistent if column ordered by has same value in multiple rows.
+
+```sql
+SELECT foo, bar FROM myTable
+ WHERE baz > 20
+ ORDER BY bar DESC
+ LIMIT 50, 100
+```
+
+### Wild-card match (in WHERE clause only)
+
+To count rows where the column `airlineName` starts with U
+
+```sql
+SELECT count(*) FROM SomeTable
+ WHERE regexp_like(airlineName, '^U.*')
+ GROUP BY airlineName TOP 10
+```
+
+### UDF
+
+As of now, functions have to be implemented within Pinot. Injecting functions is not allowed yet. The example below demonstrate the use of UDFs. More examples in Transform Function in Aggregation Grouping
+
+```sql
+SELECT count(*) FROM myTable
+ GROUP BY timeConvert(timeColumnName, 'SECONDS', 'DAYS')
+```
+
+### BYTES column
+
+Pinot supports queries on BYTES column using HEX string. The query response also uses hex string to represent bytes value.
+E.g. the query below fetches all the rows for a given UID.
+
+```sql
+SELECT * FROM myTable
+ WHERE UID = "c8b3bce0b378fc5ce8067fc271a34892"
+```
+
+## PQL Specification
+
+### SELECT
+
+The select statement is as follows
+
+```sql
+SELECT <outputColumn> (, outputColumn, outputColumn,...)
+ FROM <tableName>
+ (WHERE ... | GROUP BY ... | ORDER BY ... | TOP ... | LIMIT ...)
+```
+
+`outputColumn` can be `*` to project all columns, columns (`foo`, `bar`, `baz`) or aggregation functions like (`MIN(foo), MAX(bar), AVG(baz)`).
+
+### Supported aggregations on single-value columns
+
+- COUNT
+- MIN
+- MAX
+- SUM
+- AVG
+- MINMAXRANGE
+- DISTINCT
+- DISTINCTCOUNT
+- DISTINCTCOUNTHLL
+- DISTINCTCOUNTRAWHLL: Returns HLL response serialized as string. The serialized HLL can be converted back into an HLL (see pinot-core/**/HllUtil.java as an example) and then aggregated with other HLLs. A common use case may be to merge HLL responses from different Pinot tables, or to allow aggregation after client-side batching.
+FASTHLL (WARN: will be deprecated soon. FASTHLL stores serialized HyperLogLog in String format, which performs worse than DISTINCTCOUNTHLL, which supports serialized HyperLogLog in BYTES (byte array) format)
+- PERCENTILE[0-100]: e.g. PERCENTILE5, PERCENTILE50, PERCENTILE99, etc.
+- PERCENTILEEST[0-100]: e.g. PERCENTILEEST5, PERCENTILEEST50, PERCENTILEEST99, etc.
+
+### Supported aggregations on multi-value columns
+
+- COUNTMV
+- MINMV
+- MAXMV
+- SUMMV
+- AVGMV
+- MINMAXRANGEMV
+- DISTINCTCOUNTMV
+- DISTINCTCOUNTHLLMV
+- DISTINCTCOUNTRAWHLLMV: Returns HLL response serialized as string. The serialized HLL can be converted back into an HLL (see pinot-core/**/HllUtil.java as an example) and then aggregated with other HLLs. A common use case may be to merge HLL responses from different Pinot tables, or to allow aggregation after client-side batching.
+- FASTHLLMV (WARN: will be deprecated soon. It does not make lots of sense to configure serialized HyperLogLog column as a dimension)
+- PERCENTILE[0-100]MV: e.g. PERCENTILE5MV, PERCENTILE50MV, PERCENTILE99MV, etc.
+- PERCENTILEEST[0-100]MV: e.g. PERCENTILEEST5MV, PERCENTILEEST50MV, PERCENTILEEST99MV, etc.
+
+### WHERE
+
+Supported predicates are comparisons with a constant using the standard SQL operators (`=, <, <=, >, >=, <>, '!='`) , range comparisons using `BETWEEN (foo BETWEEN 42 AND 69)`, set membership (`foo IN (1, 2, 4, 8)`) and exclusion (foo NOT IN (1, 2, 4, 8)). For `BETWEEN`, the range is inclusive.
+
+Comparison with a regular expression is supported using the regexp_like function, as in `WHERE regexp_like(columnName, 'regular expression')`
+
+### GROUP BY
+
+The GROUP BY clause groups aggregation results by a list of columns, or transform functions on columns (see below)
+
+### ORDER BY
+
+The ORDER BY clause orders selection results or group by results by a list of columns. PQL supports ordering DESC or ASC.
+
+### TOP
+
+The TOP n clause causes the 'n' largest group results to be returned. If not specified, the top 10 groups are returned.
+
+### LIMIT
+
+The LIMIT n clause causes the selection results to contain at most 'n' results. The LIMIT a, b clause paginate the selection results from the 'a' th results and return at most 'b' results.
+
+## Transform Function in Aggregation and Grouping
+
+In aggregation and grouping, each column can be transformed from one or multiple columns. For example, the following query will calculate the maximum value of column foo divided by column bar grouping on the column time converted from time unit MILLISECONDS to SECONDS:
+
+```sql
+SELECT MAX(DIV(foo, bar) FROM myTable
+ GROUP BY TIMECONVERT(time, 'MILLISECONDS', 'SECONDS')
+```
+
+### Supported transform functions
+
+| Functions | Decription |
+|---|---|
+| ADD | Sum of at least two values |
+| SUB | Difference between two values |
+| MULT | Product of at least two values |
+| DIV | Quotient of two values |
+| TIMECONVERT | Takes 3 arguments, converts the value into another time unit. <br /> Examples - `TIMECONVERT(time, 'MILLISECONDS', 'SECONDS')` - This expression converts the value of column `time` (taken to be in milliseconds) to the nearest seconds (i.e. the nearest seconds that is lower than the value of `date` column) <br /> <br /> Takes 4 arguments, converts the value into another date time format, and buckets time based on the given time granularity. <br /> <br /> `DATETIMECONVERT( [...]
+| DATETIMECONVERT | Format is expressed as `<time size>:<time unit>:<time format>:<pattern>` <br /> where: <br /> `time size` - size of the time unit eg: 1, 10 <br /> `time unit` - HOURS, DAYS etc <br /> `time format` - EPOCH or SIMPLE_DATE_FORMAT <br /> `pattern` - this is defined in case of SIMPLE_DATE_FORMAT. eg: yyyyMMdd. A specific timezone can be passed using tz(timezone) <br /> `timezone` - can be expressed as long form tz(Asia/Kolkata), or short form tz(IST) or in terms of GMT t [...]
+| DATETRUNC | (Presto) SQL compatible date truncation, equivalent to the Presto function date_trunc. Takes at least 3 and upto 5 arguments, converts the value into a specified output granularity seconds since UTC epoch that is bucketed on a unit in a specified timezone. Examples DATETRUNC('week', time_in_seconds, 'SECONDS') This expression converts the column time_in_seconds, which is a long containing seconds since UTC epoch truncated at WEEK (where a Week starts at Monday UTC midnight) [...]
+| VALUEIN | Takes at least 2 arguments, where the first argument is a multi-valued column, and the following arguments are constant values. The transform function will filter the value from the multi-valued column with the given constant values. The `VALUEIN` transform function is especially useful when the same multi-valued column is both filtering column and grouping column. <br /><br /> Examples <br /> `VALUEIN(mvColumn, 3, 5, 15)`|
+
+## Differences with SQL
+
+<Alert type="info"> These differences only apply to the PQL endpoint. They do not hold true for the standard-SQL endpoint, which is the recommended endpoint. <br />
+More information about the two types of endpoints in Querying Pinot.. </Alert>
+
+- TOP works like LIMIT for truncation in group by queries
+- No need to select the columns to group with.
+The following two queries are both supported in PQL, where the non-aggregation columns are ignored.
+
+```sql
+SELECT MIN(foo), MAX(foo), SUM(foo), AVG(foo) FROM mytable
+ GROUP BY bar, baz
+ TOP 50
+
+SELECT bar, baz, MIN(foo), MAX(foo), SUM(foo), AVG(foo) FROM mytable
+ GROUP BY bar, baz
+ TOP 50
+```
+
+- The results will always order by the aggregated value (descending).
+The results for query
+
+```sql
+SELECT MIN(foo), MAX(foo) FROM myTable
+ GROUP BY bar
+ TOP 50
+```
+
+will be the same as the combining results from the following queries
+
+```sql
+SELECT MIN(foo) FROM myTable
+ GROUP BY bar
+ TOP 50
+SELECT MAX(foo) FROM myTable
+ GROUP BY bar
+ TOP 50
+```
+
+where we don't put the results for the same group together.
+
+- No support for **ORDER BY** in aggregation group by. However, ORDER BY support was added recently and is available in the standard-SQL endpoint. It can be used in the PQL endpoint by passing `queryOptions` into the payload as follows
+
+```sql
+{
+ "pql" : "SELECT SUM(foo), SUM(bar) from myTable GROUP BY moo ORDER BY SUM(bar) ASC, moo DESC TOP 10",
+ "queryOptions" : "groupByMode=sql;responseFormat=sql"
+}
+```
+
+where:
+- `groupByMode=sql` - standard sql way of execution group by, hence accepting order by
+- `responseFormat=sql` - standard sql way of displaying results, in a tabular manner
\ No newline at end of file
diff --git a/website-builder/docs/user-guide/query-pinot.md b/website-builder/docs/user-guide/query-pinot.md
new file mode 100644
index 0000000..8af9710
--- /dev/null
+++ b/website-builder/docs/user-guide/query-pinot.md
@@ -0,0 +1,77 @@
+---
+title: Querying Pinot
+sidebar_label: query-pinot
+description: Ways to query Pinot
+---
+
+import Alert from '@site/src/components/Alert';
+import Tabs from '@theme/Tabs';
+import TabItem from '@theme/TabItem';
+
+## REST API on the Broker
+
+Pinot can be queried via a broker endpoint as follows. This example assumes broker is running on `localhost:8099`
+
+<Tabs
+ block={true}
+ defaultValue="Standard-SQL endpoint"
+ urlKey="arch"
+ values={[{"label":"Standard-SQL endpoint","value":"Standard-SQL endpoint"},{"label":"PQL endpoint","value":"PQL endpoint"}]}>
+
+<TabItem value="Standard-SQL endpoint">
+
+The Pinot REST API can be accessed by invoking POST operation with a JSON body containing the parameter sql to the `/query/sql` endpoint on a broker.
+
+```sql
+$ curl -H "Content-Type: application/json" -X POST \
+ -d '{"sql":"select foo, count(*) from myTable group by foo limit 100"}' \
+ http://localhost:8099/query/sql
+```
+
+</TabItem>
+
+<TabItem value="PQL endpoint">
+
+<Alert type="info"> This endpoint is deprecated, and will soon be removed. The standard-SQL endpoint is the recommended endpoint.
+</Alert>
+
+The PQL endpoint can be accessed by invoking POST operation with a JSON body containing the parameter pql to the `/query` endpoint on a broker.
+
+```sql
+$ curl -H "Content-Type: application/json" -X POST \
+ -d '{"pql":"select count(*) from myTable group by foo top 100"}' \
+ http://localhost:8099/query
+```
+
+</TabItem>
+
+</Tabs>
+
+## Query Console
+
+Query Console can be used for running ad-hoc queries (checkbox available to query the PQL endpoint). The Query Console can be accessed by entering the `<controller host>:<controller port>` in your browser
+
+
+
+### pinot-admin
+
+You can also query using the pinot-admin scripts. Make sure you follow instructions in Getting Pinot to get Pinot locally, and then
+
+```bash
+cd incubator-pinot/pinot-tools/target/pinot-tools-pkg
+bin/pinot-admin.sh PostQuery \
+ -queryType sql \
+ -brokerPort 8000 \
+ -query "select count(*) from baseballStats"
+
+2020/03/04 12:46:33.459 INFO [PostQueryCommand] [main] Executing command: PostQuery -brokerHost localhost -brokerPort 8000 -queryType sql -query select count(*) from baseballStats
+2020/03/04 12:46:33.854 INFO [PostQueryCommand] [main] Result: {"resultTable":{"dataSchema":{"columnDataTypes":["LONG"],"columnNames":["count(*)"]},"rows":[[97889]]},"exceptions":[],"numServersQueried":1,"numServersResponded":1,"numSegmentsQueried":1,"numSegmentsProcessed":1,"numSegmentsMatched":1,"numConsumingSegmentsQueried":0,"numDocsScanned":97889,"numEntriesScannedInFilter":0,"numEntriesScannedPostFilter":0,"numGroupsLimitReached":false,"totalDocs":97889,"timeUsedMs":185,"segmentSta [...]
+```
+
+## Pinot Clients
+
+Here's a list of the clients available to query Pinot from your application
+
+- [Java client](../../docs/user-guide/clients/golang.md)
+- [Go client](../../docs/user-guide/clients/java.md)
+- Coming soon - JDBC client
diff --git a/website-builder/docs/user-guide/response-format.md b/website-builder/docs/user-guide/response-format.md
new file mode 100644
index 0000000..1665293
--- /dev/null
+++ b/website-builder/docs/user-guide/response-format.md
@@ -0,0 +1,381 @@
+---
+title: Response Format
+sidebar_label: rest
+description: REST Response Format
+---
+
+import Alert from '@site/src/components/Alert';
+import Tabs from '@theme/Tabs';
+import TabItem from '@theme/TabItem';
+
+## Standard-SQL response
+
+Response is returned in a SQL-like tabular structure. Note, this is the response returned from the standard-SQL endpoint. For PQL endpoint response, skip to [PQL endpoint response](../../docs/user-guide/response-format.md)
+
+<Tabs
+ block={true}
+ defaultValue="Aggregations"
+ urlKey="arch"
+ values={[{"label":"Selections","value":"Selections"},{"label":"Aggregations","value":"Aggregations"},{"label":"GroupBy","value":"GroupBy"}]}>
+
+<TabItem value="Selections">
+
+```sql
+$ curl -H "Content-Type: application/json" -X POST \
+ -d '{"sql":"SELECT moo, bar, foo FROM myTable ORDER BY foo DESC"}' \
+ http://localhost:8099/query/sql
+{
+ "exceptions": [],
+ "minConsumingFreshnessTimeMs": 0,
+ "numConsumingSegmentsQueried": 0,
+ "numDocsScanned": 6,
+ "numEntriesScannedInFilter": 0,
+ "numEntriesScannedPostFilter": 18,
+ "numGroupsLimitReached": false,
+ "numSegmentsMatched": 2,
+ "numSegmentsProcessed": 2,
+ "numSegmentsQueried": 2,
+ "numServersQueried": 1,
+ "numServersResponded": 1,
+ "resultTable": {
+ "dataSchema": {
+ "columnDataTypes": [
+ "LONG",
+ "INT",
+ "STRING"
+ ],
+ "columnNames": [
+ "moo",
+ "bar",
+ "foo"
+ ]
+ },
+ "rows": [
+ [
+ 40015,
+ 2019,
+ "xyz"
+ ],
+ [
+ 1002,
+ 2001,
+ "pqr"
+ ],
+ [
+ 20555,
+ 1988,
+ "pqr"
+ ],
+ [
+ 203,
+ 2010,
+ "pqr"
+ ],
+ [
+ 500,
+ 2008,
+ "abc"
+ ],
+ [
+ 60,
+ 2003,
+ "abc"
+ ]
+ ]
+ },
+ "segmentStatistics": [],
+ "timeUsedMs": 4,
+ "totalDocs": 6,
+ "traceInfo": {}
+}
+```
+
+</TabItem>
+
+<TabItem value="Aggregations">
+
+```sql
+$ curl -X POST \
+ -d '{"sql":"SELECT SUM(moo), MAX(bar), COUNT(*) FROM myTable"}' \
+ localhost:8099/query/sql -H "Content-Type: application/json"
+{
+ "exceptions": [],
+ "minConsumingFreshnessTimeMs": 0,
+ "numConsumingSegmentsQueried": 0,
+ "numDocsScanned": 6,
+ "numEntriesScannedInFilter": 0,
+ "numEntriesScannedPostFilter": 12,
+ "numGroupsLimitReached": false,
+ "numSegmentsMatched": 2,
+ "numSegmentsProcessed": 2,
+ "numSegmentsQueried": 2,
+ "numServersQueried": 1,
+ "numServersResponded": 1,
+ "resultTable": {
+ "dataSchema": {
+ "columnDataTypes": [
+ "DOUBLE",
+ "DOUBLE",
+ "LONG"
+ ],
+ "columnNames": [
+ "sum(moo)",
+ "max(bar)",
+ "count(*)"
+ ]
+ },
+ "rows": [
+ [
+ 62335,
+ 2019.0,
+ 6
+ ]
+ ]
+ },
+ "segmentStatistics": [],
+ "timeUsedMs": 87,
+ "totalDocs": 6,
+ "traceInfo": {}
+}
+```
+
+</TabItem>
+
+<TabItem value="GroupBy">
+
+```sql
+$ curl -X POST \
+ -d '{"sql":"SELECT SUM(moo), MAX(bar) FROM myTable GROUP BY foo ORDER BY foo"}' \
+ localhost:8099/query/sql -H "Content-Type: application/json"
+{
+ "exceptions": [],
+ "minConsumingFreshnessTimeMs": 0,
+ "numConsumingSegmentsQueried": 0,
+ "numDocsScanned": 6,
+ "numEntriesScannedInFilter": 0,
+ "numEntriesScannedPostFilter": 18,
+ "numGroupsLimitReached": false,
+ "numSegmentsMatched": 2,
+ "numSegmentsProcessed": 2,
+ "numSegmentsQueried": 2,
+ "numServersQueried": 1,
+ "numServersResponded": 1,
+ "resultTable": {
+ "dataSchema": {
+ "columnDataTypes": [
+ "STRING",
+ "DOUBLE",
+ "DOUBLE"
+ ],
+ "columnNames": [
+ "foo",
+ "sum(moo)",
+ "max(bar)"
+ ]
+ },
+ "rows": [
+ [
+ "abc",
+ 560.0,
+ 2008.0
+ ],
+ [
+ "pqr",
+ 21760.0,
+ 2010.0
+ ],
+ [
+ "xyz",
+ 40015.0,
+ 2019.0
+ ]
+ ]
+ },
+ "segmentStatistics": [],
+ "timeUsedMs": 15,
+ "totalDocs": 6,
+ "traceInfo": {}
+}
+```
+
+</TabItem>
+
+</Tabs>
+
+where:
+
+| Response Field | Description |
+| --------- | --------- |
+| resultTable | This contains everything needed to process the response |
+| resultTable.dataSchema | This describes schema of the response (columnNames and their dataTypes) |
+| resultTable.dataSchema.columnNames | columnNames in the response. |
+| resultTable.dataSchema.columnDataTypes | DataTypes for each column |
+| resultTable.rows | Actual content with values. This is an array of arrays. number of rows depends on the limit value in the query. The number of columns in each row is equal to the length of (resultTable.dataSchema.columnNames) |
+| timeUsedms | Total time taken as seen by the broker before sending the response back to the client |
+| totalDocs | This is number of documents/records in the table |
+| numServersQueried | represents the number of servers queried by the broker (note that this may be less than the total number of servers since broker can apply some optimizations to minimize the number of servers) |
+| numServersResponded | This should be equal to the numServersQueried. If this is not the same, then one of more servers might have timed out. If numServersQueried != numServersResponded the results can be considered partial and clients can retry the query with exponential back off. |
+| numSegmentsQueried | Total number of segmentsQueried for this query. it may be less than the total number of segments since broker can apply optimizations. |
+| numSegmentsMatched | This is the number of segments actually processed. This indicates the effectiveness of pruning logic (based on partitioning, time etc). |
+| numSegmentsProcessed | Actual number of segments that were processed. This is where the majority of the time is spent. |
+| numDocScanned | The number of docs/records that were scanned to process the query. This includes the docs scanned in filter phase (this can be zero if columns in query are indexed) and post filter. |
+| numEntriesScannedInFilter | This along with numEntriesScannedInPostFilter should give an idea on where most of the time is spent during query processing. If this is high, enabling indexing for columns in tableConfig can be one way to bring it down. |
+| numEntriesScannedPostFilter | This along with numEntriesScannedInPostFilter should give an idea on where most of the time is spent during query processing. A high number for this means the selectivity is low (i.e. pinot needs to scan a lot of records to answer the query). If this is high, adding regular inverted/bitmap index will not help. However, consider using start-tree index. |
+| numGroupsLimitReached | If the query has group by clause and top K, pinot drops new entries after the numGroupsLimit is reached. If this boolean is set to true then the query result may not be accurate. Note that the default value for numGroupsLimit is 100k and should be sufficient for most use cases. |
+| exceptions | Will contain the stack trace if there is any exception processing the query.
+| segmentStatistics | N/A |
+| traceInfo | If trace is enabled (can be enabled for each query), this will contain the timing for each stage and each segment. Advanced feature and intended for dev/debugging purposes |
+
+## PQL response
+
+<Alert type="info"> PQL endpoint is deprecated, and will soon be removed. The standard sql endpoint is the recommended endpoint..
+</Alert>
+
+The response received from PQL endpoint is different depending on the type of the query.
+
+<Tabs
+ block={true}
+ defaultValue="Aggregations"
+ urlKey="arch"
+ values={[{"label":"Selections","value":"Selections"},{"label":"Aggregations","value":"Aggregations"},{"label":"GroupBy","value":"GroupBy"}]}>
+
+<TabItem value="Selections">
+
+```sql
+curl -X POST \
+ -d '{"pql":"select * from flights limit 3"}' \
+ http://localhost:8099/query
+
+
+{
+ "selectionResults":{
+ "columns":[
+ "Cancelled",
+ "Carrier",
+ "DaysSinceEpoch",
+ "Delayed",
+ "Dest",
+ "DivAirports",
+ "Diverted",
+ "Month",
+ "Origin",
+ "Year"
+ ],
+ "results":[
+ [
+ "0",
+ "AA",
+ "16130",
+ "0",
+ "SFO",
+ [],
+ "0",
+ "3",
+ "LAX",
+ "2014"
+ ],
+ [
+ "0",
+ "AA",
+ "16130",
+ "0",
+ "LAX",
+ [],
+ "0",
+ "3",
+ "SFO",
+ "2014"
+ ],
+ [
+ "0",
+ "AA",
+ "16130",
+ "0",
+ "SFO",
+ [],
+ "0",
+ "3",
+ "LAX",
+ "2014"
+ ]
+ ]
+ },
+ "traceInfo":{},
+ "numDocsScanned":3,
+ "aggregationResults":[],
+ "timeUsedMs":10,
+ "segmentStatistics":[],
+ "exceptions":[],
+ "totalDocs":102
+}
+```
+
+</TabItem>
+
+<TabItem value="Aggregations">
+
+```sql
+curl -X POST \
+ -d '{"pql":"select count(*) from flights"}' \
+ http://localhost:8099/query
+
+
+{
+ "traceInfo":{},
+ "numDocsScanned":17,
+ "aggregationResults":[
+ {
+ "function":"count_star",
+ "value":"17"
+ }
+ ],
+ "timeUsedMs":27,
+ "segmentStatistics":[],
+ "exceptions":[],
+ "totalDocs":17
+}
+```
+
+</TabItem>
+
+<TabItem value="GroupBy">
+
+```sql
+curl -X POST \
+ -d '{"pql":"select count(*) from flights group by Carrier"}' \
+ http://localhost:8099/query
+
+
+{
+ "traceInfo":{},
+ "numDocsScanned":23,
+ "aggregationResults":[
+ {
+ "groupByResult":[
+ {
+ "value":"10",
+ "group":["AA"]
+ },
+ {
+ "value":"9",
+ "group":["VX"]
+ },
+ {
+ "value":"4",
+ "group":["WN"]
+ }
+ ],
+ "function":"count_star",
+ "groupByColumns":["Carrier"]
+ }
+ ],
+ "timeUsedMs":47,
+ "segmentStatistics":[],
+ "exceptions":[],
+ "totalDocs":23
+}
+```
+
+</TabItem>
+
+</Tabs>
diff --git a/website-builder/docs/user-guide/rest-admin-interface.md b/website-builder/docs/user-guide/rest-admin-interface.md
new file mode 100644
index 0000000..9de0c8c
--- /dev/null
+++ b/website-builder/docs/user-guide/rest-admin-interface.md
@@ -0,0 +1,7 @@
+---
+title: Rest Admin Inerface
+sidebar_label: rest-admin-interface
+description: Pinot Rest Admin Interface
+---
+
+## TODO
\ No newline at end of file
diff --git a/website-builder/docusaurus.config.js b/website-builder/docusaurus.config.js
new file mode 100755
index 0000000..bb75508
--- /dev/null
+++ b/website-builder/docusaurus.config.js
@@ -0,0 +1,196 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements. See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership. The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+module.exports = {
+ title: 'Apache Pinot™ (Incubating)',
+ tagline: 'Realtime distributed OLAP datastore',
+ url: 'https://pinot.apache.org',
+ baseUrl: '/',
+ favicon: 'img/favicon.ico',
+ organizationName: 'apache',
+ projectName: 'pinot',
+ onBrokenLinks: 'ignore',
+ themeConfig: {
+ navbar: {
+ hideOnScroll: true,
+ logo: {
+ alt: 'Pinot',
+ src: 'img/pinot-navbar-logo-722f37.svg',
+ },
+ items: [
+ {to: 'https://docs.pinot.apache.org/', label: 'Docs', position: 'right'},
+ {to: '/download', label: 'Download', position: 'right'},
+ {to: 'https://docs.pinot.apache.org/community-1/blogs', label: 'Blog', position: 'right'},
+ {
+ href: 'https://github.com/apache/incubator-pinot',
+ label: 'GitHub',
+ position: 'right',
+ },
+ ],
+ },
+ colorMode: {
+ defaultMode: "dark",
+ disableSwitch: false,
+ respectPrefersColorScheme: true,
+ switchConfig: {
+ darkIcon: "🌙",
+ darkIconStyle: {
+ marginLeft: "2px",
+ },
+ lightIcon: "☀️",
+ lightIconStyle: {
+ marginLeft: "2px",
+ },
+ },
+ },
+ prism: {
+ theme: require("prism-react-renderer/themes/dracula"),
+ darkTheme: require("prism-react-renderer/themes/dracula"),
+ },
+ footer: {
+ style: 'light',
+ links: [
+ {
+ title: 'About',
+ items: [
+ {
+ label: 'What is Pinot?',
+ to: 'https://docs.pinot.apache.org/',
+ },
+ {
+ label: 'Components',
+ to: 'https://docs.pinot.apache.org/pinot-components',
+ },
+ {
+ label: 'Architecture',
+ to: 'https://docs.pinot.apache.org/basics/architecture',
+ },
+ {
+ label: 'Plugins Architecture',
+ to: 'https://docs.pinot.apache.org/plugins/plugin-architecture',
+ },
+ ],
+ },
+ {
+ title: 'Components',
+ items: [
+ {
+ label: 'Presto',
+ to: 'https://docs.pinot.apache.org/integrations/presto',
+ },
+ {
+ label: 'Superset',
+ to: 'https://docs.pinot.apache.org/integrations/superset',
+ },
+ {
+ label: 'ThirdEye',
+ to: 'https://docs.pinot.apache.org/integrations/thirdeye',
+ }
+ ],
+ },
+ {
+ title: 'Docs',
+ items: [
+ {
+ label: 'Getting Started',
+ to: 'https://docs.pinot.apache.org/getting-started',
+ },
+ {
+ label: 'Pinot Components',
+ to: 'https://docs.pinot.apache.org/pinot-components',
+ },
+ {
+ label: 'User Guide',
+ to: 'https://docs.pinot.apache.org/users',
+ },
+ {
+ label: 'Administration',
+ to: 'https://docs.pinot.apache.org/operating-pinot',
+ },
+ ],
+ },
+ {
+ title: 'Community',
+ items: [
+ {
+ label: 'Slack',
+ to: 'https://communityinviter.com/apps/apache-pinot/apache-pinot',
+ },
+ {
+ label: 'Github',
+ to: 'https://github.com/apache/incubator-pinot',
+ },
+ {
+ label: 'Twitter',
+ to: 'https://twitter.com/ApachePinot',
+ },
+ {
+ label: 'Mailing List',
+ to: 'mailto:dev-subscribe@pinot.apache.org?Subject=SubscribeToPinot',
+ },
+ ],
+ },
+ ],
+ logo: {
+ alt: 'Apache Pinot™ - Incubating',
+ src: 'img/logo.svg',
+ href: 'https://pinot.apache.org/',
+ },
+ copyright: `Copyright © ${new Date().getFullYear()} The Apache Software Foundation.`,
+ },
+ googleAnalytics: {
+ trackingID: 'UA-157446650-1',
+ },
+ algolia: {
+ apiKey: 'f3cde09979e469ad62eaea4e115c21ea',
+ indexName: 'apache_pinot',
+ algoliaOptions: {}, // Optional, if provided by Algolia
+ },
+ },
+ plugins: [
+ [
+ '@docusaurus/plugin-ideal-image',
+ {
+ quality: 70,
+ max: 1030, // max resized image's size.
+ min: 640, // min resized image's size. if original is lower, use that size.
+ steps: 2, // the max number of images generated between min and max (inclusive)
+ },
+ ],
+ ],
+ presets: [
+ [
+ '@docusaurus/preset-classic',
+ {
+ docs: {
+ editUrl: 'https://github.com/apache/incubator-pinot/edit/master/website/',
+ // Sidebars filepath relative to the website dir.
+ sidebarPath: require.resolve('./sidebars.js'),
+ },
+ theme: {
+ customCss: require.resolve('./src/css/custom.css'),
+ },
+ },
+ ],
+ ],
+ scripts: [],
+ stylesheets: [
+ 'https://fonts.googleapis.com/css?family=Ubuntu|Roboto|Source+Code+Pro',
+ 'https://at-ui.github.io/feather-font/css/iconfont.css',
+ ],
+};
diff --git a/website-builder/package.json b/website-builder/package.json
new file mode 100755
index 0000000..46f602e
--- /dev/null
+++ b/website-builder/package.json
@@ -0,0 +1,67 @@
+{
+ "name": "website",
+ "version": "0.0.1",
+ "private": true,
+ "scripts": {
+ "docusaurus": "docusaurus",
+ "start": "docusaurus start",
+ "build": "docusaurus build",
+ "swizzle": "docusaurus swizzle",
+ "deploy": "docusaurus deploy",
+ "serve": "docusaurus serve",
+ "lint": "prettier --write src",
+ "lint-check": "prettier --check 'src/**/*'"
+ },
+ "dependencies": {
+ "@docusaurus/core": "2.0.0-alpha.64",
+ "@docusaurus/plugin-ideal-image": "2.0.0-alpha.64",
+ "@docusaurus/preset-classic": "2.0.0-alpha.64",
+ "@docusaurus/utils": "2.0.0-alpha.64",
+ "axios": "^0.19.2",
+ "cash-dom": "^8.0.0",
+ "classnames": "^2.2.6",
+ "color": "^3.1.2",
+ "d3-timer": "^1.0.10",
+ "dateformat": "^3.0.3",
+ "humanize-string": "^2.1.0",
+ "now": "^19.2.0",
+ "pluralize": "^8.0.0",
+ "prismjs": "^1.20.0",
+ "qs": "^6.9.4",
+ "react": "^16.13.1",
+ "react-dom": "^16.13.1",
+ "react-player": "^2.6.2",
+ "react-github-btn": "^1.2.0",
+ "react-inlinesvg": "^1.2.0",
+ "react-select": "^3.1.0",
+ "reading-time": "^1.2.0",
+ "strftime": "^0.10.0",
+ "svg.js": "^2.7.1"
+ },
+ "devDependencies": {
+ "@docusaurus/module-type-aliases": "^2.0.0-alpha.64",
+ "@types/react": "^16.9.49",
+ "add": "2.0.6",
+ "prettier": "2.0.5",
+ "typescript": "^4.0.2",
+ "yarn": "^1.22.10"
+ },
+ "resolutions": {
+ "**/sharp": "^0.25.2"
+ },
+ "prettier": {
+ "tabWidth": 4
+ },
+ "browserslist": {
+ "production": [
+ ">0.2%",
+ "not dead",
+ "not op_mini all"
+ ],
+ "development": [
+ "last 1 chrome version",
+ "last 1 firefox version",
+ "last 1 safari version"
+ ]
+ }
+}
diff --git a/website-builder/scripts/build-site.sh b/website-builder/scripts/build-site.sh
new file mode 100755
index 0000000..dc15ec1
--- /dev/null
+++ b/website-builder/scripts/build-site.sh
@@ -0,0 +1,36 @@
+#!/bin/bash
+#
+# Licensed to the Apache Software Foundation (ASF) under one
+# or more contributor license agreements. See the NOTICE file
+# distributed with this work for additional information
+# regarding copyright ownership. The ASF licenses this file
+# to you under the Apache License, Version 2.0 (the
+# "License"); you may not use this file except in compliance
+# with the License. You may obtain a copy of the License at
+#
+# http://www.apache.org/licenses/LICENSE-2.0
+#
+# Unless required by applicable law or agreed to in writing,
+# software distributed under the License is distributed on an
+# "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+# KIND, either express or implied. See the License for the
+# specific language governing permissions and limitations
+# under the License.
+#
+
+ROOT_DIR=$(git rev-parse --show-toplevel)
+
+VERSION=0.30
+
+set -x -e
+
+cd ${ROOT_DIR}/website-builder
+npm install yarn
+yarn install
+yarn run build
+
+rm -rf ${ROOT_DIR}/content
+
+## copy generated site
+cp -R build/ ${ROOT_DIR}/content/
+
diff --git a/website-builder/scripts/publish_site.sh b/website-builder/scripts/publish_site.sh
new file mode 100644
index 0000000..9b3a87c
--- /dev/null
+++ b/website-builder/scripts/publish_site.sh
@@ -0,0 +1,51 @@
+#!/bin/bash
+#
+# Licensed to the Apache Software Foundation (ASF) under one
+# or more contributor license agreements. See the NOTICE file
+# distributed with this work for additional information
+# regarding copyright ownership. The ASF licenses this file
+# to you under the Apache License, Version 2.0 (the
+# "License"); you may not use this file except in compliance
+# with the License. You may obtain a copy of the License at
+#
+# http://www.apache.org/licenses/LICENSE-2.0
+#
+# Unless required by applicable law or agreed to in writing,
+# software distributed under the License is distributed on an
+# "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+# KIND, either express or implied. See the License for the
+# specific language governing permissions and limitations
+# under the License.
+#
+
+set -e
+
+ROOT_DIR=$(git rev-parse --show-toplevel)
+WORK_DIR=${ROOT_DIR}/build
+ME=`basename $0`
+echo "Basename $ME"
+
+# ORIGIN_REPO=$(git remote show origin | grep 'Push URL' | awk -F// '{print $NF}')
+ORIGIN_REPO="https://github.com/apache/incubator-pinot-site"
+echo "ORIGIN_REPO: $ORIGIN_REPO"
+
+SITE_TMP=/tmp/pinot-site
+(
+
+ cd $ROOT_DIR
+ rm -rf $SITE_TMP
+ mkdir $SITE_TMP
+ cd $SITE_TMP
+
+ git clone "https://$GH_TOKEN@$ORIGIN_REPO" .
+ git config user.name "Pinot Site Updater"
+ git config user.email "dev@pinot.apache.org"
+ git checkout asf-master
+
+ # Clean content directory
+ rm -rf $SITE_TMP/content/
+ mkdir $SITE_TMP/content
+
+ # Copy the generated directory to asf folder
+ cp -r $WORK_DIR/* $SITE_TMP/content
+)
\ No newline at end of file
diff --git a/website-builder/sidebars.js b/website-builder/sidebars.js
new file mode 100755
index 0000000..14807d3
--- /dev/null
+++ b/website-builder/sidebars.js
@@ -0,0 +1,73 @@
+/**
+ * Copyright (c) 2017-present, Facebook, Inc.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+ module.exports = {
+ docs: [
+ {
+ type: 'category',
+ label: 'About',
+ items: [
+ "about/what_is_pinot",
+ "about/features_of_pinot",
+ "about/who_use_pinot"
+ ],
+ },
+ {
+ type: 'category',
+ label: 'Administration',
+ items: [
+ "administration/running_locally",
+ {
+ type: 'category',
+ label: 'Installation',
+ items: [
+ {
+ type: 'category',
+ label: 'Containers',
+ items: [
+ "administration/installation/containers/docker",
+ ],
+ },
+ {
+ type: 'category',
+ label: 'Cloud',
+ items: [
+ "administration/installation/cloud/on-premise",
+ "administration/installation/cloud/aws",
+ "administration/installation/cloud/gcp",
+ "administration/installation/cloud/azure"
+ ],
+ },
+ {
+ type: 'category',
+ label: 'Operating Systems',
+ items: [
+ "administration/installation/operating-systems/macos",
+ "administration/installation/operating-systems/ubuntu",
+ ],
+ },
+ ],
+ },
+ ],
+ },
+ {
+ type: 'category',
+ label: 'Components',
+ items: [
+ "components/broker",
+ "components/cluster",
+ "components/controller",
+ "components/minion",
+ "components/schema",
+ "components/segments",
+ "components/server",
+ "components/tables",
+ "components/tenants",
+ ],
+ }
+ ]
+};
diff --git a/website-builder/src/components/Alert/index.js b/website-builder/src/components/Alert/index.js
new file mode 100644
index 0000000..e3c6ca0
--- /dev/null
+++ b/website-builder/src/components/Alert/index.js
@@ -0,0 +1,65 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements. See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership. The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+import React from "react";
+import classnames from "classnames";
+
+import "./styles.css";
+
+function Alert({ children, classNames, fill, icon, type }) {
+ let typeIcon = null;
+
+ switch (type) {
+ case "danger":
+ typeIcon = "alert-triangle";
+ break;
+
+ case "success":
+ typeIcon = "check-circle";
+ break;
+
+ case "warning":
+ typeIcon = "alert-triangle";
+ break;
+
+ default:
+ typeIcon = "info";
+ }
+
+ return (
+ <div
+ className={classnames(classNames, "alert", `alert--${type}`, {
+ "alert--fill": fill,
+ "alert--icon": icon !== false,
+ })}
+ role="alert"
+ >
+ {icon !== false && (
+ <i
+ className={classnames(
+ "feather",
+ `icon-${icon || typeIcon}`
+ )}
+ ></i>
+ )}
+ {children}
+ </div>
+ );
+}
+
+export default Alert;
diff --git a/website-builder/src/components/Alert/styles.css b/website-builder/src/components/Alert/styles.css
new file mode 100644
index 0000000..9fadad6
--- /dev/null
+++ b/website-builder/src/components/Alert/styles.css
@@ -0,0 +1,65 @@
+/**
+ * base
+ */
+
+.alert {
+ background: var(--ifm-panel-background) !important;
+ border: 0px none;
+ border-left: 6px solid var(--ifm-alert-background-color);
+ border-radius: 0;
+ font-size: 95%;
+ font-weight: 500;
+ margin-bottom: calc(var(--ifm-spacing-vertical) * 2);
+}
+
+.alert > i.feather {
+ float: left;
+ font-size: 2em !important;
+ margin-left: -1.65em;
+ position: relative;
+ top: -2px;
+}
+
+.alert a,
+.alert code {
+ color: var(--ifm-alert-background-color);
+}
+
+.alert.alert--icon {
+ padding-left: 5em;
+}
+
+.alert > *:last-child,
+.alert > ul:last-child > li:last-child {
+ margin-bottom: 0;
+}
+
+/**
+ * fill
+ */
+
+.alert.alert--fill.alert--danger {
+ background: rgba(var(--ifm-color-danger-rgb), 0.15) !important;
+ border: 1px solid var(--ifm-color-danger);
+ color: var(--ifm-color-danger) !important;
+}
+.alert.alert--fill.alert--primary {
+ background: rgba(var(--ifm-color-primary-rgb), 0.15) !important;
+ border: 1px solid var(--ifm-color-primary);
+ color: var(--ifm-color-primary) !important;
+}
+.alert.alert--fill.alert--warning {
+ background: rgba(var(--ifm-color-warning-rgb), 0.15) !important;
+ border: 1px solid var(--ifm-color-warning);
+ color: var(--ifm-color-warning) !important;
+}
+.alert.alert--fill a {
+ color: inherit;
+ text-decoration: underline;
+}
+.alert.alert--fill a code {
+ color: inherit;
+}
+.alert.alert--fill code {
+ color: inherit;
+}
diff --git a/website-builder/src/components/BlogPostTags/index.js b/website-builder/src/components/BlogPostTags/index.js
new file mode 100644
index 0000000..0fb2119
--- /dev/null
+++ b/website-builder/src/components/BlogPostTags/index.js
@@ -0,0 +1,49 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements. See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership. The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+import React from "react";
+
+import Link from "@docusaurus/Link";
+
+import classnames from "classnames";
+import { enrichTags } from "@site/src/exports/tags";
+import styles from "./styles.module.css";
+
+function BlogPostTags({ tags, valuesOnly }) {
+ const enrichedTags = enrichTags(tags);
+
+ return (
+ <div className={styles.tags}>
+ {enrichedTags.map((tag, idx) => (
+ <Link
+ key={idx}
+ to={tag.permalink + "/"}
+ className={classnames(
+ "badge",
+ "badge--rounded",
+ `badge--${tag.style}`
+ )}
+ >
+ {valuesOnly ? tag.value : tag.label}
+ </Link>
+ ))}
+ </div>
+ );
+}
+
+export default BlogPostTags;
diff --git a/website-builder/src/components/BlogPostTags/styles.module.css b/website-builder/src/components/BlogPostTags/styles.module.css
new file mode 100644
index 0000000..96c692f
--- /dev/null
+++ b/website-builder/src/components/BlogPostTags/styles.module.css
@@ -0,0 +1,3 @@
+.tags a {
+ margin-right: 5px;
+}
diff --git a/website-builder/src/components/Changelog/index.js b/website-builder/src/components/Changelog/index.js
new file mode 100644
index 0000000..f17a26b
--- /dev/null
+++ b/website-builder/src/components/Changelog/index.js
@@ -0,0 +1,214 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements. See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership. The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+import React, { useState } from "react";
+
+import CheckboxList from "@site/src/components/CheckboxList";
+import Heading from "@theme/Heading";
+import Link from "@docusaurus/Link";
+
+import _ from "lodash";
+import { commitTypeName, sortCommitTypes } from "@site/src/exports/commits";
+import pluralize from "pluralize";
+
+const AnchoredH3 = Heading("h3");
+const AnchoredH4 = Heading("h4");
+
+function Commit({ commit, setSearchTerm }) {
+ return (
+ <div className="section">
+ <div className="badges">
+ {commit.breaking_change && (
+ <span className="badge badge--danger">
+ <i className="feather icon-alert-triangle"></i> breaking
+ </span>
+ )}
+ {commit.pr_number && (
+ <span
+ className="badge badge--secondary"
+ style={{ minWidth: "65px", textAlign: "center" }}
+ >
+ <a
+ href={`https://github.com/apache/incubator-pinot/pull/${commit.pr_number}`}
+ target="_blank"
+ >
+ <i className="feather icon-git-pull-request"></i>{" "}
+ {commit.pr_number}
+ </a>
+ </span>
+ )}
+ {!commit.pr_number && (
+ <span
+ className="badge badge--secondary"
+ style={{ minWidth: "65px", textAlign: "center" }}
+ >
+ <a
+ href={`https://github.com/apache/incubator-pinot/commit/${commit.sha}`}
+ target="_blank"
+ >
+ <i className="feather icon-git-commit"></i>{" "}
+ {commit.sha.slice(0, 5)}
+ </a>
+ </span>
+ )}
+ </div>
+ <AnchoredH4 id={commit.sha}>
+ <span
+ className="badge badge--primary badge--small link"
+ onClick={() => setSearchTerm(commit.scope.name)}
+ >
+ {commit.scope.name}
+ </span>
+
+ {commit.description}
+ </AnchoredH4>
+ </div>
+ );
+}
+
+function Commits({ commits, groupBy, setSearchTerm }) {
+ if (groupBy) {
+ const groupedCommits = _(commits)
+ .sortBy((commit) => commit.scope.name)
+ .groupBy(groupBy)
+ .value();
+ const groupKeys = sortCommitTypes(Object.keys(groupedCommits));
+
+ return (
+ <div className="section-list">
+ {groupKeys.map((groupKey, catIdx) => (
+ <div className="section" key={catIdx}>
+ <AnchoredH3 id={groupKey}>
+ {pluralize(
+ commitTypeName(groupKey),
+ groupedCommits[groupKey].length,
+ true
+ )}
+ </AnchoredH3>
+ <div className="section-list section-list--compact section-list--hover">
+ {groupedCommits[groupKey].map(
+ (commit, commitIdx) => (
+ <Commit
+ key={commitIdx}
+ commit={commit}
+ setSearchTerm={setSearchTerm}
+ />
+ )
+ )}
+ </div>
+ </div>
+ ))}
+ </div>
+ );
+ } else {
+ return <div>{commits.length}</div>;
+ }
+}
+
+function Changelog(props) {
+ const { commits } = props;
+
+ const [groupBy, setGroupBy] = useState("type");
+ const [onlyTypes, setOnlyTypes] = useState(
+ new Set(["enhancement", "feat", "fix", "perf"])
+ );
+ const [searchTerm, setSearchTerm] = useState(null);
+
+ let filteredCommits = commits.slice(0);
+
+ if (searchTerm) {
+ filteredCommits = filteredCommits.filter((commit) =>
+ commit.message.toLowerCase().includes(searchTerm.toLowerCase())
+ );
+ }
+
+ if (onlyTypes.size > 0) {
+ filteredCommits = filteredCommits.filter((commit) =>
+ onlyTypes.has(commit.type)
+ );
+
+ if (onlyTypes.has("breaking change")) {
+ filteredCommits = filteredCommits.filter(
+ (commit) => commit.breaking_change
+ );
+ }
+ }
+
+ //
+ // Filter Options
+ //
+
+ const types = new Set(
+ _(commits)
+ .map((commit) => commit.group)
+ .uniq()
+ .compact()
+ .sort()
+ .value()
+ );
+
+ //
+ // Render
+ //
+
+ return (
+ <div>
+ {commits.length > 1 ? (
+ <div className="filters">
+ <div className="search">
+ <span className="search--result-count">
+ {filteredCommits.length} items
+ </span>
+ <input
+ type="text"
+ onChange={(event) =>
+ setSearchTerm(event.currentTarget.value)
+ }
+ placeholder="🔍 Search..."
+ value={searchTerm || ""}
+ />
+ </div>
+ <div className="filter">
+ <div className="filter--choices">
+ <CheckboxList
+ values={types}
+ currentState={onlyTypes}
+ setState={setOnlyTypes}
+ />
+ </div>
+ </div>
+ </div>
+ ) : null}
+ {filteredCommits.length > 0 ? (
+ <Commits
+ commits={filteredCommits}
+ groupBy={groupBy}
+ setSearchTerm={setSearchTerm}
+ types={types}
+ />
+ ) : (
+ <div className="empty">
+ <div className="icon">☹</div>
+ <div>No commits found</div>
+ </div>
+ )}
+ </div>
+ );
+}
+
+export default Changelog;
diff --git a/website-builder/src/components/CheckboxList/index.js b/website-builder/src/components/CheckboxList/index.js
new file mode 100644
index 0000000..75f34a5
--- /dev/null
+++ b/website-builder/src/components/CheckboxList/index.js
@@ -0,0 +1,70 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements. See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership. The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+import React from "react";
+
+import humanizeString from "humanize-string";
+
+import "./styles.css";
+
+function CheckboxList({ humanize, icon, values, currentState, setState }) {
+ if (values.size == 0) return null;
+
+ let valuesArr = Array.from(values);
+
+ return (
+ <>
+ {valuesArr.map((value, idx) => {
+ let label =
+ typeof value === "string" && humanize
+ ? humanizeString(value)
+ : value;
+
+ return (
+ <label key={idx}>
+ <input
+ type="checkbox"
+ onChange={(event) => {
+ let newValues = new Set(currentState);
+
+ if (event.currentTarget.checked)
+ newValues.add(value);
+ else newValues.delete(value);
+
+ setState(newValues);
+ }}
+ checked={currentState.has(value)}
+ />
+ {label && (
+ <>
+ {icon ? (
+ <i className={`feather icon-${icon}`}></i>
+ ) : (
+ ""
+ )}{" "}
+ {label}
+ </>
+ )}
+ </label>
+ );
+ })}
+ </>
+ );
+}
+
+export default CheckboxList;
diff --git a/website-builder/src/components/CheckboxList/styles.css b/website-builder/src/components/CheckboxList/styles.css
new file mode 100644
index 0000000..e69de29
diff --git a/website-builder/src/components/CodeHeader/index.js b/website-builder/src/components/CodeHeader/index.js
new file mode 100644
index 0000000..8334507
--- /dev/null
+++ b/website-builder/src/components/CodeHeader/index.js
@@ -0,0 +1,42 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements. See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership. The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+import React from "react";
+
+import "./styles.css";
+
+function CodeHeader({ fileName, links }) {
+ let linkElements = [];
+
+ for (var link in links) {
+ linkElements.push(
+ <a href={link.href}>{link.text || "Learn more…"}</a>
+ );
+ }
+
+ return (
+ <div className="code-header">
+ {linkElements.length > 0 && (
+ <span className="code-header--links">{linkElements}</span>
+ )}
+ {fileName}
+ </div>
+ );
+}
+
+export default CodeHeader;
diff --git a/website-builder/src/components/CodeHeader/styles.css b/website-builder/src/components/CodeHeader/styles.css
new file mode 100644
index 0000000..6a0ee70
--- /dev/null
+++ b/website-builder/src/components/CodeHeader/styles.css
@@ -0,0 +1,17 @@
+.code-header {
+ background: var(--ifm-color-emphasis-50);
+ border-top-left-radius: var(--ifm-global-radius);
+ border-top-right-radius: var(--ifm-global-radius);
+ color: var(--ifm-color-emphasis-400);
+ font-size: 0.8rem;
+ padding: 2px 8px;
+}
+
+.code-header + div[class^="mdxCodeBlock_"] pre {
+ border-top-left-radius: 0;
+ border-top-right-radius: 0;
+}
+
+.code-header .learn-more {
+ float: right;
+}
diff --git a/website-builder/src/components/Field/index.js b/website-builder/src/components/Field/index.js
new file mode 100644
index 0000000..4ea1573
--- /dev/null
+++ b/website-builder/src/components/Field/index.js
@@ -0,0 +1,270 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements. See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership. The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+import React, { useState } from "react";
+import classnames from "classnames";
+import { MDXProvider } from "@mdx-js/react";
+import CodeHeader from "@site/src/components/CodeHeader";
+import CodeBlock from "@theme/CodeBlock";
+
+function isObject(a) {
+ return !!a && a.constructor === Object;
+}
+
+function toTOML(value) {
+ return JSON.stringify(value);
+}
+
+function keyToTOML(key) {
+ if (key.includes(".")) {
+ return '"' + key + '"';
+ } else {
+ return key;
+ }
+}
+
+function exampleToTOML(name, example) {
+ if (isObject(example)) {
+ if ("name" in example && "value" in example) {
+ return `${keyToTOML(example.name)} = ${toTOML(example.value)}`;
+ } else {
+ return `${keyToTOML(Object.keys(example)[0])} = ${toTOML(
+ Object.values(example)[0]
+ )}`;
+ }
+ } else if (name) {
+ return `${name} = ${toTOML(example)}`;
+ } else {
+ return `${toTOML(example)}`;
+ }
+}
+
+function Enum({ values }) {
+ let elements = [];
+
+ if (!Array.isArray(values)) {
+ for (var key in values) {
+ elements.push(
+ <code key={key} title={values[key]}>
+ {toTOML(key)}
+ </code>
+ );
+ elements.push(" ");
+ }
+ } else {
+ for (var index in values) {
+ let value = values[index];
+ elements.push(<code key={value}>{toTOML(value)}</code>);
+ elements.push(" ");
+ }
+ }
+
+ return elements;
+}
+
+function Example({ name, path, unit, value }) {
+ let unitText = "";
+
+ if (unit) {
+ unitText = <> ({unit})</>;
+ }
+
+ return (
+ <>
+ <code>{exampleToTOML(null, value)}</code>
+ {unitText}
+ </>
+ );
+}
+
+function Examples({ name, path, values }) {
+ let code = "";
+
+ values.forEach(function (value) {
+ code += exampleToTOML(name, value) + "\n";
+ });
+
+ if (path) {
+ code = `[${path}]\n${code}`;
+ }
+
+ return (
+ <div>
+ <CodeHeader fileName="pinot.toml" />
+
+ <CodeBlock className="language-toml">{code}</CodeBlock>
+ </div>
+ );
+}
+
+function Groups({ values }) {
+ let elements = [];
+
+ values.forEach(function (value) {
+ elements.push(<code key={value}>{value}</code>);
+ elements.push(" ");
+ });
+
+ return elements;
+}
+
+function RelevantWhen({ value }) {
+ let relKey = Object.keys(value)[0];
+ let relValue = Object.values(value)[0];
+
+ if (relValue == "") {
+ relValue = null;
+ }
+
+ return (
+ <span>
+ <code>
+ <a href={`#${relKey}`}>{relKey}</a>
+ </code>{" "}
+ = <code>{toTOML(relValue)}</code>
+ </span>
+ );
+}
+
+// function FieldFooter({defaultValue, enumValues, examples, groups, name, path, relevantWhen, required, unit}) {
+// const [showExamples, setShowExamples] = useState(false);
+
+// if (defaultValue || enumValues || (examples && examples.length > 0) || (groups && groups.length > 0)) {
+// return (
+// <div className="info">
+// {relevantWhen ?
+// <div>Only {required ? 'required' : 'relevant'} when: <RelevantWhen value={relevantWhen} /></div> :
+// null}
+// {defaultValue !== undefined ?
+// (defaultValue ?
+// <div>Default: <Example name={name} path={path} value={defaultValue} unit={unit} /></div> :
+// <div>No default</div>) :
+// null}
+// {enumValues ?
+// <div>Enum, must be one of: <Enum values={enumValues} /></div> :
+// null}
+// <div>
+// <div className="show-more" onClick={() => setShowExamples(!showExamples)}>
+// {showExamples ? "Hide examples" : "View examples"}
+// </div>
+// {showExamples && <div className="examples"><Examples name={name} path={path} values={examples} /></div>}
+// </div>
+// </div>
+// );
+// } else {
+// return null;
+// }
+// }
+
+function Field({
+ children,
+ common,
+ defaultValue,
+ enumValues,
+ examples,
+ groups,
+ name,
+ path,
+ relevantWhen,
+ templateable,
+ type,
+ unit,
+ required,
+}) {
+ const [collapse, setCollapse] = useState(false);
+
+ let filteredChildren = children;
+
+ if (collapse) {
+ filteredChildren = filteredChildren.filter(
+ (child) => child.props.originalType != "p"
+ );
+ }
+
+ return (
+ <div
+ className={classnames(
+ "field",
+ "section",
+ required ? "field-required" : "",
+ collapse ? "field-collapsed" : ""
+ )}
+ required={required}
+ >
+ <div className="badges">
+ {groups &&
+ groups.map((group, idx) => (
+ <span key={idx} className="badge badge--secondary">
+ {group}
+ </span>
+ ))}
+ {templateable && (
+ <span
+ className="badge badge--primary"
+ title="This option is dynamic and accepts the Pinot template syntax"
+ >
+ templateable
+ </span>
+ )}
+ <span className="badge badge--secondary">
+ {type}
+ {unit && <> ({unit})</>}
+ </span>
+ {enumValues && Object.keys(enumValues).length > 0 && (
+ <span
+ className="badge badge--secondary"
+ title="This option is an enumation and only allows specific values"
+ >
+ enum
+ </span>
+ )}
+ {common && (
+ <span
+ className="badge badge--primary"
+ title="This is a popular that we recommend for getting started"
+ >
+ common
+ </span>
+ )}
+ {required ? (
+ <span className="badge badge--danger">
+ required{relevantWhen && "*"}
+ </span>
+ ) : (
+ <span className="badge badge--secondary">optional</span>
+ )}
+ </div>
+ {filteredChildren}
+ {!collapse && type != "table" && (
+ <FieldFooter
+ defaultValue={defaultValue}
+ enumValues={enumValues}
+ examples={examples}
+ groups={groups}
+ name={name}
+ path={path}
+ relevantWhen={relevantWhen}
+ required={required}
+ unit={unit}
+ />
+ )}
+ </div>
+ );
+}
+
+export default Field;
diff --git a/website-builder/src/components/Fields/index.js b/website-builder/src/components/Fields/index.js
new file mode 100644
index 0000000..3c8b6dd
--- /dev/null
+++ b/website-builder/src/components/Fields/index.js
@@ -0,0 +1,141 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements. See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership. The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+import React, { useState } from "react";
+
+import CheckboxList from "@site/src/components/CheckboxList";
+
+import _ from "lodash";
+
+import "./styles.css";
+
+function Fields({ children, filters }) {
+ const [onlyCommon, setOnlyCommon] = useState(false);
+ const [onlyGroups, setOnlyGroups] = useState(new Set());
+ const [onlyRequired, setOnlyRequired] = useState(false);
+ const [searchTerm, setSearchTerm] = useState(null);
+
+ let childrenArray = [];
+
+ if (children) {
+ childrenArray = Array.isArray(children) ? children : [children];
+ }
+
+ let commonRelevant = childrenArray.some((child) => child.props.common);
+ let groups = _(childrenArray)
+ .flatMap((child) => child.props.groups)
+ .uniq()
+ .value();
+ let requiredRelevant = childrenArray.some((child) => child.props.required);
+ let filteredChildren = childrenArray;
+
+ if (onlyCommon) {
+ filteredChildren = filteredChildren.filter(
+ (child) => child.props.common
+ );
+ }
+
+ if (onlyGroups.size > 0) {
+ filteredChildren = filteredChildren.filter((child) =>
+ Array.from(onlyGroups).every((group) =>
+ child.props.groups.includes(group)
+ )
+ );
+ }
+
+ if (onlyRequired) {
+ filteredChildren = filteredChildren.filter(
+ (child) => child.props.required
+ );
+ }
+
+ if (searchTerm) {
+ filteredChildren = filteredChildren.filter((child) =>
+ child.props.name.toLowerCase().includes(searchTerm.toLowerCase())
+ );
+ }
+
+ return (
+ <div className="fields">
+ {childrenArray.length > 1 && filters !== false ? (
+ <div className="filters">
+ <span className="result-count">
+ {filteredChildren.length} items
+ </span>
+ <div className=" search">
+ <input
+ type="text"
+ onChange={(event) =>
+ setSearchTerm(event.currentTarget.value)
+ }
+ placeholder="🔍 Search..."
+ />
+ </div>
+ <div className="checkboxes">
+ <CheckboxList
+ values={groups}
+ currentState={onlyGroups}
+ setState={setOnlyGroups}
+ />
+ {commonRelevant && (
+ <label title="Only show popular/common results">
+ <input
+ type="checkbox"
+ onChange={(event) =>
+ setOnlyCommon(
+ event.currentTarget.checked
+ )
+ }
+ checked={onlyCommon}
+ />
+ common only
+ </label>
+ )}
+ {requiredRelevant && (
+ <label title="Only show required results">
+ <input
+ type="checkbox"
+ onChange={(event) =>
+ setOnlyRequired(
+ event.currentTarget.checked
+ )
+ }
+ checked={onlyRequired}
+ />
+ required only
+ </label>
+ )}
+ </div>
+ </div>
+ ) : null}
+ <div className="section-list">
+ {!Array.isArray(filteredChildren) ||
+ filteredChildren.length > 0 ? (
+ filteredChildren
+ ) : (
+ <div className="empty">
+ <div className="icon">☹</div>
+ <div>No fields found</div>
+ </div>
+ )}
+ </div>
+ </div>
+ );
+}
+
+export default Fields;
diff --git a/website-builder/src/components/Fields/styles.css b/website-builder/src/components/Fields/styles.css
new file mode 100644
index 0000000..64c12eb
--- /dev/null
+++ b/website-builder/src/components/Fields/styles.css
@@ -0,0 +1,31 @@
+.fields .filters {
+ color: var(--ifm-color-emphasis-300);
+ margin-bottom: var(--ifm-spacing-vertical);
+}
+
+.fields .filters .checkboxes {
+ font-size: 0.9em;
+ padding: calc(var(--ifm-spacing-vertical) / 2) var(--ifm-spacing-horizontal);
+}
+
+.fields .filters .checkboxes label {
+ margin-right: 1em;
+}
+
+.fields .filters .checkboxes label input {
+ margin-right: 0.5em;
+}
+
+.fields .filters .result-count {
+ float: right;
+ font-size: 0.9em;
+ line-height: 1;
+ margin-bottom: -1em;
+ margin-right: var(--ifm-spacing-horizontal);
+ position: relative;
+ top: 0.75em;
+}
+
+.fields .filters .search input {
+ width: 100%;
+}
diff --git a/website-builder/src/components/Jump/index.js b/website-builder/src/components/Jump/index.js
new file mode 100644
index 0000000..af9a56f
--- /dev/null
+++ b/website-builder/src/components/Jump/index.js
@@ -0,0 +1,65 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements. See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership. The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+import React from "react";
+
+import Link from "@docusaurus/Link";
+
+import classnames from "classnames";
+
+import "./styles.css";
+
+function Jump({ children, className, badge, icon, size, target, to }) {
+ let classes = classnames("jump-to", `jump-to--${size}`, className);
+
+ let content = (
+ <div className="jump-to--inner">
+ <div className="jump-to--inner-2">
+ <div className="jump-to--main">
+ {badge ? (
+ <span className="badge badge--primary badge--right">
+ {badge}
+ </span>
+ ) : (
+ ""
+ )}
+ {children}
+ </div>
+ <div className="jump-to--right">
+ <i
+ className={`feather icon-${
+ icon || "chevron-right"
+ } arrow`}
+ ></i>
+ </div>
+ </div>
+ </div>
+ );
+
+ return target ? (
+ <a href={to} target={target} className={classes}>
+ {content}
+ </a>
+ ) : (
+ <Link to={to} className={classes}>
+ {content}
+ </Link>
+ );
+}
+
+export default Jump;
diff --git a/website-builder/src/components/Jump/styles.css b/website-builder/src/components/Jump/styles.css
new file mode 100644
index 0000000..cbf7d6c
--- /dev/null
+++ b/website-builder/src/components/Jump/styles.css
@@ -0,0 +1,109 @@
+/*
+ * Structure
+ */
+
+.jump-to {
+ background: var(--ifm-panel-background);
+ border: 1px solid var(--ifm-panel-border-color);
+ border-radius: var(--ifm-global-radius);
+ box-shadow: var(--ifm-panel-box-shadow);
+ color: var(--ifm-font-base-color);
+ display: block;
+ font-weight: 500;
+ margin-bottom: var(--ifm-spacing-vertical);
+ text-align: left;
+ transition: var(--ifm-transition-fast) ease;
+}
+.jump-to--inner {
+ border-radius: var(--ifm-global-radius);
+ transition: var(--ifm-transition-fast) ease;
+}
+.jump-to--inner-2 {
+ border-radius: var(--ifm-global-radius);
+ display: flex;
+ padding: 1em var(--ifm-spacing-horizontal);
+ transition: var(--ifm-transition-fast) ease;
+}
+.jump-to--main {
+ flex: 1 1;
+ vertical-align: center;
+}
+.jump-to--main .badge--right {
+ float: right;
+ margin-top: 3px;
+}
+.jump-to--right {
+ font-size: 1.8em !important;
+ line-height: 1;
+ margin: 0 10px;
+ transition: var(--ifm-transition-fast) ease;
+ width: 30px;
+}
+.jump-to:hover {
+ background: var(--ifm-panel-background-active);
+ border-color: var(--ifm-color-primary);
+ box-shadow: var(--ifm-panel-box-shadow-active);
+ text-decoration: none;
+}
+.jump-to:hover .jump-to--right {
+ margin-right: 0;
+}
+
+/*
+ * Variations
+ */
+
+.jump-to.jump-to--sm {
+ font-size: 0.8em;
+}
+
+.jump-to.jump-to--primary {
+ background: rgba(var(--ifm-color-primary-rgb), 0.2);
+}
+
+.jump-to.jump-to--highlight {
+ animation: gradientBG 5s ease-in infinite;
+ background-image: var(--ifm-highlight-gradient);
+ background-size: 150% 150%;
+ border: 0px none;
+ font-weight: 600;
+ padding: 1px;
+}
+.jump-to.jump-to--highlight .jump-to--inner {
+ background: rgba(var(--ifm-background-color-rgb), 0.85);
+ color: var(--ifm-background-color);
+}
+.jump-to.jump-to--highlight .jump-to--inner-2 {
+ animation: gradientBG 5s ease-in infinite;
+ background-image: var(--ifm-highlight-gradient);
+ background-size: 150% 150%;
+ background-clip: text;
+ color: var(--ifm-color-emphasis-700);
+}
+.jump-to.jump-to--highlight:hover {
+ box-shadow: none;
+}
+.jump-to.jump-to--highlight:hover .jump-to--inner {
+ background: none;
+}
+.jump-to.jump-to--highlight:hover .jump-to--inner-2 {
+ color: var(--ifm-background-color);
+}
+.jump-to.jump-to--highlight:hover span.badge {
+ background: var(--ifm-background-color);
+ color: var(--ifm-color-primary);
+}
+
+/*
+ * Elements
+ */
+
+.jump-to small {
+ opacity: 0.75;
+}
+
+.jump-to span.badge.badge--category {
+ font-size: 0.8em;
+ line-height: 1em;
+ text-transform: uppercase;
+}
diff --git a/website-builder/src/components/Step/index.js b/website-builder/src/components/Step/index.js
new file mode 100644
index 0000000..56e9798
--- /dev/null
+++ b/website-builder/src/components/Step/index.js
@@ -0,0 +1,27 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements. See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership. The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+import React from "react";
+
+import "./styles.css";
+
+function Step({ children }) {
+ return <li className="step">{children}</li>;
+}
+
+export default Step;
diff --git a/website-builder/src/components/Step/styles.css b/website-builder/src/components/Step/styles.css
new file mode 100644
index 0000000..e69de29
diff --git a/website-builder/src/components/Steps/index.js b/website-builder/src/components/Steps/index.js
new file mode 100644
index 0000000..b67ef93
--- /dev/null
+++ b/website-builder/src/components/Steps/index.js
@@ -0,0 +1,27 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements. See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership. The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+import React from "react";
+
+import "./styles.css";
+
+function Steps({ children, type }) {
+ return <ol className="steps">{children}</ol>;
+}
+
+export default Steps;
diff --git a/website-builder/src/components/Steps/styles.css b/website-builder/src/components/Steps/styles.css
new file mode 100644
index 0000000..b7dc3e0
--- /dev/null
+++ b/website-builder/src/components/Steps/styles.css
@@ -0,0 +1,15 @@
+ol.steps {
+ border-left: 1px solid var(--ifm-hr-border-color);
+ list-style: disc;
+}
+
+ol.steps > li {
+ margin-left: calc(var(--ifm-list-left-padding) * -0.65);
+ margin-top: 0;
+ padding-bottom: calc(var(--ifm-spacing-vertical) * 2);
+}
+
+ol.steps > li > h3 {
+ background: var(--ifm-background-color);
+ padding-bottom: calc(var(--ifm-spacing-vertical) * 1.5);
+}
diff --git a/website-builder/src/css/custom.css b/website-builder/src/css/custom.css
new file mode 100644
index 0000000..c3989ff
--- /dev/null
+++ b/website-builder/src/css/custom.css
@@ -0,0 +1,1865 @@
+/**
+ * Root variables
+ *
+ * Override the default Infima variables here. These values cascade down to
+ * the rest of the elements.
+ *
+ * Note: The primary colors were generated with colorbox via:
+ *
+ * https://www.colorbox.io/#steps=6#hue_start=185#hue_end=200#hue_curve=easeInQuad#sat_start=48#sat_end=100#sat_curve=easeOutQuad#sat_rate=101#lum_start=100#lum_end=65#lum_curve=easeOutQuint#minor_steps_map=0
+ */
+:root {
+ --ifm-alert-color: var(--ifm-heading-color);
+ --ifm-background-color: white;
+ --ifm-background-color-rgb: 255, 255, 255;
+ --ifm-background-surface-color: var(--ifm-panel-background);
+ --ifm-badge-border-radius: 0.25em;
+ --ifm-blockquote-color: var(--ifm-color-primary-lighter);
+ --ifm-code-background: var(--ifm-color-emphasis-50);
+ --ifm-code-font-size: 85%;
+ --ifm-color-black: rgb(0, 27, 61);
+ --ifm-color-blue: #438fff;
+ --ifm-color-blue-rgb: 67, 143, 255;
+ --ifm-color-content: var(--ifm-color-emphasis-800);
+ --ifm-color-content-secondary: var(--ifm-color-emphasis-400);
+ --ifm-color-danger: #ff1178;
+ --ifm-color-danger-rgb: 255, 17, 120;
+ --ifm-color-gray-25: rgba(0, 27, 61, 0.025);
+ --ifm-color-gray-40: rgba(0, 27, 61, 0.04);
+ --ifm-color-gray-50: rgba(0, 27, 61, 0.05);
+ --ifm-color-gray-75: rgba(0, 27, 61, 0.075);
+ --ifm-color-gray-100: rgba(0, 27, 61, 0.1);
+ --ifm-color-gray-150: rgba(0, 27, 61, 0.15);
+ --ifm-color-gray-200: rgba(0, 27, 61, 0.2);
+ --ifm-color-gray-300: rgba(0, 27, 61, 0.3);
+ --ifm-color-gray-400: rgba(0, 27, 61, 0.4);
+ --ifm-color-gray-500: rgba(0, 27, 61, 0.5);
+ --ifm-color-gray-600: rgba(0, 27, 61, 0.6);
+ --ifm-color-gray-700: rgba(0, 27, 61, 0.7);
+ --ifm-color-gray-800: rgba(0, 27, 61, 0.8);
+ --ifm-color-gray-900: rgba(0, 27, 61, 0.9);
+ --ifm-color-emphasis-25: var(--ifm-color-gray-25);
+ --ifm-color-emphasis-40: var(--ifm-color-gray-40);
+ --ifm-color-emphasis-50: var(--ifm-color-gray-50);
+ --ifm-color-emphasis-75: var(--ifm-color-gray-75);
+ --ifm-color-pink: #f44af5;
+ --ifm-color-pink-rgb: 244, 74, 245;
+ --ifm-color-primary: #5170a4;
+ --ifm-color-primary-rgb: 40, 217, 242;
+ --ifm-color-primary-dark: #0fbce1;
+ --ifm-color-primary-darker: #0395c7;
+ --ifm-color-primary-darkest: #006ea6;
+ --ifm-color-primary-light: #51ebfb;
+ --ifm-color-primary-lighter: #6af0fd;
+ --ifm-color-primary-lightest: #83f5ff;
+ --ifm-color-secondary: var(--ifm-color-emphasis-100);
+ --ifm-color-success: #00ff7f;
+ --ifm-color-success-rgb: 0, 255, 127;
+ --ifm-color-warning-rgb: 255, 186, 0;
+ --ifm-contents-border-color: var(--ifm-color-emphasis-75);
+ --ifm-contents-padding-left: var(--ifm-spacing-horizontal);
+ --ifm-font-family-base: -apple-system, BlinkMacSystemFont, Roboto,
+ sans-serif;
+ --ifm-font-family-monospace: "Source Code Pro", Menlo, monospace;
+ --ifm-font-size-base: 16px;
+ --ifm-footer-background-color: var(--ifm-background-color);
+ --ifm-footer-padding-vertical: calc(var(--ifm-spacing-vertical) * 4);
+ --ifm-global-shadow-md: 0 3px 8px 0px var(--ifm-hr-border-color);
+ --ifm-h2-font-size: 2em;
+ --ifm-heading-color: #001b3d;
+ --ifm-heading-font-family: Ubuntu, var(--ifm-font-family-base);
+ --ifm-heading-margin-bottom: calc(var(--ifm-spacing-vertical) * 3);
+ --ifm-hero-background-color: var(--ifm-background-color);
+ --ifm-hero-text-color: var(--ifm-color-content);
+ --ifm-highlight-gradient: linear-gradient(
+ 150deg,
+ var(--ifm-color-primary) 5%,
+ var(--ifm-color-blue) 40%,
+ var(--ifm-color-pink) 90%
+ );
+ --ifm-highlight-gradient-20: linear-gradient(
+ 150deg,
+ var(--ifm-color-primary) 5%,
+ var(--ifm-color-blue) 95%
+ );
+ --ifm-hr-border-color: var(--ifm-contents-border-color);
+ --ifm-leading: calc(var(--ifm-leading-desktop) * 1em);
+ --ifm-line-height-base: 1.7;
+ --ifm-link-color: var(--ifm-color-primary-dark);
+ --ifm-menu-color: var(--ifm-color-emphasis-600);
+ --ifm-navbar-background-color: var(--ifm-background-color);
+ --ifm-navbar-link-color: var(--ifm-heading-color);
+ --ifm-panel-background: var(--ifm-background-color);
+ --ifm-panel-background-rgb: 249, 249, 250;
+ --ifm-panel-background-solid: #f9f9fa;
+ --ifm-panel-background-active: rgba(var(--ifm-color-primary-rgb), 0.2);
+ --ifm-panel-border-color: var(--ifm-hr-border-color);
+ --ifm-panel-border-color-active: var(--ifm-color-primary);
+ --ifm-panel-box-shadow: 0 0px 10px 0px var(--ifm-color-emphasis-50);
+ --ifm-panel-box-shadow-active: var(--ifm-panel-box-shadow);
+ --ifm-panel-color: var(--ifm-color-emphasis-800);
+ --ifm-panel-color-active: var(--ifm-link-color);
+ --ifm-pre-line-height: var(--ifm-line-height-base);
+ --ifm-sidebar-background: var(--ifm-background-color);
+ --ifm-sidebar-border-color: var(--ifm-hr-border-color);
+ --ifm-sidebar-width: 250px;
+ --ifm-table-stripe-background: var(--ifm-table-background);
+}
+
+@keyframes gradientBG {
+ 0% {
+ background-position: 0% 0%;
+ }
+ 50% {
+ background-position: 100% 100%;
+ }
+ 100% {
+ background-position: 0% 0%;
+ }
+}
+
+/**
+ * Base
+ *
+ * Base / foundational styling.
+ */
+
+html,
+body {
+ font-smoothing: antialiased;
+ text-size-adjust: 100%;
+ -ms-text-size-adjust: 100%;
+ -webkit-font-smoothing: antialiased;
+ -moz-osx-font-smoothing: grayscale;
+ -webkit-text-size-adjust: 100%;
+}
+
+@media screen and (min-width: 996px) {
+ html,
+ body {
+ text-rendering: optimizeLegibility;
+ }
+}
+
+li + li {
+ margin-top: 0;
+}
+
+.link {
+ cursor: pointer;
+}
+.link:not(.badge) {
+ color: var(--ifm-link-color);
+}
+.link:hover {
+ text-decoration: underline;
+}
+
+/**
+ * a
+ */
+
+a.text--warning:hover {
+ color: var(--ifm-color-warning);
+}
+a code {
+ color: var(--ifm-link-color);
+}
+
+/**
+ * article
+ */
+
+article header h1 {
+ font-size: 2em;
+}
+
+/**
+ * badge
+ */
+
+.badge {
+ background-clip: padding-box;
+ border-color: transparent;
+ box-sizing: border-box;
+}
+.badge.badge--blue {
+ --ifm-badge-background-color: rgba(var(--ifm-color-blue-rgb), 0.25);
+ --ifm-badge-color: var(--ifm-color-blue);
+}
+.badge.badge--danger {
+ --ifm-badge-background-color: rgba(var(--ifm-color-danger-rgb), 0.2);
+ --ifm-badge-color: var(--ifm-color-danger);
+}
+.badge.badge--highlight {
+ animation: gradientBG 5s ease-in infinite;
+ background-image: var(--ifm-highlight-gradient);
+ background-size: 150% 150%;
+ color: var(--ifm-background-color);
+}
+.badge.badge--pink {
+ --ifm-badge-background-color: rgba(var(--ifm-color-pink-rgb), 0.2);
+ --ifm-badge-color: var(--ifm-color-pink);
+}
+.badge.badge--primary {
+ --ifm-badge-background-color: rgba(var(--ifm-color-primary-rgb), 0.2);
+ --ifm-badge-color: var(--ifm-color-primary);
+}
+.badge.badge--rounded {
+ border-radius: 1em;
+}
+.badge.badge--secondary {
+ color: var(--ifm-color-emphasis-800);
+}
+.badge.badge--success {
+ --ifm-badge-background-color: rgba(var(--ifm-color-success-rgb), 0.5);
+ --ifm-badge-color: var(--ifm-color-success);
+}
+.badge.badge--warning {
+ --ifm-badge-background-color: rgba(var(--ifm-color-warning-rgb), 0.2);
+ --ifm-badge-color: var(--ifm-color-warning);
+}
+.badge a {
+ color: inherit;
+}
+a.badge:hover {
+ color: var(--ifm-badge-color);
+}
+
+/**
+ * blockquote
+ */
+
+blockquote {
+ border-left: 4px solid var(--ifm-hr-border-color);
+ color: var(--ifm-color-emphasis-400);
+ padding: 0 0 0 1.5rem;
+}
+
+/**
+ * button
+ */
+
+.button.button--primary {
+ --ifm-button-color: var(--ifm-background-color);
+}
+.button.button--highlight {
+ animation: gradientBG 5s ease-in infinite;
+ background-image: var(--ifm-highlight-gradient);
+ background-size: 150% 150%;
+ color: var(--ifm-background-color);
+}
+
+/**
+ * checks
+ *
+ * Generic list with checkmarks as list styles.
+ */
+
+ul.checks {
+ list-style: none;
+}
+ul.checks li > i.feather:first-child {
+ margin-left: -1.8em;
+ margin-right: 0.5em;
+}
+
+/**
+ * comparison
+ *
+ * Comparison table used in both the performance and correctness tables.
+ */
+
+table.comparison {
+ width: 100%;
+}
+table.comparison [title],
+table.comparison [title] {
+ text-decoration: underline;
+ text-decoration-style: dotted;
+}
+table.comparison th,
+table.comparison td,
+table.comparison tr {
+ border: 0px none;
+ white-space: nowrap;
+}
+table.comparison th {
+ padding-left: 0;
+ padding-right: 0;
+}
+table.comparison tr th.vector {
+ color: var(--ifm-color-primary);
+}
+table.comparison tr td {
+ border-left: 10px solid var(--ifm-background-color);
+ min-width: 90px;
+ text-align: center;
+}
+table.comparison tr td:first-child {
+ font-weight: bold;
+ padding-left: 0;
+ text-align: left;
+ white-space: nowrap;
+ width: 25%;
+}
+table.comparison tr td.description {
+ font-weight: normal;
+ min-width: 250px;
+ padding-top: 0;
+ vertical-align: top;
+ white-space: normal;
+}
+table.comparison tr td.description .label {
+ color: var(--ifm-heading-color);
+ font-weight: bold;
+}
+table.comparison tr td.description .text {
+ color: var(--ifm-color-emphasis-600);
+}
+table.comparison tr td.description .links {
+ font-size: 0.9em;
+ margin-top: var(--ifm-spacing-vertical);
+}
+table.comparison tr td.result {
+ background: var(--ifm-panel-background);
+}
+table.comparison tr:hover td.row-label,
+table.comparison tr:hover td.result {
+ background: var(--ifm-color-emphasis-25);
+}
+table.comparison tr td.result.failed {
+ color: var(--ifm-color-danger);
+}
+table.comparison tr td.result.lost {
+ background: var(--ifm-color-emphasis-1000);
+ color: var(--ifm-background-color);
+}
+table.comparison tr td.result.not-applicable {
+ background: var(--ifm-color-emphasis-1000);
+ color: rgba(var(--ifm-background-color-rgb), 0.5);
+}
+table.comparison tr td.result.passed {
+ color: var(--ifm-color-primary);
+}
+table.comparison tr td.result.warning {
+ color: var(--ifm-color-warning);
+}
+table.comparison tr td.result.passed.vector {
+ background: var(--ifm-color-primary);
+ color: var(--ifm-background-color);
+}
+table.comparison tr:hover td.result.passed.vector {
+ background: rgba(var(--ifm-color-primary-rgb), 0.8);
+}
+table.comparison tr td.bar {
+ padding: 0;
+ vertical-align: bottom;
+}
+table.comparison tr td.bar:hover {
+ background: var(--ifm-panel-background);
+}
+table.comparison tr td.bar .place {
+ font-size: 0.9em;
+}
+table.comparison tr td.bar .measurement {
+ font-weight: bold;
+}
+table.comparison tr td.bar .bar {
+ background: var(--ifm-color-emphasis-1000);
+ margin: 0 auto;
+}
+table.comparison tr td.bar.vector {
+ color: var(--ifm-color-primary);
+}
+table.comparison tr td.bar.vector .bar {
+ background: var(--ifm-color-primary);
+}
+
+@media (max-width: 996px) {
+ table.comparison td.description {
+ display: none;
+ }
+}
+
+/**
+ * container
+ */
+
+.container--flush {
+ padding-left: 0;
+ padding-right: 0;
+}
+
+.container--narrow {
+ box-sizing: border-box;
+ max-width: 760px;
+}
+
+.container--bleed > .bleed,
+.container--bleed > section > p > img,
+.container--bleed > section > .code-header,
+.container--bleed > section > pre {
+ position: relative;
+ left: calc(
+ -1 * (((var(--ifm-container-width) - 760px) / 2) +
+ var(--ifm-spacing-vertical))
+ );
+ max-width: none;
+ width: var(--ifm-container-width);
+}
+
+@media (max-width: 996px) {
+ .container--bleed > .bleed,
+ .container--bleed > section > p > img,
+ .container--bleed > section > .code-header,
+ .container--bleed > section > pre {
+ position: static;
+ max-width: 100%;
+ width: auto;
+ }
+}
+
+/**
+ * domain-bg
+ */
+
+.domain-bg {
+ background-image: url(/img/vector-bg-light.svg);
+}
+.domain-bg.domain-bg--config {
+ background-image: url(/img/cogs-bg-light.svg);
+}
+.domain-bg.domain-bg--platforms {
+ background-image: url(/img/circuit-bg-light.svg);
+}
+.domain-bg.domain-bg--networking,
+.domain-bg.domain-bg--sinks,
+.domain-bg.domain-bg--sources,
+.domain-bg.domain-bg--transforms {
+ background-image: url(/img/nodes-bg-light.svg);
+}
+.domain-bg--hover:not(:hover) {
+ background-image: none !important;
+}
+
+/**
+ * empty
+ *
+ * Generic empty state. Used for showing no results, etc.
+ */
+
+.empty {
+ color: var(--ifm-color-emphasis-400);
+ padding: calc(var(--ifm-spacing-vertical) * 3);
+ text-align: center;
+}
+.empty .icon {
+ font-size: 4rem;
+ font-weight: bold;
+ line-height: 1;
+}
+
+/**
+ * feather
+ *
+ * The feather icon set
+ */
+
+.feather {
+ font-size: inherit !important;
+}
+
+/**
+ * filters
+ *
+ * Generic filters
+ */
+
+.filters {
+ color: var(--ifm-menu-color);
+ margin-bottom: var(--ifm-spacing-vertical);
+}
+.filters .search {
+ margin-bottom: calc(var(--ifm-spacing-vertical) / 2);
+}
+.filters .search--result-count {
+ float: right;
+ font-size: 0.9em;
+ line-height: 1;
+ margin-bottom: -1em;
+ margin-right: var(--ifm-spacing-horizontal);
+ position: relative;
+ top: 0.75em;
+}
+.filters .search input {
+ width: 100%;
+}
+.filters .filter {
+ display: flex;
+ font-size: 0.9em;
+ overflow: auto;
+ width: 100%;
+ white-space: nowrap;
+}
+.filters .filter--label {
+ border-right: 1px solid var(--ifm-hr-border-color);
+ flex: 0 0 150px;
+ min-width: 120px;
+ padding-right: 1.2em;
+ text-align: right;
+}
+.filters .filter--label a {
+ color: inherit;
+ border-bottom: 1px solid var(--ifm-hr-border-color);
+}
+.filters .filter--choices {
+ white-space: nowrap;
+}
+.filters .filter--choices label {
+ margin-left: 0.75em;
+ margin-top: calc(var(--ifm-spacing-vertical) / 4);
+ white-space: nowrap;
+}
+.filters .filter--choices label input {
+ margin-right: 0.5em;
+}
+
+/**
+ * footer
+ *
+ * Foot at the bottom of every page
+ */
+
+.footer {
+ --ifm-heading-margin-bottom: var(--ifm-spacing-vertical);
+ border-top: 1px solid var(--ifm-hr-border-color);
+}
+
+/**
+ * github-badge
+ *
+ * Github star count badge in the header
+ */
+
+.github-badge {
+}
+
+/**
+ * h*
+ *
+ * Global headings with anchor links that appear on mouse over.
+ */
+
+h2 {
+ font-family: var(--ifm-heading-font-family);
+}
+h2 > .hash-link,
+h3 > .hash-link,
+h4 > .hash-link,
+h5 > .hash-link,
+h6 > .hash-link {
+ margin-left: -1.25em;
+ padding-right: 1.25em;
+}
+
+/**
+ * header
+ *
+ * Generic empty state. Used for showing no results, etc.
+ */
+
+header {
+ border-bottom: 2px solid var(--ifm-hr-border-color);
+ margin-bottom: calc(2 * var(--ifm-leading));
+}
+header .badges {
+ float: right;
+ font-family: monospace;
+ margin-top: 0.5rem;
+}
+header .badges .badge {
+ margin-left: 2px;
+}
+header h1 {
+ font-family: Ubuntu, var(--ifm-font-family-base);
+ font-size: 2.5rem;
+ margin-bottom: 0.5rem;
+}
+
+/**
+ * hero
+ *
+ * Large hero component typically used on marketing pages.
+ */
+
+@keyframes hero {
+ 0% {
+ background-size: 100% 100%;
+ }
+ 100% {
+ background-size: 300% 300%;
+ }
+}
+.hero {
+ display: block;
+ align-items: center;
+ min-height: 200px;
+ padding: 3em 0;
+ position: relative;
+ text-align: center;
+}
+.hero h1 {
+ font-size: 2.5rem;
+}
+.hero .hero--subtitle {
+ font-size: 1.1rem;
+ margin-top: 0.3rem;
+ margin-bottom: var(--ifm-spacing-vertical);
+}
+.hero .hero--subtitle a {
+ color: var(--ifm-color-content);
+ text-decoration: underline;
+}
+.hero .hero--subtitle a:hover {
+ color: var(--ifm-link-color);
+}
+.hero .hero--subsubtitle {
+ color: var(--ifm-hero-text-color);
+ font-size: 0.9rem;
+ margin-top: 0.3rem;
+}
+.hero .hero--buttons {
+ --ifm-button-padding-vertical: 0.5rem;
+ --ifm-button-padding-horizontal: 4rem;
+ margin-bottom: var(--ifm-spacing-vertical);
+}
+.hero .hero--buttons .button {
+ border-radius: 2rem;
+ margin-right: 1rem;
+ min-width: 240px;
+}
+.hero .hero--buttons .button:last-child {
+ margin-right: 0;
+}
+.hero.hero--full-height {
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ min-height: calc(100vh - var(--ifm-navbar-height));
+}
+@media (max-width: 996px) {
+ .hero {
+ min-height: 100px;
+ padding: 2em 0;
+ }
+ .hero .hero--buttons .button {
+ --ifm-button-padding-horizontal: 2rem;
+ min-width: 180px;
+ }
+}
+@media (max-width: 480px) {
+ .hero.hero--full-height {
+ min-height: auto;
+ }
+ .hero h1 {
+ font-size: 2em;
+ }
+ .hero .hero--subtitle {
+ font-size: 1em;
+ }
+ .hero .hero--buttons .button {
+ display: block;
+ border-radius: 0.5rem;
+ margin: 0 0 1rem 0;
+ min-width: auto;
+ width: 100%;
+ }
+}
+
+/**
+ * input
+ *
+ * Custom form component styling. This is mostly neccessary for the dark theme.
+ */
+
+input[type="checkbox"] {
+ -webkit-appearance: none;
+ -moz-appearance: none;
+ -o-appearance: none;
+ appearance: none;
+ background: var(--ifm-background-color);
+ background-clip: padding-box;
+ border: 1px solid var(--ifm-color-emphasis-200);
+ border-radius: 4px;
+ cursor: pointer;
+ height: 1rem;
+ margin-bottom: 0.5rem;
+ width: 1rem;
+ outline: none;
+ transition-duration: var(--ifm-transition-fast);
+ vertical-align: middle;
+}
+input[type="checkbox"]:checked {
+ background-color: var(--ifm-color-primary);
+ border: 1px solid var(--ifm-color-primary);
+}
+
+input[type="email"],
+input[type="text"] {
+ background: var(--ifm-panel-background);
+ border: 1px solid var(--ifm-panel-border-color);
+ border-radius: var(--ifm-global-radius);
+ box-shadow: var(--ifm-panel-box-shadow);
+ box-sizing: border-box;
+ color: var(--ifm-font-base-color);
+ display: inline-block;
+ font-size: calc(0.8rem * var(--ifm-button-size-multiplier));
+ line-height: 1.5;
+ padding: calc(
+ var(--ifm-button-padding-vertical) *
+ var(--ifm-button-size-multiplier)
+ )
+ 0.8em;
+ transition: var(--ifm-transition-slow) ease;
+ vertical-align: middle;
+}
+input[type="email"]:focus,
+input[type="text"]:focus {
+ background: var(--ifm-panel-background-active);
+ border-color: var(--ifm-color-primary);
+ box-shadow: var(--ifm-panel-box-shadow-active);
+}
+.input--lg {
+ --ifm-button-size-multiplier: 1.35;
+}
+.input--highlight-wrapper {
+ animation: gradientBG 5s ease-in infinite;
+ background-image: var(--ifm-highlight-gradient);
+ background-size: 150% 150%;
+ border: 0px none;
+ font-weight: 600;
+ padding: 1px;
+}
+
+/**
+ * label
+ */
+
+.label.label--warning {
+ color: var(--ifm-color-warning);
+ border-bottom: 1px solid var(--ifm-color-warning);
+ padding-bottom: 5px;
+ font-size: 0.8rem;
+}
+
+/**
+ * list--warnings
+ *
+ * Generic list with warnings as list styles.
+ */
+
+div.list--warnings > ul,
+ul.list--warnings {
+ list-style: none;
+ margin-left: 1em;
+ padding-left: 1em;
+}
+div.list--warnings > ul > li:before,
+ul.list--warnings > li:before {
+ content: "⚠";
+ display: block;
+ float: left;
+ font-size: 1.25em;
+ font-weight: bold;
+ margin-left: -1.6em;
+ margin-top: -0.2em;
+}
+div.list--warnings > ul > li,
+ul.list--warnings > li {
+ margin: 0 0 1em 0;
+ padding: 0;
+}
+
+/**
+ * menu
+ *
+ * Menu styling generally used as a navigation menu, such a the left-side
+ * menu for the docs section.
+ */
+
+.menu > ul.menu__list li {
+ margin-top: 0;
+ margin-bottom: 0;
+}
+.menu > ul.menu__list li > a {
+ padding-left: 0;
+ padding-right: 0;
+}
+.menu .menu__list-item-hidden {
+ display: none;
+}
+.menu > ul.menu__list > li.menu__list-item div.title {
+ color: var(--ifm-color-emphasis-300);
+ cursor: text;
+ display: flex;
+ font-size: 0.9rem;
+ justify-content: space-between;
+ line-height: calc(var(--ifm-spacing-vertical) * 1.25);
+ margin-top: calc(var(--ifm-spacing-vertical) * 1.5);
+ padding: var(--ifm-menu-link-padding-vertical) 0;
+ font-weight: bold;
+ text-transform: uppercase;
+}
+.menu > ul.menu__list > li.menu__list-item:first-child div.title {
+ margin-top: 0;
+}
+.menu > ul.menu__list ul.menu__list {
+ border-left: 1px solid var(--ifm-hr-border-color);
+ margin-left: 0;
+ padding-left: var(--ifm-menu-link-padding-horizontal);
+}
+.menu > ul.menu__list ul.menu__list .menu__link {
+ border-radius: 0;
+ font-size: 0.85rem;
+ margin-left: calc(var(--ifm-menu-link-padding-horizontal) * -1);
+ padding-left: var(--ifm-menu-link-padding-horizontal);
+}
+.menu > ul.menu__list > li > ul.menu__list {
+ border-left: 0px none;
+ padding-left: 0;
+}
+.menu .menu__list-title {
+ color: var(--ifm-color-emphasis-300);
+ font-size: 0.9em;
+ text-transform: uppercase;
+}
+.menu .menu__link,
+.menu .menu__link:hover,
+.menu .menu__link.menu__link--active:not(.menu__link--sublist) {
+ background: none;
+ line-height: calc(var(--ifm-spacing-vertical) * 1.25);
+}
+.menu .menu__link small {
+ font-weight: normal;
+ opacity: 0.75;
+}
+.menu .menu__link.menu__link--sublist::after {
+ background-image: url('data:image/svg+xml;utf8,<svg alt="Arrow" xmlns="http://www.w3.org/2000/svg" width="14px" height="14px" viewBox="-6 -6 38 38"><path fill="rgba(0,0,0,0.3)" d="M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z"></path></svg>');
+ -webkit-transform: rotate(180deg);
+ transform: rotate(180deg);
+ transition: var(--ifm-transition-fast) ease;
+}
+.menu .menu__link.menu__link--sublist:hover::after,
+.menu .menu__link.menu__link--sublist.menu__link--active::after {
+ background-image: url('data:image/svg+xml;utf8,<svg alt="Arrow" xmlns="http://www.w3.org/2000/svg" width="14px" height="14px" viewBox="-6 -6 38 38"><path fill="rgb(40,217,242)" d="M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z"></path></svg>');
+}
+.menu .menu__list-item.menu__list-item--collapsed .menu__link--sublist::after {
+ -webkit-transform: rotate(90deg);
+ transform: rotate(90deg);
+}
+.menu .menu__link:hover {
+ color: var(--ifm-menu-color-active);
+}
+.menu .menu__link .badges {
+ vertical-align: top;
+ margin-top: -1px;
+}
+.menu .menu__link .badges .badge {
+ background-clip: padding-box;
+ border: 1px solid var(--ifm-color-emphasis-50);
+ border-radius: 0.25em;
+ display: inline-block;
+ font-family: monospace;
+ font-size: 0.5rem;
+ font-weight: bold;
+ height: 1rem;
+ line-height: 1rem;
+ margin-right: 2px;
+ padding: 0 0.25rem;
+ vertical-align: middle;
+}
+.menu.menu--responsive .menu__button {
+ background: var(--ifm-panel-background-solid);
+ border-color: var(--ifm-color-content-secondary);
+ bottom: 1rem;
+ right: 1rem;
+}
+
+/**
+ * navbar
+ *
+ * Global navbar styling, used in the global header of the site.
+ */
+
+.navbar .navbar__brand {
+ min-width: 100px;
+}
+.navbar .navbar__logo {
+ margin-right: 0;
+ max-width: 155px;
+}
+.navbar .search-icon-hidden {
+ display: none;
+}
+
+@media (max-width: 996px) {
+ .navbar .navbar__search {
+ flex-grow: 1;
+ text-align: right;
+ }
+ .navbar .navbar__search .navbar__search-input {
+ width: 12.5rem;
+ }
+ .navbar .navbar-sidebar__items .navbar__item {
+ display: inline-block;
+ }
+}
+@media (max-width: 480px) {
+ .navbar .navbar__brand {
+ margin-right: 0;
+ }
+ .navbar .navbar__brand .navbar__logo {
+ max-width: 130px;
+ }
+ .navbar .navbar__search {
+ margin-left: 0;
+ }
+ .navbar .navbar__search .navbar__search-input {
+ width: 100%;
+ }
+ .navbar .navbar__search .search-bar-expanded {
+ width: 100% !important;
+ }
+}
+.navbar .navbar__items--right {
+ flex: 0 0 40%;
+}
+.navbar .navbar__items--right .react-toggle {
+ margin-left: var(--ifm-navbar-item-padding-horizontal);
+}
+.navbar .navbar__item .badge {
+ border-color: var(--ifm-background-color) !important;
+ border-radius: 1em;
+ display: block;
+ float: right;
+ font-size: 0.6em;
+ line-height: 1;
+ margin-top: -0.7em;
+ margin-right: -1.5em;
+ margin-left: -0.5em;
+ padding: 0.3em 0.5em;
+ position: relative;
+ z-index: 1;
+}
+.navbar-sidebar__brand .navbar__brand {
+ flex: 1 0;
+}
+.navbar-sidebar__brand .react-toggle {
+ flex: 0;
+ text-align: right;
+}
+.navbar-sidebar__items .menu .menu__link {
+ color: var(--ifm-heading-color);
+ display: block;
+}
+.navbar-sidebar__items .menu .menu__link .badge {
+ border-color: var(--ifm-background-color);
+ border-radius: 1em;
+ font-size: 0.6em;
+ margin-top: -1em;
+ margin-left: 0.25em;
+}
+
+/**
+ * pagination-nav
+ */
+
+.pagination-nav .pagination-nav__link {
+ background: var(--ifm-panel-background);
+ border-color: var(--ifm-panel-border-color);
+ box-shadow: var(--ifm-panel-box-shadow);
+ transition: border 250ms ease;
+}
+.pagination-nav .pagination-nav__link:hover {
+ background: var(--ifm-panel-background-active);
+ box-shadow: var(--ifm-panel-box-shadow-active);
+ color: var(--ifm-panel-color-active);
+}
+.pagination-nav .pagination-nav__link:hover * {
+ color: var(--ifm-panel-color-active);
+}
+
+/**
+ * panel
+ */
+
+.panel {
+ background: var(--ifm-panel-background);
+ border: 1px solid var(--ifm-panel-border-color);
+ border-radius: var(--ifm-global-radius);
+ box-shadow: var(--ifm-panel-box-shadow);
+ color: var(--ifm-font-base-color);
+ display: block;
+ margin-bottom: var(--ifm-spacing-vertical);
+ padding: calc(var(--ifm-spacing-vertical) * 1.5)
+ calc(var(--ifm-spacing-horizontal) * 2);
+}
+.panel.panel--link {
+ transition: var(--ifm-transition-fast) ease;
+}
+.panel.panel--link:hover {
+ background: var(--ifm-panel-background-active);
+ border-color: var(--ifm-panel-border-color-active);
+ box-shadow: var(--ifm-panel-box-shadow-active);
+ text-decoration: none;
+}
+.panel .panel--icon {
+ font-size: 4em;
+ line-height: 1;
+ margin: 0 0 var(--ifm-spacing-vertical) 0;
+}
+.panel .panel--title {
+ font-size: 1.2em;
+ font-weight: 600;
+}
+.panel .panel--description {
+ font-size: 0.95em;
+ opacity: 0.5;
+}
+
+/**
+ * press--color
+ */
+
+.press--color {
+ background: #10e7ff;
+ color: black;
+ padding: var(--ifm-spacing-vertical) var(--ifm-spacing-horizontal);
+}
+
+/**
+ * react-select-container
+ */
+
+.react-select-container .react-select__control {
+ background: var(--ifm-panel-background);
+ border-color: var(--ifm-panel-border-color);
+ border-radius: var(--ifm-global-radius);
+ box-shadow: var(--ifm-panel-box-shadow);
+ box-sizing: border-box;
+ color: var(--ifm-font-base-color);
+}
+
+.react-select-container .react-select__indicator-separator {
+ background-color: var(--ifm-color-emphasis-200);
+}
+
+.react-select-container .react-select__single-value {
+ color: var(--ifm-font-base-color);
+}
+
+.react-select-container:hover .react-select__control {
+ background: var(--ifm-panel-background-active);
+ border-color: var(--ifm-panel-border-color-active);
+ box-shadow: var(--ifm-panel-box-shadow-active);
+}
+
+.react-select-container .react-select__menu {
+ background: var(--ifm-panel-background-solid);
+ border-radius: var(--ifm-global-radius);
+ color: var(--ifm-color-content);
+}
+
+.react-select-container .react-select__option:hover {
+ background: var(--ifm-color-primary);
+ color: var(--ifm-background-color);
+}
+
+.react-select-container .react-select__option--is-selected {
+ background: var(--ifm-panel-background-active);
+}
+
+.react-select-container .react-select__option--is-focused {
+ background: var(--ifm-panel-background-active);
+ color: var(--ifm-color-content);
+}
+
+/**
+ * section
+ *
+ * Sections are generally used on marketing pages to focus on separate topics.
+ */
+
+section {
+ border-bottom: 1px solid var(--ifm-hr-border-color);
+ margin-bottom: calc(2 * var(--ifm-leading));
+ padding-bottom: calc(
+ (2 * var(--ifm-leading)) - var(--ifm-spacing-vertical)
+ );
+}
+section .sub-title {
+ color: var(--ifm-color-emphasis-600);
+ margin-top: calc(var(--ifm-heading-margin-bottom) * -1);
+ margin-bottom: var(--ifm-heading-margin-bottom);
+}
+section.shade {
+ background: var(--ifm-panel-background);
+ padding-left: var(--ifm-spacing-horizontal);
+ padding-right: var(--ifm-spacing-horizontal);
+}
+section:last-child {
+ border-bottom: 0px none;
+ margin-bottom: 0;
+}
+header + section.shade {
+ margin-top: calc(-1 * ((var(--ifm-spacing-vertical) * 2) - 5px));
+ padding-top: var(--ifm-spacing-vertical);
+}
+
+/**
+ * section-list
+ *
+ * A section list is a generic list that allows for larger sections with
+ * headings. This is used for options, fields, or step-by-step guides.
+ */
+
+.section-list {
+ border-left: 1px solid var(--ifm-hr-border-color);
+ margin-left: 0.25em;
+}
+.section-list > .section {
+ border-radius: 5px;
+ font-size: 0.95em;
+ padding-bottom: calc(var(--ifm-spacing-vertical) / 1.5);
+ padding-left: var(--ifm-spacing-horizontal);
+}
+.section-list > .section:last-child {
+ padding-bottom: 0;
+}
+.section-list > .section > .badges {
+ float: right;
+ margin-top: -0.25em;
+ text-align: right;
+}
+.section-list > .section > .badges .badge {
+ font-size: 0.7em;
+ margin-left: 3px;
+}
+.section-list > .section > .badges .badge:first-child {
+ margin-left: 0;
+}
+.section-list > .section > h3,
+.section-list > .section > h4,
+.section-list > .section > h5,
+.section-list > .section > h6 {
+ margin-bottom: 1em;
+}
+.section-list > .section > h3 .hash-link,
+.section-list > .section > h4 .hash-link,
+.section-list > .section > h5 .hash-link,
+.section-list > .section > h6 .hash-link {
+ margin-left: calc(
+ (var(--ifm-spacing-horizontal) * -1.75) - var(--ifm-spacing-horizontal)
+ ) !important;
+ padding-right: 3em;
+}
+.section-list:not(.section-list--no-bullet) > .section > h3::before,
+.section-list:not(.section-list--no-bullet) > .section > h4::before,
+.section-list:not(.section-list--no-bullet) > .section > h5::before,
+.section-list:not(.section-list--no-bullet) > .section > h6::before,
+.section-list > .section > .section--bullet {
+ content: "• ";
+ float: left;
+ display: block;
+ width: calc(var(--ifm-spacing-horizontal) * 2);
+ margin-left: calc(var(--ifm-spacing-horizontal) * -2);
+ text-align: center;
+}
+.section-list > .section:hover > h3 > .hash-link,
+.section-list > .section:hover > h4 > .hash-link,
+.section-list > .section:hover > h5 > .hash-link,
+.section-list > .section:hover > h6 > .hash-link {
+ opacity: 1;
+}
+.section-list > .section > .sub__title {
+ margin-top: -0.4em;
+ margin-bottom: 0.25em;
+}
+.section-list > .section .info {
+ border-left: 1px solid var(--ifm-hr-border-color);
+ color: var(--ifm-color-content-secondary);
+ font-size: 0.9em;
+ margin-top: calc(var(--ifm-spacing-horizontal) * -1);
+ margin-bottom: calc(var(--ifm-spacing-vertical) / 2);
+ margin-left: 0.25em;
+ padding-left: var(--ifm-spacing-horizontal);
+}
+.section-list > .section .info > div:before {
+ content: "• ";
+ float: left;
+ display: block;
+ width: calc(var(--ifm-spacing-horizontal) * 2);
+ margin-left: calc(var(--ifm-spacing-horizontal) * -2);
+ text-align: center;
+}
+.section-list > .section .info .show-more {
+ color: var(--ifm-color-primary);
+ cursor: pointer;
+}
+.section-list > .section .info .examples {
+ margin-top: 0.5em;
+}
+.section-list.section-list--lg > .section {
+ margin-top: calc(var(--ifm-spacing-vertical) * 2);
+}
+.section-list.section-list--compact > .section {
+ padding-top: calc(var(--ifm-spacing-vertical) / 4);
+ padding-bottom: calc(var(--ifm-spacing-vertical) / 4);
+}
+.section-list.section-list--compact > .section > h4 {
+ font-weight: normal;
+ margin: 0;
+}
+.section-list.section-list--compact > .section > h4 .badge {
+}
+.section-list.section-list--compact > .section:last-child > h4 {
+ margin-bottom: var(--ifm-spacing-vertical);
+}
+.section-list.section-list--hover > .section:hover {
+ background: var(--ifm-panel-background);
+}
+
+/**
+ * sidebar
+ *
+ * Side navigation used in sections like components, release notes, docs, etc.
+ */
+
+.sidebar {
+ border-right: 1px solid var(--ifm-sidebar-border-color);
+}
+
+.sidebar .menu {
+ font-weight: bold;
+}
+
+.sidebar .menu .menu__link {
+ border-right: 2px solid transparent;
+}
+
+.sidebar .menu .menu__link--active {
+ border-radius: 0;
+ border-right-color: var(--ifm-color-primary);
+}
+
+.sidebar.sidebar--right .menu__list-title,
+.sidebar.sidebar--right .menu__link {
+ display: block;
+ padding-right: var(--ifm-spacing-vertical);
+ text-align: right;
+}
+
+@media (min-width: 997px) {
+ .sidebar {
+ height: calc(100vh - var(--ifm-navbar-height));
+ overflow-y: auto;
+ position: sticky;
+ top: var(--ifm-navbar-height);
+ }
+
+ .sidebar::-webkit-scrollbar {
+ width: 7px;
+ }
+
+ .sidebar::-webkit-scrollbar-track {
+ background: #f1f1f1;
+ border-radius: 10px;
+ }
+
+ .sidebar::-webkit-scrollbar-thumb {
+ background: #888;
+ border-radius: 10px;
+ }
+
+ .sidebar::-webkit-scrollbar-thumb:hover {
+ background: #555;
+ }
+}
+
+/**
+ * svg
+ *
+ * SVG styling ensures SVG colors match the color palette. SVG intentionally
+ * use white and black colors to easily target and change their colors.
+ */
+
+.container svg [fill="#000000"],
+.footer svg [fill="#000000"],
+.markdown svg [fill="#000000"],
+.navbar__brand svg [fill="#000000"],
+.sidebar__logo svg [fill="#000000"] {
+ fill: var(--ifm-heading-color);
+}
+.container svg [stroke="#000000"],
+.footer svg [stroke="#000000"],
+.markdown svg [stroke="#000000"],
+.navbar__brand svg [stroke="#000000"],
+.sidebar__logo svg [stroke="#000000"] {
+ stroke: var(--ifm-heading-color);
+}
+.container svg [stop-color="#000000"],
+.footer svg [stop-color="#000000"],
+.markdown svg [stop-color="#000000"],
+.navbar__brand svg [stop-color="#000000"],
+.sidebar__logo svg [stop-color="#000000"] {
+ stop-color: var(--ifm-heading-color);
+}
+.container svg [fill="#FFFFFF"],
+.footer svg [fill="#FFFFFF"],
+.markdown svg [fill="#FFFFFF"],
+.navbar__brand svg [fill="#FFFFFF"],
+.sidebar__logo svg [fill="#FFFFFF"] {
+ fill: var(--ifm-background-color);
+}
+.container svg [stroke="#FFFFFF"],
+.footer svg [stroke="#FFFFFF"],
+.markdown svg [stroke="#FFFFFF"],
+.navbar__brand svg [stroke="#FFFFFF"],
+.sidebar__logo svg [stroke="#FFFFFF"] {
+ stroke: var(--ifm-background-color);
+}
+
+/**
+ * table
+ */
+
+table {
+ display: table;
+}
+.table-responsive {
+ overflow-x: auto;
+}
+
+/**
+ * .table-of-contents
+ *
+ * Used as a right hand side navigation for jumping around a document.
+ */
+
+.table-of-contents {
+ border-left: 1px solid var(--ifm-contents-border-color);
+ display: inherit;
+ max-height: calc(100vh - (var(--ifm-navbar-height) + 2rem));
+ overflow-y: auto;
+ padding-left: var(--ifm-contents-padding-left);
+ position: sticky;
+ top: calc(var(--ifm-navbar-height) + 2rem);
+}
+.table-of-contents {
+ font-size: 0.8rem;
+}
+.table-of-contents .section {
+ border-bottom: 1px solid var(--ifm-hr-border-color);
+ padding: 0 0 0.5rem 0;
+ margin-bottom: 0.5rem;
+}
+.table-of-contents .section:last-child {
+ border-bottom: 0px none;
+ margin-bottom: 0;
+}
+.table-of-contents .status {
+ font-weight: bold;
+ padding: 0 0 var(--ifm-contents-padding-vertical) 0;
+}
+.table-of-contents .title {
+ color: var(--ifm-color-emphasis-300);
+ font-size: 0.9rem;
+ font-weight: bold;
+ margin-bottom: var(--ifm-contents-padding-vertical);
+ text-transform: uppercase;
+}
+.table-of-contents ul.contents {
+ font-weight: bold;
+ font-size: 0.75rem;
+ padding: 0;
+}
+.table-of-contents ul.contents code {
+ color: inherit;
+}
+.table-of-contents ul.contents li {
+ margin-right: 0;
+ margin-left: 0;
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
+}
+.table-of-contents ul.contents li a.text--danger {
+ color: var(--ifm-color-danger);
+}
+.table-of-contents ul.contents > li ul {
+ border-left: 1px solid var(--ifm-hr-border-color);
+}
+.table-of-contents ul.contents > li > ul > li:last-child {
+ margin-bottom: 0;
+}
+@media (max-width: 996px) {
+ .table-of-contents {
+ display: none;
+ }
+}
+
+/**
+ * tabs
+ *
+ * Used with the `Tabs` and `TabItem` components
+ */
+
+ul.tabs {
+ background-color: var(--ifm-color-emphasis-50);
+ border-bottom: 1px solid var(--ifm-hr-border-color);
+ font-size: 0.9em;
+ font-weight: bold;
+}
+ul.tabs li.tab-item {
+ border-top: 2px solid transparent;
+ border-right: 1px solid transparent;
+ border-left: 1px solid transparent;
+ border-radius: 0;
+ color: var(--ifm-color-emphasis-400);
+ margin: 0;
+ margin-bottom: -1px;
+ padding: 0.4em 1.5em;
+ text-align: center;
+}
+ul.tabs li.tab-item:hover {
+ background: transparent;
+ color: var(--ifm-link-colorI);
+}
+ul.tabs li.tab-item.tab-item--active {
+ background: var(--ifm-background-color);
+ border-top-color: var(--ifm-tabs-color-active);
+ border-right-color: var(--ifm-hr-border-color);
+ border-bottom-color: var(--ifm-background-color);
+ border-left-color: var(--ifm-hr-border-color);
+ color: var(--ifm-font-base-color);
+}
+ul.tabs.mini {
+ background: none;
+ border: 0px none;
+}
+ul.tabs.mini li {
+ border: 0px none;
+ padding: 0;
+ margin-right: 1em;
+}
+ul.tabs.mini li.tab-item.tab-item--active {
+ color: var(--ifm-color-primary);
+}
+ul.tabs.rounded {
+ border: 0px none;
+ border-radius: 2em;
+ font-size: 1em;
+ font-weight: normal;
+ margin: 0 auto;
+ padding: 6px;
+}
+ul.tabs.rounded li.tab-item {
+ border: 0px none;
+ border-radius: 2em;
+ flex: 1 1 0;
+ padding: 0px 10px;
+ white-space: nowrap;
+}
+ul.tabs.rounded li.tab-item.tab-item--active {
+ border: 0px none;
+ background: var(--ifm-color-primary);
+ color: var(--ifm-background-color);
+}
+.tabs--centered {
+ text-align: center;
+}
+.tabs--centered ul.tabs {
+ display: inline-block;
+}
+
+/*
+ * text--highlight
+ */
+
+.text--highlight {
+ animation: gradientBG 5s ease-in infinite;
+ background-clip: text;
+ background-image: var(--ifm-highlight-gradient);
+ background-size: 150% 150%;
+ -webkit-background-clip: text;
+ color: transparent;
+}
+
+/*
+ * text--upcase
+ */
+
+.text--upcase {
+ text-transform: uppercase;
+}
+
+/*
+ * unstyled
+ */
+
+.unstyled {
+ list-style: none;
+ padding-left: 0;
+}
+
+/******************************************************************************
+ * Markdown
+ *
+ * Specific styling for markdown generated content.
+ ******************************************************************************/
+
+.markdown {
+ --ifm-h1-h2-vertical-rhythm-top: 1;
+ --ifm-h1-h2-vertical-rhythm-bottom: var(--ifm-h1-h2-vertical-rhythm-top);
+ --ifm-h3-vertical-rhythm-top: 1.25;
+ --ifm-h3-vertical-rhythm-bottom: calc(
+ var(--ifm-h3-vertical-rhythm-top) / 2
+ );
+ --ifm-h4-vertical-rhythm-top: 1.25;
+ --ifm-h4-vertical-rhythm-bottom: calc(
+ var(--ifm-h4-vertical-rhythm-top) / 2
+ );
+ --ifm-h5-vertical-rhythm-top: 1.25;
+ --ifm-h5-vertical-rhythm-bottom: calc(
+ var(--ifm-h5-vertical-rhythm-top) / 2
+ );
+ --ifm-h6-vertical-rhythm-top: 1.25;
+ --ifm-h6-vertical-rhythm-bottom: calc(
+ var(--ifm-h6-vertical-rhythm-top) / 2
+ );
+}
+
+.markdown .diagram {
+ max-height: 250px;
+ width: 100%;
+}
+
+.markdown > h1,
+.markdown > h2 {
+ border-top: 1px solid var(--ifm-hr-border-color);
+ font-size: 1.5rem;
+ margin-top: calc(var(--ifm-h1-h2-vertical-rhythm-top) * var(--ifm-leading));
+ margin-bottom: calc(
+ var(--ifm-h1-h2-vertical-rhythm-bottom) * var(--ifm-leading)
+ );
+ padding-top: calc(
+ var(--ifm-h1-h2-vertical-rhythm-top) * var(--ifm-leading)
+ );
+}
+.markdown > h3 {
+ margin-top: calc(var(--ifm-h3-vertical-rhythm-top) * var(--ifm-leading));
+ margin-bottom: calc(
+ var(--ifm-h3-vertical-rhythm-bottom) * var(--ifm-leading)
+ );
+}
+.markdown > h4 {
+ margin-top: calc(var(--ifm-h4-vertical-rhythm-top) * var(--ifm-leading));
+ margin-bottom: calc(
+ var(--ifm-h4-vertical-rhythm-bottom) * var(--ifm-leading)
+ );
+}
+.markdown > h5 {
+ margin-top: calc(var(--ifm-h5-vertical-rhythm-top) * var(--ifm-leading));
+ margin-bottom: calc(
+ var(--ifm-h5-vertical-rhythm-bottom) * var(--ifm-leading)
+ );
+}
+.markdown > h6 {
+ margin-top: calc(var(--ifm-h6-vertical-rhythm-top) * var(--ifm-leading));
+ margin-bottom: calc(
+ var(--ifm-h6-vertical-rhythm-bottom) * var(--ifm-leading)
+ );
+}
+
+.markdown > p > img,
+.markdown > p > svg,
+.markdown > img,
+.markdown > svg {
+ display: block;
+ height: auto;
+ margin: 0 auto;
+}
+.markdown > img,
+.markdown > svg {
+ margin-bottom: calc(var(--ifm-spacing-vertical) * 2);
+}
+.markdown svg {
+ height: 100%;
+ max-width: 100%;
+ max-height: 100%;
+}
+
+.markdown pre {
+ font-size: 90%;
+}
+
+.markdown table {
+ display: table;
+ width: 100%;
+ border-collapse: collapse;
+ page-break-inside: auto;
+}
+.markdown table > thead > tr,
+.markdown table > tbody > tr {
+ border: none;
+ border-bottom: 1px solid var(--ifm-hr-border-color);
+ page-break-after: auto;
+ page-break-inside: avoid;
+}
+.markdown table > thead > tr {
+ border-bottom-width: 2px;
+}
+.markdown table > thead > tr > th:not([align]) {
+ text-align: left;
+}
+.markdown table > thead > tr > th,
+.markdown table > tbody > tr > td {
+ width: auto;
+ padding: 8px;
+ align-self: start;
+ border-top: none;
+ align-items: start;
+ border: none;
+ -webkit-box-align: start;
+ -ms-grid-row-align: start;
+}
+.markdown table > thead > tr > th:first-child,
+.markdown table > tbody > tr > td:first-child {
+ padding-left: 0;
+}
+.markdown table > thead > tr > th:last-child,
+.markdown table > tbody > tr > td:last-child {
+ padding-right: 0;
+}
+.markdown table > thead > tr {
+ border-bottom-size: 2px;
+}
+.markdown table > tbody > tr:hover {
+ background: var(--ifm-color-emphasis-25);
+}
+
+/******************************************************************************
+ * Docs
+ *
+ * Specific styling for the docs section.
+ ******************************************************************************/
+
+div[class^="docPage_"] div[class^="docItemContainer_"] {
+ max-width: none;
+}
+@media (min-width: 997px) {
+ div[class^="docPage_"] div[class^="docItemContainer_"] {
+ max-width: none;
+ padding: 0 calc(var(--ifm-spacing-horizontal) * 2);
+ }
+}
+
+div[class^="docPage_"] h1[class^="docTitle_"] {
+ font-size: 2em;
+ margin-bottom: 0.5rem;
+}
+
+div[class^="docPage_"]
+ main[class^="docMainContainer_"]
+ div.container
+ div.row
+ div.col.col--3 {
+ padding-left: 0;
+}
+
+div[class^="docPage_"] div[class^="docSidebarContainer_"] {
+ border-right-color: var(--ifm-sidebar-border-color);
+ max-width: var(--ifm-sidebar-width);
+ min-width: var(--ifm-sidebar-width);
+}
+
+div[class^="docPage_"] div[class^="sidebar_"] {
+ font-size: 0.85rem;
+ font-weight: bold;
+}
+div[class^="docPage_"] div[class^="sidebar_"] .menu {
+ background: var(--ifm-sidebar-background);
+ font-weight: bold;
+ padding: var(--ifm-spacing-vertical) var(--ifm-navbar-padding-horizontal) 0
+ var(--ifm-navbar-padding-horizontal);
+}
+div[class^="docPage_"]
+ div[class^="sidebar_"]
+ .menu__link.menu__link--active:not(.menu__link--sublist) {
+ border-radius: 0;
+ border-right: 2px solid var(--ifm-color-primary);
+ margin-right: calc(var(--ifm-navbar-padding-horizontal) * -1);
+ padding-right: calc(var(--ifm-navbar-padding-horizontal) - 2px);
+}
+div[class^="docPage_"]
+ div[class^="sidebar_"]
+ .menu__link.menu__link--active:not(.menu__link--sublist)
+ .badge {
+ background: rgba(var(--ifm-color-primary-rgb), 0.2);
+ background-clip: padding-box;
+ border: 1px solid rgba(var(--ifm-color-primary-rgb), 0.2);
+ color: var(--ifm-color-primary);
+}
+
+/******************************************************************************
+ * Dark Theme
+ ******************************************************************************/
+
+html[data-theme="dark"] {
+ --ifm-background-color: #191927;
+ --ifm-background-color-rgb: 25, 25, 39;
+ --ifm-color-content-secondary: var(--ifm-color-emphasis-400);
+ --ifm-color-emphasis-25: var(--ifm-color-gray-975);
+ --ifm-color-emphasis-40: var(--ifm-color-gray-960);
+ --ifm-color-emphasis-50: var(--ifm-color-gray-950);
+ --ifm-color-emphasis-75: var(--ifm-color-gray-925);
+ --ifm-color-gray-25: rgba(224, 235, 247, calc(1 - 0.025));
+ --ifm-color-gray-40: rgba(224, 235, 247, calc(1 - 0.04));
+ --ifm-color-gray-50: rgba(224, 235, 247, calc(1 - 0.05));
+ --ifm-color-gray-75: rgba(224, 235, 247, calc(1 - 0.075));
+ --ifm-color-gray-100: rgba(224, 235, 247, calc(1 - 0.1));
+ --ifm-color-gray-150: rgba(224, 235, 247, calc(1 - 0.15));
+ --ifm-color-gray-200: rgba(224, 235, 247, calc(1 - 0.2));
+ --ifm-color-gray-300: rgba(224, 235, 247, calc(1 - 0.3));
+ --ifm-color-gray-400: rgba(224, 235, 247, calc(1 - 0.4));
+ --ifm-color-gray-500: rgba(224, 235, 247, calc(1 - 0.5));
+ --ifm-color-gray-600: rgba(224, 235, 247, calc(1 - 0.6));
+ --ifm-color-gray-700: rgba(224, 235, 247, calc(1 - 0.7));
+ --ifm-color-gray-800: rgba(224, 235, 247, calc(1 - 0.8));
+ --ifm-color-gray-900: rgba(224, 235, 247, calc(1 - 0.9));
+ --ifm-color-gray-925: rgba(224, 235, 247, calc(1 - 0.925));
+ --ifm-color-gray-950: rgba(224, 235, 247, calc(1 - 0.95));
+ --ifm-color-gray-960: rgba(224, 235, 247, calc(1 - 0.96));
+ --ifm-color-gray-975: rgba(224, 235, 247, calc(1 - 0.975));
+ --ifm-color-gray-1000: rgb(224, 235, 247);
+ --ifm-contents-border-color: var(--ifm-color-emphasis-75);
+ --ifm-global-shadow-md: 0 3px 8px 0px rgba(0, 0, 0, 0.2);
+ --ifm-heading-color: var(--ifm-color-gray-1000);
+ --ifm-link-color: var(--ifm-color-primary);
+ --ifm-navbar-search-input-icon: url('data:image/svg+xml;utf8,<svg fill="rgb(224, 235, 247)" alt="Search" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" height="16px" width="16px"><path d="M6.02945,10.20327a4.17382,4.17382,0,1,1,4.17382-4.17382A4.15609,4.15609,0,0,1,6.02945,10.20327Zm9.69195,4.2199L10.8989,9.59979A5.88021,5.88021,0,0,0,12.058,6.02856,6.00467,6.00467,0,1,0,9.59979,10.8989l4.82338,4.82338a.89729.89729,0,0,0,1.29912,0,.89749.89749,0,0,0-.00087-1.29909Z" /></svg>');
+ --ifm-panel-background: var(--ifm-color-emphasis-50);
+ --ifm-panel-background-rgb: 37, 37, 50;
+ --ifm-panel-background-solid: #252532;
+ --ifm-panel-box-shadow: none;
+ --ifm-panel-box-shadow-active: 0 0px 10px 0px
+ rgba(var(--ifm-color-primary-rgb), 0.5);
+}
+
+/**
+ * domain-bg
+ */
+
+html[data-theme="dark"] .domain-bg {
+ background-image: url(/img/logo.svg);
+}
+html[data-theme="dark"] .domain-bg.domain-bg--config {
+ background-image: url(/img/logo.svg);
+}
+html[data-theme="dark"] .domain-bg.domain-bg--platforms {
+ background-image: url(/img/logo.svg);
+}
+html[data-theme="dark"] .domain-bg.domain-bg--networking,
+html[data-theme="dark"] .domain-bg.domain-bg--sinks,
+html[data-theme="dark"] .domain-bg.domain-bg--sources,
+html[data-theme="dark"] .domain-bg.domain-bg--transforms {
+ background-image: url(/img/logo.svg);
+}
+
+/*
+ * navbar
+ */
+
+html[data-theme="dark"] .navbar {
+ border-bottom: 1px solid var(--ifm-sidebar-border-color);
+ box-shadow: none;
+}
+html[data-theme="dark"] .navbar__sidebar__backdrop {
+ background: var(--ifm-color-emphasis-100);
+}
+html[data-theme="dark"] .navbar .navbar__item .badge--default {
+ background: var(--ifm-color-emphasis-100);
+ color: var(--ifm-panel-color);
+}
+
+/*
+ * button
+ */
+
+html[data-theme="dark"] .button.button--secondary {
+ --ifm-button-background-color: var(--ifm-panel-background);
+ --ifm-button-border-color: var(--ifm-panel-border-color);
+ --ifm-button-color: var(--ifm-panel-color);
+ color: var(--ifm-button-color);
+}
+html[data-theme="dark"] .button.button--secondary:hover {
+ --ifm-button-background-color: var(--ifm-panel-background-active);
+ --ifm-button-border-color: var(--ifm-panel-border-color-active);
+ --ifm-button-color: var(--ifm-panel-color-active);
+ box-shadow: var(--ifm-panel-box-shadow-active);
+}
+
+/*
+ * svg
+ */
+
+html[data-theme="dark"] .container svg [fill="#000000"],
+html[data-theme="dark"] .footer svg [fill="#000000"],
+html[data-theme="dark"] .markdown svg [fill="#000000"],
+html[data-theme="dark"] .navbar__brand svg [fill="#000000"],
+html[data-theme="dark"] .sidebar__logo svg [fill="#000000"] {
+ fill: var(--ifm-heading-color);
+}
+html[data-theme="dark"] .container svg [stroke="#000000"],
+html[data-theme="dark"] .footer svg [stroke="#000000"],
+html[data-theme="dark"] .markdown svg [stroke="#000000"],
+html[data-theme="dark"] .navbar__brand svg [stroke="#000000"],
+html[data-theme="dark"] .sidebar__logo svg [stroke="#000000"] {
+ stroke: var(--ifm-heading-color);
+}
+html[data-theme="dark"] .container svg [stop-color="#000000"],
+html[data-theme="dark"] .footer svg [stop-color="#000000"],
+html[data-theme="dark"] .markdown svg [stop-color="#000000"],
+html[data-theme="dark"] .navbar__brand svg [stop-color="#000000"],
+html[data-theme="dark"] .sidebar__logo svg [stop-color="#000000"] {
+ stop-color: var(--ifm-heading-color);
+}
+html[data-theme="dark"] .container svg [fill="#FFFFFF"],
+html[data-theme="dark"] .footer svg [fill="#FFFFFF"],
+html[data-theme="dark"] .markdown svg [fill="#FFFFFF"],
+html[data-theme="dark"] .navbar__brand svg [fill="#FFFFFF"],
+html[data-theme="dark"] .sidebar__logo svg [fill="#FFFFFF"] {
+ fill: var(--ifm-background-color);
+}
+html[data-theme="dark"] .container svg [stroke="#FFFFFF"],
+html[data-theme="dark"] .footer svg [stroke="#FFFFFF"],
+html[data-theme="dark"] .markdown svg [stroke="#FFFFFF"],
+html[data-theme="dark"] .navbar__brand svg [stroke="#FFFFFF"],
+html[data-theme="dark"] .sidebar__logo svg [stroke="#FFFFFF"] {
+ stroke: var(--ifm-background-color);
+}
+
+/*
+ * menu
+ */
+
+html[data-theme="dark"] .menu .menu__link.menu__link--sublist::after {
+ background-image: url('data:image/svg+xml;utf8,<svg alt="Arrow" xmlns="http://www.w3.org/2000/svg" width="14px" height="14px" viewBox="-6 -6 38 38"><path fill="rgba(255,255,255,0.3)" d="M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z"></path></svg>');
+}
+
+html[data-theme="dark"] input[type="checkbox"] {
+ background: var(--ifm-color-emphasis-200);
+}
+html[data-theme="dark"] input[type="checkbox"]:checked {
+ background-color: var(--ifm-color-primary);
+}
diff --git a/website-builder/src/exports/animatedGraph.js b/website-builder/src/exports/animatedGraph.js
new file mode 100644
index 0000000..17c7099
--- /dev/null
+++ b/website-builder/src/exports/animatedGraph.js
@@ -0,0 +1,91 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements. See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership. The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+import * as d3Timer from "d3-timer";
+
+const d3 = Object.assign({}, d3Timer);
+
+export default function animatedGraph(canvas) {
+ var context = canvas.getContext("2d"),
+ width = canvas.width,
+ height = canvas.height,
+ radius = 3,
+ minDistance = 60,
+ maxDistance = 45,
+ minDistance2 = minDistance * minDistance,
+ maxDistance2 = maxDistance * maxDistance;
+
+ var tau = 2 * Math.PI,
+ n = 200,
+ particles = new Array(n);
+
+ for (var i = 0; i < n; ++i) {
+ particles[i] = {
+ x: Math.random() * width,
+ y: Math.random() * height,
+ vx: 0,
+ vy: 0,
+ };
+ }
+
+ return d3.timer(function (elapsed) {
+ context.save();
+ context.clearRect(0, 0, width, height);
+
+ for (var i = 0; i < n; ++i) {
+ var p = particles[i];
+ p.x += p.vx;
+ if (p.x < -maxDistance) p.x += width + maxDistance * 2;
+ else if (p.x > width + maxDistance) p.x -= width + maxDistance * 2;
+ p.y += p.vy;
+ if (p.y < -maxDistance) p.y += height + maxDistance * 2;
+ else if (p.y > height + maxDistance)
+ p.y -= height + maxDistance * 2;
+ p.vx += 0.2 * (Math.random() - 0.5) - 0.01 * p.vx;
+ p.vy += 0.2 * (Math.random() - 0.5) - 0.01 * p.vy;
+ context.beginPath();
+ context.arc(p.x, p.y, radius, 0, tau);
+ context.fillStyle = "rgba(40,217,242,0.4)";
+ context.fill();
+ }
+
+ for (var i = 0; i < n; ++i) {
+ for (var j = i + 1; j < n; ++j) {
+ var pi = particles[i],
+ pj = particles[j],
+ dx = pi.x - pj.x,
+ dy = pi.y - pj.y,
+ d2 = dx * dx + dy * dy;
+ if (d2 < maxDistance2) {
+ context.globalAlpha =
+ d2 > minDistance2
+ ? (maxDistance2 - d2) /
+ (maxDistance2 - minDistance2)
+ : 1;
+ context.beginPath();
+ context.moveTo(pi.x, pi.y);
+ context.lineTo(pj.x, pj.y);
+ context.strokeStyle = "rgba(40,217,242,0.3)";
+ context.stroke();
+ }
+ }
+ }
+
+ context.restore();
+ });
+}
diff --git a/website-builder/src/exports/cloudify.js b/website-builder/src/exports/cloudify.js
new file mode 100644
index 0000000..c07fa39
--- /dev/null
+++ b/website-builder/src/exports/cloudify.js
@@ -0,0 +1,342 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements. See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership. The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+let $ = null;
+let SVG = null;
+
+if (typeof document !== "undefined") {
+ $ = require("cash-dom");
+ SVG = require("svg.js");
+}
+
+export default function cloudify() {
+ var SVG_INSTANCE = SVG("component-canvas").size("100%", "100%");
+ var CANVAS = SVG_INSTANCE.group();
+
+ // ----------------------------------------
+ // PAGE RESIZING
+ // Only runs on initial load, not window resize
+
+ if ($(window).width() >= 1000) {
+ var CANVAS_SIZE = 1000;
+ var CANVAS_OFFSET_X = 500;
+ var CANVAS_OFFSET_Y = 500;
+ $(".components").addClass("initial-large");
+ } else {
+ var CANVAS_SIZE = 800;
+ var CANVAS_OFFSET_X = 400;
+ var CANVAS_OFFSET_Y = 400;
+ $(".components").addClass("initial-small");
+ }
+
+ function setCanvasOffsets() {
+ CANVAS_OFFSET_X = $(".components").innerWidth() / 2;
+ CANVAS_OFFSET_Y = $(".components").innerHeight() / 2;
+ CANVAS.transform({
+ x: CANVAS_OFFSET_X,
+ y: CANVAS_OFFSET_Y,
+ });
+ }
+ setCanvasOffsets();
+ $(window).on("resize", setCanvasOffsets);
+
+ // ----------------------------------------
+ // VECTORS
+
+ var Vector = function (_x, _y) {
+ this.x = _x || 0;
+ this.y = _y || 0;
+
+ this.dist = function (vector) {
+ var dx = this.x - vector.x;
+ var dy = this.y - vector.y;
+ return Math.sqrt(dx * dx + dy * dy);
+ };
+
+ this.minus = function (vector) {
+ return new Vector(this.x - vector.x, this.y - vector.y);
+ };
+
+ this.scale = function (scale) {
+ this.x *= scale;
+ this.y *= scale;
+ };
+
+ this.apply = function (vector) {
+ this.x += vector.x;
+ this.y += vector.y;
+ };
+
+ this.length = function () {
+ return Math.sqrt(this.x * this.x + this.y * this.y);
+ };
+ };
+
+ // ----------------------------------------
+ // NODES
+
+ var NODES = [];
+ if ($(window).width() >= 1000) {
+ var RADIUS_SMALL = 25;
+ var RADIUS_MEDIUM = 45;
+ var RADIUS_LARGE = 60;
+ } else {
+ var RADIUS_SMALL = 18;
+ var RADIUS_MEDIUM = 38;
+ var RADIUS_LARGE = 50;
+ }
+ var RADIUS_ANIMATION_SPEED = 0.15;
+ var TEXT_ANIMATION_SPEED = 0.1;
+ var GRAY = "#bdbecf";
+ var GRAY_TXT = "#8183A4";
+ var Node = function (_home, _label) {
+ this.home = _home; // Home position
+ this.pos = new Vector(_home.x, _home.y); // Current position
+ this.radius = RADIUS_SMALL;
+ this.targetRadius = this.radius;
+ this.textOpacity = 0;
+ this.targetTextOpacity = 0;
+ this.label = _label;
+ this.defaultStyle = "small";
+ this.currentStyle = "small";
+ this.url = null;
+ NODES.push(this);
+
+ // Initialize
+ this.svgGroup = CANVAS.group();
+ this.svgGroup.addClass("item");
+ this.svgCircle = this.svgGroup.circle();
+ this.svgCircle.fill("#fff").stroke(GRAY);
+ this.svgText = this.svgGroup.text(this.label);
+ this.svgText.font({
+ family: "open-sans, helvetica neue, helvetica",
+ size: 12,
+ anchor: "middle",
+ leading: "1.2em",
+ });
+ if (this.label.indexOf("\n") == -1) {
+ this.svgText.transform({
+ y: -9,
+ });
+ } else {
+ this.svgText.transform({
+ y: -16,
+ });
+ }
+
+ // Click events:
+ var self = this;
+ this.svgGroup.click(function () {
+ if (self.url) {
+ window.location = self.url;
+ }
+ });
+
+ this.setStyle = function (style) {
+ if (this.currentStyle == style) return;
+
+ var targetStyle = style;
+ if (targetStyle == "default") targetStyle = this.defaultStyle;
+
+ if (targetStyle == "large") {
+ this.targetRadius = RADIUS_LARGE;
+ this.targetTextOpacity = 1;
+ this.svgGroup.addClass("large");
+ } else if (targetStyle == "large-hover") {
+ this.targetRadius = RADIUS_LARGE;
+ this.targetTextOpacity = 1;
+ this.svgGroup.addClass("large");
+ } else if (targetStyle == "medium") {
+ this.targetRadius = RADIUS_MEDIUM;
+ this.targetTextOpacity = 1;
+ this.svgGroup.removeClass("large");
+ } else if (targetStyle == "small") {
+ this.targetRadius = RADIUS_SMALL;
+ this.targetTextOpacity = 0;
+ this.svgGroup.removeClass("large");
+ }
+
+ this.currentStyle = targetStyle;
+ };
+
+ this.draw = function () {
+ // size
+ this.radius +=
+ (this.targetRadius - this.radius) * RADIUS_ANIMATION_SPEED;
+ var d = this.radius * 2;
+ this.svgCircle.size(d, d);
+ // text
+ this.textOpacity +=
+ (this.targetTextOpacity - this.textOpacity) *
+ TEXT_ANIMATION_SPEED;
+ this.svgText.opacity(this.textOpacity);
+ // position
+ this.svgGroup.transform({
+ x: this.pos.x,
+ y: this.pos.y,
+ });
+ };
+ };
+
+ var EDGES = [];
+ var Edge = function (_n1, _n2) {
+ this.n1 = _n1;
+ this.n2 = _n2;
+ this.homeLength = this.n1.home.dist(this.n2.home);
+ EDGES.push(this);
+
+ this.length = function () {
+ return this.n1.pos.dist(this.n2.pos);
+ };
+ };
+
+ // ----------------------------------------
+ // INITIAL NODE & EDGE CREATION
+
+ var HOME_RADIUS = 0.3 * CANVAS_SIZE;
+ var RADIUS_VARIANCE = 0.1;
+ var INITIAL_RADIUS_SCALE = 0.1;
+
+ var elements = $(".components li");
+ elements.each(function (i, e) {
+ var el = $(e);
+ var p = (i / elements.length) * Math.PI * 2;
+ var r =
+ HOME_RADIUS + Math.random() * RADIUS_VARIANCE - RADIUS_VARIANCE / 2;
+
+ var home = new Vector(Math.sin(p) * r, Math.cos(p) * r);
+
+ var label = el.text();
+ label = label.replace(" ", "\n");
+ var n = new Node(home, label);
+
+ n.pos = new Vector(
+ Math.sin(p) * r * INITIAL_RADIUS_SCALE,
+ Math.cos(p) * r * INITIAL_RADIUS_SCALE
+ );
+
+ if (el.hasClass("medium")) {
+ n.defaultStyle = "medium";
+ } else if (el.hasClass("large")) {
+ n.defaultStyle = "large";
+ }
+
+ var url = $("a", e).attr("href");
+ if (url) {
+ n.url = url;
+ }
+
+ n.setStyle("default");
+ n.draw();
+ });
+
+ // Create Edges
+ var EDGE_SPAN = 12;
+ for (var i = 0; i < NODES.length; i++) {
+ var n1 = NODES[i];
+ for (var j = 1; j < EDGE_SPAN; j++) {
+ var n2 = NODES[(i + j) % NODES.length];
+ new Edge(n1, n2);
+ }
+ }
+
+ // ----------------------------------------
+ // FORCES & ANIMATION
+
+ var EDGE_FORCE = 0.3;
+ var EDGE_PADDING = 30;
+
+ function applyEdgeForces() {
+ for (var e in EDGES) {
+ var edge = EDGES[e];
+
+ // Edge lengths
+ var min_length = edge.n1.radius + edge.n2.radius;
+ min_length += EDGE_PADDING;
+ var target_length = min_length;
+ var length = edge.length();
+
+ // Collisions
+ if (length < min_length) {
+ // Calculate forces
+ var force = edge.n1.pos.minus(edge.n2.pos);
+ var stretch = length - min_length;
+ force.scale((stretch / length) * EDGE_FORCE);
+ // Apply forces
+ edge.n2.pos.apply(force);
+ force.scale(-1);
+ edge.n1.pos.apply(force);
+ }
+ }
+ }
+
+ function applyHomeForces() {
+ var HOME_FORCE = 0.1;
+ for (var n in NODES) {
+ var node = NODES[n];
+ var diff = node.home.minus(node.pos);
+ diff.scale(HOME_FORCE);
+ node.pos.apply(diff);
+ }
+ }
+
+ function redraw() {
+ for (var n in NODES) {
+ NODES[n].draw();
+ }
+ }
+
+ var ANIMATION_TIMER = null;
+
+ function startAnimation() {
+ if (ANIMATION_TIMER != null) return;
+ ANIMATION_TIMER = setInterval(function () {
+ applyHomeForces();
+ applyEdgeForces();
+ redraw();
+ }, 1000 / 40);
+ }
+
+ setTimeout(function () {
+ startAnimation();
+ }, 300);
+
+ // ----------------------------------------
+ // MOUSE MOVEMENTS
+
+ $("#component-canvas").on("mousemove", function (e) {
+ var offset = $("#component-canvas").offset();
+ var mouse = new Vector(
+ e.pageX - offset.left - CANVAS_OFFSET_X,
+ e.pageY - offset.top - CANVAS_OFFSET_Y
+ );
+
+ for (var n in NODES) {
+ var node = NODES[n];
+ var dist = mouse.dist(node.pos);
+
+ if (dist < 100) {
+ node.setStyle("large-hover");
+ } else if (dist < 210 && node.defaultStyle != "large") {
+ node.setStyle("large");
+ } else {
+ node.setStyle("default");
+ }
+ }
+ });
+}
diff --git a/website-builder/src/exports/newPost.js b/website-builder/src/exports/newPost.js
new file mode 100644
index 0000000..fd18599
--- /dev/null
+++ b/website-builder/src/exports/newPost.js
@@ -0,0 +1,53 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements. See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership. The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+import useDocusaurusContext from "@docusaurus/useDocusaurusContext";
+
+export function fetchNewPost() {
+ const context = useDocusaurusContext();
+ const { siteConfig = {} } = context;
+ const {
+ metadata: { latest_post: latestPost },
+ } = siteConfig.customFields;
+ const date = Date.parse(latestPost.date);
+ const now = new Date();
+ const diffTime = Math.abs(now - date);
+ const diffDays = Math.ceil(diffTime / (1000 * 60 * 60 * 24));
+
+ let viewedAt = null;
+
+ if (typeof window !== "undefined") {
+ viewedAt = new Date(
+ parseInt(window.localStorage.getItem("blogViewedAt") || "0")
+ );
+ }
+
+ if (diffDays < 30 && (!viewedAt || viewedAt < date)) {
+ return latestPost;
+ }
+
+ return null;
+}
+
+export function viewedNewPost() {
+ if (typeof window !== "undefined") {
+ window.localStorage.setItem("blogViewedAt", new Date().getTime());
+ }
+}
+
+export default { fetchNewPost, viewedNewPost };
diff --git a/website-builder/src/exports/newRelease.js b/website-builder/src/exports/newRelease.js
new file mode 100644
index 0000000..41df0d5
--- /dev/null
+++ b/website-builder/src/exports/newRelease.js
@@ -0,0 +1,56 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements. See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership. The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+import useDocusaurusContext from "@docusaurus/useDocusaurusContext";
+
+export function fetchNewRelease() {
+ const context = useDocusaurusContext();
+ const { siteConfig = {} } = context;
+ const {
+ metadata: { latest_release: latestRelease },
+ } = siteConfig.customFields;
+ const releaseDate = Date.parse(latestRelease.date);
+ const releaseNow = new Date();
+ const releaseDiffTime = Math.abs(releaseNow - releaseDate);
+ const releaseDiffDays = Math.ceil(releaseDiffTime / (1000 * 60 * 60 * 24));
+
+ let releaseViewedAt = null;
+
+ if (typeof window !== "undefined") {
+ releaseViewedAt = new Date(
+ parseInt(window.localStorage.getItem("releaseViewedAt") || "0")
+ );
+ }
+
+ if (
+ releaseDiffDays < 30 &&
+ (!releaseViewedAt || releaseViewedAt < releaseDate)
+ ) {
+ return latestRelease;
+ }
+
+ return null;
+}
+
+export function viewedNewRelease() {
+ if (typeof window !== "undefined") {
+ window.localStorage.setItem("releaseViewedAt", new Date().getTime());
+ }
+}
+
+export default { fetchNewRelease, viewedNewRelease };
diff --git a/website-builder/src/exports/repoUrl.js b/website-builder/src/exports/repoUrl.js
new file mode 100644
index 0000000..48667b2
--- /dev/null
+++ b/website-builder/src/exports/repoUrl.js
@@ -0,0 +1,26 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements. See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership. The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+import useDocusaurusContext from "@docusaurus/useDocusaurusContext";
+
+export default function repoUrl(url) {
+ const { siteConfig } = useDocusaurusContext();
+ const githubHost = siteConfig.githubHost || "github.com";
+
+ return `https://${githubHost}/${siteConfig.organizationName}/${siteConfig.projectName}`;
+}
diff --git a/website-builder/src/pages/download.css b/website-builder/src/pages/download.css
new file mode 100644
index 0000000..b78e845
--- /dev/null
+++ b/website-builder/src/pages/download.css
@@ -0,0 +1,28 @@
+/**
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements. See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership. The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+.componentsHero {
+ padding: 0;
+ margin: 0;
+ overflow: hidden;
+}
+
+.componentsHeroOverlay {
+ margin-top: -15.25em;
+ margin-bottom: 2em;
+}
diff --git a/website-builder/src/pages/download.js b/website-builder/src/pages/download.js
new file mode 100644
index 0000000..c224acf
--- /dev/null
+++ b/website-builder/src/pages/download.js
@@ -0,0 +1,371 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements. See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership. The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+import React from "react";
+
+import Layout from "@theme/Layout";
+
+import styles from "./download.css";
+import useDocusaurusContext from "@docusaurus/useDocusaurusContext";
+
+function Download() {
+ const context = useDocusaurusContext();
+ const { siteConfig = {} } = context;
+
+ return (
+ <Layout title="Download" description="Download Pinots versions">
+ <header className="hero">
+ <div className="container container--fluid">
+ <h1>Download</h1>
+ <div className="hero--subtitle">
+ Be sure to verify your downloads by these{" "}
+ <a href="https://www.apache.org/info/verification">
+ procedures
+ </a>{" "}
+ using these{" "}
+ <a href="https://downloads.apache.org/incubator/pinot/KEYS">
+ KEYS
+ </a>{" "}
+ for any Apache release.
+ </div>
+ </div>
+ </header>
+ <main>
+ <section>
+ <div className="container">
+ <div className="row">
+ <div className="col">
+ <a
+ href="https://www.apache.org/dyn/closer.lua/incubator/pinot/apache-pinot-incubating-0.7.1/apache-pinot-incubating-0.7.1-bin.tar.gz"
+ className="panel panel--link text--center"
+ >
+ <div className="panel--icon">
+ <i className="feather icon-download"></i>
+ </div>
+
+ <div className="panel--title">0.7.1</div>
+
+ <a href="https://www.apache.org/dyn/closer.lua/incubator/pinot/apache-pinot-incubating-0.7.1/apache-pinot-incubating-0.7.1-src.tar.gz">
+ <div className="panel--title">
+ Official source release
+ </div>
+ </a>
+ <a href="https://downloads.apache.org/incubator/pinot/apache-pinot-incubating-0.7.1/apache-pinot-incubating-0.7.1-src.tar.gz.sha512">
+ <div className="panel--subtitle">
+ SHA512
+ </div>
+ </a>
+ <a href="https://downloads.apache.org/incubator/pinot/apache-pinot-incubating-0.7.1/apache-pinot-incubating-0.7.1-src.tar.gz.asc">
+ <div className="panel--subtitle">
+ ASC
+ </div>
+ </a>
+
+ <a href="https://www.apache.org/dyn/closer.lua/incubator/pinot/apache-pinot-incubating-0.7.1/apache-pinot-incubating-0.7.1-bin.tar.gz">
+ <div className="panel--title">
+ Official binary release
+ </div>
+ </a>
+ <a href="https://downloads.apache.org/incubator/pinot/apache-pinot-incubating-0.7.1/apache-pinot-incubating-0.7.1-bin.tar.gz.sha512">
+ <div className="panel--subtitle">
+ SHA512
+ </div>
+ </a>
+ <a href="https://downloads.apache.org/incubator/pinot/apache-pinot-incubating-0.7.1/apache-pinot-incubating-0.7.1-bin.tar.gz.asc">
+ <div className="panel--subtitle">
+ ASC{" "}
+ </div>
+ </a>
+ </a>
+ </div>
+ <div className="col">
+ <a
+ href="https://www.apache.org/dyn/closer.lua/incubator/pinot/apache-pinot-incubating-0.6.0/apache-pinot-incubating-0.6.0-bin.tar.gz"
+ className="panel panel--link text--center"
+ >
+ <div className="panel--icon">
+ <i className="feather icon-download"></i>
+ </div>
+
+ <div className="panel--title">0.6.0</div>
+
+ <a href="https://www.apache.org/dyn/closer.lua/incubator/pinot/apache-pinot-incubating-0.6.0/apache-pinot-incubating-0.6.0-src.tar.gz">
+ <div className="panel--title">
+ Official source release
+ </div>
+ </a>
+ <a href="https://downloads.apache.org/incubator/pinot/apache-pinot-incubating-0.6.0/apache-pinot-incubating-0.6.0-src.tar.gz.sha512">
+ <div className="panel--subtitle">
+ SHA512
+ </div>
+ </a>
+ <a href="https://downloads.apache.org/incubator/pinot/apache-pinot-incubating-0.6.0/apache-pinot-incubating-0.6.0-src.tar.gz.asc">
+ <div className="panel--subtitle">
+ ASC
+ </div>
+ </a>
+
+ <a href="https://www.apache.org/dyn/closer.lua/incubator/pinot/apache-pinot-incubating-0.6.0/apache-pinot-incubating-0.6.0-bin.tar.gz">
+ <div className="panel--title">
+ Official binary release
+ </div>
+ </a>
+ <a href="https://downloads.apache.org/incubator/pinot/apache-pinot-incubating-0.6.0/apache-pinot-incubating-0.6.0-bin.tar.gz.sha512">
+ <div className="panel--subtitle">
+ SHA512
+ </div>
+ </a>
+ <a href="https://downloads.apache.org/incubator/pinot/apache-pinot-incubating-0.6.0/apache-pinot-incubating-0.6.0-bin.tar.gz.asc">
+ <div className="panel--subtitle">
+ ASC{" "}
+ </div>
+ </a>
+ </a>
+ </div>
+ <div className="col">
+ <a
+ href="https://www.apache.org/dyn/closer.lua/incubator/pinot/apache-pinot-incubating-0.5.0/apache-pinot-incubating-0.5.0-bin.tar.gz"
+ className="panel panel--link text--center"
+ >
+ <div className="panel--icon">
+ <i className="feather icon-download"></i>
+ </div>
+
+ <div className="panel--title">0.5.0</div>
+
+ <a href="https://www.apache.org/dyn/closer.lua/incubator/pinot/apache-pinot-incubating-0.5.0/apache-pinot-incubating-0.5.0-src.tar.gz">
+ <div className="panel--title">
+ Official source release
+ </div>
+ </a>
+ <a href="https://downloads.apache.org/incubator/pinot/apache-pinot-incubating-0.5.0/apache-pinot-incubating-0.5.0-src.tar.gz.sha512">
+ <div className="panel--subtitle">
+ SHA512
+ </div>
+ </a>
+ <a href="https://downloads.apache.org/incubator/pinot/apache-pinot-incubating-0.5.0/apache-pinot-incubating-0.5.0-src.tar.gz.asc">
+ <div className="panel--subtitle">
+ ASC
+ </div>
+ </a>
+
+ <a href="https://www.apache.org/dyn/closer.lua/incubator/pinot/apache-pinot-incubating-0.5.0/apache-pinot-incubating-0.5.0-bin.tar.gz">
+ <div className="panel--title">
+ Official binary release
+ </div>
+ </a>
+ <a href="https://downloads.apache.org/incubator/pinot/apache-pinot-incubating-0.5.0/apache-pinot-incubating-0.5.0-bin.tar.gz.sha512">
+ <div className="panel--subtitle">
+ SHA512
+ </div>
+ </a>
+ <a href="https://downloads.apache.org/incubator/pinot/apache-pinot-incubating-0.5.0/apache-pinot-incubating-0.5.0-bin.tar.gz.asc">
+ <div className="panel--subtitle">
+ ASC{" "}
+ </div>
+ </a>
+ </a>
+ </div>
+ <div className="col">
+ <a
+ href="https://www.apache.org/dyn/closer.lua/incubator/pinot/apache-pinot-incubating-0.4.0/apache-pinot-incubating-0.4.0-bin.tar.gz"
+ className="panel panel--link text--center"
+ >
+ <div className="panel--icon">
+ <i className="feather icon-download"></i>
+ </div>
+
+ <div className="panel--title">0.4.0</div>
+
+ <a href="https://www.apache.org/dyn/closer.lua/incubator/pinot/apache-pinot-incubating-0.4.0/apache-pinot-incubating-0.4.0-src.tar.gz">
+ <div className="panel--title">
+ Official source release
+ </div>
+ </a>
+ <a href="https://downloads.apache.org/incubator/pinot/apache-pinot-incubating-0.4.0/apache-pinot-incubating-0.4.0-src.tar.gz.sha512">
+ <div className="panel--subtitle">
+ SHA512
+ </div>
+ </a>
+ <a href="https://downloads.apache.org/incubator/pinot/apache-pinot-incubating-0.4.0/apache-pinot-incubating-0.4.0-src.tar.gz.asc">
+ <div className="panel--subtitle">
+ ASC
+ </div>
+ </a>
+
+ <a href="https://www.apache.org/dyn/closer.lua/incubator/pinot/apache-pinot-incubating-0.4.0/apache-pinot-incubating-0.4.0-bin.tar.gz">
+ <div className="panel--title">
+ Official binary release
+ </div>
+ </a>
+ <a href="https://downloads.apache.org/incubator/pinot/apache-pinot-incubating-0.4.0/apache-pinot-incubating-0.4.0-bin.tar.gz.sha512">
+ <div className="panel--subtitle">
+ SHA512
+ </div>
+ </a>
+ <a href="https://downloads.apache.org/incubator/pinot/apache-pinot-incubating-0.4.0/apache-pinot-incubating-0.4.0-bin.tar.gz.asc">
+ <div className="panel--subtitle">
+ ASC{" "}
+ </div>
+ </a>
+ </a>
+ </div>
+
+ <div className="col">
+ <a
+ href="https://www.apache.org/dyn/closer.lua/incubator/pinot/apache-pinot-incubating-0.3.0/apache-pinot-incubating-0.3.0-bin.tar.gz"
+ className="panel panel--link text--center"
+ >
+ <div className="panel--icon">
+ <i className="feather icon-download"></i>
+ </div>
+
+ <div className="panel--title">0.3.0</div>
+
+ <a href="https://www.apache.org/dyn/closer.lua/incubator/pinot/apache-pinot-incubating-0.3.0/apache-pinot-incubating-0.3.0-src.tar.gz">
+ <div className="panel--title">
+ Official source release
+ </div>
+ </a>
+ <a href="https://downloads.apache.org/incubator/pinot/apache-pinot-incubating-0.3.0/apache-pinot-incubating-0.3.0-src.tar.gz.sha512">
+ <div className="panel--subtitle">
+ SHA512
+ </div>
+ </a>
+ <a href="https://downloads.apache.org/incubator/pinot/apache-pinot-incubating-0.3.0/apache-pinot-incubating-0.3.0-src.tar.gz.asc">
+ <div className="panel--subtitle">
+ ASC
+ </div>
+ </a>
+
+ <a href="https://www.apache.org/dyn/closer.lua/incubator/pinot/apache-pinot-incubating-0.3.0/apache-pinot-incubating-0.3.0-bin.tar.gz">
+ <div className="panel--title">
+ Official binary release
+ </div>
+ </a>
+ <a href="https://downloads.apache.org/incubator/pinot/apache-pinot-incubating-0.3.0/apache-pinot-incubating-0.3.0-bin.tar.gz.sha512">
+ <div className="panel--subtitle">
+ SHA512
+ </div>
+ </a>
+ <a href="https://downloads.apache.org/incubator/pinot/apache-pinot-incubating-0.3.0/apache-pinot-incubating-0.3.0-bin.tar.gz.asc">
+ <div className="panel--subtitle">
+ ASC{" "}
+ </div>
+ </a>
+ </a>
+ </div>
+
+ <div className="col">
+ <a
+ href="https://www.apache.org/dyn/closer.lua/incubator/pinot/apache-pinot-incubating-0.2.0/apache-pinot-incubating-0.2.0-bin.tar.gz"
+ className="panel panel--link text--center"
+ >
+ <div className="panel--icon">
+ <i className="feather icon-download"></i>
+ </div>
+
+ <div className="panel--title">0.2.0</div>
+
+ <a href="https://www.apache.org/dyn/closer.lua/incubator/pinot/apache-pinot-incubating-0.2.0/apache-pinot-incubating-0.2.0-src.tar.gz">
+ <div className="panel--title">
+ Official source release
+ </div>
+ </a>
+ <a href="https://downloads.apache.org/incubator/pinot/apache-pinot-incubating-0.2.0/apache-pinot-incubating-0.2.0-src.tar.gz.sha512">
+ <div className="panel--subtitle">
+ SHA512
+ </div>
+ </a>
+ <a href="https://downloads.apache.org/incubator/pinot/apache-pinot-incubating-0.2.0/apache-pinot-incubating-0.2.0-src.tar.gz.asc">
+ <div className="panel--subtitle">
+ ASC
+ </div>
+ </a>
+
+ <a href="https://www.apache.org/dyn/closer.lua/incubator/pinot/apache-pinot-incubating-0.2.0/apache-pinot-incubating-0.2.0-bin.tar.gz">
+ <div className="panel--title">
+ Official binary release
+ </div>
+ </a>
+ <a href="https://downloads.apache.org/incubator/pinot/apache-pinot-incubating-0.2.0/apache-pinot-incubating-0.2.0-bin.tar.gz.sha512">
+ <div className="panel--subtitle">
+ SHA512
+ </div>
+ </a>
+ <a href="https://downloads.apache.org/incubator/pinot/apache-pinot-incubating-0.2.0/apache-pinot-incubating-0.2.0-bin.tar.gz.asc">
+ <div className="panel--subtitle">
+ ASC{" "}
+ </div>
+ </a>
+ </a>
+ </div>
+
+ <div className="col">
+ <a
+ href="https://www.apache.org/dyn/closer.lua/incubator/pinot/apache-pinot-incubating-0.1.0/apache-pinot-incubating-0.1.0-bin.tar.gz"
+ className="panel panel--link text--center"
+ >
+ <div className="panel--icon">
+ <i className="feather icon-download"></i>
+ </div>
+
+ <div className="panel--title">0.1.0</div>
+
+ <a href="https://www.apache.org/dyn/closer.lua/incubator/pinot/apache-pinot-incubating-0.1.0/apache-pinot-incubating-0.1.0-src.tar.gz">
+ <div className="panel--title">
+ Official source release
+ </div>
+ </a>
+ <a href="https://downloads.apache.org/incubator/pinot/apache-pinot-incubating-0.1.0/apache-pinot-incubating-0.1.0-src.tar.gz.sha512">
+ <div className="panel--subtitle">
+ SHA512
+ </div>
+ </a>
+ <a href="https://downloads.apache.org/incubator/pinot/apache-pinot-incubating-0.1.0/apache-pinot-incubating-0.1.0-src.tar.gz.asc">
+ <div className="panel--subtitle">
+ ASC
+ </div>
+ </a>
+
+ <a href="https://www.apache.org/dyn/closer.lua/incubator/pinot/apache-pinot-incubating-0.1.0/apache-pinot-incubating-0.1.0-bin.tar.gz">
+ <div className="panel--title">
+ Official binary release
+ </div>
+ </a>
+ <a href="https://downloads.apache.org/incubator/pinot/apache-pinot-incubating-0.1.0/apache-pinot-incubating-0.1.0-bin.tar.gz.sha512">
+ <div className="panel--subtitle">
+ SHA512
+ </div>
+ </a>
+ <a href="https://downloads.apache.org/incubator/pinot/apache-pinot-incubating-0.1.0/apache-pinot-incubating-0.1.0-bin.tar.gz.asc">
+ <div className="panel--subtitle">
+ ASC
+ </div>
+ </a>
+ </a>
+ </div>
+ </div>
+ </div>
+ </section>
+ </main>
+ </Layout>
+ );
+}
+
+export default Download;
diff --git a/website-builder/src/pages/index.css b/website-builder/src/pages/index.css
new file mode 100644
index 0000000..6b2a2cb
--- /dev/null
+++ b/website-builder/src/pages/index.css
@@ -0,0 +1,143 @@
+.integrations g.item circle {
+ fill: var(--ifm-background-color);
+ stroke: var(--ifm-heading-color);
+}
+
+.integrations g.item text {
+ fill: var(--ifm-color-content);
+}
+
+.integrations g.item.large circle {
+ stroke: var(--ifm-panel-border-color-active);
+}
+
+.integrations g.item.large text {
+ fill: var(--ifm-color-primary);
+}
+
+.integrations g.item:hover circle {
+ fill: var(--ifm-panel-background-active);
+ stroke: var(--ifm-panel-border-color-active);
+}
+
+.integrations g.item:hover text {
+ fill: var(--ifm-color-primary);
+}
+
+/*
+ * Configuration Section
+ */
+
+.configuration__diagram svg {
+ margin-left: -4%;
+ margin-bottom: var(--ifm-spacing-vertical);
+ width: calc(100% + 4%);
+ height: 100%;
+}
+
+.configuration__diagram svg #config-file-bg {
+ fill: var(--ifm-panel-background);
+ stroke: var(--ifm-panel-border-color);
+}
+
+.image-overview {
+ flex: 1.3;
+ width: null;
+ height: null;
+ margin: 15px 10px 15px 15px;
+ padding: 0;
+}
+
+/* Shine */
+.hover14 figure {
+ position: relative;
+}
+.hover14 figure::before {
+ position: absolute;
+ top: 0;
+ left: -75%;
+ z-index: 2;
+ display: block;
+ content: "";
+ width: 50%;
+ height: 100%;
+ background: -webkit-linear-gradient(
+ left,
+ rgba(255, 255, 255, 0) 0%,
+ rgba(255, 255, 255, 0.3) 100%
+ );
+ background: linear-gradient(
+ to right,
+ rgba(255, 255, 255, 0) 0%,
+ rgba(255, 255, 255, 0.3) 100%
+ );
+ -webkit-transform: skewX(-25deg);
+ transform: skewX(-25deg);
+}
+.hover14 figure:hover::before {
+ -webkit-animation: shine 0.75s;
+ animation: shine 0.75s;
+}
+@-webkit-keyframes shine {
+ 100% {
+ left: 125%;
+ }
+}
+@keyframes shine {
+ 100% {
+ left: 125%;
+ }
+}
+
+@media (max-width: 996px) {
+ .configuration__diagram {
+ margin: 0 auto;
+ overflow: hidden;
+ max-width: 500px;
+ }
+ .configuration__diagram svg {
+ padding-left: 20px;
+ width: 235%;
+ }
+ .configuration__diagram svg #Line-6,
+ .configuration__diagram svg .config-section-description {
+ display: none;
+ }
+}
+
+.svg {
+ display: block;
+ margin: var(--ifm-heading-margin-bottom) auto;
+ max-height: 100%;
+ max-width: 100%;
+ display: flex;
+ justify-content: center;
+ width: auto;
+ height: auto;
+ display: block;
+}
+
+/* fallback */
+@font-face {
+ font-family: "Material Icons";
+ font-style: normal;
+ font-weight: 400;
+ src: url(https://fonts.gstatic.com/s/materialicons/v50/flUhRq6tzZclQEJ-Vdg-IuiaDsNcIhQ8tQ.woff2)
+ format("woff2");
+}
+
+.material-icons {
+ font-family: "Material Icons";
+ font-weight: normal;
+ font-style: normal;
+ font-size: 24px;
+ line-height: 1;
+ letter-spacing: normal;
+ text-transform: none;
+ display: inline-block;
+ white-space: nowrap;
+ word-wrap: normal;
+ direction: ltr;
+ -webkit-font-feature-settings: "liga";
+ -webkit-font-smoothing: antialiased;
+}
diff --git a/website-builder/src/pages/index.js b/website-builder/src/pages/index.js
new file mode 100755
index 0000000..0c513d0
--- /dev/null
+++ b/website-builder/src/pages/index.js
@@ -0,0 +1,405 @@
+// /**
+// * Copyright (c) 2017-present, Facebook, Inc.
+// *
+// * This source code is licensed under the MIT license found in the
+// * LICENSE file in the root directory of this source tree.
+// */
+
+import React, { useState, useEffect } from "react";
+
+import CodeBlock from "@theme/CodeBlock";
+import Heading from "@theme/Heading";
+import Jump from "@site/src/components/Jump";
+import Layout from "@theme/Layout";
+import Link from "@docusaurus/Link";
+import SVG from "react-inlinesvg";
+import TabItem from "@theme/TabItem";
+import Tabs from "@theme/Tabs";
+
+import classnames from "classnames";
+import useDocusaurusContext from "@docusaurus/useDocusaurusContext";
+// import PinotOverview from '@site/static/img/pinot-overview.svg';
+
+import styles from "./index.module.css";
+import "./index.css";
+
+const AnchoredH2 = Heading("h2");
+
+const features = [
+ {
+ title: "Blazing Fast",
+ icon: "zap",
+ description: (
+ <>
+ Pinot is designed to answer OLAP queries with low latency on
+ immutable data
+ </>
+ ),
+ },
+ {
+ title: "Pluggable indexing",
+ icon: "unlock",
+ description: (
+ <>
+ Pluggable indexing technologies - Sorted Index, Bitmap Index,
+ Inverted Index
+ </>
+ ),
+ },
+ {
+ title: "Near Real time ingestion",
+ icon: "rss",
+ description: (
+ <>
+ Near Realtime ingestion with{" "}
+ <Link to="https://kafka.apache.org/">Apache Kafka</Link>{" "}
+ supports StringSerializer or{" "}
+ <Link to="https://avro.apache.org/">Avro</Link> formats
+ </>
+ ),
+ },
+ {
+ title: "Horizontally scalable",
+ icon: "code",
+ description: <>Horizontally scalable and fault tolerant</>,
+ },
+ {
+ title: "Joins using PrestoDB",
+ icon: "shuffle",
+ description: (
+ <>
+ Joins are currently not supported, but this problem can be
+ overcome by using{" "}
+ <Link to="https://prestodb.io/">PrestoDB</Link> for querying
+ </>
+ ),
+ },
+ {
+ title: "SQL-like Query Interface (PQL)",
+ icon: "search",
+ description: (
+ <>
+ SQL like language that supports selection, aggregation,
+ filtering, group by, order by, distinct queries on data
+ </>
+ ),
+ },
+ {
+ title: "Hybrid tables",
+ icon: "list",
+ description: (
+ <>
+ Consist of of{" "}
+ <Link to="http://pinot.apache.org/img/dynamic-table.png">
+ both offline and realtime table
+ </Link>
+ . Use realtime table only to cover segments for which offline
+ data may not be available yet
+ </>
+ ),
+ },
+ {
+ title: "Anomaly Detection",
+ icon: "bar-chart",
+ description: (
+ <>
+ Run ML Algorithms to detect Anomalies on the data stored in
+ Pinot. Use{" "}
+ <Link to="https://docs.pinot.apache.org/integrations/thirdeye">
+ ThirdEye
+ </Link>{" "}
+ with Pinot for Anomaly Detection and Root Cause Analysis
+ </>
+ ),
+ },
+ {
+ title: "Smart Alerts in ThirdEye",
+ icon: "bell",
+ description: (
+ <>
+ Detect the right anomalies by customizing anomaly detect flow
+ and notification flow
+ </>
+ ),
+ },
+];
+
+function Features({ features }) {
+ let rows = [];
+
+ let i,
+ j,
+ temparray,
+ chunk = 3;
+ for (i = 0, j = features.length; i < j; i += chunk) {
+ let featuresChunk = features.slice(i, i + chunk);
+
+ rows.push(
+ <div key={`features${i}`} className="row">
+ {featuresChunk.map((props, idx) => (
+ <Feature key={idx} {...props} />
+ ))}
+ </div>
+ );
+ }
+
+ return (
+ <section className={styles.features}>
+ <div className="container">
+ <AnchoredH2 id="features">Features</AnchoredH2>
+ {rows}
+ </div>
+ </section>
+ );
+}
+
+function Feature({ icon, title, description }) {
+ return (
+ <div className={classnames("col col--4", styles.feature)}>
+ <div className={styles.featureIcon}>
+ <i className={classnames("feather", `icon-${icon}`)}></i>
+ </div>
+ <h3>{title}</h3>
+ <p>{description}</p>
+ </div>
+ );
+}
+
+function WhoUses() {
+ return (
+ <section className="topologies">
+ <div className="container">
+ <AnchoredH2 id="who-uses">Who Uses?</AnchoredH2>
+ <div className="sub-title">
+ Pinot powers several big players, including LinkedIn, Uber,
+ Microsoft, Factual, Weibo, Slack and more
+ </div>
+
+ <div className={styles.installationPlatforms}>
+ <Link to="https://www.linkedin.com">
+ <SVG src="/img/companies/linkedin.svg" />
+ </Link>
+ <Link to="https://www.ubereats.com">
+ <SVG src="/img/companies/uber.svg" />
+ </Link>
+ <Link to="https://teams.microsoft.com">
+ <SVG src="/img/companies/microsoft-teams.svg" />
+ </Link>
+ <Link to="https://slack.com">
+ <SVG src="/img/companies/slack.svg" />
+ </Link>
+ <Link to="https://www.factual.com">
+ <SVG src="/img/companies/factual.svg" />
+ </Link>
+ <Link to="https://www.weibo.com">
+ <SVG src="/img/companies/weibo.svg" />
+ </Link>
+ </div>
+ </div>
+ </section>
+ );
+}
+
+function Usage() {
+ return (
+ <section className="topologies">
+ <div className="container">
+ <AnchoredH2 id="ingest-query">
+ Ingest and Query Options
+ </AnchoredH2>
+
+ <div className="sub-title">
+ Ingest with Kafka, Spark, HDFS or Cloud Storages
+ </div>
+ <div className="sub-title">
+ Query using PQL(Pinot Query Language ), SQL or
+ Presto(supports Joins)
+ </div>
+
+ <SVG
+ src="/img/ingest-query.svg"
+ className="svg image-overview figure"
+ />
+ </div>
+ </section>
+ );
+}
+// // <SVG src="/img/topologies-distributed.svg" className={styles.topologyDiagram} />
+
+function Installation() {
+ return (
+ <section className={styles.installation}>
+ <div className="container">
+ <AnchoredH2 id="installation">Installs Everywhere</AnchoredH2>
+ <div className="sub-title">
+ Pinot can be installed using docker with presto
+ </div>
+
+ <div className={styles.installationChecks}>
+ <div>
+ <i className="feather icon-package"></i> Helm or K8s
+ crds
+ </div>
+ <div>
+ <i className="feather icon-cpu"></i> On-Premise
+ </div>
+ <div>
+ <i className="feather icon-zap"></i> Public Cloud
+ </div>
+ <div>
+ <i className="feather icon-feather"></i> Locally
+ </div>
+ </div>
+
+ <h3 className={styles.installSubTitle}>Install:</h3>
+
+ <Tabs
+ className="mini"
+ defaultValue="helm"
+ values={[
+ {
+ label: (
+ <>
+ <i className="feather icon-download-cloud"></i>{" "}
+ Using Helm
+ </>
+ ),
+ value: "helm",
+ },
+ {
+ label: (
+ <>
+ <i className="feather icon-download"></i>{" "}
+ Using Binary
+ </>
+ ),
+ value: "binary",
+ },
+ {
+ label: (
+ <>
+ <i className="feather icon-github"></i>{" "}
+ Build From Source
+ </>
+ ),
+ value: "github",
+ },
+ ]}
+ >
+ <TabItem value="helm">
+ <CodeBlock className="language-bash">
+ {`helm repo add pinot https://raw.githubusercontent.com/apache/incubator-pinot/master/kubernetes/helm\nkubectl create ns pinot\nhelm install pinot pinot/pinot -n pinot --set cluster.name=pinot`}
+ </CodeBlock>
+ </TabItem>
+ <TabItem value="binary">
+ <CodeBlock className="language-bash">
+ {`VERSION=0.7.1\nwget https://downloads.apache.org/incubator/pinot/apache-pinot-incubating-$VERSION/apache-pinot-incubating-$VERSION-bin.tar.gz\ntar vxf apache-pinot-incubating-*-bin.tar.gz\ncd apache-pinot-incubating-*-bin\nbin/quick-start-batch.sh`}
+ </CodeBlock>
+ </TabItem>
+ <TabItem value="github">
+ <CodeBlock className="language-bash">
+ {`# Clone a repo\ngit clone https://github.com/apache/incubator-pinot.git\ncd incubator-pinot\n\n# Build Pinot\nmvn clean install -DskipTests -Pbin-dist\n\n# Run the Quick Demo\ncd pinot-distribution/target/apache-pinot-incubating-*-SNAPSHOT-bin/apache-pinot-incubating-*-SNAPSHOT-bin\nbin/quick-start-batch.sh`}
+ </CodeBlock>
+ </TabItem>
+ </Tabs>
+
+ <h3 className={styles.installSubTitle}>
+ Or choose your preferred method:
+ </h3>
+
+ <div className="row">
+ <div className="col">
+ <Jump to="https://docs.pinot.apache.org/getting-started/running-pinot-in-docker">
+ Containers
+ </Jump>
+ </div>
+ <div className="col">
+ <Jump to="https://docs.pinot.apache.org/getting-started/kubernetes-quickstart">
+ Helm
+ </Jump>
+ </div>
+ <div className="col">
+ <Jump to="https://docs.pinot.apache.org/basics/getting-started/public-cloud-examples">
+ Cloud
+ </Jump>
+ </div>
+ <div className="col">
+ <Jump to="https://docs.pinot.apache.org/getting-started/running-pinot-locally">
+ Manual/Local
+ </Jump>
+ </div>
+ </div>
+ </div>
+ </section>
+ );
+}
+
+function Home() {
+ const context = useDocusaurusContext();
+ const { siteConfig = {} } = context;
+
+ return (
+ <Layout
+ title={`${siteConfig.title}: ${siteConfig.tagline}`}
+ description={siteConfig.description}
+ >
+ <header
+ className={classnames(
+ "hero",
+ "hero--full-height",
+ styles.indexHeroBanner
+ )}
+ >
+ <div className="container">
+ <Link
+ to="https://docs.pinot.apache.org/basics/releases/0.7.1"
+ className={styles.indexAnnouncement}
+ >
+ <span className="badge badge-primary">release</span>
+ v0.7.1 has been released! Check the release notes
+ </Link>
+ <h1 className="hero__title">{siteConfig.title}</h1>
+ <p className="hero__subtitle">
+ {siteConfig.tagline}, designed to answer OLAP queries
+ with low latency
+ {/* <Diagram className={styles.indexHeroDiagram} width="100%" /> */}
+ {/* <PinotOverview title="PinotOverview" className="svg image-overview figure" /> */}
+ <SVG
+ src="/img/pinot-overview.svg"
+ className="svg image-overview figure"
+ />
+ </p>
+ <div className="hero--buttons">
+ <Link
+ to="https://docs.pinot.apache.org/getting-started"
+ className="button button--primary button--highlight"
+ >
+ Getting Started
+ </Link>
+ <Link
+ to="https://communityinviter.com/apps/apache-pinot/apache-pinot"
+ className="button button--primary button--highlight"
+ >
+ Join our Slack
+ </Link>
+ </div>
+ <p className="hero--subsubtitle">
+ Pinot is proven at <strong>scale in LinkedIn</strong>{" "}
+ powers 50+ user-facing apps and serving{" "}
+ <strong>100k+ queries</strong>
+ </p>
+ </div>
+ </header>
+ <main>
+ {features && features.length && (
+ <Features features={features} />
+ )}
+ <Usage />
+ <WhoUses />
+ <Installation />
+ </main>
+ </Layout>
+ );
+}
+
+export default Home;
diff --git a/website-builder/src/pages/index.module.css b/website-builder/src/pages/index.module.css
new file mode 100644
index 0000000..9c0aba8
--- /dev/null
+++ b/website-builder/src/pages/index.module.css
@@ -0,0 +1,344 @@
+/**
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements. See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership. The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+/*
+ * Hero Section
+ */
+
+@keyframes indexHeroInitial {
+ 0% {
+ background-size: 100% 100%;
+ }
+ 90% {
+ background-size: 250% 250%;
+ }
+ 100% {
+ background-size: 200% 200%;
+ }
+}
+
+@keyframes indexHeroPulsating {
+ 0% {
+ background-size: 200% 200%;
+ }
+ 50% {
+ background-size: 150% 150%;
+ }
+ 100% {
+ background-size: 200% 200%;
+ }
+}
+
+.indexAnnouncement {
+ background: var(--ifm-color-emphasis-50);
+ border-radius: 1em;
+ color: var(--ifm-color-content);
+ display: inline-block;
+ font-size: 0.9em;
+ margin-bottom: var(--ifm-spacing-vertical);
+ padding: 3px 10px 5px 10px;
+}
+
+.indexAnnouncement span {
+ background: var(--ifm-color-content);
+ border: 0px none;
+ border-radius: 1em;
+ color: var(--ifm-background-color);
+ margin-right: 0.5em;
+ text-transform: uppercase;
+}
+
+.indexAnnouncement:hover {
+ background: var(--ifm-panel-background-active);
+ text-decoration: none;
+}
+
+.indexAnnouncement:hover span {
+ background: var(--ifm-color-primary);
+}
+
+.indexHeroBanner {
+ animation: indexHeroInitial 700ms cubic-bezier(0, 1.5, 0.32, 1.5),
+ indexHeroPulsating 2.5s linear infinite;
+ animation-delay: 650ms, 1350ms;
+ animation-fill-mode: forwards;
+ background-image: radial-gradient(
+ ellipse at center calc(50% + 125px),
+ rgba(var(--ifm-color-primary-rgb), 0.25),
+ transparent 20%
+ );
+ background-position: center center;
+ min-height: calc(100vh - var(--ifm-navbar-height));
+}
+
+.indexHeroDiagram {
+ margin: calc(var(--ifm-spacing-vertical) * 4) 0
+ calc(var(--ifm-spacing-vertical) * 2) 0;
+ max-height: 325px;
+ width: 100%;
+}
+
+html[data-theme="dark"] .hero {
+ background-image: radial-gradient(
+ ellipse at center calc(50% + 125px),
+ rgba(var(--ifm-color-primary-rgb), 0.2),
+ transparent 30%
+ );
+}
+
+@media (max-width: 480px) {
+ html[data-theme="dark"] .indexHeroBanner,
+ .indexHeroBanner {
+ animation: none;
+ background-image: none;
+ min-height: auto;
+ }
+
+ .indexHeroDiagram {
+ display: none;
+ }
+}
+
+/*
+ * Features Section
+ */
+
+.features {
+ display: flex;
+ align-items: center;
+ width: 100%;
+}
+
+.features h3 {
+ text-align: center;
+ margin-bottom: var(--ifm-spacing-vertical);
+}
+
+.feature p {
+ margin-bottom: calc(var(--ifm-spacing-vertical) * 3);
+}
+
+.featureIcon {
+ border-top: 1px solid var(--ifm-color-primary);
+ color: var(--ifm-color-primary);
+ font-size: 1.5em;
+ margin-bottom: -0.5em;
+ margin-top: 1em;
+ text-align: center;
+}
+
+.featureIcon i {
+ background: var(--ifm-background-color);
+ padding: 0 var(--ifm-spacing-horizontal);
+ position: relative;
+ top: -1em;
+}
+
+/*
+ * Performance Section
+ */
+
+.performance {
+}
+
+/*
+ * Integrations Section
+ */
+
+.components {
+ position: relative;
+ height: 1000px;
+ margin-top: calc(var(--ifm-spacing-vertical) * -8);
+ width: 100%;
+}
+
+.components h3 {
+ align-items: center;
+ display: flex;
+ font-size: 3.5rem;
+ height: 100%;
+ justify-content: center;
+ position: relative;
+ text-align: center;
+ z-index: 1;
+}
+
+.components h3 span {
+ display: block;
+}
+
+.components ul {
+ display: none;
+}
+
+.componentsCanvas {
+ width: 100%;
+ height: 100%;
+ position: absolute;
+ top: 0;
+ left: 0;
+ z-index: 2;
+}
+
+.componentsCanvas circle,
+.componentsCanvas text {
+ cursor: pointer;
+}
+
+@media screen and (max-width: 999px) {
+ .components {
+ height: 900px;
+ }
+
+ .components h3 {
+ font-size: 2.5rem;
+ }
+}
+
+@media (max-width: 480px) {
+ .componentsCanvas {
+ display: none;
+ }
+
+ .components {
+ position: static;
+ height: auto;
+ margin-top: 0;
+ }
+
+ .components h3 {
+ display: none;
+ }
+
+ .components ul {
+ display: grid;
+ grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
+ grid-gap: 1rem;
+ margin: 0;
+ padding: 0;
+ }
+
+ .components ul li {
+ display: grid;
+ }
+
+ .components ul li a {
+ background: var(--ifm-panel-background);
+ border: 1px solid var(--ifm-panel-border-color);
+ border-radius: 0.25em;
+ box-shadow: var(--ifm-panel-box-shadow);
+ color: var(--ifm-panel-color);
+ display: block;
+ font-size: 1em;
+ margin: 0;
+ overflow: hidden;
+ padding: 0.2em;
+ text-align: center;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ }
+
+ .components ul li a:hover {
+ background: var(--ifm-panel-background-active);
+ border-color: var(--ifm-panel-border-color-active);
+ box-shadow: var(--ifm-panel-box-shadow-active);
+ color: var(--ifm-panel-color-active);
+ text-decoration: none;
+ }
+}
+
+/*
+ * Topology Section
+ */
+
+.topology {
+ text-align: center;
+}
+
+.topologyDiagram {
+ display: block;
+ margin: var(--ifm-heading-margin-bottom) auto;
+ max-height: 300px;
+ max-width: 900px;
+ height: 100%;
+ width: 100%;
+}
+
+/*
+ * Installation Section
+ */
+
+.installSubTitle {
+ margin-top: var(--ifm-heading-margin-bottom);
+}
+
+.installationPlatforms {
+ margin: calc(var(--ifm-spacing-vertical) * 4) 0
+ calc(var(--ifm-spacing-vertical) * 1) 0;
+ text-align: center;
+}
+
+.installationPlatforms a svg {
+ margin: 0 var(--ifm-spacing-horizontal);
+ width: 10vw;
+ min-height: 75px;
+ max-height: 100px;
+ min-width: 75px;
+ max-width: 100px;
+}
+
+.installationPlatforms svg [fill="#10E7FF"] {
+ fill: var(--ifm-heading-color);
+}
+
+.installationPlatforms a:hover svg [fill="#10E7FF"] {
+ fill: var(--ifm-color-primary);
+}
+
+.installationChecks {
+ display: flex;
+ font-weight: bold;
+ justify-content: center;
+ margin-bottom: calc(var(--ifm-spacing-vertical) * 4);
+ vertical-align: center;
+}
+
+.installationChecks > div {
+ flex-grow: 1;
+ flex-basis: 0;
+ margin: 0 var(--ifm-spacing-horizontal);
+ text-align: center;
+}
+
+.installationChecks > div:first-child {
+ text-align: right;
+}
+
+.installationChecks > div:last-child {
+ text-align: left;
+}
+
+@media (max-width: 996px) {
+ .installationChecks {
+ display: block;
+ }
+
+ .installationChecks > div {
+ text-align: center !important;
+ }
+}
diff --git a/website-builder/static/img/companies/factual.svg b/website-builder/static/img/companies/factual.svg
new file mode 100644
index 0000000..dde356c
--- /dev/null
+++ b/website-builder/static/img/companies/factual.svg
@@ -0,0 +1 @@
+<svg id="logosandtypes_com" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 150 150"><path d="M0 0h150v150H0V0z" fill="none"/><path d="M70.8 23.8l-.2 33-31.8 1.6-2.3-34.6h34.3z" fill="#eb2027"/><path d="M39.8 131.2l2.3-29 28.6 1.6v27.4H39.8z" fill="#b82025"/><path d="M114.5 27.9v28.7H77.7l1.7-31.1 35.1 2.4z" fill="#f5841f"/><path d="M38.8 92.2V66.6H73v29.5l-34.2-3.9z" fill="#ffc514"/><path d="M81 94.4V67.3l31.5-1-1.3 27L81 94.4z" fill="#e08626"/></svg>
\ No newline at end of file
diff --git a/website-builder/static/img/companies/linkedin.svg b/website-builder/static/img/companies/linkedin.svg
new file mode 100644
index 0000000..7163524
--- /dev/null
+++ b/website-builder/static/img/companies/linkedin.svg
@@ -0,0 +1 @@
+<svg height="2500" width="2490" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256"><g fill="none"><path d="M0 18.338C0 8.216 8.474 0 18.92 0h218.16C247.53 0 256 8.216 256 18.338v219.327C256 247.79 247.53 256 237.08 256H18.92C8.475 256 0 247.791 0 237.668V18.335z" fill="#069"/><path d="M77.796 214.238V98.986H39.488v115.252H77.8zM58.65 83.253c13.356 0 21.671-8.85 21.671-19.91-.25-11.312-8.315-19.915-21.417-19.915-13.111 0-21.674 8.603-21.674 19.914 0 11.06 8.312 19.91 21.169 19.91h.2 [...]
\ No newline at end of file
diff --git a/website-builder/static/img/companies/microsoft-teams.svg b/website-builder/static/img/companies/microsoft-teams.svg
new file mode 100644
index 0000000..b05bd28
--- /dev/null
+++ b/website-builder/static/img/companies/microsoft-teams.svg
@@ -0,0 +1,21 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 22.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+ viewBox="0 0 2381.4 2354.5" style="enable-background:new 0 0 2381.4 2354.5;" xml:space="preserve">
+<style type="text/css">
+ .st0{fill:#5558AF;}
+ .st1{fill:#FFFFFF;}
+</style>
+<g>
+ <path class="st0" d="M2015.6,899.2c19.5,19.5,42.5,35,67.9,45.8c53,22.2,112.7,22.2,165.8,0c51.2-21.8,92-62.5,113.7-113.7
+ c22.2-53,22.2-112.7,0-165.8c-21.8-51.2-62.5-92-113.7-113.7c-53-22.2-112.7-22.2-165.8,0c-51.2,21.8-92,62.5-113.7,113.7
+ c-22.2,53-22.2,112.7,0,165.8C1980.6,856.6,1996.2,879.7,2015.6,899.2L2015.6,899.2z M1953.2,1097v642.1h107
+ c36.8-0.2,73.4-3.6,109.5-10.4c36.3-6.4,71.3-18.6,103.7-36.2c30.6-16.6,57-40,77.3-68.2c21.3-31.3,32-68.6,30.5-106.5V1097H1953.2
+ z M1606.4,827.8c28.4,0.2,56.6-5.5,82.8-16.7c51.2-21.8,91.9-62.5,113.6-113.7c22.2-53,22.2-112.7-0.1-165.8
+ c-21.8-51.2-62.5-92-113.7-113.7c-26.2-11.2-54.4-16.9-82.9-16.7c-28.3-0.2-56.3,5.5-82.3,16.7c-19.4,8.3-25.5,19.1-52.2,32.1v329
+ c26.8,13.1,32.8,23.8,52.2,32.1C1549.9,822.4,1578,828,1606.4,827.8L1606.4,827.8z M1471.6,1908.9c26.8,5.8,36.4,10.3,55.4,12.9
+ c20.8,3,41.8,4.5,62.8,4.6c32.4-0.2,64.8-3.6,96.5-10.4c32.3-6.5,63.3-18.6,91.5-35.7c27.7-17,51-40.2,68.2-67.7
+ c19-32.1,28.3-69.1,26.9-106.4v-743h-401.3V1908.9z M0,2113.7l1391.3,240.8V0L0,240.8V2113.7z"/>
+</g>
+<path class="st1" d="M1016.7,722.4l-642.1,39.1v148.1l240.8-9.7v686.7l160.5,9.4V893.6l240.8-10.7V722.4z"/>
+</svg>
diff --git a/website-builder/static/img/companies/slack.svg b/website-builder/static/img/companies/slack.svg
new file mode 100644
index 0000000..47232d6
--- /dev/null
+++ b/website-builder/static/img/companies/slack.svg
@@ -0,0 +1 @@
+<svg width="2500" height="2500" viewBox="0 0 256 256" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="xMidYMid"><path d="M165.964 15.838c-3.89-11.975-16.752-18.528-28.725-14.636-11.975 3.89-18.528 16.752-14.636 28.725l58.947 181.365c4.048 11.187 16.132 17.473 27.732 14.135 12.1-3.483 19.475-16.334 15.614-28.217L165.964 15.838" fill="#DFA22F"/><path d="M74.626 45.516C70.734 33.542 57.873 26.989 45.9 30.879 33.924 34.77 27.37 47.631 31.263 59.606l58.948 181.366c4.047 11.186 16.132 [...]
\ No newline at end of file
diff --git a/website-builder/static/img/companies/uber.svg b/website-builder/static/img/companies/uber.svg
new file mode 100644
index 0000000..ea44103
--- /dev/null
+++ b/website-builder/static/img/companies/uber.svg
@@ -0,0 +1,9 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="1072px" height="1064px" viewBox="0 0 1072 1064" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+ <!-- Generator: Sketch 61 (89581) - https://sketch.com -->
+ <title>Untitled</title>
+ <desc>Created with Sketch.</desc>
+ <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+ <image id="Bitmap" x="0" y="0" width="1072" height="1064" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAABDAAAAQoCAYAAAD8ES7gAAAAAXNSR0IArs4c6QAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAAEMKADAAQAAAABAAAEKAAAAAAbniVfAABAAElEQVR4AezdCbRlWVnY8YvirAg0dCOTTUAkTYAVG1GBMAsNQVQwCxQQEIIE1KBgXBrAKZCVhWDiSiSCCGjUgInEQFRExAExETCgUQRlUCaRqUFxVtL/o19x+lk91Kuq9069+u217rvTGfb57b3P2/s7w73Kbrf7yCUPiQABAgQIECBAgAABAgQIECCwWYGP2WzOZIwAAQIECBAgQIAAAQIECBAg [...]
+ </g>
+</svg>
\ No newline at end of file
diff --git a/website-builder/static/img/companies/weibo.svg b/website-builder/static/img/companies/weibo.svg
new file mode 100644
index 0000000..5795f39
--- /dev/null
+++ b/website-builder/static/img/companies/weibo.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="2500" height="762" viewBox="0 0.039 200 60.922"><path d="M5.53 41.936c0 8.758 11.402 15.86 25.47 15.86s25.47-7.103 25.47-15.86S45.067 26.077 31 26.077 5.53 33.178 5.53 41.936" fill="#fff"/><path d="M31.593 56.504c-12.45 1.228-23.197-4.398-24.007-12.573-.808-8.173 8.633-15.795 21.081-17.026 12.451-1.232 23.199 4.396 24.007 12.567.807 8.176-8.63 15.8-21.081 17.032m24.903-27.135c-1.059-.316-1.785-.533-1.231-1.924 1.201-3.022 1.325-5.628.023-7.4 [...]
\ No newline at end of file
diff --git a/website-builder/static/img/components/Broker.png b/website-builder/static/img/components/Broker.png
new file mode 100644
index 0000000..9384268
Binary files /dev/null and b/website-builder/static/img/components/Broker.png differ
diff --git a/website-builder/static/img/components/ClusterLogical.png b/website-builder/static/img/components/ClusterLogical.png
new file mode 100644
index 0000000..317cdbb
Binary files /dev/null and b/website-builder/static/img/components/ClusterLogical.png differ
diff --git a/website-builder/static/img/components/TimeBoundary.jpg b/website-builder/static/img/components/TimeBoundary.jpg
new file mode 100644
index 0000000..3beb416
Binary files /dev/null and b/website-builder/static/img/components/TimeBoundary.jpg differ
diff --git a/website-builder/static/img/components/components.png b/website-builder/static/img/components/components.png
new file mode 100644
index 0000000..51fc3b3
Binary files /dev/null and b/website-builder/static/img/components/components.png differ
diff --git a/website-builder/static/img/dynamic-table.png b/website-builder/static/img/dynamic-table.png
new file mode 100644
index 0000000..cfcb718
Binary files /dev/null and b/website-builder/static/img/dynamic-table.png differ
diff --git a/website-builder/static/img/favicon-16x16.png b/website-builder/static/img/favicon-16x16.png
new file mode 100644
index 0000000..01874d0
Binary files /dev/null and b/website-builder/static/img/favicon-16x16.png differ
diff --git a/website-builder/static/img/favicon-32x32.png b/website-builder/static/img/favicon-32x32.png
new file mode 100644
index 0000000..d4976b6
Binary files /dev/null and b/website-builder/static/img/favicon-32x32.png differ
diff --git a/website-builder/static/img/favicon-96x96.png b/website-builder/static/img/favicon-96x96.png
new file mode 100644
index 0000000..8603a01
Binary files /dev/null and b/website-builder/static/img/favicon-96x96.png differ
diff --git a/website-builder/static/img/favicon.ico b/website-builder/static/img/favicon.ico
new file mode 100644
index 0000000..2498f92
Binary files /dev/null and b/website-builder/static/img/favicon.ico differ
diff --git a/website-builder/static/img/ingest-query.svg b/website-builder/static/img/ingest-query.svg
new file mode 100644
index 0000000..2e97a5f
--- /dev/null
+++ b/website-builder/static/img/ingest-query.svg
@@ -0,0 +1,321 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="800px" height="400px" viewBox="0 0 800 400" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+ <!-- Generator: Sketch 61 (89581) - https://sketch.com -->
+ <title>IngestQuery</title>
+ <desc>Created with Sketch.</desc>
+ <defs>
+ <circle id="path-1" cx="32.5" cy="32.5" r="32.5"></circle>
+ <filter x="-27.7%" y="-15.4%" width="143.1%" height="143.1%" filterUnits="objectBoundingBox" id="filter-3">
+ <feOffset dx="-4" dy="4" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
+ <feGaussianBlur stdDeviation="4" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
+ <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.0514039855 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
+ </filter>
+ <circle id="path-4" cx="32.5" cy="32.5" r="32.5"></circle>
+ <filter x="-27.7%" y="-15.4%" width="143.1%" height="143.1%" filterUnits="objectBoundingBox" id="filter-6">
+ <feOffset dx="-4" dy="4" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
+ <feGaussianBlur stdDeviation="4" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
+ <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.0514039855 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
+ </filter>
+ <circle id="path-7" cx="32.5" cy="32.5" r="32.5"></circle>
+ <filter x="-27.7%" y="-15.4%" width="143.1%" height="143.1%" filterUnits="objectBoundingBox" id="filter-9">
+ <feOffset dx="-4" dy="4" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
+ <feGaussianBlur stdDeviation="4" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
+ <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.0514039855 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
+ </filter>
+ <circle id="path-10" cx="32.5" cy="32.5" r="32.5"></circle>
+ <filter x="-20.8%" y="-11.5%" width="132.3%" height="132.3%" filterUnits="objectBoundingBox" id="filter-12">
+ <feOffset dx="-3" dy="3" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
+ <feGaussianBlur stdDeviation="3" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
+ <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.0514039855 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
+ </filter>
+ <circle id="path-13" cx="32.5" cy="32.5" r="32.5"></circle>
+ <filter x="-20.8%" y="-11.5%" width="132.3%" height="132.3%" filterUnits="objectBoundingBox" id="filter-15">
+ <feOffset dx="-3" dy="3" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
+ <feGaussianBlur stdDeviation="3" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
+ <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.0514039855 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
+ </filter>
+ <circle id="path-16" cx="32.5" cy="32.5" r="32.5"></circle>
+ <filter x="-20.8%" y="-11.5%" width="132.3%" height="132.3%" filterUnits="objectBoundingBox" id="filter-18">
+ <feOffset dx="-3" dy="3" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
+ <feGaussianBlur stdDeviation="3" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
+ <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.0514039855 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
+ </filter>
+ <circle id="path-19" cx="32.5" cy="32.5" r="32.5"></circle>
+ <filter x="-27.7%" y="-15.4%" width="143.1%" height="143.1%" filterUnits="objectBoundingBox" id="filter-21">
+ <feOffset dx="-4" dy="4" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
+ <feGaussianBlur stdDeviation="4" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
+ <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.0514039855 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
+ </filter>
+ <circle id="path-22" cx="32.5" cy="32.5" r="32.5"></circle>
+ <filter x="-27.7%" y="-15.4%" width="143.1%" height="143.1%" filterUnits="objectBoundingBox" id="filter-24">
+ <feOffset dx="-4" dy="4" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
+ <feGaussianBlur stdDeviation="4" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
+ <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.0514039855 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
+ </filter>
+ <circle id="path-25" cx="32.5" cy="32.5" r="32.5"></circle>
+ <filter x="-27.7%" y="-15.4%" width="143.1%" height="143.1%" filterUnits="objectBoundingBox" id="filter-27">
+ <feOffset dx="-4" dy="4" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
+ <feGaussianBlur stdDeviation="4" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
+ <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.0514039855 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
+ </filter>
+ </defs>
+ <g id="IngestQuery" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+ <path d="M126.5,159 C147.833333,126 173.166667,99 202.5,78 C231.833333,57 280.5,42.3333333 348.5,34" id="Path-2" stroke="#8C8C8C" stroke-dasharray="3"></path>
+ <path d="M190.5,201 C201.085766,147.393422 215.252433,111.060088 233,92 C250.747567,72.9399116 288.414234,53.6065783 346,34" id="Path-3" stroke="#8C8C8C" stroke-dasharray="3"></path>
+ <path d="M190,273 C207.666667,174 227,113.666667 248,92 C269,70.3333333 302.166667,51 347.5,34" id="Path-4" stroke="#8C8C8C" stroke-dasharray="3"></path>
+ <path d="M125.5,314.32474 C157.117284,202.44158 184.938272,131.666667 208.962963,102 C232.987654,72.3333333 278.833333,49.6666667 346.5,34" id="Path-5" stroke="#8C8C8C" stroke-dasharray="3"></path>
+ <path d="M61,277.491217 C130.333333,170.830406 181.333333,105.833333 214,82.5 C246.666667,59.1666667 290.833333,43 346.5,34" id="Path-6" stroke="#8C8C8C" stroke-dasharray="3"></path>
+ <path d="M64,201 C117.720046,136.21307 163.053379,92.8797363 200,71 C236.946621,49.1202637 285.613287,36.7869303 346,34" id="Path-7" stroke="#8C8C8C" stroke-dasharray="3"></path>
+ <path id="Line" d="M559.429355,317.819082 L559.865143,318.064212 L567.865143,322.564212 L568.639877,323 L567.865143,323.435788 L559.865143,327.935788 L559.429355,328.180918 L558.939094,327.309343 L559.374882,327.064212 L565.711,323.5 L562.5,323.5 L562.5,322.5 L565.711,322.5 L559.374882,318.935788 L558.939094,318.690657 L559.429355,317.819082 Z M530.5,322.5 L530.5,323.5 L526.5,323.5 L526.5,322.5 L530.5,322.5 Z M536.5,322.5 L536.5,323.5 L532.5,323.5 L532.5,322.5 L536.5,322.5 Z M542 [...]
+ <path id="Line-Copy" d="M548.296034,266.877368 L548.320431,267.87707 L547.820579,267.889268 C547.134398,267.906013 546.459529,267.917091 545.795968,267.922499 L544.809108,267.926359 L544.309108,267.926159 L544.309508,266.926159 L544.809508,266.926359 C545.456177,266.926618 546.114205,266.921254 546.78359,266.910266 L547.796183,266.889566 L548.296034,266.877368 Z M538.335453,266.711509 L538.834412,266.743756 C539.555249,266.790342 540.294147,266.828018 541.051099,266.856781 L541.8 [...]
+ <path id="Line-Copy-2" d="M403.309343,63.8190816 L404.180918,64.3093429 L403.935788,64.7451306 L399.435788,72.7451306 L399,73.5198644 L398.564212,72.7451306 L394.064212,64.7451306 L393.819082,64.3093429 L394.690657,63.8190816 L394.935788,64.2548694 L398.5,70.591 L398.5,67.5 L399.5,67.5 L399.5,70.591 L403.064212,64.2548694 L403.309343,63.8190816 Z M399.5,61.5 L399.5,65.5 L398.5,65.5 L398.5,61.5 L399.5,61.5 Z M399.5,55.5 L399.5,59.5 L398.5,59.5 L398.5,55.5 L399.5,55.5 Z M399.5,49.5 [...]
+ <g id="Bitmap-Copy-3" transform="translate(156.000000, 165.000000)">
+ <mask id="mask-2" fill="white">
+ <use xlink:href="#path-1"></use>
+ </mask>
+ <g id="Mask">
+ <use fill="black" fill-opacity="1" filter="url(#filter-3)" xlink:href="#path-1"></use>
+ <use fill="#FFFFFF" fill-rule="evenodd" xlink:href="#path-1"></use>
+ </g>
+ <image mask="url(#mask-2)" x="12.037037" y="12.037037" width="40.9259259" height="40.9259259" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAIAAAACACAYAAADDPmHLAAAABGdBTUEAALGOfPtRkwAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAAAgKADAAQAAAABAAAAgAAAAABIjgR3AAAjyUlEQVR4Ae2dCdxew/XHJ4sSEQkRJJZEmkgpiiaqIYuU2BtKmtq1llJ7UVpKSmJpqTWCqLW22neJIIkiBKkttorYlVj+VFBJ5v/7zr3nee6zL+/zvt7EPZ/PeWbu3Llz78ycOXOWmXmcSyFtgbQF0hZIWyBtgbQF0hZIWyBtgbQF0hZI [...]
+ </g>
+ <g id="Bitmap-Copy-9" transform="translate(28.000000, 165.000000)">
+ <mask id="mask-5" fill="white">
+ <use xlink:href="#path-4"></use>
+ </mask>
+ <g id="Mask">
+ <use fill="black" fill-opacity="1" filter="url(#filter-6)" xlink:href="#path-4"></use>
+ <use fill="#FFFFFF" fill-rule="evenodd" xlink:href="#path-4"></use>
+ </g>
+ <image mask="url(#mask-5)" x="20.8641975" y="15.2469136" width="24.0740741" height="35.308642" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAANAAAAFACAYAAADNtfKDAAAABGdBTUEAALGOfPtRkwAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAAA0KADAAQAAAABAAABQAAAAAAg0MOAAAAwtUlEQVR4Ae2dibMW1Zn/+7IKyCab7MgmKIOjFEW0qFRJReuXkXIypuZnUIwGMRr+ICMRECYQ46RiDGUmKUhhaVlSFAVRyxE0ArIvlx3UAGLP+bzaN337dr+9nef06X7PU3Xv+3a/3Wf5nvOc5TnP0uXVmP7/f/6nP2zYMG/gwIFe//7 [...]
+ </g>
+ <g id="Bitmap-Copy-6" transform="translate(156.000000, 242.000000)">
+ <mask id="mask-8" fill="white">
+ <use xlink:href="#path-7"></use>
+ </mask>
+ <g id="Mask">
+ <use fill="black" fill-opacity="1" filter="url(#filter-9)" xlink:href="#path-7"></use>
+ <use fill="#FFFFFF" fill-rule="evenodd" xlink:href="#path-7"></use>
+ </g>
+ <image mask="url(#mask-8)" x="17.654321" y="15.2469136" width="32.0987654" height="36.1111111" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAXMAAAGnCAYAAABFFberAAAABGdBTUEAALGOfPtRkwAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAABc6ADAAQAAAABAAABpwAAAACSw8w4AABAAElEQVR4Aey9eaxdyX3nV2e7+9sfH3eyyWav2iy3FkseWZLHMuIkSjwetJBBjEHiIJrAgQbxAJ7BIEDU+iOYCSbIYiP22EkAJV4m0z2SJVsjWWu3pJZa3WqqFzbZbO7b29e737Pn+61zz32X5CPFZnN599xfkWers1V9691P/c6v6tQ [...]
+ </g>
+ <g id="Group-5" transform="translate(271.000000, 268.000000)" fill-rule="nonzero">
+ <path d="M129,10 L255.62325,35.2097696 L255.03,71.252 L255.01,73.087 L255.429662,73.1708738 L135.426,96.82 L127.445602,98.4004556 L0.264237582,73.2280941 L0.264,73.222 L1.42108547e-14,73.1708738 L0.263,73.118 L0.259,72.565 L1.42108547e-13,72.6169894 L1.42108547e-13,34.8866389 L126.35859,10 L126.36,10.215 L127.445602,10 L129.002,10.31 L129,10 Z" id="Combined-Shape" fill="#F44AF5"></path>
+ <polygon id="Fill-75-Copy" fill="#000000" opacity="0.255138579" points="0 35 0 73.3001307 127.440092 98.6169894 127.440092 60.6437577"></polygon>
+ <polygon id="Fill-76-Copy" fill="#000000" opacity="0.499418713" points="128 60.4465748 255.62325 35 255.003418 73.1703643 128 98.6169894"></polygon>
+ <polygon id="Fill-74-Copy-Copy" fill-opacity="0.33241368" fill="#FFFFFF" points="0 25.1708738 127.716305 50.3391483 255.429662 25.1708738 127.716305 -1.13686838e-13"></polygon>
+ </g>
+ <g id="Group-5-Copy" transform="translate(271.000000, 210.000000)" fill-rule="nonzero">
+ <path d="M129,10 L255.62325,35.2097696 L255.03,71.252 L255.01,73.087 L255.429662,73.1708738 L135.426,96.82 L127.445602,98.4004556 L0.264237582,73.2280941 L0.264,73.222 L1.42108547e-14,73.1708738 L0.263,73.118 L0.259,72.565 L1.42108547e-13,72.6169894 L1.42108547e-13,34.8866389 L126.35859,10 L126.36,10.215 L127.445602,10 L129.002,10.31 L129,10 Z" id="Combined-Shape" fill="#4285F4"></path>
+ <polygon id="Fill-75-Copy" fill="#000000" opacity="0.255138579" points="0 35 0 73.3001307 127.440092 98.6169894 127.440092 60.6437577"></polygon>
+ <polygon id="Fill-76-Copy" fill="#000000" opacity="0.499418713" points="128 60.4465748 255.62325 35 255.003418 73.1703643 128 98.6169894"></polygon>
+ <polygon id="Fill-74-Copy-Copy" fill-opacity="0.33241368" fill="#FFFFFF" points="0 25.1708738 127.716305 50.3391483 255.429662 25.1708738 127.716305 -1.13686838e-13"></polygon>
+ </g>
+ <g id="Group-5-Copy-2" transform="translate(271.000000, 80.000000)" fill-rule="nonzero">
+ <path d="M129,80 L255.62325,105.20977 L255.03,141.252 L255.01,143.087 L255.429662,143.170874 L135.426,166.82 L127.445602,168.400456 L0.264237582,143.228094 L0.264,143.222 L1.42108547e-14,143.170874 L0.263,143.118 L0.259,142.565 L1.42108547e-13,142.616989 L1.42108547e-13,104.886639 L126.35859,80 L126.36,80.215 L127.445602,80 L129.002,80.31 L129,80 Z" id="Combined-Shape" fill="#54BAC9"></path>
+ <polygon id="Fill-75-Copy" fill="#000000" opacity="0.255138579" points="0 105 0 143.300131 127.440092 168.616989 127.440092 130.643758"></polygon>
+ <polygon id="Fill-76-Copy" fill="#000000" opacity="0.499418713" points="128 130.446575 255.62325 105 255.003418 143.170364 128 168.616989"></polygon>
+ <polygon id="Fill-74-Copy-Copy" fill-opacity="0.33241368" fill="#FFFFFF" points="0 95.1708738 127.716305 120.339148 255.429662 95.1708738 127.716305 70"></polygon>
+ <polygon id="Fill-74-Copy-Copy" fill-opacity="0.33241368" fill="#FFFFFF" points="0 25.1708738 127.716305 50.3391483 255.429662 25.1708738 127.716305 -1.10134124e-13"></polygon>
+ <polygon id="Fill-74-Copy-Copy" fill-opacity="0.33241368" fill="#FFFFFF" points="0 85.1708738 127.716305 110.339148 255.429662 85.1708738 127.716305 60"></polygon>
+ <polygon id="Fill-74-Copy-Copy" fill-opacity="0.33241368" fill="#FFFFFF" points="0 75.1708738 127.716305 100.339148 255.429662 75.1708738 127.716305 50"></polygon>
+ <polygon id="Fill-74-Copy-Copy" fill-opacity="0.33241368" fill="#FFFFFF" points="0 65.1708738 127.716305 90.3391483 255.429662 65.1708738 127.716305 40"></polygon>
+ <polygon id="Fill-74-Copy-Copy" fill-opacity="0.33241368" fill="#FFFFFF" points="0 55.1708738 127.716305 80.3391483 255.429662 55.1708738 127.716305 30"></polygon>
+ <polygon id="Fill-74-Copy-Copy" fill-opacity="0.33241368" fill="#FFFFFF" points="0 45.1708738 127.716305 70.3391483 255.429662 45.1708738 127.716305 20"></polygon>
+ <polygon id="Fill-74-Copy-Copy" fill-opacity="0.33241368" fill="#FFFFFF" points="0 35.1708738 127.716305 60.3391483 255.429662 35.1708738 127.716305 10"></polygon>
+ </g>
+ <text id="Query" opacity="0.904203869" font-family="DINAlternate-Bold, DIN Alternate" font-size="20" font-weight="bold" fill="#838383">
+ <tspan x="621" y="81">QUERY</tspan>
+ </text>
+ <text id="SQL" font-family="DINAlternate-Bold, DIN Alternate" font-size="16" font-weight="bold" fill="#8D8D8D">
+ <tspan x="623.164062" y="256">SQL</tspan>
+ </text>
+ <text id="PQL" font-family="DINAlternate-Bold, DIN Alternate" font-size="16" font-weight="bold" fill="#8D8D8D">
+ <tspan x="658" y="165">PQL</tspan>
+ </text>
+ <text id="Joins-in-Presto" font-family="DINAlternate-Bold, DIN Alternate" font-size="16" font-weight="bold" fill="#8D8D8D">
+ <tspan x="658" y="314">Joins in</tspan>
+ <tspan x="658" y="333"> Presto</tspan>
+ </text>
+ <text id="Sources-Copy" opacity="0.904203869" font-family="DINAlternate-Bold, DIN Alternate" font-size="20" font-weight="bold" fill="#838383">
+ <tspan x="84.40625" y="81">SOURCES</tspan>
+ </text>
+ <text id="Events-Copy" opacity="0.904203869" font-family="DINAlternate-Bold, DIN Alternate" font-size="20" font-weight="bold" fill="#838383">
+ <tspan x="365.237305" y="41">EVENTS</tspan>
+ </text>
+ <g id="Group" transform="translate(577.000000, 126.000000)">
+ <mask id="mask-11" fill="white">
+ <use xlink:href="#path-10"></use>
+ </mask>
+ <g id="Mask">
+ <use fill="black" fill-opacity="1" filter="url(#filter-12)" xlink:href="#path-10"></use>
+ <use fill="#FFFFFF" fill-rule="evenodd" xlink:href="#path-10"></use>
+ </g>
+ </g>
+ <g id="Group-2" transform="translate(663.000000, 216.000000)">
+ <mask id="mask-14" fill="white">
+ <use xlink:href="#path-13"></use>
+ </mask>
+ <g id="Mask">
+ <use fill="black" fill-opacity="1" filter="url(#filter-15)" xlink:href="#path-13"></use>
+ <use fill="#FFFFFF" fill-rule="evenodd" xlink:href="#path-13"></use>
+ </g>
+ </g>
+ <g id="Group-4" transform="translate(577.000000, 281.000000)">
+ <g id="Group-3">
+ <mask id="mask-17" fill="white">
+ <use xlink:href="#path-16"></use>
+ </mask>
+ <g id="Mask">
+ <use fill="black" fill-opacity="1" filter="url(#filter-18)" xlink:href="#path-16"></use>
+ <use fill="#FFFFFF" fill-rule="evenodd" xlink:href="#path-16"></use>
+ </g>
+ </g>
+ </g>
+ <g id="Group-5" transform="translate(271.000000, 195.000000)" font-family="DINAlternate-Bold, DIN Alternate" font-weight="bold">
+ <text id="Smart-Index-Copy" transform="translate(191.927620, 25.177529) rotate(-11.000000) translate(-191.927620, -25.177529) " font-size="18" fill="#FAF5F5">
+ <tspan x="145.789437" y="28.6775292">Smart Index</tspan>
+ </text>
+ <text id="Blazing-Fast-Copy" transform="translate(64.873543, 26.472952) rotate(11.000000) translate(-64.873543, -26.472952) " font-size="18" fill="#F8F5F5">
+ <tspan x="17.307137" y="27.9729521">Blazing-Fast</tspan>
+ </text>
+ <text id="Performant-Copy" transform="translate(63.546002, 81.214275) rotate(11.000000) translate(-63.546002, -81.214275) " font-size="19" fill="#FCF7F7">
+ <tspan x="17.9664126" y="87.7142748">Performant</tspan>
+ </text>
+ <text id="Aggregation-Copy" transform="translate(191.155175, 83.777538) rotate(-11.000000) translate(-191.155175, -83.777538) " font-size="19" fill="#FAF5F5">
+ <tspan x="142.773827" y="87.2775384">Aggregation</tspan>
+ </text>
+ <text id="Pre-Materialization-Copy" transform="translate(192.240329, 146.071874) rotate(-11.000000) translate(-192.240329, -146.071874) " font-size="15" fill="#F6F3F3">
+ <tspan x="132.005954" y="142.071874">Pre-Materialization</tspan>
+ </text>
+ <text id="Segment-Optimizer-Copy" transform="translate(64.546002, 140.214275) rotate(11.000000) translate(-64.546002, -140.214275) " font-size="15" fill="#F8F5F5">
+ <tspan x="4.01499655" y="142.714275">Segment Optimizer</tspan>
+ </text>
+ </g>
+ <g id="Bitmap-Copy-2" transform="translate(93.000000, 125.000000)">
+ <mask id="mask-20" fill="white">
+ <use xlink:href="#path-19"></use>
+ </mask>
+ <g id="Mask">
+ <use fill="black" fill-opacity="1" filter="url(#filter-21)" xlink:href="#path-19"></use>
+ <use fill="#FFFFFF" fill-rule="evenodd" xlink:href="#path-19"></use>
+ </g>
+ <image mask="url(#mask-20)" x="10.4320988" y="20.8641975" width="44.1358025" height="23.2716049" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAABLAAAAJxCAYAAABSRUvkAAAABGdBTUEAALGOfPtRkwAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAAEsKADAAQAAAABAAACcQAAAABCSKAQAABAAElEQVR4AezdCXxU1d34/3PuzCSggEoFJJlJwIpLcWmLLbKKShfaWqttlCRgbZ+Wp4vd/m1/Pl2ltYvP0721m1ofqyRoY+va0vqgImu12kVLVUBJZiYBQasISsjM3PP/3gASQkLmznrvnc99vSAzd87yPe87meR+c+65WrEhgAACC [...]
+ </g>
+ <g id="Bitmap-Copy-4" transform="translate(93.000000, 282.000000)">
+ <mask id="mask-23" fill="white">
+ <use xlink:href="#path-22"></use>
+ </mask>
+ <g id="Mask">
+ <use fill="black" fill-opacity="1" filter="url(#filter-24)" xlink:href="#path-22"></use>
+ <use fill="#FFFFFF" fill-rule="evenodd" xlink:href="#path-22"></use>
+ </g>
+ <image mask="url(#mask-23)" x="13.6419753" y="14.4444444" width="36.1111111" height="36.1111111" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAABLAAAASwCAYAAADrIbPPAAAABGdBTUEAALGOfPtRkwAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAAEsKADAAQAAAABAAAEsAAAAABAZIJmAABAAElEQVR4AezdC5RcZ30g+HtvPbpbsg02xOadAEZ+QYJxJsGYgKxuyRBCQhKU93MyCcmQOAmxsSSbUMFSt2SDLOfMzAm75+zO7p6ze9aZnNlZMsfYlmwFm8xsApM4mIeNTRJIIBBsGWxLXd1V99tPAjl6tKR+VHXdx6/P8emqe7/7/ [...]
+ </g>
+ <g id="Bitmap-Copy-5" transform="translate(28.000000, 242.000000)">
+ <mask id="mask-26" fill="white">
+ <use xlink:href="#path-25"></use>
+ </mask>
+ <g id="Mask">
+ <use fill="black" fill-opacity="1" filter="url(#filter-27)" xlink:href="#path-25"></use>
+ <use fill="#FFFFFF" fill-rule="evenodd" xlink:href="#path-25"></use>
+ </g>
+ <image mask="url(#mask-26)" x="11.2345679" y="16.0493827" width="41.7283951" height="32.9012346" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAZAAAAFACAYAAACSgSrjAAAABGdBTUEAALGOfPtRkwAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAABkKADAAQAAAABAAABQAAAAACSxBCVAAAuOklEQVR4Ae2deXQc13Xmb69AYwdJANx3UtxEUUvMRXtERZRtydbYkm0to0RrJEeW7UwmsWfsRH94JjlnxtJxdCzJmcSmfeKMZ+RYdjS2NI4jaSRxMbVRJimSIglSJEBsxNpA791zbxMNogE00N1Vr7rq9VfnFLqr6r137/vd6v7wl [...]
+ </g>
+ <image id="Bitmap-Copy" x="370" y="82" width="51" height="83" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAewAAAMYCAYAAAAJttRGAAAABGdBTUEAALGOfPtRkwAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAAB7KADAAQAAAABAAADGAAAAAAmw5O2AABAAElEQVR4Aey9CZgcV3nuXz3aRvto3zdrtSRL8iIZ4xUbYzAJtlkdMNsFshBCbsgN/8sSCCEk/EPuJZAAIQm5cBPAQBwciFkMNhiEF9mSbO37Lsu2bLzJtiRL7vv+jqfk1ng0M93T1VXV9Z7nqeme7uqzvOfUec+3nO+UIicjYASMQA4RKJfLJaXyAw888N+ffvrpIYcPH37vM888M2HP [...]
+ <path id="Path-9" d="M529.381393,207.273589 L529.461256,208.270395 C528.80988,208.322583 528.148984,208.3738 527.478568,208.424048 L526.465804,208.498692 L526.393519,207.501308 C527.410923,207.427573 528.406881,207.351666 529.381393,207.273589 Z M535.346937,206.742134 L535.445445,207.737271 C534.797955,207.801365 534.139015,207.86429 533.468625,207.926048 L532.454451,208.017807 L532.365939,207.021732 C533.385409,206.931141 534.379076,206.837942 535.346937,206.742134 Z M541.298584 [...]
+ <line x1="351.5" y1="34" x2="343.5" y2="29.5" id="Path-10" stroke="#979797"></line>
+ <line x1="351.5" y1="40.5" x2="344.5" y2="34" id="Path-10" stroke="#979797" transform="translate(348.000000, 37.500000) scale(-1, 1) translate(-348.000000, -37.500000) "></line>
+ <image id="Bitmap" x="584" y="296" width="51" height="43" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAK4AAACUCAYAAAAK7RIlAAAAAXNSR0IArs4c6QAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAAArqADAAQAAAABAAAAlAAAAACyaf9ZAAAnKElEQVR4Ae1dCXwURdbvqr5mMpODhASQK+E+1mNXVGRR4dNFBRUvsrLrhYqogBfIpeC4oqiIIJ6IgovXGjxQFBddRfFYxagrN4SEcEkkkGuSmb7rezUYDMnMpCeZ7gyk6/dLerq7uur1v/9dXfXqvVcM4yQHAQcBBwEHAQcBBwEHAQcBBwEHAQcBBwEHAQcBBwEHAQcBBwEHAQeBREYAWSHcSX+f [...]
+ <g id="sql-file-format-symbol-svgrepo-com" transform="translate(592.000000, 131.000000)" fill-rule="nonzero">
+ <path d="M20.5214521,40 C18.2881889,40 17.0002537,41.7974322 17.0002537,44.0177687 C16.9788745,46.273111 18.309892,48 20.5000729,48 C22.7119568,48 24,46.2910126 24,43.9650386 C24,41.7969004 22.7535275,40 20.5214521,40 Z" id="Path" fill="#000000"></path>
+ <path d="M38.9897523,12.9408354 C38.9867267,12.6931892 38.9084535,12.4485822 38.7391216,12.2553477 L28.373476,0.362155548 C28.3714264,0.358822226 28.3683033,0.357743799 28.3647898,0.354704594 C28.3034985,0.285391121 28.2319595,0.228234465 28.1563213,0.177842491 C28.1336787,0.163136663 28.1109384,0.149705339 28.0873198,0.136470093 C28.0203679,0.10058787 27.9513664,0.0707840567 27.8788514,0.0490194298 C27.8593318,0.043333176 27.8423498,0.0352939895 27.8227327,0.0301959688 C27.7 [...]
+ <g id="PQL" transform="translate(2.000000, 39.000000)" fill="#CCCCCC">
+ <path d="M7.83619063,0.194562725 L7.83619063,0.194562725 L7.83619063,0.194562725 C11.0271836,0.194562725 12.6226801,0.999672453 12.6226801,2.60989191 L12.6226801,2.60989191 L12.6226801,2.60989191 C12.6226801,3.49295775 12.2254116,4.19980347 11.4308745,4.73042909 L11.4308745,4.73042909 L11.4308745,4.73042909 C10.6491821,5.25974451 9.57481388,5.52440223 8.20776974,5.52440223 L8.20776974,5.52440223 L8.20776974,5.52440223 C7.56920415,5.52440223 7.00220195,5.39469374 6.5067631 [...]
+ </g>
+ <rect id="Rectangle" fill="#000000" x="6" y="9" width="5" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="13" y="9" width="5" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="6" y="13" width="4" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="10" y="13" width="4" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="14" y="13" width="4" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="19" y="13" width="4" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="6" y="18" width="4" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="10" y="18" width="4" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="16" y="18" width="4" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="22" y="18" width="4" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="6" y="21" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="8" y="21" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="10" y="21" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="12" y="21" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="14" y="21" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="16" y="21" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="19" y="21" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="21" y="21" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="23" y="21" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="24" y="21" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="27" y="21" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="29" y="21" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="7" y="25" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="9" y="25" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="12" y="25" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="14" y="25" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="19" y="25" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="22" y="25" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="24" y="25" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="26" y="25" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="6" y="28" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="9" y="28" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="10" y="28" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="13" y="28" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="16" y="28" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="19" y="28" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="21" y="28" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="23" y="28" width="2" height="1"></rect>
+ </g>
+ <g id="sql-file-format-symbol-svgrepo-com" transform="translate(677.000000, 222.000000)" fill-rule="nonzero">
+ <path d="M20.0183875,39 C18.1041619,39 17.0002175,41.0221112 17.0002175,43.5199898 C16.9818924,46.0572498 18.1227646,48 20.0000625,48 C21.895963,48 23,46.0773892 23,43.4606684 C23,41.021513 21.931595,39 20.0183875,39 Z" id="Path" fill="#000000"></path>
+ <path d="M37.990015,12.7011903 C37.9870671,12.4581301 37.9108008,12.2180529 37.7458108,12.0283968 L27.645951,0.355448964 C27.643954,0.35217737 27.6409109,0.351118914 27.6374875,0.348135991 C27.5777678,0.2801061 27.5080631,0.224007901 27.4343644,0.174549112 C27.4123023,0.160115613 27.3901451,0.146933018 27.3671321,0.133942869 C27.3018969,0.0987251317 27.2346647,0.0694732408 27.164009,0.0481116626 C27.14499,0.0425307098 27.1284434,0.0346403971 27.1093293,0.0296367842 C27.032682 [...]
+ <g id="SQL" transform="translate(3.000000, 37.000000)" fill="#CCCCCC">
+ <path d="M7.65902579,3.81813227 L7.65902579,3.81813227 L7.65902579,3.81813227 C7.84813754,3.46929506 7.94269341,3.13226744 7.94269341,2.80704942 L7.94269341,2.80704942 L7.94269341,2.80704942 C7.94269341,2.4818314 7.92397923,2.22928779 7.88655086,2.0494186 L7.88655086,2.0494186 L7.88655086,2.0494186 C7.84715258,1.86773256 7.78411533,1.70784884 7.69743911,1.56976744 L7.69743911,1.56976744 L7.69743911,1.56976744 C7.50832736,1.26635174 7.22465974,1.1146439 6.84643625,1.114643 [...]
+ </g>
+ <rect id="Rectangle" fill="#000000" x="5" y="9" width="6" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="12" y="9" width="6" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="5" y="13" width="4" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="9" y="13" width="4" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="14" y="13" width="4" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="17" y="13" width="4" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="5" y="16" width="5" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="9" y="16" width="5" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="15" y="16" width="5" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="20" y="16" width="5" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="5" y="20" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="7" y="20" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="9" y="20" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="12" y="20" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="14" y="20" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="16" y="20" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="18" y="20" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="20" y="20" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="22" y="20" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="24" y="20" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="27" y="20" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="29" y="20" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="6" y="23" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="9" y="23" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="12" y="23" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="14" y="23" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="18" y="23" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="20" y="23" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="23" y="23" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="26" y="23" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="5" y="29" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="7" y="29" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="10" y="29" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="13" y="29" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="15" y="29" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="18" y="29" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="19" y="29" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="22" y="29" width="2" height="1"></rect>
+ </g>
+ </g>
+</svg>
\ No newline at end of file
diff --git a/website-builder/static/img/logo.svg b/website-builder/static/img/logo.svg
new file mode 100644
index 0000000..0a76a78
--- /dev/null
+++ b/website-builder/static/img/logo.svg
@@ -0,0 +1 @@
+<svg id="svg" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="400" height="450" viewBox="0, 0, 400,450"><g id="svgg"><path id="path1" d="M213.706 2.706 C 212.348 4.063,212.333 4.105,212.333 6.515 C 212.333 13.329,221.032 13.654,221.595 6.861 C 221.989 2.107,216.956 -0.544,213.706 2.706 M174.624 16.201 C 170.148 18.568,171.557 26.343,176.459 26.328 C 180.429 26.316,182.731 21.622,180.474 18.141 C 178.992 15.856,176.708 15.098,174.624 16.2 [...]
\ No newline at end of file
diff --git a/website-builder/static/img/pinot-320x320.png b/website-builder/static/img/pinot-320x320.png
new file mode 100644
index 0000000..f29a4b5
Binary files /dev/null and b/website-builder/static/img/pinot-320x320.png differ
diff --git a/website-builder/static/img/pinot-architecture.png b/website-builder/static/img/pinot-architecture.png
new file mode 100644
index 0000000..338953c
Binary files /dev/null and b/website-builder/static/img/pinot-architecture.png differ
diff --git a/website-builder/static/img/pinot-components.svg b/website-builder/static/img/pinot-components.svg
new file mode 100644
index 0000000..4f61b3a
--- /dev/null
+++ b/website-builder/static/img/pinot-components.svg
@@ -0,0 +1,247 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="800px" height="400px" viewBox="0 0 800 400" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+ <!-- Generator: Sketch 61 (89581) - https://sketch.com -->
+ <title>ImgLight</title>
+ <desc>Created with Sketch.</desc>
+ <defs>
+ <circle id="path-1" cx="32.5" cy="32.5" r="32.5"></circle>
+ <filter x="-27.7%" y="-15.4%" width="143.1%" height="143.1%" filterUnits="objectBoundingBox" id="filter-3">
+ <feOffset dx="-4" dy="4" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
+ <feGaussianBlur stdDeviation="4" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
+ <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.0514039855 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
+ </filter>
+ <circle id="path-4" cx="32.5" cy="32.5" r="32.5"></circle>
+ <filter x="-27.7%" y="-15.4%" width="143.1%" height="143.1%" filterUnits="objectBoundingBox" id="filter-6">
+ <feOffset dx="-4" dy="4" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
+ <feGaussianBlur stdDeviation="4" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
+ <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.0514039855 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
+ </filter>
+ <circle id="path-7" cx="32.5" cy="32.5" r="32.5"></circle>
+ <filter x="-27.7%" y="-15.4%" width="143.1%" height="143.1%" filterUnits="objectBoundingBox" id="filter-9">
+ <feOffset dx="-4" dy="4" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
+ <feGaussianBlur stdDeviation="4" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
+ <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.0514039855 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
+ </filter>
+ <circle id="path-10" cx="32.5" cy="32.5" r="32.5"></circle>
+ <filter x="-20.8%" y="-11.5%" width="132.3%" height="132.3%" filterUnits="objectBoundingBox" id="filter-12">
+ <feOffset dx="-3" dy="3" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
+ <feGaussianBlur stdDeviation="3" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
+ <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.0514039855 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
+ </filter>
+ <circle id="path-13" cx="32.5" cy="32.5" r="32.5"></circle>
+ <filter x="-20.8%" y="-11.5%" width="132.3%" height="132.3%" filterUnits="objectBoundingBox" id="filter-15">
+ <feOffset dx="-3" dy="3" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
+ <feGaussianBlur stdDeviation="3" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
+ <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.0514039855 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
+ </filter>
+ <circle id="path-16" cx="32.5" cy="32.5" r="32.5"></circle>
+ <filter x="-20.8%" y="-11.5%" width="132.3%" height="132.3%" filterUnits="objectBoundingBox" id="filter-18">
+ <feOffset dx="-3" dy="3" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
+ <feGaussianBlur stdDeviation="3" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
+ <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.0514039855 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
+ </filter>
+ <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-19">
+ <stop stop-color="#B6B6B6" stop-opacity="0.748867754" offset="0%"></stop>
+ <stop stop-color="#C5C5C5" stop-opacity="0.418138587" offset="100%"></stop>
+ <stop stop-color="#3BA1FF" stop-opacity="0" offset="100%"></stop>
+ </linearGradient>
+ <circle id="path-20" cx="32.5" cy="32.5" r="32.5"></circle>
+ <filter x="-27.7%" y="-15.4%" width="143.1%" height="143.1%" filterUnits="objectBoundingBox" id="filter-22">
+ <feOffset dx="-4" dy="4" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
+ <feGaussianBlur stdDeviation="4" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
+ <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.0514039855 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
+ </filter>
+ <circle id="path-23" cx="32.5" cy="32.5" r="32.5"></circle>
+ <filter x="-27.7%" y="-15.4%" width="143.1%" height="143.1%" filterUnits="objectBoundingBox" id="filter-25">
+ <feOffset dx="-4" dy="4" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
+ <feGaussianBlur stdDeviation="4" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
+ <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.0514039855 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
+ </filter>
+ <circle id="path-26" cx="32.5" cy="32.5" r="32.5"></circle>
+ <filter x="-27.7%" y="-15.4%" width="143.1%" height="143.1%" filterUnits="objectBoundingBox" id="filter-28">
+ <feOffset dx="-4" dy="4" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
+ <feGaussianBlur stdDeviation="4" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
+ <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.0514039855 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
+ </filter>
+ </defs>
+ <g id="ImgLight" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+ <path d="M126.5,159 C147.833333,126 173.166667,99 202.5,78 C231.833333,57 280.5,42.3333333 348.5,34" id="Path-2" stroke="#8C8C8C" stroke-dasharray="3"></path>
+ <path d="M190.5,201 C201.085766,147.393422 215.252433,111.060088 233,92 C250.747567,72.9399116 288.414234,53.6065783 346,34" id="Path-3" stroke="#8C8C8C" stroke-dasharray="3"></path>
+ <path d="M190,273 C207.666667,174 227,113.666667 248,92 C269,70.3333333 302.166667,51 347.5,34" id="Path-4" stroke="#8C8C8C" stroke-dasharray="3"></path>
+ <path d="M125.5,314.32474 C157.117284,202.44158 184.938272,131.666667 208.962963,102 C232.987654,72.3333333 278.833333,49.6666667 346.5,34" id="Path-5" stroke="#8C8C8C" stroke-dasharray="3"></path>
+ <path d="M61,277.491217 C130.333333,170.830406 181.333333,105.833333 214,82.5 C246.666667,59.1666667 290.833333,43 346.5,34" id="Path-6" stroke="#8C8C8C" stroke-dasharray="3"></path>
+ <path d="M64,201 C117.720046,136.21307 163.053379,92.8797363 200,71 C236.946621,49.1202637 285.613287,36.7869303 346,34" id="Path-7" stroke="#8C8C8C" stroke-dasharray="3"></path>
+ <path id="Line" d="M559.429355,317.819082 L559.865143,318.064212 L567.865143,322.564212 L568.639877,323 L567.865143,323.435788 L559.865143,327.935788 L559.429355,328.180918 L558.939094,327.309343 L559.374882,327.064212 L565.711,323.5 L562.5,323.5 L562.5,322.5 L565.711,322.5 L559.374882,318.935788 L558.939094,318.690657 L559.429355,317.819082 Z M530.5,322.5 L530.5,323.5 L526.5,323.5 L526.5,322.5 L530.5,322.5 Z M536.5,322.5 L536.5,323.5 L532.5,323.5 L532.5,322.5 L536.5,322.5 Z M542 [...]
+ <path id="Line-Copy" d="M538.223799,266.863649 L538.723413,266.883283 C539.440317,266.911456 540.177314,266.925816 540.934397,266.926352 L541.698173,266.92228 L542.198141,266.916648 L542.209407,267.916584 L541.709439,267.922217 C540.926547,267.931037 540.163585,267.925802 539.420545,267.906501 L538.684145,267.882512 L538.18453,267.862878 L538.223799,266.863649 Z M548.17255,266.569995 L548.259736,267.566187 L547.76164,267.60978 C546.988568,267.677439 546.230936,267.734257 545.4887 [...]
+ <path id="Line-Copy-2" d="M403.309343,63.8190816 L404.180918,64.3093429 L403.935788,64.7451306 L399.435788,72.7451306 L399,73.5198644 L398.564212,72.7451306 L394.064212,64.7451306 L393.819082,64.3093429 L394.690657,63.8190816 L394.935788,64.2548694 L398.5,70.591 L398.5,67.5 L399.5,67.5 L399.5,70.591 L403.064212,64.2548694 L403.309343,63.8190816 Z M399.5,61.5 L399.5,65.5 L398.5,65.5 L398.5,61.5 L399.5,61.5 Z M399.5,55.5 L399.5,59.5 L398.5,59.5 L398.5,55.5 L399.5,55.5 Z M399.5,49.5 [...]
+ <g id="Bitmap-Copy-3" transform="translate(156.000000, 165.000000)">
+ <mask id="mask-2" fill="white">
+ <use xlink:href="#path-1"></use>
+ </mask>
+ <g id="Mask">
+ <use fill="black" fill-opacity="1" filter="url(#filter-3)" xlink:href="#path-1"></use>
+ <use fill="#FFFFFF" fill-rule="evenodd" xlink:href="#path-1"></use>
+ </g>
+ <image mask="url(#mask-2)" x="12.037037" y="12.037037" width="40.9259259" height="40.9259259" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAIAAAACACAYAAADDPmHLAAAABGdBTUEAALGOfPtRkwAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAAAgKADAAQAAAABAAAAgAAAAABIjgR3AAAjyUlEQVR4Ae2dCdxew/XHJ4sSEQkRJJZEmkgpiiaqIYuU2BtKmtq1llJ7UVpKSmJpqTWCqLW22neJIIkiBKkttorYlVj+VFBJ5v/7zr3nee6zL+/zvt7EPZ/PeWbu3Llz78ycOXOWmXmcSyFtgbQF0hZIWyBtgbQF0hZIWyBtgbQF0hZI [...]
+ </g>
+ <g id="Bitmap-Copy-9" transform="translate(28.000000, 165.000000)">
+ <mask id="mask-5" fill="white">
+ <use xlink:href="#path-4"></use>
+ </mask>
+ <g id="Mask">
+ <use fill="black" fill-opacity="1" filter="url(#filter-6)" xlink:href="#path-4"></use>
+ <use fill="#FFFFFF" fill-rule="evenodd" xlink:href="#path-4"></use>
+ </g>
+ <image mask="url(#mask-5)" x="20.8641975" y="15.2469136" width="24.0740741" height="35.308642" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAANAAAAFACAYAAADNtfKDAAAABGdBTUEAALGOfPtRkwAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAAA0KADAAQAAAABAAABQAAAAAAg0MOAAAAwtUlEQVR4Ae2dibMW1Zn/+7IKyCab7MgmKIOjFEW0qFRJReuXkXIypuZnUIwGMRr+ICMRECYQ46RiDGUmKUhhaVlSFAVRyxE0ArIvlx3UAGLP+bzaN337dr+9nef06X7PU3Xv+3a/3Wf5nvOc5TnP0uXVmP7/f/6nP2zYMG/gwIFe//7 [...]
+ </g>
+ <g id="Bitmap-Copy-6" transform="translate(156.000000, 242.000000)">
+ <mask id="mask-8" fill="white">
+ <use xlink:href="#path-7"></use>
+ </mask>
+ <g id="Mask">
+ <use fill="black" fill-opacity="1" filter="url(#filter-9)" xlink:href="#path-7"></use>
+ <use fill="#FFFFFF" fill-rule="evenodd" xlink:href="#path-7"></use>
+ </g>
+ <image mask="url(#mask-8)" x="17.654321" y="15.2469136" width="32.0987654" height="36.1111111" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAXMAAAGnCAYAAABFFberAAAABGdBTUEAALGOfPtRkwAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAABc6ADAAQAAAABAAABpwAAAACSw8w4AABAAElEQVR4Aey9eaxdyX3nV2e7+9sfH3eyyWav2iy3FkseWZLHMuIkSjwetJBBjEHiIJrAgQbxAJ7BIEDU+iOYCSbIYiP22EkAJV4m0z2SJVsjWWu3pJZa3WqqFzbZbO7b29e737Pn+61zz32X5CPFZnN599xfkWers1V9691P/c6v6tQ [...]
+ </g>
+ <g id="Group-5" transform="translate(271.000000, 268.000000)" fill-rule="nonzero">
+ <path d="M129,10 L255.62325,35.2097696 L255.03,71.252 L255.01,73.087 L255.429662,73.1708738 L135.426,96.82 L127.445602,98.4004556 L0.264237582,73.2280941 L0.264,73.222 L1.42108547e-14,73.1708738 L0.263,73.118 L0.259,72.565 L1.42108547e-13,72.6169894 L1.42108547e-13,34.8866389 L126.35859,10 L126.36,10.215 L127.445602,10 L129.002,10.31 L129,10 Z" id="Combined-Shape" fill="#F44AF5"></path>
+ <polygon id="Fill-75-Copy" fill="#000000" opacity="0.255138579" points="0 35 0 73.3001307 127.440092 98.6169894 127.440092 60.6437577"></polygon>
+ <polygon id="Fill-76-Copy" fill="#000000" opacity="0.499418713" points="128 60.4465748 255.62325 35 255.003418 73.1703643 128 98.6169894"></polygon>
+ <polygon id="Fill-74-Copy-Copy" fill-opacity="0.33241368" fill="#FFFFFF" points="0 25.1708738 127.716305 50.3391483 255.429662 25.1708738 127.716305 -1.13686838e-13"></polygon>
+ </g>
+ <g id="Group-5-Copy" transform="translate(271.000000, 210.000000)" fill-rule="nonzero">
+ <path d="M129,10 L255.62325,35.2097696 L255.03,71.252 L255.01,73.087 L255.429662,73.1708738 L135.426,96.82 L127.445602,98.4004556 L0.264237582,73.2280941 L0.264,73.222 L1.42108547e-14,73.1708738 L0.263,73.118 L0.259,72.565 L1.42108547e-13,72.6169894 L1.42108547e-13,34.8866389 L126.35859,10 L126.36,10.215 L127.445602,10 L129.002,10.31 L129,10 Z" id="Combined-Shape" fill="#4285F4"></path>
+ <polygon id="Fill-75-Copy" fill="#000000" opacity="0.255138579" points="0 35 0 73.3001307 127.440092 98.6169894 127.440092 60.6437577"></polygon>
+ <polygon id="Fill-76-Copy" fill="#000000" opacity="0.499418713" points="128 60.4465748 255.62325 35 255.003418 73.1703643 128 98.6169894"></polygon>
+ <polygon id="Fill-74-Copy-Copy" fill-opacity="0.33241368" fill="#FFFFFF" points="0 25.1708738 127.716305 50.3391483 255.429662 25.1708738 127.716305 -1.13686838e-13"></polygon>
+ </g>
+ <g id="Group-5-Copy-2" transform="translate(271.000000, 80.000000)" fill-rule="nonzero">
+ <path d="M129,80 L255.62325,105.20977 L255.03,141.252 L255.01,143.087 L255.429662,143.170874 L135.426,166.82 L127.445602,168.400456 L0.264237582,143.228094 L0.264,143.222 L1.42108547e-14,143.170874 L0.263,143.118 L0.259,142.565 L1.42108547e-13,142.616989 L1.42108547e-13,104.886639 L126.35859,80 L126.36,80.215 L127.445602,80 L129.002,80.31 L129,80 Z" id="Combined-Shape" fill="#54BAC9"></path>
+ <polygon id="Fill-75-Copy" fill="#000000" opacity="0.255138579" points="0 105 0 143.300131 127.440092 168.616989 127.440092 130.643758"></polygon>
+ <polygon id="Fill-76-Copy" fill="#000000" opacity="0.499418713" points="128 130.446575 255.62325 105 255.003418 143.170364 128 168.616989"></polygon>
+ <polygon id="Fill-74-Copy-Copy" fill-opacity="0.33241368" fill="#FFFFFF" points="0 95.1708738 127.716305 120.339148 255.429662 95.1708738 127.716305 70"></polygon>
+ <polygon id="Fill-74-Copy-Copy" fill-opacity="0.33241368" fill="#FFFFFF" points="0 25.1708738 127.716305 50.3391483 255.429662 25.1708738 127.716305 -1.10134124e-13"></polygon>
+ <polygon id="Fill-74-Copy-Copy" fill-opacity="0.33241368" fill="#FFFFFF" points="0 85.1708738 127.716305 110.339148 255.429662 85.1708738 127.716305 60"></polygon>
+ <polygon id="Fill-74-Copy-Copy" fill-opacity="0.33241368" fill="#FFFFFF" points="0 75.1708738 127.716305 100.339148 255.429662 75.1708738 127.716305 50"></polygon>
+ <polygon id="Fill-74-Copy-Copy" fill-opacity="0.33241368" fill="#FFFFFF" points="0 65.1708738 127.716305 90.3391483 255.429662 65.1708738 127.716305 40"></polygon>
+ <polygon id="Fill-74-Copy-Copy" fill-opacity="0.33241368" fill="#FFFFFF" points="0 55.1708738 127.716305 80.3391483 255.429662 55.1708738 127.716305 30"></polygon>
+ <polygon id="Fill-74-Copy-Copy" fill-opacity="0.33241368" fill="#FFFFFF" points="0 45.1708738 127.716305 70.3391483 255.429662 45.1708738 127.716305 20"></polygon>
+ <polygon id="Fill-74-Copy-Copy" fill-opacity="0.33241368" fill="#FFFFFF" points="0 35.1708738 127.716305 60.3391483 255.429662 35.1708738 127.716305 10"></polygon>
+ </g>
+ <text id="Use-Cases-Copy" opacity="0.904203869" font-family="DINAlternate-Bold, DIN Alternate" font-size="20" font-weight="bold" fill="#838383">
+ <tspan x="621" y="81">USE-CASES</tspan>
+ </text>
+ <text id="Data-Products" font-family="DINAlternate-Bold, DIN Alternate" font-size="16" font-weight="bold" fill="#8D8D8D">
+ <tspan x="640.476562" y="232">Data </tspan>
+ <tspan x="611.453125" y="251">Products</tspan>
+ </text>
+ <text id="Business-Intelligenc" font-family="DINAlternate-Bold, DIN Alternate" font-size="16" font-weight="bold" fill="#8D8D8D">
+ <tspan x="658" y="155">Business </tspan>
+ <tspan x="658" y="174">Intelligence</tspan>
+ </text>
+ <text id="Anomaly-Detection" font-family="DINAlternate-Bold, DIN Alternate" font-size="16" font-weight="bold" fill="#8D8D8D">
+ <tspan x="658" y="310">Anomaly </tspan>
+ <tspan x="658" y="329">Detection</tspan>
+ </text>
+ <text id="Sources-Copy" opacity="0.904203869" font-family="DINAlternate-Bold, DIN Alternate" font-size="20" font-weight="bold" fill="#838383">
+ <tspan x="84.40625" y="81">SOURCES</tspan>
+ </text>
+ <text id="Events-Copy" opacity="0.904203869" font-family="DINAlternate-Bold, DIN Alternate" font-size="20" font-weight="bold" fill="#838383">
+ <tspan x="365.237305" y="41">EVENTS</tspan>
+ </text>
+ <g id="Group" transform="translate(577.000000, 126.000000)">
+ <mask id="mask-11" fill="white">
+ <use xlink:href="#path-10"></use>
+ </mask>
+ <g id="Mask">
+ <use fill="black" fill-opacity="1" filter="url(#filter-12)" xlink:href="#path-10"></use>
+ <use fill="#FFFFFF" fill-rule="evenodd" xlink:href="#path-10"></use>
+ </g>
+ <image id="Bitmap-Copy-8" mask="url(#mask-11)" x="10.4320988" y="12.8395062" width="43.3333333" height="43.3333333" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAgAAAAIACAYAAAD0eNT6AAAABGdBTUEAALGOfPtRkwAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAACAKADAAQAAAABAAACAAAAAAAL+LWFAABAAElEQVR4Ae3dCZwcV33g8feqq6+RRrZk+ZSEDsuHNJZMogRDuGwnwQmLN7AGYT4QWHPk+AQILBsCLPvBbMyVwIfLiYLAQMAEe2SHgAOEJUF24kW2bGEsWfIpS7Juy5YszdVnvf3XSD2M5Onp6u46u371+b [...]
+ </g>
+ <g id="Group-2" transform="translate(687.000000, 203.000000)">
+ <mask id="mask-14" fill="white">
+ <use xlink:href="#path-13"></use>
+ </mask>
+ <g id="Mask">
+ <use fill="black" fill-opacity="1" filter="url(#filter-15)" xlink:href="#path-13"></use>
+ <use fill="#FFFFFF" fill-rule="evenodd" xlink:href="#path-13"></use>
+ </g>
+ <image id="Bitmap-Copy-7" mask="url(#mask-14)" x="12.037037" y="13.6419753" width="36.1111111" height="39.3209877" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAA6oAAAQACAYAAADoXKQYAAAMTWlDQ1BJQ0MgUHJvZmlsZQAASImVVwdck0cbv3dkkrACYcgIe4kiM4CMEFYEAZmCqIQkkDBiTAgqbqRUwbpFFNSKVkUsWgcgdaLWWRS3dRQHKkotDlyofJcB2vYbv+/5/e69//vcc/9n5O7NHQB6tXyZrADVB6BQWiRPjApjjU/PYJEeAgyQgC4wAd58gULGSUiIBVAG+7/Km2sAUfWX3VVc/xz/r2IgFCkEACAJEGcLFYJCiPcBgJcKZPIiAIhsqLebViRT4UyIjeQwQIhlKpyrwWU [...]
+ </g>
+ <g id="Group-4" transform="translate(577.000000, 281.000000)">
+ <g id="Group-3">
+ <mask id="mask-17" fill="white">
+ <use xlink:href="#path-16"></use>
+ </mask>
+ <g id="Mask">
+ <use fill="black" fill-opacity="1" filter="url(#filter-18)" xlink:href="#path-16"></use>
+ <use fill="#FFFFFF" fill-rule="evenodd" xlink:href="#path-16"></use>
+ </g>
+ <path d="M-1.60493827,44.7713826 C-1.73902763,41.8732326 0.166750448,40.4241576 4.11239595,40.4241576 C10.0308642,40.4241576 11.3014114,44.5096125 15.8409367,44.2005655 C20.3804619,43.8915185 27.1728395,36.1111111 31.3284358,30.5179012 C35.4840321,24.9246914 43.2872002,47.3338772 47.8906848,46.8624974 C53.7654321,46.5432099 55.3747849,39.2410692 57.8291263,38.7588798 C60.2834678,38.2766903 59.4573907,43.9248375 61.0236254,44.2823489 C62.5898601,44.6398602 65.0481481,40.40 [...]
+ </g>
+ <g id="anomaly-detection-copy" transform="translate(26.481481, 19.259259)" stroke="#5EA7EA" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.44">
+ <ellipse id="Oval" cx="6.49876543" cy="6.70477824" rx="4.20246914" ry="4.29974851"></ellipse>
+ <line x1="6.49876543" y1="0.252629172" x2="6.49876543" y2="3.7540695" id="Path"></line>
+ <line x1="6.49876543" y1="9.43822588" x2="6.49876543" y2="13.3085048" id="Path"></line>
+ <line x1="0.404938272" y1="6.70477824" x2="3.82716049" y2="6.70477824" id="Path"></line>
+ <line x1="9.17037037" y1="6.70477824" x2="12.5925926" y2="6.70477824" id="Path"></line>
+ </g>
+ </g>
+ <g id="Group-5" transform="translate(271.000000, 195.000000)" font-family="DINAlternate-Bold, DIN Alternate" font-weight="bold">
+ <text id="Smart-Index-Copy" transform="translate(191.927620, 25.177529) rotate(-11.000000) translate(-191.927620, -25.177529) " font-size="18" fill="#FAF5F5">
+ <tspan x="145.789437" y="28.6775292">Smart Index</tspan>
+ </text>
+ <text id="Blazing-Fast-Copy" transform="translate(64.873543, 26.472952) rotate(11.000000) translate(-64.873543, -26.472952) " font-size="18" fill="#F8F5F5">
+ <tspan x="17.307137" y="27.9729521">Blazing-Fast</tspan>
+ </text>
+ <text id="Performant-Copy" transform="translate(63.546002, 81.214275) rotate(11.000000) translate(-63.546002, -81.214275) " font-size="19" fill="#FCF7F7">
+ <tspan x="17.9664126" y="87.7142748">Performant</tspan>
+ </text>
+ <text id="Aggregation-Copy" transform="translate(191.155175, 83.777538) rotate(-11.000000) translate(-191.155175, -83.777538) " font-size="19" fill="#FAF5F5">
+ <tspan x="142.773827" y="87.2775384">Aggregation</tspan>
+ </text>
+ <text id="Pre-Materialization-Copy" transform="translate(192.240329, 146.071874) rotate(-11.000000) translate(-192.240329, -146.071874) " font-size="15" fill="#F6F3F3">
+ <tspan x="132.005954" y="142.071874">Pre-Materialization</tspan>
+ </text>
+ <text id="Segment-Optimizer-Copy" transform="translate(64.546002, 140.214275) rotate(11.000000) translate(-64.546002, -140.214275) " font-size="15" fill="#F8F5F5">
+ <tspan x="4.01499655" y="142.714275">Segment Optimizer</tspan>
+ </text>
+ </g>
+ <g id="Bitmap-Copy-2" transform="translate(93.000000, 125.000000)">
+ <mask id="mask-21" fill="white">
+ <use xlink:href="#path-20"></use>
+ </mask>
+ <g id="Mask">
+ <use fill="black" fill-opacity="1" filter="url(#filter-22)" xlink:href="#path-20"></use>
+ <use fill="#FFFFFF" fill-rule="evenodd" xlink:href="#path-20"></use>
+ </g>
+ <image mask="url(#mask-21)" x="10.4320988" y="20.8641975" width="44.1358025" height="23.2716049" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAABLAAAAJxCAYAAABSRUvkAAAABGdBTUEAALGOfPtRkwAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAAEsKADAAQAAAABAAACcQAAAABCSKAQAABAAElEQVR4AezdCXxU1d34/3PuzCSggEoFJJlJwIpLcWmLLbKKShfaWqttlCRgbZ+Wp4vd/m1/Pl2ltYvP0721m1ofqyRoY+va0vqgImu12kVLVUBJZiYBQasISsjM3PP/3gASQkLmznrvnc99vSAzd87yPe87meR+c+65WrEhgAACC [...]
+ </g>
+ <g id="Bitmap-Copy-4" transform="translate(93.000000, 282.000000)">
+ <mask id="mask-24" fill="white">
+ <use xlink:href="#path-23"></use>
+ </mask>
+ <g id="Mask">
+ <use fill="black" fill-opacity="1" filter="url(#filter-25)" xlink:href="#path-23"></use>
+ <use fill="#FFFFFF" fill-rule="evenodd" xlink:href="#path-23"></use>
+ </g>
+ <image mask="url(#mask-24)" x="13.6419753" y="14.4444444" width="36.1111111" height="36.1111111" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAABLAAAASwCAYAAADrIbPPAAAABGdBTUEAALGOfPtRkwAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAAEsKADAAQAAAABAAAEsAAAAABAZIJmAABAAElEQVR4AezdC5RcZ30g+HtvPbpbsg02xOadAEZ+QYJxJsGYgKxuyRBCQhKU93MyCcmQOAmxsSSbUMFSt2SDLOfMzAm75+zO7p6ze9aZnNlZMsfYlmwFm8xsApM4mIeNTRJIIBBsGWxLXd1V99tPAjl6tKR+VHXdx6/P8emqe7/7/ [...]
+ </g>
+ <g id="Bitmap-Copy-5" transform="translate(28.000000, 242.000000)">
+ <mask id="mask-27" fill="white">
+ <use xlink:href="#path-26"></use>
+ </mask>
+ <g id="Mask">
+ <use fill="black" fill-opacity="1" filter="url(#filter-28)" xlink:href="#path-26"></use>
+ <use fill="#FFFFFF" fill-rule="evenodd" xlink:href="#path-26"></use>
+ </g>
+ <image mask="url(#mask-27)" x="11.2345679" y="16.0493827" width="41.7283951" height="32.9012346" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAZAAAAFACAYAAACSgSrjAAAABGdBTUEAALGOfPtRkwAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAABkKADAAQAAAABAAABQAAAAACSxBCVAAAuOklEQVR4Ae2deXQc13Xmb69AYwdJANx3UtxEUUvMRXtERZRtydbYkm0to0RrJEeW7UwmsWfsRH94JjlnxtJxdCzJmcSmfeKMZ+RYdjS2NI4jaSRxMbVRJimSIglSJEBsxNpA791zbxMNogE00N1Vr7rq9VfnFLqr6r137/vd6v7wl [...]
+ </g>
+ <image id="Bitmap-Copy" x="370" y="82" width="51" height="83" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAewAAAMYCAYAAAAJttRGAAAABGdBTUEAALGOfPtRkwAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAAB7KADAAQAAAABAAADGAAAAAAmw5O2AABAAElEQVR4Aey9CZgcV3nuXz3aRvto3zdrtSRL8iIZ4xUbYzAJtlkdMNsFshBCbsgN/8sSCCEk/EPuJZAAIQm5cBPAQBwciFkMNhiEF9mSbO37Lsu2bLzJtiRL7vv+jqfk1ng0M93T1VXV9Z7nqeme7uqzvOfUec+3nO+UIicjYASMQA4RKJfLJaXyAw888N+ffvrpIYcPH37vM888M2HP [...]
+ <path id="Path-9" d="M529.381393,207.273589 L529.461256,208.270395 C528.80988,208.322583 528.148984,208.3738 527.478568,208.424048 L526.465804,208.498692 L526.393519,207.501308 C527.410923,207.427573 528.406881,207.351666 529.381393,207.273589 Z M535.346937,206.742134 L535.445445,207.737271 C534.797955,207.801365 534.139015,207.86429 533.468625,207.926048 L532.454451,208.017807 L532.365939,207.021732 C533.385409,206.931141 534.379076,206.837942 535.346937,206.742134 Z M541.298584 [...]
+ <line x1="351.5" y1="34" x2="343.5" y2="29.5" id="Path-10" stroke="#979797"></line>
+ <line x1="351.5" y1="40.5" x2="344.5" y2="34" id="Path-10" stroke="#979797" transform="translate(348.000000, 37.500000) scale(-1, 1) translate(-348.000000, -37.500000) "></line>
+ </g>
+</svg>
\ No newline at end of file
diff --git a/website-builder/static/img/pinot-navbar-logo-722f37.png b/website-builder/static/img/pinot-navbar-logo-722f37.png
new file mode 100644
index 0000000..77b8b67
Binary files /dev/null and b/website-builder/static/img/pinot-navbar-logo-722f37.png differ
diff --git a/website-builder/static/img/pinot-navbar-logo-722f37.svg b/website-builder/static/img/pinot-navbar-logo-722f37.svg
new file mode 100644
index 0000000..170d89c
--- /dev/null
+++ b/website-builder/static/img/pinot-navbar-logo-722f37.svg
@@ -0,0 +1,21 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="851px" height="327px" viewBox="0 0 851 327" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+ <!-- Generator: Sketch 61 (89581) - https://sketch.com -->
+ <title>pinot-navbar-logo-722f37</title>
+ <desc>Created with Sketch.</desc>
+ <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+ <g id="pinot-navbar-logo-722f37" fill="#722F37" fill-rule="nonzero">
+ <path d="M101.5,12.80279 C98.5,9.80278999 98.3,6.40278999 101.1,2.90278999 C105.2,-2.39721001 112,0.602789991 112,7.60278999 C112,14.60279 106.1,17.50279 101.5,12.80279 Z" id="Path" transform="translate(105.559592, 7.651395) scale(-1, 1) rotate(-180.000000) translate(-105.559592, -7.651395) "></path>
+ <path d="M50.6,31.882638 C46.7,27.982638 47.8,21.282638 52.7,19.382638 C58.6,17.182638 63.9,26.682638 59.4,31.582638 C57.3,33.882638 52.7,34.082638 50.6,31.882638 Z" id="Path" transform="translate(54.663061, 26.241319) scale(-1, 1) rotate(-180.000000) translate(-54.663061, -26.241319) "></path>
+ <path d="M101.2,325.394268 C99,323.894268 99,323.694268 99,294.694268 C99,262.294268 98.8,260.994268 93,260.994268 C87.5,260.994268 87,262.594268 87,279.594268 C87,294.894268 87,295.094268 84.4,297.594268 C82.5,299.594268 81.3,299.994268 79.2,299.494268 C73.9,298.194268 74,298.994268 74,265.494268 L74,234.294268 L79.6,237.194268 C84.3,239.494268 86.6,239.994268 92.6,239.994268 C106.7,239.994268 117.2,231.694268 120.6,217.794268 C122.1,211.894268 122.1,210.794268 120.6,204.994 [...]
+ <path d="M75.7,41.09803 C73.4,38.59803 73.5,32.59803 75.8,30.59803 C77.7,28.79803 81.7,28.39803 83.6,29.69803 C85.6,30.99803 87.2,35.09803 86.6,37.39803 C85.3,42.69803 79,44.79803 75.7,41.09803 Z" id="Path" transform="translate(80.375954, 35.949015) scale(-1, 1) rotate(-180.000000) translate(-80.375954, -35.949015) "></path>
+ <path d="M85,156.45979 C79.5,152.65979 77.5,149.15979 77.5,143.15979 C77.5,134.65979 83.1,128.65979 91.7,127.95979 C100.8,127.25979 108,134.15979 108,143.65979 C108,155.25979 94.3,162.75979 85,156.45979 Z" id="Path" transform="translate(92.750000, 143.329895) scale(-1, 1) rotate(-180.000000) translate(-92.750000, -143.329895) "></path>
+ <path d="M409.753404,96.8902798 C403.035734,93.3600049 399.676898,87.8819922 399.054891,79.9693071 C398.557286,72.056622 401.418516,66.7003428 408.633793,61.9527318 C414.605056,57.9355224 425.179167,58.057256 431.274832,62.0744654 C443.092956,69.8654169 442.844154,87.3950577 430.901628,96.0381445 C426.049976,99.5684194 415.600266,100.055354 409.753404,96.8902798 Z" id="Path" transform="translate(419.500000, 79.000000) scale(-1, 1) rotate(-180.000000) translate(-419.500000, -7 [...]
+ <polygon id="Path" transform="translate(821.000000, 178.500000) scale(-1, 1) rotate(-180.000000) translate(-821.000000, -178.500000) " points="803.244898 246.349767 803.244898 221.699534 797.122449 221.699534 791 221.699534 791 206.909394 791 192.119254 797.122449 192.119254 803.244898 192.119254 803.489796 139.491006 803.857143 86.739507 819.530612 86.3697535 835.081633 86 835.081633 139.121252 835.081633 192.119254 843.040816 192.119254 851 192.119254 851 206.909394 851 221 [...]
+ <path d="M528.072646,269.340519 C521.925176,267.139506 513.770368,262.492924 509.504777,258.70229 L506.619229,256.256721 L506.619229,261.881531 L506.619229,267.62862 L490.309615,267.62862 L474,267.62862 L474,200.375449 L474,133.122278 L490.184156,133.122278 L506.368312,133.122278 L506.870147,176.286586 C507.49744,224.464313 508.124732,228.621781 516.028623,236.325326 C521.046966,241.216466 530.3309,243.784314 539.489376,242.806086 C551.533399,241.338745 557.053577,235.591655 [...]
+ <path d="M677.52103,274.437991 C665.407725,271.469256 654.901288,265.284393 645.012876,255.264914 C630.180258,240.297545 624,225.701267 624,205.043824 C624,162.368267 658.238627,130.330675 700.635193,133.175712 C713.119313,134.041593 722.266094,136.515538 731.536481,141.587126 C746.987124,150.245935 758.853219,163.976331 764.662661,180.056976 C767.505579,187.849904 768,190.818638 768,204.425338 C768,217.413551 767.505579,221.248166 765.157082,228.175213 C757.369957,250.564418 [...]
+ <polygon id="Path" transform="translate(420.500000, 203.500000) scale(-1, 1) rotate(-180.000000) translate(-420.500000, -203.500000) " points="404 203.561308 404 136 420.246154 136.367847 436.365385 136.735695 436.746154 203.929155 437 271 420.5 271 404 271"></polygon>
+ <path d="M285.568834,325.759393 C278.634681,324.648318 267.738153,320.697827 263.651955,317.858411 C259.93723,315.265902 259.194285,315.512807 259.194285,319.710204 L259.194285,323.413789 L243.097143,323.413789 L227,323.413789 L227,230.206895 L227,137 L243.097143,137 L259.194285,137 L259.194285,165.887965 L259.194285,194.899382 L266.376087,191.195797 C276.405845,186.134231 286.435603,183.912079 299.437142,183.912079 C320.982548,183.912079 337.698811,190.578533 351.938591,204. [...]
+ </g>
+ </g>
+</svg>
\ No newline at end of file
diff --git a/website-builder/static/img/pinot-navbar-logo.svg b/website-builder/static/img/pinot-navbar-logo.svg
new file mode 100644
index 0000000..7651aff
--- /dev/null
+++ b/website-builder/static/img/pinot-navbar-logo.svg
@@ -0,0 +1,19 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="851px" height="327px" viewBox="0 0 851 327" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+ <!-- Generator: Sketch 64 (93537) - https://sketch.com -->
+ <title>pinot</title>
+ <desc>Created with Sketch.</desc>
+ <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+ <path d="M101.5,12.8027896 C98.5,9.80278959 98.3,6.40278959 101.1,2.90278959 C105.2,-2.39721041 112,0.60278959 112,7.60278959 C112,14.6027896 106.1,17.5027896 101.5,12.8027896 Z" id="Path" fill="#000000" fill-rule="nonzero" transform="translate(105.559592, 7.651395) scale(-1, 1) rotate(-180.000000) translate(-105.559592, -7.651395) "></path>
+ <path d="M50.6,31.8826375 C46.7,27.9826375 47.8,21.2826375 52.7,19.3826375 C58.6,17.1826375 63.9,26.6826375 59.4,31.5826375 C57.3,33.8826375 52.7,34.0826375 50.6,31.8826375 Z" id="Path" fill="#000000" fill-rule="nonzero" transform="translate(54.663061, 26.241319) scale(-1, 1) rotate(-180.000000) translate(-54.663061, -26.241319) "></path>
+ <path d="M101.2,325.394269 C99,323.894269 99,323.694269 99,294.694269 C99,262.294269 98.8,260.994269 93,260.994269 C87.5,260.994269 87,262.594269 87,279.594269 C87,294.894269 87,295.094269 84.4,297.594269 C82.5,299.594269 81.3,299.994269 79.2,299.494269 C73.9,298.194269 74,298.994269 74,265.494269 L74,234.294269 L79.6,237.194269 C84.3,239.494269 86.6,239.994269 92.6,239.994269 C106.7,239.994269 117.2,231.694269 120.6,217.794269 C122.1,211.894269 122.1,210.794269 120.6,204.994269 [...]
+ <path d="M75.7,41.0980294 C73.4,38.5980294 73.5,32.5980294 75.8,30.5980294 C77.7,28.7980294 81.7,28.3980294 83.6,29.6980294 C85.6,30.9980294 87.2,35.0980294 86.6,37.3980294 C85.3,42.6980294 79,44.7980294 75.7,41.0980294 Z" id="Path" fill="#000000" fill-rule="nonzero" transform="translate(80.375954, 35.949015) scale(-1, 1) rotate(-180.000000) translate(-80.375954, -35.949015) "></path>
+ <path d="M85,156.45979 C79.5,152.65979 77.5,149.15979 77.5,143.15979 C77.5,134.65979 83.1,128.65979 91.7,127.95979 C100.8,127.25979 108,134.15979 108,143.65979 C108,155.25979 94.3,162.75979 85,156.45979 Z" id="Path" fill="#000000" fill-rule="nonzero" transform="translate(92.750000, 143.329895) scale(-1, 1) rotate(-180.000000) translate(-92.750000, -143.329895) "></path>
+ <path d="M409.753404,96.8902798 C403.035734,93.3600049 399.676898,87.8819922 399.054891,79.9693071 C398.557286,72.056622 401.418516,66.7003428 408.633793,61.9527318 C414.605056,57.9355224 425.179167,58.057256 431.274832,62.0744654 C443.092956,69.8654169 442.844154,87.3950577 430.901628,96.0381445 C426.049976,99.5684194 415.600266,100.055354 409.753404,96.8902798 Z" id="Path" fill="#000000" fill-rule="nonzero" transform="translate(419.500000, 79.000000) scale(-1, 1) rotate(-180.00 [...]
+ <polygon id="Path" fill="#000000" fill-rule="nonzero" transform="translate(821.000000, 178.500000) scale(-1, 1) rotate(-180.000000) translate(-821.000000, -178.500000) " points="803.244898 246.349767 803.244898 221.699534 797.122449 221.699534 791 221.699534 791 206.909394 791 192.119254 797.122449 192.119254 803.244898 192.119254 803.489796 139.491006 803.857143 86.739507 819.530612 86.3697535 835.081633 86 835.081633 139.121252 835.081633 192.119254 843.040816 192.119254 851 19 [...]
+ <path d="M528.072646,269.340519 C521.925176,267.139506 513.770368,262.492924 509.504777,258.70229 L506.619229,256.256721 L506.619229,261.881531 L506.619229,267.62862 L490.309615,267.62862 L474,267.62862 L474,200.375449 L474,133.122278 L490.184156,133.122278 L506.368312,133.122278 L506.870147,176.286586 C507.49744,224.464313 508.124732,228.621781 516.028623,236.325326 C521.046966,241.216466 530.3309,243.784314 539.489376,242.806086 C551.533399,241.338745 557.053577,235.591655 559. [...]
+ <path d="M677.52103,274.437991 C665.407725,271.469256 654.901288,265.284393 645.012876,255.264914 C630.180258,240.297545 624,225.701267 624,205.043824 C624,162.368267 658.238627,130.330675 700.635193,133.175712 C713.119313,134.041593 722.266094,136.515538 731.536481,141.587126 C746.987124,150.245935 758.853219,163.976331 764.662661,180.056976 C767.505579,187.849904 768,190.818638 768,204.425338 C768,217.413551 767.505579,221.248166 765.157082,228.175213 C757.369957,250.564418 737 [...]
+ <polygon id="Path" fill="#000000" fill-rule="nonzero" transform="translate(420.500000, 203.500000) scale(-1, 1) rotate(-180.000000) translate(-420.500000, -203.500000) " points="404 203.561308 404 136 420.246154 136.367847 436.365385 136.735695 436.746154 203.929155 437 271 420.5 271 404 271"></polygon>
+ <path d="M285.568834,325.759393 C278.634681,324.648318 267.738153,320.697827 263.651955,317.858411 C259.93723,315.265902 259.194285,315.512807 259.194285,319.710204 L259.194285,323.413789 L243.097143,323.413789 L227,323.413789 L227,230.206895 L227,137 L243.097143,137 L259.194285,137 L259.194285,165.887965 L259.194285,194.899382 L266.376087,191.195797 C276.405845,186.134231 286.435603,183.912079 299.437142,183.912079 C320.982548,183.912079 337.698811,190.578533 351.938591,204.8990 [...]
+ </g>
+</svg>
\ No newline at end of file
diff --git a/website-builder/static/img/pinot-overview-dark.png b/website-builder/static/img/pinot-overview-dark.png
new file mode 100644
index 0000000..79c493c
Binary files /dev/null and b/website-builder/static/img/pinot-overview-dark.png differ
diff --git a/website-builder/static/img/pinot-overview-light.png b/website-builder/static/img/pinot-overview-light.png
new file mode 100644
index 0000000..54095bc
Binary files /dev/null and b/website-builder/static/img/pinot-overview-light.png differ
diff --git a/website-builder/static/img/pinot-overview.png b/website-builder/static/img/pinot-overview.png
new file mode 100644
index 0000000..b07e500
Binary files /dev/null and b/website-builder/static/img/pinot-overview.png differ
diff --git a/website-builder/static/img/pinot-overview.svg b/website-builder/static/img/pinot-overview.svg
new file mode 100644
index 0000000..2e1ad10
--- /dev/null
+++ b/website-builder/static/img/pinot-overview.svg
@@ -0,0 +1,247 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="800px" height="400px" viewBox="0 0 800 400" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+ <!-- Generator: Sketch 61 (89581) - https://sketch.com -->
+ <title>PinotOverview</title>
+ <desc>Created with Sketch.</desc>
+ <defs>
+ <circle id="path-1" cx="32.5" cy="32.5" r="32.5"></circle>
+ <filter x="-27.7%" y="-15.4%" width="143.1%" height="143.1%" filterUnits="objectBoundingBox" id="filter-3">
+ <feOffset dx="-4" dy="4" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
+ <feGaussianBlur stdDeviation="4" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
+ <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.0514039855 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
+ </filter>
+ <circle id="path-4" cx="32.5" cy="32.5" r="32.5"></circle>
+ <filter x="-27.7%" y="-15.4%" width="143.1%" height="143.1%" filterUnits="objectBoundingBox" id="filter-6">
+ <feOffset dx="-4" dy="4" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
+ <feGaussianBlur stdDeviation="4" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
+ <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.0514039855 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
+ </filter>
+ <circle id="path-7" cx="32.5" cy="32.5" r="32.5"></circle>
+ <filter x="-27.7%" y="-15.4%" width="143.1%" height="143.1%" filterUnits="objectBoundingBox" id="filter-9">
+ <feOffset dx="-4" dy="4" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
+ <feGaussianBlur stdDeviation="4" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
+ <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.0514039855 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
+ </filter>
+ <circle id="path-10" cx="32.5" cy="32.5" r="32.5"></circle>
+ <filter x="-20.8%" y="-11.5%" width="132.3%" height="132.3%" filterUnits="objectBoundingBox" id="filter-12">
+ <feOffset dx="-3" dy="3" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
+ <feGaussianBlur stdDeviation="3" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
+ <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.0514039855 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
+ </filter>
+ <circle id="path-13" cx="32.5" cy="32.5" r="32.5"></circle>
+ <filter x="-20.8%" y="-11.5%" width="132.3%" height="132.3%" filterUnits="objectBoundingBox" id="filter-15">
+ <feOffset dx="-3" dy="3" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
+ <feGaussianBlur stdDeviation="3" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
+ <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.0514039855 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
+ </filter>
+ <circle id="path-16" cx="32.5" cy="32.5" r="32.5"></circle>
+ <filter x="-20.8%" y="-11.5%" width="132.3%" height="132.3%" filterUnits="objectBoundingBox" id="filter-18">
+ <feOffset dx="-3" dy="3" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
+ <feGaussianBlur stdDeviation="3" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
+ <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.0514039855 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
+ </filter>
+ <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-19">
+ <stop stop-color="#B6B6B6" stop-opacity="0.748867754" offset="0%"></stop>
+ <stop stop-color="#C5C5C5" stop-opacity="0.418138587" offset="100%"></stop>
+ <stop stop-color="#3BA1FF" stop-opacity="0" offset="100%"></stop>
+ </linearGradient>
+ <circle id="path-20" cx="32.5" cy="32.5" r="32.5"></circle>
+ <filter x="-27.7%" y="-15.4%" width="143.1%" height="143.1%" filterUnits="objectBoundingBox" id="filter-22">
+ <feOffset dx="-4" dy="4" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
+ <feGaussianBlur stdDeviation="4" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
+ <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.0514039855 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
+ </filter>
+ <circle id="path-23" cx="32.5" cy="32.5" r="32.5"></circle>
+ <filter x="-27.7%" y="-15.4%" width="143.1%" height="143.1%" filterUnits="objectBoundingBox" id="filter-25">
+ <feOffset dx="-4" dy="4" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
+ <feGaussianBlur stdDeviation="4" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
+ <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.0514039855 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
+ </filter>
+ <circle id="path-26" cx="32.5" cy="32.5" r="32.5"></circle>
+ <filter x="-27.7%" y="-15.4%" width="143.1%" height="143.1%" filterUnits="objectBoundingBox" id="filter-28">
+ <feOffset dx="-4" dy="4" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
+ <feGaussianBlur stdDeviation="4" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
+ <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.0514039855 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
+ </filter>
+ </defs>
+ <g id="PinotOverview" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+ <path d="M126.5,159 C147.833333,126 173.166667,99 202.5,78 C231.833333,57 280.5,42.3333333 348.5,34" id="Path-2" stroke="#8C8C8C" stroke-dasharray="3"></path>
+ <path d="M190.5,201 C201.085766,147.393422 215.252433,111.060088 233,92 C250.747567,72.9399116 288.414234,53.6065783 346,34" id="Path-3" stroke="#8C8C8C" stroke-dasharray="3"></path>
+ <path d="M190,273 C207.666667,174 227,113.666667 248,92 C269,70.3333333 302.166667,51 347.5,34" id="Path-4" stroke="#8C8C8C" stroke-dasharray="3"></path>
+ <path d="M125.5,314.32474 C157.117284,202.44158 184.938272,131.666667 208.962963,102 C232.987654,72.3333333 278.833333,49.6666667 346.5,34" id="Path-5" stroke="#8C8C8C" stroke-dasharray="3"></path>
+ <path d="M61,277.491217 C130.333333,170.830406 181.333333,105.833333 214,82.5 C246.666667,59.1666667 290.833333,43 346.5,34" id="Path-6" stroke="#8C8C8C" stroke-dasharray="3"></path>
+ <path d="M64,201 C117.720046,136.21307 163.053379,92.8797363 200,71 C236.946621,49.1202637 285.613287,36.7869303 346,34" id="Path-7" stroke="#8C8C8C" stroke-dasharray="3"></path>
+ <path id="Line" d="M559.429355,317.819082 L559.865143,318.064212 L567.865143,322.564212 L568.639877,323 L567.865143,323.435788 L559.865143,327.935788 L559.429355,328.180918 L558.939094,327.309343 L559.374882,327.064212 L565.711,323.5 L562.5,323.5 L562.5,322.5 L565.711,322.5 L559.374882,318.935788 L558.939094,318.690657 L559.429355,317.819082 Z M530.5,322.5 L530.5,323.5 L526.5,323.5 L526.5,322.5 L530.5,322.5 Z M536.5,322.5 L536.5,323.5 L532.5,323.5 L532.5,322.5 L536.5,322.5 Z M542 [...]
+ <path id="Line-Copy" d="M538.223799,266.863649 L538.723413,266.883283 C539.440317,266.911456 540.177314,266.925816 540.934397,266.926352 L541.698173,266.92228 L542.198141,266.916648 L542.209407,267.916584 L541.709439,267.922217 C540.926547,267.931037 540.163585,267.925802 539.420545,267.906501 L538.684145,267.882512 L538.18453,267.862878 L538.223799,266.863649 Z M548.17255,266.569995 L548.259736,267.566187 L547.76164,267.60978 C546.988568,267.677439 546.230936,267.734257 545.4887 [...]
+ <path id="Line-Copy-2" d="M403.309343,63.8190816 L404.180918,64.3093429 L403.935788,64.7451306 L399.435788,72.7451306 L399,73.5198644 L398.564212,72.7451306 L394.064212,64.7451306 L393.819082,64.3093429 L394.690657,63.8190816 L394.935788,64.2548694 L398.5,70.591 L398.5,67.5 L399.5,67.5 L399.5,70.591 L403.064212,64.2548694 L403.309343,63.8190816 Z M399.5,61.5 L399.5,65.5 L398.5,65.5 L398.5,61.5 L399.5,61.5 Z M399.5,55.5 L399.5,59.5 L398.5,59.5 L398.5,55.5 L399.5,55.5 Z M399.5,49.5 [...]
+ <g id="Bitmap-Copy-3" transform="translate(156.000000, 165.000000)">
+ <mask id="mask-2" fill="white">
+ <use xlink:href="#path-1"></use>
+ </mask>
+ <g id="Mask">
+ <use fill="black" fill-opacity="1" filter="url(#filter-3)" xlink:href="#path-1"></use>
+ <use fill="#FFFFFF" fill-rule="evenodd" xlink:href="#path-1"></use>
+ </g>
+ <image mask="url(#mask-2)" x="12.037037" y="12.037037" width="40.9259259" height="40.9259259" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAIAAAACACAYAAADDPmHLAAAABGdBTUEAALGOfPtRkwAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAAAgKADAAQAAAABAAAAgAAAAABIjgR3AAAjyUlEQVR4Ae2dCdxew/XHJ4sSEQkRJJZEmkgpiiaqIYuU2BtKmtq1llJ7UVpKSmJpqTWCqLW22neJIIkiBKkttorYlVj+VFBJ5v/7zr3nee6zL+/zvt7EPZ/PeWbu3Llz78ycOXOWmXmcSyFtgbQF0hZIWyBtgbQF0hZIWyBtgbQF0hZI [...]
+ </g>
+ <g id="Bitmap-Copy-9" transform="translate(28.000000, 165.000000)">
+ <mask id="mask-5" fill="white">
+ <use xlink:href="#path-4"></use>
+ </mask>
+ <g id="Mask">
+ <use fill="black" fill-opacity="1" filter="url(#filter-6)" xlink:href="#path-4"></use>
+ <use fill="#FFFFFF" fill-rule="evenodd" xlink:href="#path-4"></use>
+ </g>
+ <image mask="url(#mask-5)" x="20.8641975" y="15.2469136" width="24.0740741" height="35.308642" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAANAAAAFACAYAAADNtfKDAAAABGdBTUEAALGOfPtRkwAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAAA0KADAAQAAAABAAABQAAAAAAg0MOAAAAwtUlEQVR4Ae2dibMW1Zn/+7IKyCab7MgmKIOjFEW0qFRJReuXkXIypuZnUIwGMRr+ICMRECYQ46RiDGUmKUhhaVlSFAVRyxE0ArIvlx3UAGLP+bzaN337dr+9nef06X7PU3Xv+3a/3Wf5nvOc5TnP0uXVmP7/f/6nP2zYMG/gwIFe//7 [...]
+ </g>
+ <g id="Bitmap-Copy-6" transform="translate(156.000000, 242.000000)">
+ <mask id="mask-8" fill="white">
+ <use xlink:href="#path-7"></use>
+ </mask>
+ <g id="Mask">
+ <use fill="black" fill-opacity="1" filter="url(#filter-9)" xlink:href="#path-7"></use>
+ <use fill="#FFFFFF" fill-rule="evenodd" xlink:href="#path-7"></use>
+ </g>
+ <image mask="url(#mask-8)" x="17.654321" y="15.2469136" width="32.0987654" height="36.1111111" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAXMAAAGnCAYAAABFFberAAAABGdBTUEAALGOfPtRkwAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAABc6ADAAQAAAABAAABpwAAAACSw8w4AABAAElEQVR4Aey9eaxdyX3nV2e7+9sfH3eyyWav2iy3FkseWZLHMuIkSjwetJBBjEHiIJrAgQbxAJ7BIEDU+iOYCSbIYiP22EkAJV4m0z2SJVsjWWu3pJZa3WqqFzbZbO7b29e737Pn+61zz32X5CPFZnN599xfkWers1V9691P/c6v6tQ [...]
+ </g>
+ <g id="Group-5" transform="translate(271.000000, 268.000000)" fill-rule="nonzero">
+ <path d="M129,10 L255.62325,35.2097696 L255.03,71.252 L255.01,73.087 L255.429662,73.1708738 L135.426,96.82 L127.445602,98.4004556 L0.264237582,73.2280941 L0.264,73.222 L1.42108547e-14,73.1708738 L0.263,73.118 L0.259,72.565 L1.42108547e-13,72.6169894 L1.42108547e-13,34.8866389 L126.35859,10 L126.36,10.215 L127.445602,10 L129.002,10.31 L129,10 Z" id="Combined-Shape" fill="#F44AF5"></path>
+ <polygon id="Fill-75-Copy" fill="#000000" opacity="0.255138579" points="0 35 0 73.3001307 127.440092 98.6169894 127.440092 60.6437577"></polygon>
+ <polygon id="Fill-76-Copy" fill="#000000" opacity="0.499418713" points="128 60.4465748 255.62325 35 255.003418 73.1703643 128 98.6169894"></polygon>
+ <polygon id="Fill-74-Copy-Copy" fill-opacity="0.33241368" fill="#FFFFFF" points="0 25.1708738 127.716305 50.3391483 255.429662 25.1708738 127.716305 -1.13686838e-13"></polygon>
+ </g>
+ <g id="Group-5-Copy" transform="translate(271.000000, 210.000000)" fill-rule="nonzero">
+ <path d="M129,10 L255.62325,35.2097696 L255.03,71.252 L255.01,73.087 L255.429662,73.1708738 L135.426,96.82 L127.445602,98.4004556 L0.264237582,73.2280941 L0.264,73.222 L1.42108547e-14,73.1708738 L0.263,73.118 L0.259,72.565 L1.42108547e-13,72.6169894 L1.42108547e-13,34.8866389 L126.35859,10 L126.36,10.215 L127.445602,10 L129.002,10.31 L129,10 Z" id="Combined-Shape" fill="#4285F4"></path>
+ <polygon id="Fill-75-Copy" fill="#000000" opacity="0.255138579" points="0 35 0 73.3001307 127.440092 98.6169894 127.440092 60.6437577"></polygon>
+ <polygon id="Fill-76-Copy" fill="#000000" opacity="0.499418713" points="128 60.4465748 255.62325 35 255.003418 73.1703643 128 98.6169894"></polygon>
+ <polygon id="Fill-74-Copy-Copy" fill-opacity="0.33241368" fill="#FFFFFF" points="0 25.1708738 127.716305 50.3391483 255.429662 25.1708738 127.716305 -1.13686838e-13"></polygon>
+ </g>
+ <g id="Group-5-Copy-2" transform="translate(271.000000, 80.000000)" fill-rule="nonzero">
+ <path d="M129,80 L255.62325,105.20977 L255.03,141.252 L255.01,143.087 L255.429662,143.170874 L135.426,166.82 L127.445602,168.400456 L0.264237582,143.228094 L0.264,143.222 L1.42108547e-14,143.170874 L0.263,143.118 L0.259,142.565 L1.42108547e-13,142.616989 L1.42108547e-13,104.886639 L126.35859,80 L126.36,80.215 L127.445602,80 L129.002,80.31 L129,80 Z" id="Combined-Shape" fill="#54BAC9"></path>
+ <polygon id="Fill-75-Copy" fill="#000000" opacity="0.255138579" points="0 105 0 143.300131 127.440092 168.616989 127.440092 130.643758"></polygon>
+ <polygon id="Fill-76-Copy" fill="#000000" opacity="0.499418713" points="128 130.446575 255.62325 105 255.003418 143.170364 128 168.616989"></polygon>
+ <polygon id="Fill-74-Copy-Copy" fill-opacity="0.33241368" fill="#FFFFFF" points="0 95.1708738 127.716305 120.339148 255.429662 95.1708738 127.716305 70"></polygon>
+ <polygon id="Fill-74-Copy-Copy" fill-opacity="0.33241368" fill="#FFFFFF" points="0 25.1708738 127.716305 50.3391483 255.429662 25.1708738 127.716305 -1.10134124e-13"></polygon>
+ <polygon id="Fill-74-Copy-Copy" fill-opacity="0.33241368" fill="#FFFFFF" points="0 85.1708738 127.716305 110.339148 255.429662 85.1708738 127.716305 60"></polygon>
+ <polygon id="Fill-74-Copy-Copy" fill-opacity="0.33241368" fill="#FFFFFF" points="0 75.1708738 127.716305 100.339148 255.429662 75.1708738 127.716305 50"></polygon>
+ <polygon id="Fill-74-Copy-Copy" fill-opacity="0.33241368" fill="#FFFFFF" points="0 65.1708738 127.716305 90.3391483 255.429662 65.1708738 127.716305 40"></polygon>
+ <polygon id="Fill-74-Copy-Copy" fill-opacity="0.33241368" fill="#FFFFFF" points="0 55.1708738 127.716305 80.3391483 255.429662 55.1708738 127.716305 30"></polygon>
+ <polygon id="Fill-74-Copy-Copy" fill-opacity="0.33241368" fill="#FFFFFF" points="0 45.1708738 127.716305 70.3391483 255.429662 45.1708738 127.716305 20"></polygon>
+ <polygon id="Fill-74-Copy-Copy" fill-opacity="0.33241368" fill="#FFFFFF" points="0 35.1708738 127.716305 60.3391483 255.429662 35.1708738 127.716305 10"></polygon>
+ </g>
+ <text id="Use-Cases-Copy" opacity="0.904203869" font-family="DINAlternate-Bold, DIN Alternate" font-size="20" font-weight="bold" fill="#838383">
+ <tspan x="621" y="81">USE-CASES</tspan>
+ </text>
+ <text id="Data-Products" font-family="DINAlternate-Bold, DIN Alternate" font-size="16" font-weight="bold" fill="#8D8D8D">
+ <tspan x="640.476562" y="232">Data </tspan>
+ <tspan x="611.453125" y="251">Products</tspan>
+ </text>
+ <text id="Business-Intelligenc" font-family="DINAlternate-Bold, DIN Alternate" font-size="16" font-weight="bold" fill="#8D8D8D">
+ <tspan x="658" y="155">Business </tspan>
+ <tspan x="658" y="174">Intelligence</tspan>
+ </text>
+ <text id="Anomaly-Detection" font-family="DINAlternate-Bold, DIN Alternate" font-size="16" font-weight="bold" fill="#8D8D8D">
+ <tspan x="658" y="310">Anomaly </tspan>
+ <tspan x="658" y="329">Detection</tspan>
+ </text>
+ <text id="Sources-Copy" opacity="0.904203869" font-family="DINAlternate-Bold, DIN Alternate" font-size="20" font-weight="bold" fill="#838383">
+ <tspan x="84.40625" y="81">SOURCES</tspan>
+ </text>
+ <text id="Events-Copy" opacity="0.904203869" font-family="DINAlternate-Bold, DIN Alternate" font-size="20" font-weight="bold" fill="#838383">
+ <tspan x="365.237305" y="41">EVENTS</tspan>
+ </text>
+ <g id="Group" transform="translate(577.000000, 126.000000)">
+ <mask id="mask-11" fill="white">
+ <use xlink:href="#path-10"></use>
+ </mask>
+ <g id="Mask">
+ <use fill="black" fill-opacity="1" filter="url(#filter-12)" xlink:href="#path-10"></use>
+ <use fill="#FFFFFF" fill-rule="evenodd" xlink:href="#path-10"></use>
+ </g>
+ <image id="Bitmap-Copy-8" mask="url(#mask-11)" x="10.4320988" y="12.8395062" width="43.3333333" height="43.3333333" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAgAAAAIACAYAAAD0eNT6AAAABGdBTUEAALGOfPtRkwAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAACAKADAAQAAAABAAACAAAAAAAL+LWFAABAAElEQVR4Ae3dCZwcV33g8feqq6+RRrZk+ZSEDsuHNJZMogRDuGwnwQmLN7AGYT4QWHPk+AQILBsCLPvBbMyVwIfLiYLAQMAEe2SHgAOEJUF24kW2bGEsWfIpS7Juy5YszdVnvf3XSD2M5Onp6u46u371+b [...]
+ </g>
+ <g id="Group-2" transform="translate(687.000000, 203.000000)">
+ <mask id="mask-14" fill="white">
+ <use xlink:href="#path-13"></use>
+ </mask>
+ <g id="Mask">
+ <use fill="black" fill-opacity="1" filter="url(#filter-15)" xlink:href="#path-13"></use>
+ <use fill="#FFFFFF" fill-rule="evenodd" xlink:href="#path-13"></use>
+ </g>
+ <image id="Bitmap-Copy-7" mask="url(#mask-14)" x="12.037037" y="13.6419753" width="36.1111111" height="39.3209877" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAA6oAAAQACAYAAADoXKQYAAAMTWlDQ1BJQ0MgUHJvZmlsZQAASImVVwdck0cbv3dkkrACYcgIe4kiM4CMEFYEAZmCqIQkkDBiTAgqbqRUwbpFFNSKVkUsWgcgdaLWWRS3dRQHKkotDlyofJcB2vYbv+/5/e69//vcc/9n5O7NHQB6tXyZrADVB6BQWiRPjApjjU/PYJEeAgyQgC4wAd58gULGSUiIBVAG+7/Km2sAUfWX3VVc/xz/r2IgFCkEACAJEGcLFYJCiPcBgJcKZPIiAIhsqLebViRT4UyIjeQwQIhlKpyrwWU [...]
+ </g>
+ <g id="Group-4" transform="translate(577.000000, 281.000000)">
+ <g id="Group-3">
+ <mask id="mask-17" fill="white">
+ <use xlink:href="#path-16"></use>
+ </mask>
+ <g id="Mask">
+ <use fill="black" fill-opacity="1" filter="url(#filter-18)" xlink:href="#path-16"></use>
+ <use fill="#FFFFFF" fill-rule="evenodd" xlink:href="#path-16"></use>
+ </g>
+ <path d="M-1.60493827,44.7713826 C-1.73902763,41.8732326 0.166750448,40.4241576 4.11239595,40.4241576 C10.0308642,40.4241576 11.3014114,44.5096125 15.8409367,44.2005655 C20.3804619,43.8915185 27.1728395,36.1111111 31.3284358,30.5179012 C35.4840321,24.9246914 43.2872002,47.3338772 47.8906848,46.8624974 C53.7654321,46.5432099 55.3747849,39.2410692 57.8291263,38.7588798 C60.2834678,38.2766903 59.4573907,43.9248375 61.0236254,44.2823489 C62.5898601,44.6398602 65.0481481,40.40 [...]
+ </g>
+ <g id="anomaly-detection-copy" transform="translate(26.481481, 19.259259)" stroke="#5EA7EA" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.44">
+ <ellipse id="Oval" cx="6.49876543" cy="6.70477824" rx="4.20246914" ry="4.29974851"></ellipse>
+ <line x1="6.49876543" y1="0.252629172" x2="6.49876543" y2="3.7540695" id="Path"></line>
+ <line x1="6.49876543" y1="9.43822588" x2="6.49876543" y2="13.3085048" id="Path"></line>
+ <line x1="0.404938272" y1="6.70477824" x2="3.82716049" y2="6.70477824" id="Path"></line>
+ <line x1="9.17037037" y1="6.70477824" x2="12.5925926" y2="6.70477824" id="Path"></line>
+ </g>
+ </g>
+ <g id="Group-5" transform="translate(271.000000, 195.000000)" font-family="DINAlternate-Bold, DIN Alternate" font-weight="bold">
+ <text id="Smart-Index-Copy" transform="translate(191.927620, 25.177529) rotate(-11.000000) translate(-191.927620, -25.177529) " font-size="18" fill="#FAF5F5">
+ <tspan x="145.789437" y="28.6775292">Smart Index</tspan>
+ </text>
+ <text id="Blazing-Fast-Copy" transform="translate(64.873543, 26.472952) rotate(11.000000) translate(-64.873543, -26.472952) " font-size="18" fill="#F8F5F5">
+ <tspan x="17.307137" y="27.9729521">Blazing-Fast</tspan>
+ </text>
+ <text id="Performant-Copy" transform="translate(63.546002, 81.214275) rotate(11.000000) translate(-63.546002, -81.214275) " font-size="19" fill="#FCF7F7">
+ <tspan x="17.9664126" y="87.7142748">Performant</tspan>
+ </text>
+ <text id="Aggregation-Copy" transform="translate(191.155175, 83.777538) rotate(-11.000000) translate(-191.155175, -83.777538) " font-size="19" fill="#FAF5F5">
+ <tspan x="142.773827" y="87.2775384">Aggregation</tspan>
+ </text>
+ <text id="Pre-Materialization-Copy" transform="translate(192.240329, 146.071874) rotate(-11.000000) translate(-192.240329, -146.071874) " font-size="15" fill="#F6F3F3">
+ <tspan x="132.005954" y="142.071874">Pre-Materialization</tspan>
+ </text>
+ <text id="Segment-Optimizer-Copy" transform="translate(64.546002, 140.214275) rotate(11.000000) translate(-64.546002, -140.214275) " font-size="15" fill="#F8F5F5">
+ <tspan x="4.01499655" y="142.714275">Segment Optimizer</tspan>
+ </text>
+ </g>
+ <g id="Bitmap-Copy-2" transform="translate(93.000000, 125.000000)">
+ <mask id="mask-21" fill="white">
+ <use xlink:href="#path-20"></use>
+ </mask>
+ <g id="Mask">
+ <use fill="black" fill-opacity="1" filter="url(#filter-22)" xlink:href="#path-20"></use>
+ <use fill="#FFFFFF" fill-rule="evenodd" xlink:href="#path-20"></use>
+ </g>
+ <image mask="url(#mask-21)" x="10.4320988" y="20.8641975" width="44.1358025" height="23.2716049" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAABLAAAAJxCAYAAABSRUvkAAAABGdBTUEAALGOfPtRkwAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAAEsKADAAQAAAABAAACcQAAAABCSKAQAABAAElEQVR4AezdCXxU1d34/3PuzCSggEoFJJlJwIpLcWmLLbKKShfaWqttlCRgbZ+Wp4vd/m1/Pl2ltYvP0721m1ofqyRoY+va0vqgImu12kVLVUBJZiYBQasISsjM3PP/3gASQkLmznrvnc99vSAzd87yPe87meR+c+65WrEhgAACC [...]
+ </g>
+ <g id="Bitmap-Copy-4" transform="translate(93.000000, 282.000000)">
+ <mask id="mask-24" fill="white">
+ <use xlink:href="#path-23"></use>
+ </mask>
+ <g id="Mask">
+ <use fill="black" fill-opacity="1" filter="url(#filter-25)" xlink:href="#path-23"></use>
+ <use fill="#FFFFFF" fill-rule="evenodd" xlink:href="#path-23"></use>
+ </g>
+ <image mask="url(#mask-24)" x="13.6419753" y="14.4444444" width="36.1111111" height="36.1111111" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAABLAAAASwCAYAAADrIbPPAAAABGdBTUEAALGOfPtRkwAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAAEsKADAAQAAAABAAAEsAAAAABAZIJmAABAAElEQVR4AezdC5RcZ30g+HtvPbpbsg02xOadAEZ+QYJxJsGYgKxuyRBCQhKU93MyCcmQOAmxsSSbUMFSt2SDLOfMzAm75+zO7p6ze9aZnNlZMsfYlmwFm8xsApM4mIeNTRJIIBBsGWxLXd1V99tPAjl6tKR+VHXdx6/P8emqe7/7/ [...]
+ </g>
+ <g id="Bitmap-Copy-5" transform="translate(28.000000, 242.000000)">
+ <mask id="mask-27" fill="white">
+ <use xlink:href="#path-26"></use>
+ </mask>
+ <g id="Mask">
+ <use fill="black" fill-opacity="1" filter="url(#filter-28)" xlink:href="#path-26"></use>
+ <use fill="#FFFFFF" fill-rule="evenodd" xlink:href="#path-26"></use>
+ </g>
+ <image mask="url(#mask-27)" x="11.2345679" y="16.0493827" width="41.7283951" height="32.9012346" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAZAAAAFACAYAAACSgSrjAAAABGdBTUEAALGOfPtRkwAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAABkKADAAQAAAABAAABQAAAAACSxBCVAAAuOklEQVR4Ae2deXQc13Xmb69AYwdJANx3UtxEUUvMRXtERZRtydbYkm0to0RrJEeW7UwmsWfsRH94JjlnxtJxdCzJmcSmfeKMZ+RYdjS2NI4jaSRxMbVRJimSIglSJEBsxNpA791zbxMNogE00N1Vr7rq9VfnFLqr6r137/vd6v7wl [...]
+ </g>
+ <image id="Bitmap-Copy" x="370" y="82" width="51" height="83" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAewAAAMYCAYAAAAJttRGAAAABGdBTUEAALGOfPtRkwAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAAB7KADAAQAAAABAAADGAAAAAAmw5O2AABAAElEQVR4Aey9CZgcV3nuXz3aRvto3zdrtSRL8iIZ4xUbYzAJtlkdMNsFshBCbsgN/8sSCCEk/EPuJZAAIQm5cBPAQBwciFkMNhiEF9mSbO37Lsu2bLzJtiRL7vv+jqfk1ng0M93T1VXV9Z7nqeme7uqzvOfUec+3nO+UIicjYASMQA4RKJfLJaXyAw888N+ffvrpIYcPH37vM888M2HP [...]
+ <path id="Path-9" d="M529.381393,207.273589 L529.461256,208.270395 C528.80988,208.322583 528.148984,208.3738 527.478568,208.424048 L526.465804,208.498692 L526.393519,207.501308 C527.410923,207.427573 528.406881,207.351666 529.381393,207.273589 Z M535.346937,206.742134 L535.445445,207.737271 C534.797955,207.801365 534.139015,207.86429 533.468625,207.926048 L532.454451,208.017807 L532.365939,207.021732 C533.385409,206.931141 534.379076,206.837942 535.346937,206.742134 Z M541.298584 [...]
+ <line x1="351.5" y1="34" x2="343.5" y2="29.5" id="Path-10" stroke="#979797"></line>
+ <line x1="351.5" y1="40.5" x2="344.5" y2="34" id="Path-10" stroke="#979797" transform="translate(348.000000, 37.500000) scale(-1, 1) translate(-348.000000, -37.500000) "></line>
+ </g>
+</svg>
\ No newline at end of file
diff --git a/website-builder/static/img/pinot-query.svg b/website-builder/static/img/pinot-query.svg
new file mode 100644
index 0000000..bea9be7
--- /dev/null
+++ b/website-builder/static/img/pinot-query.svg
@@ -0,0 +1,277 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="800px" height="400px" viewBox="0 0 800 400" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+ <!-- Generator: Sketch 61 (89581) - https://sketch.com -->
+ <title>ImgLight</title>
+ <desc>Created with Sketch.</desc>
+ <defs>
+ <circle id="path-1" cx="32.5" cy="32.5" r="32.5"></circle>
+ <filter x="-27.7%" y="-15.4%" width="143.1%" height="143.1%" filterUnits="objectBoundingBox" id="filter-3">
+ <feOffset dx="-4" dy="4" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
+ <feGaussianBlur stdDeviation="4" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
+ <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.0514039855 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
+ </filter>
+ <circle id="path-4" cx="32.5" cy="32.5" r="32.5"></circle>
+ <filter x="-27.7%" y="-15.4%" width="143.1%" height="143.1%" filterUnits="objectBoundingBox" id="filter-6">
+ <feOffset dx="-4" dy="4" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
+ <feGaussianBlur stdDeviation="4" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
+ <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.0514039855 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
+ </filter>
+ <circle id="path-7" cx="32.5" cy="32.5" r="32.5"></circle>
+ <filter x="-27.7%" y="-15.4%" width="143.1%" height="143.1%" filterUnits="objectBoundingBox" id="filter-9">
+ <feOffset dx="-4" dy="4" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
+ <feGaussianBlur stdDeviation="4" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
+ <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.0514039855 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
+ </filter>
+ <circle id="path-10" cx="32.5" cy="32.5" r="32.5"></circle>
+ <filter x="-20.8%" y="-11.5%" width="132.3%" height="132.3%" filterUnits="objectBoundingBox" id="filter-12">
+ <feOffset dx="-3" dy="3" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
+ <feGaussianBlur stdDeviation="3" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
+ <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.0514039855 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
+ </filter>
+ <circle id="path-13" cx="32.5" cy="32.5" r="32.5"></circle>
+ <filter x="-20.8%" y="-11.5%" width="132.3%" height="132.3%" filterUnits="objectBoundingBox" id="filter-15">
+ <feOffset dx="-3" dy="3" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
+ <feGaussianBlur stdDeviation="3" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
+ <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.0514039855 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
+ </filter>
+ <circle id="path-16" cx="32.5" cy="32.5" r="32.5"></circle>
+ <filter x="-20.8%" y="-11.5%" width="132.3%" height="132.3%" filterUnits="objectBoundingBox" id="filter-18">
+ <feOffset dx="-3" dy="3" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
+ <feGaussianBlur stdDeviation="3" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
+ <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.0514039855 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
+ </filter>
+ <circle id="path-19" cx="32.5" cy="32.5" r="32.5"></circle>
+ <filter x="-27.7%" y="-15.4%" width="143.1%" height="143.1%" filterUnits="objectBoundingBox" id="filter-21">
+ <feOffset dx="-4" dy="4" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
+ <feGaussianBlur stdDeviation="4" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
+ <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.0514039855 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
+ </filter>
+ <circle id="path-22" cx="32.5" cy="32.5" r="32.5"></circle>
+ <filter x="-27.7%" y="-15.4%" width="143.1%" height="143.1%" filterUnits="objectBoundingBox" id="filter-24">
+ <feOffset dx="-4" dy="4" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
+ <feGaussianBlur stdDeviation="4" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
+ <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.0514039855 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
+ </filter>
+ <circle id="path-25" cx="32.5" cy="32.5" r="32.5"></circle>
+ <filter x="-27.7%" y="-15.4%" width="143.1%" height="143.1%" filterUnits="objectBoundingBox" id="filter-27">
+ <feOffset dx="-4" dy="4" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
+ <feGaussianBlur stdDeviation="4" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
+ <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.0514039855 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
+ </filter>
+ </defs>
+ <g id="ImgLight" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+ <path d="M126.5,159 C147.833333,126 173.166667,99 202.5,78 C231.833333,57 280.5,42.3333333 348.5,34" id="Path-2" stroke="#8C8C8C" stroke-dasharray="3"></path>
+ <path d="M190.5,201 C201.085766,147.393422 215.252433,111.060088 233,92 C250.747567,72.9399116 288.414234,53.6065783 346,34" id="Path-3" stroke="#8C8C8C" stroke-dasharray="3"></path>
+ <path d="M190,273 C207.666667,174 227,113.666667 248,92 C269,70.3333333 302.166667,51 347.5,34" id="Path-4" stroke="#8C8C8C" stroke-dasharray="3"></path>
+ <path d="M125.5,314.32474 C157.117284,202.44158 184.938272,131.666667 208.962963,102 C232.987654,72.3333333 278.833333,49.6666667 346.5,34" id="Path-5" stroke="#8C8C8C" stroke-dasharray="3"></path>
+ <path d="M61,277.491217 C130.333333,170.830406 181.333333,105.833333 214,82.5 C246.666667,59.1666667 290.833333,43 346.5,34" id="Path-6" stroke="#8C8C8C" stroke-dasharray="3"></path>
+ <path d="M64,201 C117.720046,136.21307 163.053379,92.8797363 200,71 C236.946621,49.1202637 285.613287,36.7869303 346,34" id="Path-7" stroke="#8C8C8C" stroke-dasharray="3"></path>
+ <path id="Line" d="M559.429355,317.819082 L559.865143,318.064212 L567.865143,322.564212 L568.639877,323 L567.865143,323.435788 L559.865143,327.935788 L559.429355,328.180918 L558.939094,327.309343 L559.374882,327.064212 L565.711,323.5 L562.5,323.5 L562.5,322.5 L565.711,322.5 L559.374882,318.935788 L558.939094,318.690657 L559.429355,317.819082 Z M530.5,322.5 L530.5,323.5 L526.5,323.5 L526.5,322.5 L530.5,322.5 Z M536.5,322.5 L536.5,323.5 L532.5,323.5 L532.5,322.5 L536.5,322.5 Z M542 [...]
+ <path id="Line-Copy" d="M548.296034,266.877368 L548.320431,267.87707 L547.820579,267.889268 C547.134398,267.906013 546.459529,267.917091 545.795968,267.922499 L544.809108,267.926359 L544.309108,267.926159 L544.309508,266.926159 L544.809508,266.926359 C545.456177,266.926618 546.114205,266.921254 546.78359,266.910266 L547.796183,266.889566 L548.296034,266.877368 Z M538.335453,266.711509 L538.834412,266.743756 C539.555249,266.790342 540.294147,266.828018 541.051099,266.856781 L541.8 [...]
+ <path id="Line-Copy-2" d="M403.309343,63.8190816 L404.180918,64.3093429 L403.935788,64.7451306 L399.435788,72.7451306 L399,73.5198644 L398.564212,72.7451306 L394.064212,64.7451306 L393.819082,64.3093429 L394.690657,63.8190816 L394.935788,64.2548694 L398.5,70.591 L398.5,67.5 L399.5,67.5 L399.5,70.591 L403.064212,64.2548694 L403.309343,63.8190816 Z M399.5,61.5 L399.5,65.5 L398.5,65.5 L398.5,61.5 L399.5,61.5 Z M399.5,55.5 L399.5,59.5 L398.5,59.5 L398.5,55.5 L399.5,55.5 Z M399.5,49.5 [...]
+ <g id="Bitmap-Copy-3" transform="translate(156.000000, 165.000000)">
+ <mask id="mask-2" fill="white">
+ <use xlink:href="#path-1"></use>
+ </mask>
+ <g id="Mask">
+ <use fill="black" fill-opacity="1" filter="url(#filter-3)" xlink:href="#path-1"></use>
+ <use fill="#FFFFFF" fill-rule="evenodd" xlink:href="#path-1"></use>
+ </g>
+ <image mask="url(#mask-2)" x="12.037037" y="12.037037" width="40.9259259" height="40.9259259" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAIAAAACACAYAAADDPmHLAAAABGdBTUEAALGOfPtRkwAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAAAgKADAAQAAAABAAAAgAAAAABIjgR3AAAjyUlEQVR4Ae2dCdxew/XHJ4sSEQkRJJZEmkgpiiaqIYuU2BtKmtq1llJ7UVpKSmJpqTWCqLW22neJIIkiBKkttorYlVj+VFBJ5v/7zr3nee6zL+/zvt7EPZ/PeWbu3Llz78ycOXOWmXmcSyFtgbQF0hZIWyBtgbQF0hZIWyBtgbQF0hZI [...]
+ </g>
+ <g id="Bitmap-Copy-9" transform="translate(28.000000, 165.000000)">
+ <mask id="mask-5" fill="white">
+ <use xlink:href="#path-4"></use>
+ </mask>
+ <g id="Mask">
+ <use fill="black" fill-opacity="1" filter="url(#filter-6)" xlink:href="#path-4"></use>
+ <use fill="#FFFFFF" fill-rule="evenodd" xlink:href="#path-4"></use>
+ </g>
+ <image mask="url(#mask-5)" x="20.8641975" y="15.2469136" width="24.0740741" height="35.308642" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAANAAAAFACAYAAADNtfKDAAAABGdBTUEAALGOfPtRkwAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAAA0KADAAQAAAABAAABQAAAAAAg0MOAAAAwtUlEQVR4Ae2dibMW1Zn/+7IKyCab7MgmKIOjFEW0qFRJReuXkXIypuZnUIwGMRr+ICMRECYQ46RiDGUmKUhhaVlSFAVRyxE0ArIvlx3UAGLP+bzaN337dr+9nef06X7PU3Xv+3a/3Wf5nvOc5TnP0uXVmP7/f/6nP2zYMG/gwIFe//7 [...]
+ </g>
+ <g id="Bitmap-Copy-6" transform="translate(156.000000, 242.000000)">
+ <mask id="mask-8" fill="white">
+ <use xlink:href="#path-7"></use>
+ </mask>
+ <g id="Mask">
+ <use fill="black" fill-opacity="1" filter="url(#filter-9)" xlink:href="#path-7"></use>
+ <use fill="#FFFFFF" fill-rule="evenodd" xlink:href="#path-7"></use>
+ </g>
+ <image mask="url(#mask-8)" x="17.654321" y="15.2469136" width="32.0987654" height="36.1111111" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAXMAAAGnCAYAAABFFberAAAABGdBTUEAALGOfPtRkwAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAABc6ADAAQAAAABAAABpwAAAACSw8w4AABAAElEQVR4Aey9eaxdyX3nV2e7+9sfH3eyyWav2iy3FkseWZLHMuIkSjwetJBBjEHiIJrAgQbxAJ7BIEDU+iOYCSbIYiP22EkAJV4m0z2SJVsjWWu3pJZa3WqqFzbZbO7b29e737Pn+61zz32X5CPFZnN599xfkWers1V9691P/c6v6tQ [...]
+ </g>
+ <g id="Group-5" transform="translate(271.000000, 268.000000)" fill-rule="nonzero">
+ <path d="M129,10 L255.62325,35.2097696 L255.03,71.252 L255.01,73.087 L255.429662,73.1708738 L135.426,96.82 L127.445602,98.4004556 L0.264237582,73.2280941 L0.264,73.222 L1.42108547e-14,73.1708738 L0.263,73.118 L0.259,72.565 L1.42108547e-13,72.6169894 L1.42108547e-13,34.8866389 L126.35859,10 L126.36,10.215 L127.445602,10 L129.002,10.31 L129,10 Z" id="Combined-Shape" fill="#F44AF5"></path>
+ <polygon id="Fill-75-Copy" fill="#000000" opacity="0.255138579" points="0 35 0 73.3001307 127.440092 98.6169894 127.440092 60.6437577"></polygon>
+ <polygon id="Fill-76-Copy" fill="#000000" opacity="0.499418713" points="128 60.4465748 255.62325 35 255.003418 73.1703643 128 98.6169894"></polygon>
+ <polygon id="Fill-74-Copy-Copy" fill-opacity="0.33241368" fill="#FFFFFF" points="0 25.1708738 127.716305 50.3391483 255.429662 25.1708738 127.716305 -1.13686838e-13"></polygon>
+ </g>
+ <g id="Group-5-Copy" transform="translate(271.000000, 210.000000)" fill-rule="nonzero">
+ <path d="M129,10 L255.62325,35.2097696 L255.03,71.252 L255.01,73.087 L255.429662,73.1708738 L135.426,96.82 L127.445602,98.4004556 L0.264237582,73.2280941 L0.264,73.222 L1.42108547e-14,73.1708738 L0.263,73.118 L0.259,72.565 L1.42108547e-13,72.6169894 L1.42108547e-13,34.8866389 L126.35859,10 L126.36,10.215 L127.445602,10 L129.002,10.31 L129,10 Z" id="Combined-Shape" fill="#4285F4"></path>
+ <polygon id="Fill-75-Copy" fill="#000000" opacity="0.255138579" points="0 35 0 73.3001307 127.440092 98.6169894 127.440092 60.6437577"></polygon>
+ <polygon id="Fill-76-Copy" fill="#000000" opacity="0.499418713" points="128 60.4465748 255.62325 35 255.003418 73.1703643 128 98.6169894"></polygon>
+ <polygon id="Fill-74-Copy-Copy" fill-opacity="0.33241368" fill="#FFFFFF" points="0 25.1708738 127.716305 50.3391483 255.429662 25.1708738 127.716305 -1.13686838e-13"></polygon>
+ </g>
+ <g id="Group-5-Copy-2" transform="translate(271.000000, 80.000000)" fill-rule="nonzero">
+ <path d="M129,80 L255.62325,105.20977 L255.03,141.252 L255.01,143.087 L255.429662,143.170874 L135.426,166.82 L127.445602,168.400456 L0.264237582,143.228094 L0.264,143.222 L1.42108547e-14,143.170874 L0.263,143.118 L0.259,142.565 L1.42108547e-13,142.616989 L1.42108547e-13,104.886639 L126.35859,80 L126.36,80.215 L127.445602,80 L129.002,80.31 L129,80 Z" id="Combined-Shape" fill="#54BAC9"></path>
+ <polygon id="Fill-75-Copy" fill="#000000" opacity="0.255138579" points="0 105 0 143.300131 127.440092 168.616989 127.440092 130.643758"></polygon>
+ <polygon id="Fill-76-Copy" fill="#000000" opacity="0.499418713" points="128 130.446575 255.62325 105 255.003418 143.170364 128 168.616989"></polygon>
+ <polygon id="Fill-74-Copy-Copy" fill-opacity="0.33241368" fill="#FFFFFF" points="0 95.1708738 127.716305 120.339148 255.429662 95.1708738 127.716305 70"></polygon>
+ <polygon id="Fill-74-Copy-Copy" fill-opacity="0.33241368" fill="#FFFFFF" points="0 25.1708738 127.716305 50.3391483 255.429662 25.1708738 127.716305 -1.10134124e-13"></polygon>
+ <polygon id="Fill-74-Copy-Copy" fill-opacity="0.33241368" fill="#FFFFFF" points="0 85.1708738 127.716305 110.339148 255.429662 85.1708738 127.716305 60"></polygon>
+ <polygon id="Fill-74-Copy-Copy" fill-opacity="0.33241368" fill="#FFFFFF" points="0 75.1708738 127.716305 100.339148 255.429662 75.1708738 127.716305 50"></polygon>
+ <polygon id="Fill-74-Copy-Copy" fill-opacity="0.33241368" fill="#FFFFFF" points="0 65.1708738 127.716305 90.3391483 255.429662 65.1708738 127.716305 40"></polygon>
+ <polygon id="Fill-74-Copy-Copy" fill-opacity="0.33241368" fill="#FFFFFF" points="0 55.1708738 127.716305 80.3391483 255.429662 55.1708738 127.716305 30"></polygon>
+ <polygon id="Fill-74-Copy-Copy" fill-opacity="0.33241368" fill="#FFFFFF" points="0 45.1708738 127.716305 70.3391483 255.429662 45.1708738 127.716305 20"></polygon>
+ <polygon id="Fill-74-Copy-Copy" fill-opacity="0.33241368" fill="#FFFFFF" points="0 35.1708738 127.716305 60.3391483 255.429662 35.1708738 127.716305 10"></polygon>
+ </g>
+ <text id="Query" opacity="0.904203869" font-family="DINAlternate-Bold, DIN Alternate" font-size="20" font-weight="bold" fill="#838383">
+ <tspan x="621" y="81">QUERY</tspan>
+ </text>
+ <text id="SQL" font-family="DINAlternate-Bold, DIN Alternate" font-size="16" font-weight="bold" fill="#8D8D8D">
+ <tspan x="623.164062" y="256">SQL</tspan>
+ </text>
+ <text id="PQL" font-family="DINAlternate-Bold, DIN Alternate" font-size="16" font-weight="bold" fill="#8D8D8D">
+ <tspan x="658" y="165">PQL</tspan>
+ </text>
+ <text id="Joins-in-Presto" font-family="DINAlternate-Bold, DIN Alternate" font-size="16" font-weight="bold" fill="#8D8D8D">
+ <tspan x="658" y="314">Joins in</tspan>
+ <tspan x="658" y="333"> Presto</tspan>
+ </text>
+ <text id="Sources-Copy" opacity="0.904203869" font-family="DINAlternate-Bold, DIN Alternate" font-size="20" font-weight="bold" fill="#838383">
+ <tspan x="84.40625" y="81">SOURCES</tspan>
+ </text>
+ <text id="Events-Copy" opacity="0.904203869" font-family="DINAlternate-Bold, DIN Alternate" font-size="20" font-weight="bold" fill="#838383">
+ <tspan x="365.237305" y="41">EVENTS</tspan>
+ </text>
+ <g id="Group" transform="translate(577.000000, 126.000000)">
+ <mask id="mask-11" fill="white">
+ <use xlink:href="#path-10"></use>
+ </mask>
+ <g id="Mask">
+ <use fill="black" fill-opacity="1" filter="url(#filter-12)" xlink:href="#path-10"></use>
+ <use fill="#FFFFFF" fill-rule="evenodd" xlink:href="#path-10"></use>
+ </g>
+ </g>
+ <g id="Group-2" transform="translate(663.000000, 216.000000)">
+ <mask id="mask-14" fill="white">
+ <use xlink:href="#path-13"></use>
+ </mask>
+ <g id="Mask">
+ <use fill="black" fill-opacity="1" filter="url(#filter-15)" xlink:href="#path-13"></use>
+ <use fill="#FFFFFF" fill-rule="evenodd" xlink:href="#path-13"></use>
+ </g>
+ </g>
+ <g id="Group-4" transform="translate(577.000000, 281.000000)">
+ <g id="Group-3">
+ <mask id="mask-17" fill="white">
+ <use xlink:href="#path-16"></use>
+ </mask>
+ <g id="Mask">
+ <use fill="black" fill-opacity="1" filter="url(#filter-18)" xlink:href="#path-16"></use>
+ <use fill="#FFFFFF" fill-rule="evenodd" xlink:href="#path-16"></use>
+ </g>
+ </g>
+ </g>
+ <g id="Group-5" transform="translate(271.000000, 195.000000)" font-family="DINAlternate-Bold, DIN Alternate" font-weight="bold">
+ <text id="Smart-Index-Copy" transform="translate(191.927620, 25.177529) rotate(-11.000000) translate(-191.927620, -25.177529) " font-size="18" fill="#FAF5F5">
+ <tspan x="145.789437" y="28.6775292">Smart Index</tspan>
+ </text>
+ <text id="Blazing-Fast-Copy" transform="translate(64.873543, 26.472952) rotate(11.000000) translate(-64.873543, -26.472952) " font-size="18" fill="#F8F5F5">
+ <tspan x="17.307137" y="27.9729521">Blazing-Fast</tspan>
+ </text>
+ <text id="Performant-Copy" transform="translate(63.546002, 81.214275) rotate(11.000000) translate(-63.546002, -81.214275) " font-size="19" fill="#FCF7F7">
+ <tspan x="17.9664126" y="87.7142748">Performant</tspan>
+ </text>
+ <text id="Aggregation-Copy" transform="translate(191.155175, 83.777538) rotate(-11.000000) translate(-191.155175, -83.777538) " font-size="19" fill="#FAF5F5">
+ <tspan x="142.773827" y="87.2775384">Aggregation</tspan>
+ </text>
+ <text id="Pre-Materialization-Copy" transform="translate(192.240329, 146.071874) rotate(-11.000000) translate(-192.240329, -146.071874) " font-size="15" fill="#F6F3F3">
+ <tspan x="132.005954" y="142.071874">Pre-Materialization</tspan>
+ </text>
+ <text id="Segment-Optimizer-Copy" transform="translate(64.546002, 140.214275) rotate(11.000000) translate(-64.546002, -140.214275) " font-size="15" fill="#F8F5F5">
+ <tspan x="4.01499655" y="142.714275">Segment Optimizer</tspan>
+ </text>
+ </g>
+ <g id="Bitmap-Copy-2" transform="translate(93.000000, 125.000000)">
+ <mask id="mask-20" fill="white">
+ <use xlink:href="#path-19"></use>
+ </mask>
+ <g id="Mask">
+ <use fill="black" fill-opacity="1" filter="url(#filter-21)" xlink:href="#path-19"></use>
+ <use fill="#FFFFFF" fill-rule="evenodd" xlink:href="#path-19"></use>
+ </g>
+ <image mask="url(#mask-20)" x="10.4320988" y="20.8641975" width="44.1358025" height="23.2716049" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAABLAAAAJxCAYAAABSRUvkAAAABGdBTUEAALGOfPtRkwAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAAEsKADAAQAAAABAAACcQAAAABCSKAQAABAAElEQVR4AezdCXxU1d34/3PuzCSggEoFJJlJwIpLcWmLLbKKShfaWqttlCRgbZ+Wp4vd/m1/Pl2ltYvP0721m1ofqyRoY+va0vqgImu12kVLVUBJZiYBQasISsjM3PP/3gASQkLmznrvnc99vSAzd87yPe87meR+c+65WrEhgAACC [...]
+ </g>
+ <g id="Bitmap-Copy-4" transform="translate(93.000000, 282.000000)">
+ <mask id="mask-23" fill="white">
+ <use xlink:href="#path-22"></use>
+ </mask>
+ <g id="Mask">
+ <use fill="black" fill-opacity="1" filter="url(#filter-24)" xlink:href="#path-22"></use>
+ <use fill="#FFFFFF" fill-rule="evenodd" xlink:href="#path-22"></use>
+ </g>
+ <image mask="url(#mask-23)" x="13.6419753" y="14.4444444" width="36.1111111" height="36.1111111" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAABLAAAASwCAYAAADrIbPPAAAABGdBTUEAALGOfPtRkwAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAAEsKADAAQAAAABAAAEsAAAAABAZIJmAABAAElEQVR4AezdC5RcZ30g+HtvPbpbsg02xOadAEZ+QYJxJsGYgKxuyRBCQhKU93MyCcmQOAmxsSSbUMFSt2SDLOfMzAm75+zO7p6ze9aZnNlZMsfYlmwFm8xsApM4mIeNTRJIIBBsGWxLXd1V99tPAjl6tKR+VHXdx6/P8emqe7/7/ [...]
+ </g>
+ <g id="Bitmap-Copy-5" transform="translate(28.000000, 242.000000)">
+ <mask id="mask-26" fill="white">
+ <use xlink:href="#path-25"></use>
+ </mask>
+ <g id="Mask">
+ <use fill="black" fill-opacity="1" filter="url(#filter-27)" xlink:href="#path-25"></use>
+ <use fill="#FFFFFF" fill-rule="evenodd" xlink:href="#path-25"></use>
+ </g>
+ <image mask="url(#mask-26)" x="11.2345679" y="16.0493827" width="41.7283951" height="32.9012346" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAZAAAAFACAYAAACSgSrjAAAABGdBTUEAALGOfPtRkwAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAABkKADAAQAAAABAAABQAAAAACSxBCVAAAuOklEQVR4Ae2deXQc13Xmb69AYwdJANx3UtxEUUvMRXtERZRtydbYkm0to0RrJEeW7UwmsWfsRH94JjlnxtJxdCzJmcSmfeKMZ+RYdjS2NI4jaSRxMbVRJimSIglSJEBsxNpA791zbxMNogE00N1Vr7rq9VfnFLqr6r137/vd6v7wl [...]
+ </g>
+ <image id="Bitmap-Copy" x="370" y="82" width="51" height="83" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAewAAAMYCAYAAAAJttRGAAAABGdBTUEAALGOfPtRkwAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAAB7KADAAQAAAABAAADGAAAAAAmw5O2AABAAElEQVR4Aey9CZgcV3nuXz3aRvto3zdrtSRL8iIZ4xUbYzAJtlkdMNsFshBCbsgN/8sSCCEk/EPuJZAAIQm5cBPAQBwciFkMNhiEF9mSbO37Lsu2bLzJtiRL7vv+jqfk1ng0M93T1VXV9Z7nqeme7uqzvOfUec+3nO+UIicjYASMQA4RKJfLJaXyAw888N+ffvrpIYcPH37vM888M2HP [...]
+ <path id="Path-9" d="M529.381393,207.273589 L529.461256,208.270395 C528.80988,208.322583 528.148984,208.3738 527.478568,208.424048 L526.465804,208.498692 L526.393519,207.501308 C527.410923,207.427573 528.406881,207.351666 529.381393,207.273589 Z M535.346937,206.742134 L535.445445,207.737271 C534.797955,207.801365 534.139015,207.86429 533.468625,207.926048 L532.454451,208.017807 L532.365939,207.021732 C533.385409,206.931141 534.379076,206.837942 535.346937,206.742134 Z M541.298584 [...]
+ <line x1="351.5" y1="34" x2="343.5" y2="29.5" id="Path-10" stroke="#979797"></line>
+ <line x1="351.5" y1="40.5" x2="344.5" y2="34" id="Path-10" stroke="#979797" transform="translate(348.000000, 37.500000) scale(-1, 1) translate(-348.000000, -37.500000) "></line>
+ <image id="Bitmap" x="584" y="296" width="51" height="43" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAK4AAACUCAYAAAAK7RIlAAAAAXNSR0IArs4c6QAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAAArqADAAQAAAABAAAAlAAAAACyaf9ZAAAnKElEQVR4Ae1dCXwURdbvqr5mMpODhASQK+E+1mNXVGRR4dNFBRUvsrLrhYqogBfIpeC4oqiIIJ6IgovXGjxQFBddRfFYxagrN4SEcEkkkGuSmb7rezUYDMnMpCeZ7gyk6/dLerq7uur1v/9dXfXqvVcM4yQHAQcBBwEHAQcBBwEHAQcBBwEHAQcBBwEHAQcBBwEHAQcBBwEHAQeBREYAWSHcSX+f [...]
+ <image id="Bitmap" x="677" y="222" width="37.4693878" height="51" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAToAAAGtCAYAAACGIbinAAAAAXNSR0IArs4c6QAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAABOqADAAQAAAABAAABrQAAAADkgzWwAAA3m0lEQVR4Ae1dB7jcxNXFgI3BNNNM97OxaQabbooBY3roHUJoCRB6QmgJCQQIBEINPRB674Qammmhd0KvLvTeMZ3/nLD6v33r1a6k1R3NSOd+33nSSqN775zRnh2NRnqTTCITA2JADIgBMSAGxIAYEANiQAyIATEgBsSAGBADYkAMiAExIAbEgBgQA2JADIgBMSAGxIAYEANiQAyIATEg [...]
+ <g id="sql-file-format-symbol-svgrepo-com" transform="translate(592.000000, 134.000000)" fill-rule="nonzero">
+ <path d="M19.0183875,38 C17.1041619,38 16.0002175,39.7974322 16.0002175,42.0177687 C15.9818924,44.273111 17.1227646,46 19.0000625,46 C20.895963,46 22,44.2910126 22,41.9650386 C22,39.7969004 20.931595,38 19.0183875,38 Z" id="Path" fill="#000000"></path>
+ <path d="M35.9905405,12.2219001 C35.9877477,11.988012 35.9154955,11.7569943 35.7591892,11.574495 L26.1909009,0.342035795 C26.189009,0.338887658 26.1861261,0.337869144 26.1828829,0.334998784 C26.1263063,0.269536058 26.0602703,0.215554773 25.9904505,0.167962353 C25.9695495,0.154073515 25.9485586,0.141388375 25.9267568,0.128888421 C25.864955,0.094999655 25.8012613,0.0668516091 25.7343243,0.0462961282 C25.7163063,0.0409257773 25.7006306,0.0333332123 25.6825225,0.028518415 C25.609 [...]
+ <g id="PQL" transform="translate(2.000000, 37.000000)" fill="#CCCCCC">
+ <path d="M7.16451714,0.178349165 L7.16451714,0.178349165 L7.16451714,0.178349165 C10.0819964,0.178349165 11.5407361,0.916366416 11.5407361,2.39240092 L11.5407361,2.39240092 L11.5407361,2.39240092 C11.5407361,3.20187793 11.1775191,3.84981985 10.4510852,4.33622666 L10.4510852,4.33622666 L10.4510852,4.33622666 C9.73639509,4.82143247 8.75411555,5.06403538 7.50424662,5.06403538 L7.50424662,5.06403538 L7.50424662,5.06403538 C6.92041522,5.06403538 6.40201321,4.94513593 5.9490405 [...]
+ </g>
+ <rect id="Rectangle" fill="#000000" x="5" y="8" width="5" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="12" y="8" width="5" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="5" y="12" width="4" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="9" y="12" width="4" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="13" y="12" width="4" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="17" y="12" width="4" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="5" y="17" width="4" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="9" y="17" width="4" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="15" y="17" width="4" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="20" y="17" width="4" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="5" y="20" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="7" y="20" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="9" y="20" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="11" y="20" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="13" y="20" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="15" y="20" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="17" y="20" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="19" y="20" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="21" y="20" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="22" y="20" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="25" y="20" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="27" y="20" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="6" y="24" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="8" y="24" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="11" y="24" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="13" y="24" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="17" y="24" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="20" y="24" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="22" y="24" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="24" y="24" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="5" y="26" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="8" y="26" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="9" y="26" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="12" y="26" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="15" y="26" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="17" y="26" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="19" y="26" width="2" height="1"></rect>
+ <rect id="Rectangle" fill="#000000" x="21" y="26" width="2" height="1"></rect>
+ </g>
+ </g>
+</svg>
\ No newline at end of file
diff --git a/website-builder/static/img/pinot.png b/website-builder/static/img/pinot.png
new file mode 100644
index 0000000..aaaef80
Binary files /dev/null and b/website-builder/static/img/pinot.png differ
diff --git a/website-builder/static/img/pql-query.png b/website-builder/static/img/pql-query.png
new file mode 100644
index 0000000..95ab3dc
Binary files /dev/null and b/website-builder/static/img/pql-query.png differ
diff --git a/website-builder/static/img/pql/pql-query-console.png b/website-builder/static/img/pql/pql-query-console.png
new file mode 100644
index 0000000..7f4eb02
Binary files /dev/null and b/website-builder/static/img/pql/pql-query-console.png differ
diff --git a/website-builder/static/img/undraw_docusaurus_mountain.svg b/website-builder/static/img/undraw_docusaurus_mountain.svg
new file mode 100755
index 0000000..431cef2
--- /dev/null
+++ b/website-builder/static/img/undraw_docusaurus_mountain.svg
@@ -0,0 +1,170 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="1088" height="687.962" viewBox="0 0 1088 687.962">
+ <g id="Group_12" data-name="Group 12" transform="translate(-57 -56)">
+ <g id="Group_11" data-name="Group 11" transform="translate(57 56)">
+ <path id="Path_83" data-name="Path 83" d="M1017.81,560.461c-5.27,45.15-16.22,81.4-31.25,110.31-20,38.52-54.21,54.04-84.77,70.28a193.275,193.275,0,0,1-27.46,11.94c-55.61,19.3-117.85,14.18-166.74,3.99a657.282,657.282,0,0,0-104.09-13.16q-14.97-.675-29.97-.67c-15.42.02-293.07,5.29-360.67-131.57-16.69-33.76-28.13-75-32.24-125.27-11.63-142.12,52.29-235.46,134.74-296.47,155.97-115.41,369.76-110.57,523.43,7.88C941.15,276.621,1036.99,396.031,1017.81,560.461Z" transform="translate(-56 -106.0 [...]
+ <path id="Path_84" data-name="Path 84" d="M986.56,670.771c-20,38.52-47.21,64.04-77.77,80.28a193.272,193.272,0,0,1-27.46,11.94c-55.61,19.3-117.85,14.18-166.74,3.99a657.3,657.3,0,0,0-104.09-13.16q-14.97-.675-29.97-.67-23.13.03-46.25,1.72c-100.17,7.36-253.82-6.43-321.42-143.29L382,283.981,444.95,445.6l20.09,51.59,55.37-75.98L549,381.981l130.2,149.27,36.8-81.27L970.78,657.9l14.21,11.59Z" transform="translate(-56 -106.019)" fill="#f2f2f2"/>
+ <path id="Path_85" data-name="Path 85" d="M302,282.962l26-57,36,83-31-60Z" opacity="0.1"/>
+ <path id="Path_86" data-name="Path 86" d="M610.5,753.821q-14.97-.675-29.97-.67L465.04,497.191Z" transform="translate(-56 -106.019)" opacity="0.1"/>
+ <path id="Path_87" data-name="Path 87" d="M464.411,315.191,493,292.962l130,150-132-128Z" opacity="0.1"/>
+ <path id="Path_88" data-name="Path 88" d="M908.79,751.051a193.265,193.265,0,0,1-27.46,11.94L679.2,531.251Z" transform="translate(-56 -106.019)" opacity="0.1"/>
+ <circle id="Ellipse_11" data-name="Ellipse 11" cx="3" cy="3" r="3" transform="translate(479 98.962)" fill="#f2f2f2"/>
+ <circle id="Ellipse_12" data-name="Ellipse 12" cx="3" cy="3" r="3" transform="translate(396 201.962)" fill="#f2f2f2"/>
+ <circle id="Ellipse_13" data-name="Ellipse 13" cx="2" cy="2" r="2" transform="translate(600 220.962)" fill="#f2f2f2"/>
+ <circle id="Ellipse_14" data-name="Ellipse 14" cx="2" cy="2" r="2" transform="translate(180 265.962)" fill="#f2f2f2"/>
+ <circle id="Ellipse_15" data-name="Ellipse 15" cx="2" cy="2" r="2" transform="translate(612 96.962)" fill="#f2f2f2"/>
+ <circle id="Ellipse_16" data-name="Ellipse 16" cx="2" cy="2" r="2" transform="translate(736 192.962)" fill="#f2f2f2"/>
+ <circle id="Ellipse_17" data-name="Ellipse 17" cx="2" cy="2" r="2" transform="translate(858 344.962)" fill="#f2f2f2"/>
+ <path id="Path_89" data-name="Path 89" d="M306,121.222h-2.76v-2.76h-1.48v2.76H299V122.7h2.76v2.759h1.48V122.7H306Z" fill="#f2f2f2"/>
+ <path id="Path_90" data-name="Path 90" d="M848,424.222h-2.76v-2.76h-1.48v2.76H841V425.7h2.76v2.759h1.48V425.7H848Z" fill="#f2f2f2"/>
+ <path id="Path_91" data-name="Path 91" d="M1144,719.981c0,16.569-243.557,74-544,74s-544-57.431-544-74,243.557,14,544,14S1144,703.413,1144,719.981Z" transform="translate(-56 -106.019)" fill="#3f3d56"/>
+ <path id="Path_92" data-name="Path 92" d="M1144,719.981c0,16.569-243.557,74-544,74s-544-57.431-544-74,243.557,14,544,14S1144,703.413,1144,719.981Z" transform="translate(-56 -106.019)" opacity="0.1"/>
+ <ellipse id="Ellipse_18" data-name="Ellipse 18" cx="544" cy="30" rx="544" ry="30" transform="translate(0 583.962)" fill="#3f3d56"/>
+ <path id="Path_93" data-name="Path 93" d="M624,677.981c0,33.137-14.775,24-33,24s-33,9.137-33-24,33-96,33-96S624,644.844,624,677.981Z" transform="translate(-56 -106.019)" fill="#ff6584"/>
+ <path id="Path_94" data-name="Path 94" d="M606,690.66c0,15.062-6.716,10.909-15,10.909s-15,4.153-15-10.909,15-43.636,15-43.636S606,675.6,606,690.66Z" transform="translate(-56 -106.019)" opacity="0.1"/>
+ <rect id="Rectangle_97" data-name="Rectangle 97" width="92" height="18" rx="9" transform="translate(489 604.962)" fill="#2f2e41"/>
+ <rect id="Rectangle_98" data-name="Rectangle 98" width="92" height="18" rx="9" transform="translate(489 586.962)" fill="#2f2e41"/>
+ <path id="Path_95" data-name="Path 95" d="M193,596.547c0,55.343,34.719,100.126,77.626,100.126" transform="translate(-56 -106.019)" fill="#3f3d56"/>
+ <path id="Path_96" data-name="Path 96" d="M270.626,696.673c0-55.965,38.745-101.251,86.626-101.251" transform="translate(-56 -106.019)" fill="#6c63ff"/>
+ <path id="Path_97" data-name="Path 97" d="M221.125,601.564c0,52.57,22.14,95.109,49.5,95.109" transform="translate(-56 -106.019)" fill="#6c63ff"/>
+ <path id="Path_98" data-name="Path 98" d="M270.626,696.673c0-71.511,44.783-129.377,100.126-129.377" transform="translate(-56 -106.019)" fill="#3f3d56"/>
+ <path id="Path_99" data-name="Path 99" d="M254.3,697.379s11.009-.339,14.326-2.7,16.934-5.183,17.757-1.395,16.544,18.844,4.115,18.945-28.879-1.936-32.19-3.953S254.3,697.379,254.3,697.379Z" transform="translate(-56 -106.019)" fill="#a8a8a8"/>
+ <path id="Path_100" data-name="Path 100" d="M290.716,710.909c-12.429.1-28.879-1.936-32.19-3.953-2.522-1.536-3.527-7.048-3.863-9.591l-.368.014s.7,8.879,4.009,10.9,19.761,4.053,32.19,3.953c3.588-.029,4.827-1.305,4.759-3.2C294.755,710.174,293.386,710.887,290.716,710.909Z" transform="translate(-56 -106.019)" opacity="0.2"/>
+ <path id="Path_101" data-name="Path 101" d="M777.429,633.081c0,38.029,23.857,68.8,53.341,68.8" transform="translate(-56 -106.019)" fill="#3f3d56"/>
+ <path id="Path_102" data-name="Path 102" d="M830.769,701.882c0-38.456,26.623-69.575,59.525-69.575" transform="translate(-56 -106.019)" fill="#6c63ff"/>
+ <path id="Path_103" data-name="Path 103" d="M796.755,636.528c0,36.124,15.213,65.354,34.014,65.354" transform="translate(-56 -106.019)" fill="#6c63ff"/>
+ <path id="Path_104" data-name="Path 104" d="M830.769,701.882c0-49.139,30.773-88.9,68.8-88.9" transform="translate(-56 -106.019)" fill="#3f3d56"/>
+ <path id="Path_105" data-name="Path 105" d="M819.548,702.367s7.565-.233,9.844-1.856,11.636-3.562,12.2-.958,11.368,12.949,2.828,13.018-19.844-1.33-22.119-2.716S819.548,702.367,819.548,702.367Z" transform="translate(-56 -106.019)" fill="#a8a8a8"/>
+ <path id="Path_106" data-name="Path 106" d="M844.574,711.664c-8.54.069-19.844-1.33-22.119-2.716-1.733-1.056-2.423-4.843-2.654-6.59l-.253.01s.479,6.1,2.755,7.487,13.579,2.785,22.119,2.716c2.465-.02,3.317-.9,3.27-2.2C847.349,711.159,846.409,711.649,844.574,711.664Z" transform="translate(-56 -106.019)" opacity="0.2"/>
+ <path id="Path_107" data-name="Path 107" d="M949.813,724.718s11.36-1.729,14.5-4.591,16.89-7.488,18.217-3.667,19.494,17.447,6.633,19.107-30.153,1.609-33.835-.065S949.813,724.718,949.813,724.718Z" transform="translate(-56 -106.019)" fill="#a8a8a8"/>
+ <path id="Path_108" data-name="Path 108" d="M989.228,734.173c-12.86,1.659-30.153,1.609-33.835-.065-2.8-1.275-4.535-6.858-5.2-9.45l-.379.061s1.833,9.109,5.516,10.783,20.975,1.725,33.835.065c3.712-.479,4.836-1.956,4.529-3.906C993.319,732.907,991.991,733.817,989.228,734.173Z" transform="translate(-56 -106.019)" opacity="0.2"/>
+ <path id="Path_109" data-name="Path 109" d="M670.26,723.9s9.587-1.459,12.237-3.875,14.255-6.32,15.374-3.095,16.452,14.725,5.6,16.125-25.448,1.358-28.555-.055S670.26,723.9,670.26,723.9Z" transform="translate(-56 -106.019)" fill="#a8a8a8"/>
+ <path id="Path_110" data-name="Path 110" d="M703.524,731.875c-10.853,1.4-25.448,1.358-28.555-.055-2.367-1.076-3.827-5.788-4.39-7.976l-.32.051s1.547,7.687,4.655,9.1,17.7,1.456,28.555.055c3.133-.4,4.081-1.651,3.822-3.3C706.977,730.807,705.856,731.575,703.524,731.875Z" transform="translate(-56 -106.019)" opacity="0.2"/>
+ <path id="Path_111" data-name="Path 111" d="M178.389,719.109s7.463-1.136,9.527-3.016,11.1-4.92,11.969-2.409,12.808,11.463,4.358,12.553-19.811,1.057-22.23-.043S178.389,719.109,178.389,719.109Z" transform="translate(-56 -106.019)" fill="#a8a8a8"/>
+ <path id="Path_112" data-name="Path 112" d="M204.285,725.321c-8.449,1.09-19.811,1.057-22.23-.043-1.842-.838-2.979-4.506-3.417-6.209l-.249.04s1.2,5.984,3.624,7.085,13.781,1.133,22.23.043c2.439-.315,3.177-1.285,2.976-2.566C206.973,724.489,206.1,725.087,204.285,725.321Z" transform="translate(-56 -106.019)" opacity="0.2"/>
+ <path id="Path_113" data-name="Path 113" d="M439.7,707.337c0,30.22-42.124,20.873-93.7,20.873s-93.074,9.347-93.074-20.873,42.118-36.793,93.694-36.793S439.7,677.117,439.7,707.337Z" transform="translate(-56 -106.019)" opacity="0.1"/>
+ <path id="Path_114" data-name="Path 114" d="M439.7,699.9c0,30.22-42.124,20.873-93.7,20.873s-93.074,9.347-93.074-20.873S295.04,663.1,346.616,663.1,439.7,669.676,439.7,699.9Z" transform="translate(-56 -106.019)" fill="#3f3d56"/>
+ </g>
+ <g id="docusaurus_keytar" transform="translate(312.271 493.733)">
+ <path id="Path_40" data-name="Path 40" d="M99,52h91.791V89.153H99Z" transform="translate(5.904 -14.001)" fill="#fff" fill-rule="evenodd"/>
+ <path id="Path_41" data-name="Path 41" d="M24.855,163.927A21.828,21.828,0,0,1,5.947,153a21.829,21.829,0,0,0,18.908,32.782H46.71V163.927Z" transform="translate(-3 -4.634)" fill="#3ecc5f" fill-rule="evenodd"/>
+ <path id="Path_42" data-name="Path 42" d="M121.861,61.1l76.514-4.782V45.39A21.854,21.854,0,0,0,176.52,23.535H78.173L75.441,18.8a3.154,3.154,0,0,0-5.464,0l-2.732,4.732L64.513,18.8a3.154,3.154,0,0,0-5.464,0l-2.732,4.732L53.586,18.8a3.154,3.154,0,0,0-5.464,0L45.39,23.535c-.024,0-.046,0-.071,0l-4.526-4.525a3.153,3.153,0,0,0-5.276,1.414l-1.5,5.577-5.674-1.521a3.154,3.154,0,0,0-3.863,3.864L26,34.023l-5.575,1.494a3.155,3.155,0,0,0-1.416,5.278l4.526,4.526c0,.023,0,.046,0,.07L18.8,48.122a3. [...]
+ <path id="Path_43" data-name="Path 43" d="M143,186.71h32.782V143H143Z" transform="translate(9.984 -5.561)" fill="#3ecc5f" fill-rule="evenodd"/>
+ <path id="Path_44" data-name="Path 44" d="M196.71,159.855a5.438,5.438,0,0,0-.7.07c-.042-.164-.081-.329-.127-.493a5.457,5.457,0,1,0-5.4-9.372q-.181-.185-.366-.367a5.454,5.454,0,1,0-9.384-5.4c-.162-.046-.325-.084-.486-.126a5.467,5.467,0,1,0-10.788,0c-.162.042-.325.08-.486.126a5.457,5.457,0,1,0-9.384,5.4,21.843,21.843,0,1,0,36.421,21.02,5.452,5.452,0,1,0,.7-10.858" transform="translate(10.912 -6.025)" fill="#44d860" fill-rule="evenodd"/>
+ <path id="Path_45" data-name="Path 45" d="M153,124.855h32.782V103H153Z" transform="translate(10.912 -9.271)" fill="#3ecc5f" fill-rule="evenodd"/>
+ <path id="Path_46" data-name="Path 46" d="M194.855,116.765a2.732,2.732,0,1,0,0-5.464,2.811,2.811,0,0,0-.349.035c-.022-.082-.04-.164-.063-.246a2.733,2.733,0,0,0-1.052-5.253,2.7,2.7,0,0,0-1.648.566q-.09-.093-.184-.184a2.7,2.7,0,0,0,.553-1.633,2.732,2.732,0,0,0-5.245-1.07,10.928,10.928,0,1,0,0,21.031,2.732,2.732,0,0,0,5.245-1.07,2.7,2.7,0,0,0-.553-1.633q.093-.09.184-.184a2.7,2.7,0,0,0,1.648.566,2.732,2.732,0,0,0,1.052-5.253c.023-.081.042-.164.063-.246a2.814,2.814,0,0,0,.349.035" trans [...]
+ <path id="Path_47" data-name="Path 47" d="M65.087,56.891a2.732,2.732,0,0,1-2.732-2.732,8.2,8.2,0,0,0-16.391,0,2.732,2.732,0,0,1-5.464,0,13.659,13.659,0,0,1,27.319,0,2.732,2.732,0,0,1-2.732,2.732" transform="translate(0.478 -15.068)" fill-rule="evenodd"/>
+ <path id="Path_48" data-name="Path 48" d="M103,191.347h65.565a21.854,21.854,0,0,0,21.855-21.855V93H124.855A21.854,21.854,0,0,0,103,114.855Z" transform="translate(6.275 -10.199)" fill="#ffff50" fill-rule="evenodd"/>
+ <path id="Path_49" data-name="Path 49" d="M173.216,129.787H118.535a1.093,1.093,0,1,1,0-2.185h54.681a1.093,1.093,0,0,1,0,2.185m0,21.855H118.535a1.093,1.093,0,1,1,0-2.186h54.681a1.093,1.093,0,0,1,0,2.186m0,21.855H118.535a1.093,1.093,0,1,1,0-2.185h54.681a1.093,1.093,0,0,1,0,2.185m0-54.434H118.535a1.093,1.093,0,1,1,0-2.185h54.681a1.093,1.093,0,0,1,0,2.185m0,21.652H118.535a1.093,1.093,0,1,1,0-2.186h54.681a1.093,1.093,0,0,1,0,2.186m0,21.855H118.535a1.093,1.093,0,1,1,0-2.186h54.681a1.093, [...]
+ <path id="Path_50" data-name="Path 50" d="M83,186.71h43.71V143H83Z" transform="translate(4.42 -5.561)" fill="#3ecc5f" fill-rule="evenodd"/>
+ <g id="Group_8" data-name="Group 8" transform="matrix(0.966, -0.259, 0.259, 0.966, 109.327, 91.085)">
+ <rect id="Rectangle_3" data-name="Rectangle 3" width="92.361" height="36.462" rx="2" transform="translate(0 0)" fill="#d8d8d8"/>
+ <g id="Group_2" data-name="Group 2" transform="translate(1.531 23.03)">
+ <rect id="Rectangle_4" data-name="Rectangle 4" width="5.336" height="5.336" rx="1" transform="translate(16.797 0)" fill="#4a4a4a"/>
+ <rect id="Rectangle_5" data-name="Rectangle 5" width="5.336" height="5.336" rx="1" transform="translate(23.12 0)" fill="#4a4a4a"/>
+ <rect id="Rectangle_6" data-name="Rectangle 6" width="5.336" height="5.336" rx="1" transform="translate(29.444 0)" fill="#4a4a4a"/>
+ <rect id="Rectangle_7" data-name="Rectangle 7" width="5.336" height="5.336" rx="1" transform="translate(35.768 0)" fill="#4a4a4a"/>
+ <rect id="Rectangle_8" data-name="Rectangle 8" width="5.336" height="5.336" rx="1" transform="translate(42.091 0)" fill="#4a4a4a"/>
+ <rect id="Rectangle_9" data-name="Rectangle 9" width="5.336" height="5.336" rx="1" transform="translate(48.415 0)" fill="#4a4a4a"/>
+ <rect id="Rectangle_10" data-name="Rectangle 10" width="5.336" height="5.336" rx="1" transform="translate(54.739 0)" fill="#4a4a4a"/>
+ <rect id="Rectangle_11" data-name="Rectangle 11" width="5.336" height="5.336" rx="1" transform="translate(61.063 0)" fill="#4a4a4a"/>
+ <rect id="Rectangle_12" data-name="Rectangle 12" width="5.336" height="5.336" rx="1" transform="translate(67.386 0)" fill="#4a4a4a"/>
+ <path id="Path_51" data-name="Path 51" d="M1.093,0H14.518a1.093,1.093,0,0,1,1.093,1.093V4.243a1.093,1.093,0,0,1-1.093,1.093H1.093A1.093,1.093,0,0,1,0,4.243V1.093A1.093,1.093,0,0,1,1.093,0ZM75,0H88.426a1.093,1.093,0,0,1,1.093,1.093V4.243a1.093,1.093,0,0,1-1.093,1.093H75a1.093,1.093,0,0,1-1.093-1.093V1.093A1.093,1.093,0,0,1,75,0Z" transform="translate(0 0)" fill="#4a4a4a" fill-rule="evenodd"/>
+ </g>
+ <g id="Group_3" data-name="Group 3" transform="translate(1.531 10.261)">
+ <path id="Path_52" data-name="Path 52" d="M1.093,0H6.218A1.093,1.093,0,0,1,7.31,1.093V4.242A1.093,1.093,0,0,1,6.218,5.335H1.093A1.093,1.093,0,0,1,0,4.242V1.093A1.093,1.093,0,0,1,1.093,0Z" transform="translate(0 0)" fill="#4a4a4a" fill-rule="evenodd"/>
+ <rect id="Rectangle_13" data-name="Rectangle 13" width="5.336" height="5.336" rx="1" transform="translate(8.299 0)" fill="#4a4a4a"/>
+ <rect id="Rectangle_14" data-name="Rectangle 14" width="5.336" height="5.336" rx="1" transform="translate(14.623 0)" fill="#4a4a4a"/>
+ <rect id="Rectangle_15" data-name="Rectangle 15" width="5.336" height="5.336" rx="1" transform="translate(20.947 0)" fill="#4a4a4a"/>
+ <rect id="Rectangle_16" data-name="Rectangle 16" width="5.336" height="5.336" rx="1" transform="translate(27.271 0)" fill="#4a4a4a"/>
+ <rect id="Rectangle_17" data-name="Rectangle 17" width="5.336" height="5.336" rx="1" transform="translate(33.594 0)" fill="#4a4a4a"/>
+ <rect id="Rectangle_18" data-name="Rectangle 18" width="5.336" height="5.336" rx="1" transform="translate(39.918 0)" fill="#4a4a4a"/>
+ <rect id="Rectangle_19" data-name="Rectangle 19" width="5.336" height="5.336" rx="1" transform="translate(46.242 0)" fill="#4a4a4a"/>
+ <rect id="Rectangle_20" data-name="Rectangle 20" width="5.336" height="5.336" rx="1" transform="translate(52.565 0)" fill="#4a4a4a"/>
+ <rect id="Rectangle_21" data-name="Rectangle 21" width="5.336" height="5.336" rx="1" transform="translate(58.888 0)" fill="#4a4a4a"/>
+ <rect id="Rectangle_22" data-name="Rectangle 22" width="5.336" height="5.336" rx="1" transform="translate(65.212 0)" fill="#4a4a4a"/>
+ <rect id="Rectangle_23" data-name="Rectangle 23" width="5.336" height="5.336" rx="1" transform="translate(71.536 0)" fill="#4a4a4a"/>
+ <rect id="Rectangle_24" data-name="Rectangle 24" width="5.336" height="5.336" rx="1" transform="translate(77.859 0)" fill="#4a4a4a"/>
+ <rect id="Rectangle_25" data-name="Rectangle 25" width="5.336" height="5.336" rx="1" transform="translate(84.183 0)" fill="#4a4a4a"/>
+ </g>
+ <g id="Group_4" data-name="Group 4" transform="translate(91.05 9.546) rotate(180)">
+ <path id="Path_53" data-name="Path 53" d="M1.093,0H6.219A1.093,1.093,0,0,1,7.312,1.093v3.15A1.093,1.093,0,0,1,6.219,5.336H1.093A1.093,1.093,0,0,1,0,4.243V1.093A1.093,1.093,0,0,1,1.093,0Z" transform="translate(0 0)" fill="#4a4a4a" fill-rule="evenodd"/>
+ <rect id="Rectangle_26" data-name="Rectangle 26" width="5.336" height="5.336" rx="1" transform="translate(8.299 0)" fill="#4a4a4a"/>
+ <rect id="Rectangle_27" data-name="Rectangle 27" width="5.336" height="5.336" rx="1" transform="translate(14.623 0)" fill="#4a4a4a"/>
+ <rect id="Rectangle_28" data-name="Rectangle 28" width="5.336" height="5.336" rx="1" transform="translate(20.947 0)" fill="#4a4a4a"/>
+ <rect id="Rectangle_29" data-name="Rectangle 29" width="5.336" height="5.336" rx="1" transform="translate(27.271 0)" fill="#4a4a4a"/>
+ <rect id="Rectangle_30" data-name="Rectangle 30" width="5.336" height="5.336" rx="1" transform="translate(33.594 0)" fill="#4a4a4a"/>
+ <rect id="Rectangle_31" data-name="Rectangle 31" width="5.336" height="5.336" rx="1" transform="translate(39.918 0)" fill="#4a4a4a"/>
+ <rect id="Rectangle_32" data-name="Rectangle 32" width="5.336" height="5.336" rx="1" transform="translate(46.242 0)" fill="#4a4a4a"/>
+ <rect id="Rectangle_33" data-name="Rectangle 33" width="5.336" height="5.336" rx="1" transform="translate(52.565 0)" fill="#4a4a4a"/>
+ <rect id="Rectangle_34" data-name="Rectangle 34" width="5.336" height="5.336" rx="1" transform="translate(58.889 0)" fill="#4a4a4a"/>
+ <rect id="Rectangle_35" data-name="Rectangle 35" width="5.336" height="5.336" rx="1" transform="translate(65.213 0)" fill="#4a4a4a"/>
+ <rect id="Rectangle_36" data-name="Rectangle 36" width="5.336" height="5.336" rx="1" transform="translate(71.537 0)" fill="#4a4a4a"/>
+ <rect id="Rectangle_37" data-name="Rectangle 37" width="5.336" height="5.336" rx="1" transform="translate(77.86 0)" fill="#4a4a4a"/>
+ <rect id="Rectangle_38" data-name="Rectangle 38" width="5.336" height="5.336" rx="1" transform="translate(84.183 0)" fill="#4a4a4a"/>
+ <rect id="Rectangle_39" data-name="Rectangle 39" width="5.336" height="5.336" rx="1" transform="translate(8.299 0)" fill="#4a4a4a"/>
+ <rect id="Rectangle_40" data-name="Rectangle 40" width="5.336" height="5.336" rx="1" transform="translate(14.623 0)" fill="#4a4a4a"/>
+ <rect id="Rectangle_41" data-name="Rectangle 41" width="5.336" height="5.336" rx="1" transform="translate(20.947 0)" fill="#4a4a4a"/>
+ <rect id="Rectangle_42" data-name="Rectangle 42" width="5.336" height="5.336" rx="1" transform="translate(27.271 0)" fill="#4a4a4a"/>
+ <rect id="Rectangle_43" data-name="Rectangle 43" width="5.336" height="5.336" rx="1" transform="translate(33.594 0)" fill="#4a4a4a"/>
+ <rect id="Rectangle_44" data-name="Rectangle 44" width="5.336" height="5.336" rx="1" transform="translate(39.918 0)" fill="#4a4a4a"/>
+ <rect id="Rectangle_45" data-name="Rectangle 45" width="5.336" height="5.336" rx="1" transform="translate(46.242 0)" fill="#4a4a4a"/>
+ <rect id="Rectangle_46" data-name="Rectangle 46" width="5.336" height="5.336" rx="1" transform="translate(52.565 0)" fill="#4a4a4a"/>
+ <rect id="Rectangle_47" data-name="Rectangle 47" width="5.336" height="5.336" rx="1" transform="translate(58.889 0)" fill="#4a4a4a"/>
+ <rect id="Rectangle_48" data-name="Rectangle 48" width="5.336" height="5.336" rx="1" transform="translate(65.213 0)" fill="#4a4a4a"/>
+ <rect id="Rectangle_49" data-name="Rectangle 49" width="5.336" height="5.336" rx="1" transform="translate(71.537 0)" fill="#4a4a4a"/>
+ <rect id="Rectangle_50" data-name="Rectangle 50" width="5.336" height="5.336" rx="1" transform="translate(77.86 0)" fill="#4a4a4a"/>
+ <rect id="Rectangle_51" data-name="Rectangle 51" width="5.336" height="5.336" rx="1" transform="translate(84.183 0)" fill="#4a4a4a"/>
+ </g>
+ <g id="Group_6" data-name="Group 6" transform="translate(1.531 16.584)">
+ <path id="Path_54" data-name="Path 54" d="M1.093,0h7.3A1.093,1.093,0,0,1,9.485,1.093v3.15A1.093,1.093,0,0,1,8.392,5.336h-7.3A1.093,1.093,0,0,1,0,4.243V1.094A1.093,1.093,0,0,1,1.093,0Z" transform="translate(0 0)" fill="#4a4a4a" fill-rule="evenodd"/>
+ <g id="Group_5" data-name="Group 5" transform="translate(10.671 0)">
+ <rect id="Rectangle_52" data-name="Rectangle 52" width="5.336" height="5.336" rx="1" fill="#4a4a4a"/>
+ <rect id="Rectangle_53" data-name="Rectangle 53" width="5.336" height="5.336" rx="1" transform="translate(6.324 0)" fill="#4a4a4a"/>
+ <rect id="Rectangle_54" data-name="Rectangle 54" width="5.336" height="5.336" rx="1" transform="translate(12.647 0)" fill="#4a4a4a"/>
+ <rect id="Rectangle_55" data-name="Rectangle 55" width="5.336" height="5.336" rx="1" transform="translate(18.971 0)" fill="#4a4a4a"/>
+ <rect id="Rectangle_56" data-name="Rectangle 56" width="5.336" height="5.336" rx="1" transform="translate(25.295 0)" fill="#4a4a4a"/>
+ <rect id="Rectangle_57" data-name="Rectangle 57" width="5.336" height="5.336" rx="1" transform="translate(31.619 0)" fill="#4a4a4a"/>
+ <rect id="Rectangle_58" data-name="Rectangle 58" width="5.336" height="5.336" rx="1" transform="translate(37.942 0)" fill="#4a4a4a"/>
+ <rect id="Rectangle_59" data-name="Rectangle 59" width="5.336" height="5.336" rx="1" transform="translate(44.265 0)" fill="#4a4a4a"/>
+ <rect id="Rectangle_60" data-name="Rectangle 60" width="5.336" height="5.336" rx="1" transform="translate(50.589 0)" fill="#4a4a4a"/>
+ <rect id="Rectangle_61" data-name="Rectangle 61" width="5.336" height="5.336" rx="1" transform="translate(56.912 0)" fill="#4a4a4a"/>
+ <rect id="Rectangle_62" data-name="Rectangle 62" width="5.336" height="5.336" rx="1" transform="translate(63.236 0)" fill="#4a4a4a"/>
+ </g>
+ <path id="Path_55" data-name="Path 55" d="M1.094,0H8A1.093,1.093,0,0,1,9.091,1.093v3.15A1.093,1.093,0,0,1,8,5.336H1.093A1.093,1.093,0,0,1,0,4.243V1.094A1.093,1.093,0,0,1,1.093,0Z" transform="translate(80.428 0)" fill="#4a4a4a" fill-rule="evenodd"/>
+ </g>
+ <g id="Group_7" data-name="Group 7" transform="translate(1.531 29.627)">
+ <rect id="Rectangle_63" data-name="Rectangle 63" width="5.336" height="5.336" rx="1" transform="translate(0 0)" fill="#4a4a4a"/>
+ <rect id="Rectangle_64" data-name="Rectangle 64" width="5.336" height="5.336" rx="1" transform="translate(6.324 0)" fill="#4a4a4a"/>
+ <rect id="Rectangle_65" data-name="Rectangle 65" width="5.336" height="5.336" rx="1" transform="translate(12.647 0)" fill="#4a4a4a"/>
+ <rect id="Rectangle_66" data-name="Rectangle 66" width="5.336" height="5.336" rx="1" transform="translate(18.971 0)" fill="#4a4a4a"/>
+ <path id="Path_56" data-name="Path 56" d="M1.093,0H31.515a1.093,1.093,0,0,1,1.093,1.093V4.244a1.093,1.093,0,0,1-1.093,1.093H1.093A1.093,1.093,0,0,1,0,4.244V1.093A1.093,1.093,0,0,1,1.093,0ZM34.687,0h3.942a1.093,1.093,0,0,1,1.093,1.093V4.244a1.093,1.093,0,0,1-1.093,1.093H34.687a1.093,1.093,0,0,1-1.093-1.093V1.093A1.093,1.093,0,0,1,34.687,0Z" transform="translate(25.294 0)" fill="#4a4a4a" fill-rule="evenodd"/>
+ <rect id="Rectangle_67" data-name="Rectangle 67" width="5.336" height="5.336" rx="1" transform="translate(66.003 0)" fill="#4a4a4a"/>
+ <rect id="Rectangle_68" data-name="Rectangle 68" width="5.336" height="5.336" rx="1" transform="translate(72.327 0)" fill="#4a4a4a"/>
+ <rect id="Rectangle_69" data-name="Rectangle 69" width="5.336" height="5.336" rx="1" transform="translate(84.183 0)" fill="#4a4a4a"/>
+ <path id="Path_57" data-name="Path 57" d="M5.336,0V1.18A1.093,1.093,0,0,1,4.243,2.273H1.093A1.093,1.093,0,0,1,0,1.18V0Z" transform="translate(83.59 2.273) rotate(180)" fill="#4a4a4a"/>
+ <path id="Path_58" data-name="Path 58" d="M5.336,0V1.18A1.093,1.093,0,0,1,4.243,2.273H1.093A1.093,1.093,0,0,1,0,1.18V0Z" transform="translate(78.255 3.063)" fill="#4a4a4a"/>
+ </g>
+ <rect id="Rectangle_70" data-name="Rectangle 70" width="88.927" height="2.371" rx="1.085" transform="translate(1.925 1.17)" fill="#4a4a4a"/>
+ <rect id="Rectangle_71" data-name="Rectangle 71" width="4.986" height="1.581" rx="0.723" transform="translate(4.1 1.566)" fill="#d8d8d8" opacity="0.136"/>
+ <rect id="Rectangle_72" data-name="Rectangle 72" width="4.986" height="1.581" rx="0.723" transform="translate(10.923 1.566)" fill="#d8d8d8" opacity="0.136"/>
+ <rect id="Rectangle_73" data-name="Rectangle 73" width="4.986" height="1.581" rx="0.723" transform="translate(16.173 1.566)" fill="#d8d8d8" opacity="0.136"/>
+ <rect id="Rectangle_74" data-name="Rectangle 74" width="4.986" height="1.581" rx="0.723" transform="translate(21.421 1.566)" fill="#d8d8d8" opacity="0.136"/>
+ <rect id="Rectangle_75" data-name="Rectangle 75" width="4.986" height="1.581" rx="0.723" transform="translate(26.671 1.566)" fill="#d8d8d8" opacity="0.136"/>
+ <rect id="Rectangle_76" data-name="Rectangle 76" width="4.986" height="1.581" rx="0.723" transform="translate(33.232 1.566)" fill="#d8d8d8" opacity="0.136"/>
+ <rect id="Rectangle_77" data-name="Rectangle 77" width="4.986" height="1.581" rx="0.723" transform="translate(38.48 1.566)" fill="#d8d8d8" opacity="0.136"/>
+ <rect id="Rectangle_78" data-name="Rectangle 78" width="4.986" height="1.581" rx="0.723" transform="translate(43.73 1.566)" fill="#d8d8d8" opacity="0.136"/>
+ <rect id="Rectangle_79" data-name="Rectangle 79" width="4.986" height="1.581" rx="0.723" transform="translate(48.978 1.566)" fill="#d8d8d8" opacity="0.136"/>
+ <rect id="Rectangle_80" data-name="Rectangle 80" width="4.986" height="1.581" rx="0.723" transform="translate(55.54 1.566)" fill="#d8d8d8" opacity="0.136"/>
+ <rect id="Rectangle_81" data-name="Rectangle 81" width="4.986" height="1.581" rx="0.723" transform="translate(60.788 1.566)" fill="#d8d8d8" opacity="0.136"/>
+ <rect id="Rectangle_82" data-name="Rectangle 82" width="4.986" height="1.581" rx="0.723" transform="translate(66.038 1.566)" fill="#d8d8d8" opacity="0.136"/>
+ <rect id="Rectangle_83" data-name="Rectangle 83" width="4.986" height="1.581" rx="0.723" transform="translate(72.599 1.566)" fill="#d8d8d8" opacity="0.136"/>
+ <rect id="Rectangle_84" data-name="Rectangle 84" width="4.986" height="1.581" rx="0.723" transform="translate(77.847 1.566)" fill="#d8d8d8" opacity="0.136"/>
+ <rect id="Rectangle_85" data-name="Rectangle 85" width="4.986" height="1.581" rx="0.723" transform="translate(83.097 1.566)" fill="#d8d8d8" opacity="0.136"/>
+ </g>
+ <path id="Path_59" data-name="Path 59" d="M146.71,159.855a5.439,5.439,0,0,0-.7.07c-.042-.164-.081-.329-.127-.493a5.457,5.457,0,1,0-5.4-9.372q-.181-.185-.366-.367a5.454,5.454,0,1,0-9.384-5.4c-.162-.046-.325-.084-.486-.126a5.467,5.467,0,1,0-10.788,0c-.162.042-.325.08-.486.126a5.457,5.457,0,1,0-9.384,5.4,21.843,21.843,0,1,0,36.421,21.02,5.452,5.452,0,1,0,.7-10.858" transform="translate(6.275 -6.025)" fill="#44d860" fill-rule="evenodd"/>
+ <path id="Path_60" data-name="Path 60" d="M83,124.855h43.71V103H83Z" transform="translate(4.42 -9.271)" fill="#3ecc5f" fill-rule="evenodd"/>
+ <path id="Path_61" data-name="Path 61" d="M134.855,116.765a2.732,2.732,0,1,0,0-5.464,2.811,2.811,0,0,0-.349.035c-.022-.082-.04-.164-.063-.246a2.733,2.733,0,0,0-1.052-5.253,2.7,2.7,0,0,0-1.648.566q-.09-.093-.184-.184a2.7,2.7,0,0,0,.553-1.633,2.732,2.732,0,0,0-5.245-1.07,10.928,10.928,0,1,0,0,21.031,2.732,2.732,0,0,0,5.245-1.07,2.7,2.7,0,0,0-.553-1.633q.093-.09.184-.184a2.7,2.7,0,0,0,1.648.566,2.732,2.732,0,0,0,1.052-5.253c.023-.081.042-.164.063-.246a2.811,2.811,0,0,0,.349.035" trans [...]
+ <path id="Path_62" data-name="Path 62" d="M143.232,42.33a2.967,2.967,0,0,1-.535-.055,2.754,2.754,0,0,1-.514-.153,2.838,2.838,0,0,1-.471-.251,4.139,4.139,0,0,1-.415-.339,3.2,3.2,0,0,1-.338-.415A2.7,2.7,0,0,1,140.5,39.6a2.968,2.968,0,0,1,.055-.535,3.152,3.152,0,0,1,.152-.514,2.874,2.874,0,0,1,.252-.47,2.633,2.633,0,0,1,.753-.754,2.837,2.837,0,0,1,.471-.251,2.753,2.753,0,0,1,.514-.153,2.527,2.527,0,0,1,1.071,0,2.654,2.654,0,0,1,.983.4,4.139,4.139,0,0,1,.415.339,4.019,4.019,0,0,1,.339. [...]
+ </g>
+ </g>
+</svg>
diff --git a/website-builder/static/img/undraw_docusaurus_react.svg b/website-builder/static/img/undraw_docusaurus_react.svg
new file mode 100755
index 0000000..e417050
--- /dev/null
+++ b/website-builder/static/img/undraw_docusaurus_react.svg
@@ -0,0 +1,169 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="1041.277" height="554.141" viewBox="0 0 1041.277 554.141">
+ <g id="Group_24" data-name="Group 24" transform="translate(-440 -263)">
+ <g id="Group_23" data-name="Group 23" transform="translate(439.989 262.965)">
+ <path id="Path_299" data-name="Path 299" d="M1040.82,611.12q-1.74,3.75-3.47,7.4-2.7,5.67-5.33,11.12c-.78,1.61-1.56,3.19-2.32,4.77-8.6,17.57-16.63,33.11-23.45,45.89A73.21,73.21,0,0,1,942.44,719l-151.65,1.65h-1.6l-13,.14-11.12.12-34.1.37h-1.38l-17.36.19h-.53l-107,1.16-95.51,1-11.11.12-69,.75H429l-44.75.48h-.48l-141.5,1.53-42.33.46a87.991,87.991,0,0,1-10.79-.54h0c-1.22-.14-2.44-.3-3.65-.49a87.38,87.38,0,0,1-51.29-27.54C116,678.37,102.75,655,93.85,629.64q-1.93-5.49-3.6-11.12C59.44,514. [...]
... 173 lines suppressed ...
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@pinot.apache.org
For additional commands, e-mail: commits-help@pinot.apache.org