Community stats page

package.json

@@ -78,8 +78,10 @@
     "react": "17.0.1",
     "react-dom": "17.0.1",
     "react-helmet": "6.1.0",
+    "recharts": "^2.15.3",
     "sass": "^1.32.10",
     "styled-components": "^5.2.3",
-    "tailwindcss": "^3.1.1"
+    "tailwindcss": "^3.1.1",
+    "xlsx": "^0.18.5"
   }
 }

src/components/Cta.js

@@ -1,32 +1,36 @@
-import React from 'react'
+import React from "react";
 
-import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
-import { faGithub } from '@fortawesome/free-brands-svg-icons'
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { faGithub } from "@fortawesome/free-brands-svg-icons";
 
 export default function Cta() {
   return (
-    <section className="md:py-20 py-10 mx-auto" style={{
-      background: 'linear-gradient(90deg, #03B0F2 1.57%, #01E0C9 100%)',
-      maxWidth: "1680px"
-    }}>
+    <section
+      className="md:py-20 py-10 mx-auto"
+      style={{
+        background: "linear-gradient(90deg, #03B0F2 1.57%, #01E0C9 100%)",
+        maxWidth: "1680px",
+      }}
+    >
       <div className="container">
         <div className="flex flex-wrap justify-between">
           <div className="max-w-sm">
-            <p className="text-white text-6xl font-bold leading-tight mb-6 lg:mb-0">Let's put synthetic data to work.</p>
+            <p className="text-white text-[28px] font-bold leading-tight mb-6 lg:mb-0">
+              Let's put synthetic data to work.
+            </p>
           </div>
           <div className="flex justify-center items-center">
-            <a href="https://github.com/sdv-dev/SDV" 
+            <a
+              href="https://github.com/sdv-dev/SDV"
               className="px-6 py-4 inline-block bg-white text-sdv-dark rounded-full font-semibold leading-none text-lg"
               target="_blank"
               rel="noreferrer"
             >
-              <FontAwesomeIcon width="16" icon={faGithub} />
-              {' '}
-              View on Github
+              <FontAwesomeIcon width="16" icon={faGithub} /> View on Github
             </a>
           </div>
         </div>
       </div>
     </section>
-  )
-}
+  );
+}

src/components/Footer.js

@@ -1,14 +1,11 @@
 import React from "react";
-
 import Img from "gatsby-image";
-
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import {
   faSlack,
   faTwitter,
   faLinkedin,
 } from "@fortawesome/free-brands-svg-icons";
-
 import { Link, StaticQuery, graphql } from "gatsby";
 
 export default function Footer() {
@@ -83,7 +80,7 @@ export default function Footer() {
                             { name: "Blog", url: "https://datacebo.com/blog" },
                           ].map((i, idx) => {
                             return (
-                              <li className="mb-4">
+                              <li className="mb-4" key={idx}>
                                 <a
                                   className="opacity-80 hover:opacity-100 text-white hover:underline"
                                   href={i.url}
@@ -112,7 +109,7 @@ export default function Footer() {
                             },
                           ].map((i, idx) => {
                             return (
-                              <li className="mb-4">
+                              <li className="mb-4" key={idx}>
                                 <a
                                   className="opacity-80 hover:opacity-100 text-white hover:underline"
                                   href={i.url}

src/components/MultiTableIcon.js

@@ -0,0 +1,78 @@
+import React from "react";
+
+const MultiTableIcon = () => {
+  return (
+    <svg
+      width="148"
+      height="75"
+      viewBox="0 0 148 75"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <rect
+        y="14.2764"
+        width="45.9196"
+        height="45.9196"
+        rx="5.33333"
+        fill="#03AFF1"
+      />
+      <g clipPath="url(#clip0_9686_2183)">
+        <path
+          d="M35.1977 24.0029H10.8029C9.61183 24.0029 8.65039 24.9644 8.65039 26.1554V48.3977C8.65039 49.5888 9.61183 50.5502 10.8029 50.5502H35.1977C36.3887 50.5502 37.3502 49.5888 37.3502 48.3977V26.1554C37.3502 24.9644 36.3887 24.0029 35.1977 24.0029ZM10.8029 31.8523H18.2935V35.9277H10.8029V31.8523ZM18.2935 38.0802V42.2273H10.8029V38.0802H18.2935ZM20.446 38.0802H35.1977V42.2273H20.446V38.0802ZM20.446 35.9277V31.8523H35.1977V35.9277H20.446ZM10.8029 44.3654H18.2935V48.3834H10.8029V44.3654ZM20.446 48.3977V44.3798H35.1977V48.3977H20.446Z"
+          fill="white"
+        />
+      </g>
+      <path
+        d="M57.9199 37.2363L89.9061 37.2363L89.9199 37.2363"
+        stroke="url(#paint0_linear_9686_2183)"
+        strokeWidth="4"
+        strokeLinecap="round"
+      />
+      <rect
+        x="101.92"
+        y="14.2764"
+        width="45.9196"
+        height="45.9196"
+        rx="5.33333"
+        fill="#04C1B3"
+      />
+      <g clipPath="url(#clip1_9686_2183)">
+        <path
+          d="M137.118 24.0029H112.723C111.532 24.0029 110.57 24.9644 110.57 26.1554V48.3977C110.57 49.5888 111.532 50.5502 112.723 50.5502H137.118C138.309 50.5502 139.27 49.5888 139.27 48.3977V26.1554C139.27 24.9644 138.309 24.0029 137.118 24.0029ZM112.723 31.8523H120.213V35.9277H112.723V31.8523ZM120.213 38.0802V42.2273H112.723V38.0802H120.213ZM122.366 38.0802H137.118V42.2273H122.366V38.0802ZM122.366 35.9277V31.8523H137.118V35.9277H122.366ZM112.723 44.3654H120.213V48.3834H112.723V44.3654ZM122.366 48.3977V44.3798H137.118V48.3977H122.366Z"
+          fill="white"
+        />
+      </g>
+      <defs>
+        <linearGradient
+          id="paint0_linear_9686_2183"
+          x1="89.9061"
+          y1="-72.352"
+          x2="57.9199"
+          y2="-72.352"
+          gradientUnits="userSpaceOnUse"
+        >
+          <stop stopColor="#AEB5CF" />
+          <stop offset="1" stopColor="#EFEFF5" />
+        </linearGradient>
+        <clipPath id="clip0_9686_2183">
+          <rect
+            width="28.6998"
+            height="28.6998"
+            fill="white"
+            transform="translate(8.65039 22.9263)"
+          />
+        </clipPath>
+        <clipPath id="clip1_9686_2183">
+          <rect
+            width="28.6998"
+            height="28.6998"
+            fill="white"
+            transform="translate(110.57 22.9263)"
+          />
+        </clipPath>
+      </defs>
+    </svg>
+  );
+};
+
+export default MultiTableIcon;

src/components/SequentialTableIcon.js

@@ -0,0 +1,214 @@
+import React from "react";
+
+const SequentialTableIcon = () => {
+  return (
+    <svg
+      width="206"
+      height="73"
+      viewBox="0 0 206 73"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <path
+        d="M25.3828 59.1494L25.3828 64.283C25.3828 67.5967 28.0691 70.283 31.3828 70.283L177.398 70.283C180.712 70.283 183.398 67.5967 183.398 64.283L183.398 59.1494"
+        stroke="url(#paint0_linear_9686_2189)"
+        strokeWidth="4"
+        strokeLinecap="round"
+      />
+      <path
+        d="M24.7113 13.23L24.7113 8.27615C24.7113 4.96244 27.3975 2.27614 30.7113 2.27614L100.088 2.27614C103.402 2.27614 106.088 4.96243 106.088 8.27614L106.088 13.23"
+        stroke="url(#paint1_linear_9686_2189)"
+        strokeWidth="4"
+        strokeLinecap="round"
+      />
+      <foreignObject x="-154" y="-144.77" width="362" height="362">
+        <div
+          xmlns="http://www.w3.org/1999/xhtml"
+          style={{
+            backdropFilter: "blur(77px)",
+            clipPath: "url(#bgblur_0_9686_2189_clip_path)",
+            height: "100%",
+            width: "100%",
+          }}
+        ></div>
+      </foreignObject>
+      <g data-figma-bg-blur-radius="154">
+        <rect
+          x="0.5"
+          y="9.72998"
+          width="53"
+          height="53"
+          rx="7.5"
+          fill="url(#paint2_linear_9686_2189)"
+        />
+        <rect
+          x="0.5"
+          y="9.72998"
+          width="53"
+          height="53"
+          rx="7.5"
+          fill="url(#paint3_linear_9686_2189)"
+        />
+        <rect
+          x="0.5"
+          y="9.72998"
+          width="53"
+          height="53"
+          rx="7.5"
+          fill="url(#paint4_radial_9686_2189)"
+          fillOpacity="0.2"
+        />
+        <rect
+          x="0.5"
+          y="9.72998"
+          width="53"
+          height="53"
+          rx="7.5"
+          stroke="url(#paint5_linear_9686_2189)"
+        />
+      </g>
+      <rect
+        x="4"
+        y="13.2305"
+        width="45.9196"
+        height="45.9196"
+        rx="5.33333"
+        fill="#04C1B3"
+      />
+      <g clipPath="url(#clip1_9686_2189)">
+        <path
+          d="M39.1977 22.957H14.8029C13.6118 22.957 12.6504 23.9185 12.6504 25.1095V47.3518C12.6504 48.5429 13.6118 49.5043 14.8029 49.5043H39.1977C40.3887 49.5043 41.3502 48.5429 41.3502 47.3518V25.1095C41.3502 23.9185 40.3887 22.957 39.1977 22.957ZM14.8029 30.8064H22.2935V34.8818H14.8029V30.8064ZM22.2935 37.0343V41.1814H14.8029V37.0343H22.2935ZM24.446 37.0343H39.1977V41.1814H24.446V37.0343ZM24.446 34.8818V30.8064H39.1977V34.8818H24.446ZM14.8029 43.3195H22.2935V47.3375H14.8029V43.3195ZM24.446 47.3518V43.3339H39.1977V47.3518H24.446Z"
+          fill="white"
+        />
+      </g>
+      <rect
+        x="81.9219"
+        y="13.2305"
+        width="45.9196"
+        height="45.9196"
+        rx="5.33333"
+        fill="#03AFF1"
+      />
+      <g clipPath="url(#clip2_9686_2189)">
+        <path
+          d="M117.12 22.957H92.7247C91.5337 22.957 90.5723 23.9185 90.5723 25.1095V47.3518C90.5723 48.5429 91.5337 49.5043 92.7247 49.5043H117.12C118.311 49.5043 119.272 48.5429 119.272 47.3518V25.1095C119.272 23.9185 118.311 22.957 117.12 22.957ZM92.7247 30.8064H100.215V34.8818H92.7247V30.8064ZM100.215 37.0343V41.1814H92.7247V37.0343H100.215ZM102.368 37.0343H117.12V41.1814H102.368V37.0343ZM102.368 34.8818V30.8064H117.12V34.8818H102.368ZM92.7247 43.3195H100.215V47.3375H92.7247V43.3195ZM102.368 47.3518V43.3339H117.12V47.3518H102.368Z"
+          fill="white"
+        />
+      </g>
+      <rect
+        x="159.844"
+        y="13.2305"
+        width="45.9196"
+        height="45.9196"
+        rx="5.33333"
+        fill="#959FBD"
+      />
+      <g clipPath="url(#clip3_9686_2189)">
+        <path
+          d="M195.041 22.957H170.647C169.456 22.957 168.494 23.9185 168.494 25.1095V47.3518C168.494 48.5429 169.456 49.5043 170.647 49.5043H195.041C196.232 49.5043 197.194 48.5429 197.194 47.3518V25.1095C197.194 23.9185 196.232 22.957 195.041 22.957ZM170.647 30.8064H178.137V34.8818H170.647V30.8064ZM178.137 37.0343V41.1814H170.647V37.0343H178.137ZM180.29 37.0343H195.041V41.1814H180.29V37.0343ZM180.29 34.8818V30.8064H195.041V34.8818H180.29ZM170.647 43.3195H178.137V47.3375H170.647V43.3195ZM180.29 47.3518V43.3339H195.041V47.3518H180.29Z"
+          fill="white"
+        />
+      </g>
+      <defs>
+        <clipPath
+          id="bgblur_0_9686_2189_clip_path"
+          transform="translate(154 144.77)"
+        >
+          <rect x="0.5" y="9.72998" width="53" height="53" rx="7.5" />
+        </clipPath>
+        <linearGradient
+          id="paint0_linear_9686_2189"
+          x1="183.398"
+          y1="75.4229"
+          x2="25.3828"
+          y2="75.4229"
+          gradientUnits="userSpaceOnUse"
+        >
+          <stop stopColor="#AEB5CF" />
+          <stop offset="1" stopColor="#EFEFF5" />
+        </linearGradient>
+        <linearGradient
+          id="paint1_linear_9686_2189"
+          x1="106.088"
+          y1="-2.78076"
+          x2="24.7113"
+          y2="-2.78076"
+          gradientUnits="userSpaceOnUse"
+        >
+          <stop stopColor="#AEB5CF" />
+          <stop offset="1" stopColor="#EFEFF5" />
+        </linearGradient>
+        <linearGradient
+          id="paint2_linear_9686_2189"
+          x1="27"
+          y1="9.22998"
+          x2="27"
+          y2="63.23"
+          gradientUnits="userSpaceOnUse"
+        >
+          <stop stopColor="white" stopOpacity="0.6" />
+          <stop offset="1" stopColor="white" stopOpacity="0.4" />
+        </linearGradient>
+        <linearGradient
+          id="paint3_linear_9686_2189"
+          x1="27"
+          y1="24.8693"
+          x2="-1.59697e-07"
+          y2="24.8693"
+          gradientUnits="userSpaceOnUse"
+        >
+          <stop stopColor="white" stopOpacity="0" />
+          <stop offset="1" stopColor="white" stopOpacity="0.5" />
+        </linearGradient>
+        <radialGradient
+          id="paint4_radial_9686_2189"
+          cx="0"
+          cy="0"
+          r="1"
+          gradientUnits="userSpaceOnUse"
+          gradientTransform="translate(27 36.23) rotate(90) scale(26.96 46.0488)"
+        >
+          <stop offset="0.477578" stopColor="#EFFDF9" />
+          <stop offset="1" stopColor="#04C1B3" />
+        </radialGradient>
+        <linearGradient
+          id="paint5_linear_9686_2189"
+          x1="2.5"
+          y1="10.23"
+          x2="53"
+          y2="62.23"
+          gradientUnits="userSpaceOnUse"
+        >
+          <stop stopColor="#04C1B3" />
+          <stop offset="1" stopColor="#BBF4E9" />
+        </linearGradient>
+        <clipPath id="clip1_9686_2189">
+          <rect
+            width="28.6998"
+            height="28.6998"
+            fill="white"
+            transform="translate(12.6504 21.8804)"
+          />
+        </clipPath>
+        <clipPath id="clip2_9686_2189">
+          <rect
+            width="28.6998"
+            height="28.6998"
+            fill="white"
+            transform="translate(90.5723 21.8804)"
+          />
+        </clipPath>
+        <clipPath id="clip3_9686_2189">
+          <rect
+            width="28.6998"
+            height="28.6998"
+            fill="white"
+            transform="translate(168.494 21.8804)"
+          />
+        </clipPath>
+      </defs>
+    </svg>
+  );
+};
+
+export default SequentialTableIcon;