You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@devlake.apache.org by yu...@apache.org on 2022/09/13 03:24:17 UTC
[incubator-devlake-website] 05/14: feat: Support section fix: header SVG -> PNG
This is an automated email from the ASF dual-hosted git repository.
yumeng pushed a commit to branch main
in repository https://gitbox.apache.org/repos/asf/incubator-devlake-website.git
commit 7cadc656e1347fb6e2cec0119b49892fe2d749e9
Author: ZiyuTao <zi...@merico.dev>
AuthorDate: Sun Sep 11 19:03:10 2022 +0800
feat: Support section
fix: header SVG -> PNG
---
src/components/Sections/Components.tsx | 32 ++++++++++++++++-
src/components/Sections/WhyDevlake.tsx | 57 ++++++++++++++++++++++++------
static/img/Homepage/WAD-1.png | Bin 0 -> 112976 bytes
static/img/Homepage/WAD-2.png | Bin 0 -> 46436 bytes
static/img/Homepage/WAD-3.png | Bin 0 -> 134404 bytes
static/img/Homepage/sup-1-jira.png | Bin 0 -> 3914 bytes
static/img/Homepage/sup-1-jira.svg | 20 +++++++++++
static/img/Homepage/sup-2-tapd.svg | 7 ++++
static/img/Homepage/sup-3-github.svg | 3 ++
static/img/Homepage/sup-4-gitlab.svg | 6 ++++
static/img/Homepage/sup-5-bitbucket.svg | 10 ++++++
static/img/Homepage/sup-6-gitee.png | Bin 0 -> 2777 bytes
static/img/Homepage/sup-6-gitee.svg | 3 ++
static/img/Homepage/sup-7-jenkins.png | Bin 0 -> 11353 bytes
static/img/Homepage/sup-7-jenkins.svg | 60 ++++++++++++++++++++++++++++++++
static/img/Homepage/sup-8-ghaction.png | Bin 0 -> 5731 bytes
static/img/Homepage/sup-8-ghaction.svg | 6 ++++
static/img/Homepage/sup-9-glci.png | Bin 0 -> 3723 bytes
static/img/Homepage/sup-9-glci.svg | 12 +++++++
static/img/Homepage/sup-A-feishu.png | Bin 0 -> 3453 bytes
static/img/Homepage/sup-A-feishu.svg | 9 +++++
tailwind.config.js | 2 +-
22 files changed, 215 insertions(+), 12 deletions(-)
diff --git a/src/components/Sections/Components.tsx b/src/components/Sections/Components.tsx
index 5abfdc453..dfc9f5e52 100644
--- a/src/components/Sections/Components.tsx
+++ b/src/components/Sections/Components.tsx
@@ -7,6 +7,12 @@ export const TextTitle = ({ children }: { children: React.ReactNode }) =>
{children}
</span>
+export const H3Title = ({ children }: { children: React.ReactNode }) =>
+ <span className="block font-inter
+ text-heading3 text-primary-800 font-semibold mb-[24px]">
+ {children}
+ </span>
+
export const TextDescription = ({ children }: { children: React.ReactNode }) =>
<p className="font-inter pr-[20px]
text-label18 text-neutral-500 ">
@@ -34,4 +40,28 @@ export const SvgImg = ({ svg: Svg }: { svg: React.ComponentType<React.SVGProps<S
"
>
<Svg role="img" />
- </div>
\ No newline at end of file
+ </div>
+export const SectionImg = ({ src }: { src: string }) => <img src={src} alt="" className="
+ w-[384px] h-[288px]
+" />
+
+export const InlineLink = ({ link, children }: { link: string, children: React.ReactNode }) =>
+ <a className="text-label16 text-primary-500 mt-[16px]"
+ href={link}>{children}
+ </a>
+
+export const BreakLine = () => <div className="
+ h-[2px] bg-neutral-100 mx-[140px]
+ " />
+
+export const Sup = ({ children, title }: { children: React.ReactNode, title: string }) =>
+ <span className="w-[100px] flex flex-col items-center">
+ {children}
+ <span className="font-inter text-label14
+ flex items-center h-[24px]
+ ">{title}</span>
+ </span>
+export const SupImg = ({ src }: { src: string }) =>
+ <img src={src} className='
+ w-[80px] h-[80px]
+ '/>
\ No newline at end of file
diff --git a/src/components/Sections/WhyDevlake.tsx b/src/components/Sections/WhyDevlake.tsx
index 06cef6346..6873c33f4 100644
--- a/src/components/Sections/WhyDevlake.tsx
+++ b/src/components/Sections/WhyDevlake.tsx
@@ -1,17 +1,53 @@
import React from "react";
import * as C from "./Components";
-import WAD1 from "@site/static/img/Homepage/WAD-1.svg";
-import WAD2 from "@site/static/img/Homepage/WAD-2.svg";
-import WAD3 from "@site/static/img/Homepage/WAD-3.svg";
+import WAD1 from "@site/static/img/Homepage/WAD-1.png";
+import WAD2 from "@site/static/img/Homepage/WAD-2.png";
+import WAD3 from "@site/static/img/Homepage/WAD-3.png";
+import Sup1 from "@site/static/img/Homepage/sup-1-jira.png";
+import Sup2 from "@site/static/img/Homepage/sup-2-tapd.svg";
+import Sup3 from "@site/static/img/Homepage/sup-3-github.svg";
+import Sup4 from "@site/static/img/Homepage/sup-4-gitlab.svg";
+import Sup5 from "@site/static/img/Homepage/sup-5-bitbucket.svg";
+import Sup6 from "@site/static/img/Homepage/sup-6-gitee.svg";
+import Sup7 from "@site/static/img/Homepage/sup-7-jenkins.svg";
+import Sup8 from "@site/static/img/Homepage/sup-8-ghaction.svg";
+import Sup9 from "@site/static/img/Homepage/sup-9-glci.svg";
+import SupA from "@site/static/img/Homepage/sup-A-feishu.png";
function Feature({ children }: { children: React.ReactNode }) {
return (
- <div className="flex w-full justify-between items-center space-y-7">
+ <div className="flex w-full justify-between items-center">
{children}
</div>
);
}
+function Supports() {
+ return (
+ <div className=" flex flex-col items-center
+ mt-[48px]
+ ">
+ <C.H3Title>Supported Data Sources</C.H3Title>
+ <div className="grid grid-cols-5 gap-x-[24px] gap-y-[16px]">
+ <C.Sup title="Jira"><C.SupImg src={Sup1} /></C.Sup>
+ <C.Sup title="TAPD"><Sup2 /></C.Sup>
+ <C.Sup title="GitHub"><Sup3 /></C.Sup>
+ <C.Sup title="GitLab"><Sup4 /></C.Sup>
+ <C.Sup title="BitBucket"><Sup5 /></C.Sup>
+ <C.Sup title="Gitee"><Sup6 /></C.Sup>
+ <C.Sup title="Jenkins"><Sup7 /></C.Sup>
+ <C.Sup title="GitHub Action"><Sup8 /></C.Sup>
+ <C.Sup title="GitLab CI"><Sup9 /></C.Sup>
+ <C.Sup title="Feishu"><C.SupImg src={SupA} /></C.Sup>
+ </div>
+ <div className="text-label18 font-inter text-neutral-500
+ mt-[48px]">
+ <C.InlineLink link="https://devlake.apache.org/docs/Overview/Roadmap">More data sources</C.InlineLink> comming soon...
+ </div>
+ </div>
+ )
+}
+
export function WhyDevlake() {
return (<section className="bg-white flex flex-col flex-nowrap py-5 items-stretch">
<span
@@ -22,11 +58,11 @@ export function WhyDevlake() {
<div
className="
flex flex-col
- px-[140px]
- space-y-5
+ px-[140px] mb-[72px]
+ space-y-7
">
<Feature>
- <C.SvgImg svg={WAD1} />
+ <C.SectionImg src={WAD1} />
<C.TextSection>
<C.TextTitle>Data Silos Connected</C.TextTitle>
<C.TextDescription>
@@ -45,10 +81,10 @@ export function WhyDevlake() {
<C.TextLink link="https://devlake.apache.org/docs/LiveDemo">Interact with pre-built dashboards</C.TextLink>
</C.TextDescription>
</C.TextSection>
- <C.SvgImg svg={WAD2} />
+ <C.SectionImg src={WAD2} />
</Feature>
<Feature>
- <C.SvgImg svg={WAD3} />
+ <C.SectionImg src={WAD3} />
<C.TextSection>
<C.TextTitle>A Highly Flexible Framework</C.TextTitle>
<C.TextDescription>
@@ -59,6 +95,7 @@ export function WhyDevlake() {
</C.TextSection>
</Feature>
</div>
+ <C.BreakLine />
+ <Supports />
</section>)
}
-
diff --git a/static/img/Homepage/WAD-1.png b/static/img/Homepage/WAD-1.png
new file mode 100644
index 000000000..4116f8321
Binary files /dev/null and b/static/img/Homepage/WAD-1.png differ
diff --git a/static/img/Homepage/WAD-2.png b/static/img/Homepage/WAD-2.png
new file mode 100644
index 000000000..7986dfede
Binary files /dev/null and b/static/img/Homepage/WAD-2.png differ
diff --git a/static/img/Homepage/WAD-3.png b/static/img/Homepage/WAD-3.png
new file mode 100644
index 000000000..c904e5e88
Binary files /dev/null and b/static/img/Homepage/WAD-3.png differ
diff --git a/static/img/Homepage/sup-1-jira.png b/static/img/Homepage/sup-1-jira.png
new file mode 100644
index 000000000..9949bab84
Binary files /dev/null and b/static/img/Homepage/sup-1-jira.png differ
diff --git a/static/img/Homepage/sup-1-jira.svg b/static/img/Homepage/sup-1-jira.svg
new file mode 100644
index 000000000..ca6262dfe
--- /dev/null
+++ b/static/img/Homepage/sup-1-jira.svg
@@ -0,0 +1,20 @@
+<svg width="80" height="81" viewBox="0 0 80 81" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_1090_3937)">
+<path d="M66.6261 39.1873L42.0489 14.5259L39.6674 12.1363L21.1663 30.7007L12.7061 39.1873C12.2835 39.6135 12.0463 40.1902 12.0463 40.7915C12.0463 41.3927 12.2835 41.9694 12.7061 42.3956L29.6086 59.3559L39.6674 69.4467L58.166 50.8822L58.4541 50.5956L66.6261 42.4084C66.8379 42.1975 67.006 41.9466 67.1207 41.6702C67.2354 41.3937 67.2944 41.0973 67.2944 40.7979C67.2944 40.4984 67.2354 40.202 67.1207 39.9256C67.006 39.6491 66.8379 39.3982 66.6261 39.1873ZM39.6674 49.2652L31.2226 40.7915L39.66 [...]
+<path d="M39.6673 32.3177C37.0114 29.6534 35.5142 26.0426 35.5028 22.2742C35.4913 18.5058 36.9665 14.886 39.6061 12.2054L21.128 30.7392L31.1842 40.8299L39.6673 32.3177Z" fill="url(#paint0_linear_1090_3937)"/>
+<path d="M48.1324 40.7683L39.6672 49.2651C42.3331 51.9409 43.8308 55.5696 43.8308 59.3533C43.8308 63.1369 42.3331 66.7656 39.6672 69.4414L58.1963 50.859L48.1324 40.7683Z" fill="url(#paint1_linear_1090_3937)"/>
+</g>
+<defs>
+<linearGradient id="paint0_linear_1090_3937" x1="38.1553" y1="23.7442" x2="26.3223" y2="35.5342" gradientUnits="userSpaceOnUse">
+<stop offset="0.18" stop-color="#0052CC"/>
+<stop offset="1" stop-color="#2684FF"/>
+</linearGradient>
+<linearGradient id="paint1_linear_1090_3937" x1="41.2786" y1="57.7363" x2="53.0886" y2="45.9692" gradientUnits="userSpaceOnUse">
+<stop offset="0.18" stop-color="#0052CC"/>
+<stop offset="1" stop-color="#2684FF"/>
+</linearGradient>
+<clipPath id="clip0_1090_3937">
+<rect width="54.5882" height="58" fill="white" transform="translate(12.7059 11.7915)"/>
+</clipPath>
+</defs>
+</svg>
diff --git a/static/img/Homepage/sup-2-tapd.svg b/static/img/Homepage/sup-2-tapd.svg
new file mode 100644
index 000000000..748b19199
--- /dev/null
+++ b/static/img/Homepage/sup-2-tapd.svg
@@ -0,0 +1,7 @@
+<svg width="80" height="81" viewBox="0 0 80 81" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M3.8166 31.2287C3.44515 31.5234 3.18112 31.9322 3.06533 32.392C2.94953 32.8518 2.98843 33.3369 3.176 33.7723L11.4756 54.7897C11.7822 55.0498 12.1408 55.2415 12.5275 55.352C12.9141 55.4625 13.3199 55.4892 13.7177 55.4303C15.2438 55.3267 24.6644 52.8773 24.6644 52.8773C24.6644 52.8773 25.7666 52.4063 25.9456 51.6055C26.1246 50.8048 24.3441 27.404 24.3441 27.404C24.3441 27.404 24.3441 25.9909 23.4021 26.1322C22.46 26.2735 3.8166 31.2287 3.8166 31.2287Z" fill="#E84441"/>
+<path d="M42.2341 33.3766C42.2341 33.3766 38.9934 32.7078 38.381 33.3766C37.6225 34.2725 37.1731 35.3892 37.0998 36.5608C37.0339 37.842 34.999 48.8076 36.4592 50.2489C37.2788 51.0403 47.3118 55.0064 49.6481 55.3455C51.9844 55.6846 52.5308 55.0252 52.5308 55.0252L60.5477 37.5123C60.5477 37.5123 61.0376 35.8637 60.2274 35.9202C59.4173 35.9767 42.2341 33.3766 42.2341 33.3766Z" fill="#9680B9"/>
+<path d="M28.3292 31.4737C27.3852 31.3522 26.4276 31.5477 25.6067 32.0295C25.0272 32.6921 24.5995 33.4734 24.3537 34.3187C23.5436 37.1449 21.7913 43.5509 21.7913 43.5509C21.7913 43.5509 21.2732 45.2937 22.4319 46.0945C23.5907 46.8952 39.1064 49.9192 39.1064 49.9192C39.3559 50.0408 39.6297 50.104 39.9072 50.104C40.1847 50.104 40.4585 50.0408 40.7079 49.9192C41.3391 49.467 40.2934 35.939 40.0956 34.1585C40.0593 33.5123 39.9193 32.8762 39.6811 32.2744C39.3985 31.6998 38.0325 31.4548 37.8441 [...]
+<path d="M58.3335 29.241C58.1828 29.1374 56.1008 28.8548 55.7711 29.5613C55.4414 30.2678 56.0914 52.5005 56.0914 52.5005C56.0914 52.5005 56.6378 54.102 57.3726 54.3846C58.1074 54.6672 69.2332 55.3267 69.2332 55.3267C69.2332 55.3267 70.1752 55.6658 70.5238 55.0064C70.8724 54.3469 76.9298 32.3969 76.9298 32.3969C76.9298 32.3969 77.382 30.5128 75.9878 30.5128C74.5935 30.5128 58.4937 29.3446 58.3335 29.241Z" fill="#F1931D"/>
+<path d="M22.8461 29.4766L4.88098 34.6014L5.82304 39.3117L12.0689 37.3239L15.5357 52.0107L21.2729 50.6164L17.8061 35.8449L23.807 34.2528L22.8461 29.4766ZM69.0071 34.2528L68.5832 37.9269L68.0462 37.7573C68.0462 37.7573 64.2309 36.9 62.6011 37.4276C61.5287 37.8114 60.5628 38.4447 59.7832 39.2751C59.0035 40.1055 58.4324 41.1093 58.1169 42.2038C57.2784 45.2278 57.9002 48.9207 61.3199 49.5331C63.2007 49.9297 65.1621 49.5927 66.8027 48.591L66.2563 50.3715H70.7593L73.821 34.6014L69.0165 34.2811 [...]
+</svg>
diff --git a/static/img/Homepage/sup-3-github.svg b/static/img/Homepage/sup-3-github.svg
new file mode 100644
index 000000000..c98343109
--- /dev/null
+++ b/static/img/Homepage/sup-3-github.svg
@@ -0,0 +1,3 @@
+<svg width="80" height="81" viewBox="0 0 80 81" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M40.1322 13.7915C33.5538 13.7848 27.1881 16.121 22.1757 20.3815C17.1633 24.642 13.832 30.5482 12.7787 37.0417C11.7255 43.5352 13.0191 50.1916 16.4277 55.818C19.8364 61.4444 25.1373 65.673 31.3805 67.746C32.774 68.0009 33.2668 67.1342 33.2668 66.4035C33.2668 65.6728 33.2668 64.0074 33.2668 61.6963C25.5348 63.3787 23.9034 57.9747 23.9034 57.9747C23.3904 56.2999 22.3007 54.8609 20.8276 53.9133C18.3295 52.2139 21.0315 52.2139 21.0315 52.2139C2 [...]
+</svg>
diff --git a/static/img/Homepage/sup-4-gitlab.svg b/static/img/Homepage/sup-4-gitlab.svg
new file mode 100644
index 000000000..c5e6e530f
--- /dev/null
+++ b/static/img/Homepage/sup-4-gitlab.svg
@@ -0,0 +1,6 @@
+<svg width="80" height="81" viewBox="0 0 80 81" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M65.1359 35.5726L65.0628 35.3857L57.985 16.9143C57.8409 16.5524 57.5859 16.2453 57.2567 16.037C56.9271 15.8324 56.5427 15.7339 56.1553 15.7547C55.768 15.7756 55.3963 15.9147 55.0906 16.1535C54.7887 16.3983 54.5694 16.7301 54.4624 17.1038L49.6835 31.725H30.3321L25.5531 17.1038C25.4496 16.727 25.2298 16.3925 24.9249 16.1481C24.6192 15.9093 24.2476 15.7701 23.8602 15.7493C23.4728 15.7285 23.0884 15.827 22.7588 16.0316C22.4309 16.2414 22.1764 16.548 22.0305 16.9089L14.9392 35.3749L1 [...]
+<path d="M65.136 35.5725L65.0628 35.3857C61.6143 36.0941 58.3646 37.5549 55.5455 39.6638L39.993 51.4176C45.2864 55.4221 49.8947 58.9014 49.8947 58.9014L60.7415 50.7786L60.7686 50.7569C63.0437 49.041 64.6997 46.6325 65.4874 43.8939C66.2751 41.1553 66.1518 38.2349 65.136 35.5725Z" fill="#FC6D26"/>
+<path d="M30.0992 58.9014L35.4332 62.9385L38.6824 65.3916C39.0624 65.6802 39.5265 65.8364 40.0037 65.8364C40.4809 65.8364 40.9449 65.6802 41.325 65.3916L44.5741 62.9385L49.9082 58.9014C49.9082 58.9014 45.3052 55.4113 40.001 51.4175C34.7076 55.4113 30.0992 58.9014 30.0992 58.9014Z" fill="#FCA326"/>
+<path d="M24.4538 39.6638C21.6367 37.5511 18.3878 36.0866 14.9392 35.3749L14.8688 35.5617C13.8495 38.2238 13.7235 41.1452 14.5098 43.8851C15.2962 46.6251 16.9522 49.0351 19.2281 50.7515L19.2525 50.7704L19.3174 50.8165L30.0992 58.8906L39.9929 51.4067L24.4538 39.6638Z" fill="#FC6D26"/>
+</svg>
diff --git a/static/img/Homepage/sup-5-bitbucket.svg b/static/img/Homepage/sup-5-bitbucket.svg
new file mode 100644
index 000000000..c39ff78db
--- /dev/null
+++ b/static/img/Homepage/sup-5-bitbucket.svg
@@ -0,0 +1,10 @@
+<svg width="80" height="81" viewBox="0 0 80 81" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M16.6227 18.3113C16.3889 18.3083 16.1573 18.3565 15.9441 18.4525C15.7309 18.5485 15.5413 18.6901 15.3886 18.8672C15.236 19.0442 15.1239 19.2526 15.0603 19.4776C14.9968 19.7026 14.9832 19.9388 15.0207 20.1696L21.8212 61.4534C21.9059 61.9586 22.166 62.4178 22.5556 62.7503C22.9453 63.0829 23.4396 63.2675 23.9519 63.2717H56.5768C56.9608 63.2766 57.3338 63.1435 57.6278 62.8965C57.9219 62.6495 58.1174 62.3051 58.1788 61.926L64.9793 20.1776C65.0168 19.9468 65.0032 19.7106 64.9397 19.48 [...]
+<path d="M62.8166 33.4182H47.7818L45.2586 48.1487H34.8455L22.5501 62.743C22.9398 63.08 23.4367 63.2674 23.9519 63.2717H56.5848C56.9688 63.2766 57.3418 63.1435 57.6358 62.8965C57.9299 62.6495 58.1254 62.3051 58.1868 61.926L62.8166 33.4182Z" fill="url(#paint0_linear_1170_3721)"/>
+<defs>
+<linearGradient id="paint0_linear_1170_3721" x1="66.293" y1="37.5434" x2="41.4458" y2="56.9357" gradientUnits="userSpaceOnUse">
+<stop offset="0.18" stop-color="#0052CC"/>
+<stop offset="1" stop-color="#2684FF"/>
+</linearGradient>
+</defs>
+</svg>
diff --git a/static/img/Homepage/sup-6-gitee.png b/static/img/Homepage/sup-6-gitee.png
new file mode 100644
index 000000000..fff84e589
Binary files /dev/null and b/static/img/Homepage/sup-6-gitee.png differ
diff --git a/static/img/Homepage/sup-6-gitee.svg b/static/img/Homepage/sup-6-gitee.svg
new file mode 100644
index 000000000..5b01c2983
--- /dev/null
+++ b/static/img/Homepage/sup-6-gitee.svg
@@ -0,0 +1,3 @@
+<svg width="80" height="81" viewBox="0 0 80 81" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M40 11.7915C56.0166 11.7915 69 24.775 69 40.7915C69 56.8081 56.0166 69.7915 40 69.7915C23.9834 69.7915 11 56.8081 11 40.7915C11 24.775 23.9834 11.7915 40 11.7915ZM54.6803 24.6804C54.68 24.6804 54.6797 24.6804 54.6794 24.6813H34.6301C28.6982 24.6813 23.889 29.4901 23.889 35.4224V55.4716C23.889 56.2626 24.5302 56.9037 25.3211 56.9037H46.4448C51.7835 56.9037 56.1114 52.5759 56.1114 47.2371V39.0027C56.1114 38.2117 55.4702 37.5706 54.6793 37.57 [...]
+</svg>
diff --git a/static/img/Homepage/sup-7-jenkins.png b/static/img/Homepage/sup-7-jenkins.png
new file mode 100644
index 000000000..019d6a1a3
Binary files /dev/null and b/static/img/Homepage/sup-7-jenkins.png differ
diff --git a/static/img/Homepage/sup-7-jenkins.svg b/static/img/Homepage/sup-7-jenkins.svg
new file mode 100644
index 000000000..20d6c7116
--- /dev/null
+++ b/static/img/Homepage/sup-7-jenkins.svg
@@ -0,0 +1,60 @@
+<svg width="80" height="81" viewBox="0 0 80 81" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M62.4488 39.6343C62.4488 52.3138 52.3922 62.5941 40.0001 62.5941C27.6079 62.5941 17.5534 52.3138 17.5534 39.6343C17.5534 26.9548 27.6038 16.6725 40.0001 16.6725C52.3964 16.6725 62.4488 26.9528 62.4488 39.6343Z" fill="#D33833"/>
+<path d="M18.4686 45.3235C18.4686 45.3235 16.8431 21.3766 38.906 20.6952L37.3668 18.1297L25.3953 22.1462L21.974 26.0785L18.9817 31.8087L17.2659 38.4789L17.779 42.9264" fill="#EF3D3A"/>
+<path d="M24.6258 23.979C20.5223 28.1886 18.2335 33.8398 18.2511 39.7185C18.2314 45.6001 20.5203 51.2546 24.6258 55.4663C26.6219 57.526 29.0112 59.1641 31.6521 60.2834C34.293 61.4027 37.1317 61.9805 40 61.9825C42.8683 61.9805 45.707 61.4027 48.3479 60.2834C50.9888 59.1641 53.3781 57.526 55.3742 55.4663C59.4804 51.2549 61.7701 45.6004 61.7509 39.7185C61.768 33.8395 59.4785 28.1883 55.3742 23.979C53.3778 21.9196 50.9884 20.2818 48.3476 19.1625C45.7068 18.0432 42.8682 17.4652 40 17.4627C37. [...]
+<path fill-rule="evenodd" clip-rule="evenodd" d="M49.4492 39.7616L46.0299 40.2747L41.4121 40.7878L38.4177 40.8719L35.5116 40.7878L33.2868 40.1023L31.3207 37.9658L29.7855 33.6045L29.4428 32.6625L27.3904 31.979L26.1939 30.0129L25.3339 27.1909L26.276 24.7096L28.4987 23.9399L30.2945 24.7999L31.1503 26.6819L32.1765 26.5095L32.5172 26.0826L32.1765 24.1164L32.0903 21.6351L32.6034 18.2159L32.5829 16.2621L34.1427 13.7684L36.8785 11.8023L41.6687 9.74991L46.9699 10.5154L51.5877 13.8505L53.7263 17.2 [...]
+<path fill-rule="evenodd" clip-rule="evenodd" d="M46.543 54.5592L34.313 55.0722V57.1246L35.3391 64.3079L34.826 64.9072L26.2759 61.9949L25.6766 60.9687L24.8208 51.3062L22.8546 45.4898L22.4277 44.1229L29.2683 39.4189L31.4068 38.563L33.2868 40.872L34.9164 42.3271L36.7984 42.9243L37.6522 43.1809L38.6783 47.6283L39.448 48.5683L41.4162 47.8849L40.0473 50.5365L47.4871 54.042L46.5471 54.555" fill="#335061"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M26.2759 24.7096L28.4986 23.94L30.2944 24.7999L31.1502 26.682L32.1764 26.5096L32.4329 25.4834L31.9198 23.5172L32.4329 18.8132L32.004 16.2477L33.5433 14.4519L36.8784 11.7982L35.9425 10.5155L31.2344 12.8244L29.2682 14.3637L28.1558 16.7567L26.4462 19.0656L25.9331 21.8035L26.2759 24.7096Z" fill="#6D6B6D"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M29.7854 16.6726C29.7854 16.6726 31.064 13.5119 36.1949 11.9686C41.3258 10.4252 36.4515 10.8562 36.4515 10.8562L30.8937 12.9948L28.7592 15.1333L27.8151 16.8429L29.7854 16.6726Z" fill="#DCD9D8"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M27.2158 24.1123C27.2158 24.1123 25.42 18.1256 32.2605 17.2698L32.004 16.2436L27.302 17.356L25.9331 21.8034L26.2759 24.7096L27.2158 24.1123Z" fill="#DCD9D8"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M29.9515 32.0653L31.0721 30.9796C31.2294 31.0082 31.3728 31.0882 31.4798 31.2071C31.5867 31.3259 31.6513 31.4769 31.6632 31.6363C31.7474 32.2356 32.0039 37.6231 35.6817 40.5313C36.0163 40.796 32.9459 40.1023 32.9459 40.1023L30.2081 35.8273" fill="#F7E4CD"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M45.6873 30.4398C45.6873 30.4398 45.8925 27.8477 46.5842 28.0468C46.7812 28.1022 46.9553 28.2191 47.0812 28.3804C47.2071 28.5418 47.2781 28.7391 47.284 28.9436C47.284 28.9436 45.5888 30.0417 45.6873 30.4398Z" fill="#F7E4CD"/>
+<path d="M52.7842 20.9476C52.7842 20.9476 51.3742 21.2452 51.2449 22.4869C51.1156 23.7286 52.7842 22.7434 53.0407 22.6572" fill="#F7E4CD"/>
+<path d="M42.4382 21.0338C42.4382 21.0338 40.5562 21.2903 40.5562 22.4869C40.5562 23.6834 42.6947 23.5992 43.2919 23.0861" fill="#F7E4CD"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M30.8114 26.5916C30.8114 26.5916 27.5605 24.6255 27.2198 26.5054C26.8791 28.3854 26.1074 29.7564 27.7329 31.7225L26.6205 31.3798L25.5943 28.7302L25.2495 26.1647L27.2157 24.1124L29.4384 24.2827L30.7211 25.3089L30.8114 26.5916Z" fill="#F7E4CD"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M32.3469 21.2041C32.3469 21.2041 33.8 13.6781 41.1557 12.2251C47.2101 11.0285 50.3913 12.4816 51.5878 13.8505C51.5878 13.8505 46.2045 7.4369 41.0736 9.40717C35.9427 11.3774 32.1766 14.9609 32.2607 17.2698C32.4064 21.2021 32.3469 21.2041 32.3469 21.2041Z" fill="#F7E4CD"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M52.1869 14.7044C52.1869 14.7044 49.7055 14.6202 49.6214 16.8429C49.6288 17.0803 49.6869 17.3133 49.7917 17.5264C49.7917 17.5264 51.7579 15.3037 52.9565 16.5002" fill="#F7E4CD"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M41.3278 17.7583C41.3278 17.7583 40.9009 14.3452 37.9906 16.3216C36.1086 17.6044 36.281 19.4002 36.6217 19.7429C36.9624 20.0857 36.8721 20.7691 37.1307 20.3012C37.3893 19.8332 37.3051 18.2878 38.2472 17.8609C39.1892 17.434 40.7305 16.9558 41.3257 17.7501" fill="#F7E4CD"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M33.2868 40.8719L25.2497 44.4636C25.2497 44.4636 28.5848 57.7198 26.8731 61.8245L25.6807 61.3956L25.5945 56.3509L23.3677 46.7725L22.4277 44.1229L30.8116 38.4789L33.2909 40.8719" fill="#49728B"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M34.114 48.1969L35.2551 49.5884V54.7193H33.8903C33.8903 54.7193 33.7199 51.1276 33.7199 50.7007C33.7199 50.2739 33.8903 48.7346 33.8903 48.7346" fill="#49728B"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M34.1426 55.495L30.2944 55.6674L31.4068 56.437L34.1426 56.8639" fill="#49728B"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M47.3129 54.6412L50.4756 54.555L51.2452 62.4217L47.9963 62.8507L47.3129 54.6412Z" fill="#335061"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M48.1664 54.6413L52.9566 54.3847C52.9566 54.3847 54.9228 49.4242 54.9228 49.1676C54.9228 48.9111 56.6324 41.9843 56.6324 41.9843L52.7842 37.9658L52.0146 37.2803L49.9622 39.3327V47.2856L48.1664 54.6413Z" fill="#335061"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M50.3093 54.0419L47.3129 54.6412L47.7398 57.0342C48.8501 57.5473 50.7321 56.1805 50.7321 56.1805" fill="#49728B"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M50.391 39.0762L56.3757 43.5236L56.5481 41.4713L52.0144 37.2803L50.391 39.0762Z" fill="#49728B"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M37.1102 71.4871L35.339 64.3038L34.4586 59.0025L34.3129 55.0682L42.3273 54.6413H47.3125L46.859 63.6203L47.6286 70.5471L47.5424 71.8298L41.0446 72.3429L37.1102 71.4871Z" fill="white"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M46.2041 54.5591C46.2041 54.5591 45.7772 63.452 47.0599 69.7815C45.1128 70.8918 42.9585 71.5903 40.7304 71.8339L47.9137 71.5773L48.7695 71.0642L47.7433 57.0384L47.4868 54.0461" fill="#DCD9D8"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M51.3906 61.7425L54.7257 60.8025L61.0532 60.4597L61.9952 57.5536L60.2835 52.5068L58.3133 52.2462L55.5775 53.102L52.9525 54.3847L51.5569 54.1282L50.4753 54.5592" fill="white"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M51.3351 60.0287C51.3351 60.0287 53.5579 59.0025 53.9006 59.0867L52.9606 54.3847L54.0709 53.9558C54.0709 53.9558 54.8406 58.4032 54.8406 58.9163C54.8406 58.9163 59.6287 59.1729 60.0577 59.1729C60.0577 59.1729 61.0839 57.2067 60.8273 55.1544L61.7673 57.8902L61.8535 59.4294L60.4846 61.4818L58.9453 61.8245L56.3798 61.7383L55.5261 60.626L52.5317 61.0549L51.5917 61.3956" fill="#DCD9D8"/>
+<path d="M47.9692 53.9578L46.0892 49.1676L44.121 46.3497C44.121 46.3497 44.55 45.1532 45.1472 45.1532H47.1154L48.9954 45.8366L48.825 49.0013L47.9692 53.9619" fill="white"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M48.339 52.3323C48.339 52.3323 45.9439 47.7145 45.9439 47.029C45.9439 47.029 46.3708 46.0028 46.9701 46.2594C47.5694 46.5159 48.8521 47.2014 48.8521 47.2014V45.5759L45.9439 44.9767L43.9777 45.2332L47.3128 53.102L47.9962 53.1861" fill="#DCD9D8"/>
+<path d="M37.8798 41.0444L35.5114 40.7878L33.2866 40.1023V40.872L34.3744 42.0705L37.7936 43.6098" fill="white"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M34.0565 41.3009C34.0565 41.3009 36.7082 42.4133 37.564 42.1567L37.6482 43.1829L35.2551 42.6719L33.8 41.6457L34.0565 41.3029" fill="#DCD9D8"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M51.3823 45.4405C50.0654 45.4193 48.7559 45.238 47.4828 44.9007C47.5608 44.4307 47.415 43.9689 47.532 43.6303C47.8522 43.4004 48.3879 43.4025 48.8722 43.3491C48.4076 43.1308 47.8839 43.0716 47.3822 43.1808C47.3719 42.8545 47.2262 42.6513 47.1359 42.3968C47.9569 42.1054 49.8779 40.1967 50.9615 40.8288C51.4787 41.1284 51.6963 42.8463 51.7373 43.6816C51.7702 44.3753 51.6737 45.0731 51.3925 45.4405" fill="#D33833"/>
+<path d="M51.3823 45.4405C50.0654 45.4193 48.7559 45.238 47.4828 44.9007C47.5608 44.4307 47.415 43.9689 47.532 43.6303C47.8522 43.4004 48.3879 43.4025 48.8722 43.3491C48.4076 43.1308 47.8839 43.0716 47.3822 43.1808C47.3719 42.8545 47.2262 42.6513 47.1359 42.3968C47.9569 42.1054 49.8779 40.1967 50.9615 40.8288C51.4787 41.1284 51.6963 42.8463 51.7373 43.6816C51.7599 44.3753 51.6634 45.0731 51.3823 45.4405Z" stroke="#D33833" stroke-width="2.5" stroke-miterlimit="5"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M44.4433 43.0659L44.431 43.3964C43.9774 43.694 43.2467 43.6919 42.748 43.9423C43.3788 43.9618 43.9978 44.118 44.5623 44.4C44.55 44.677 44.5397 44.9541 44.5295 45.2312C43.7085 45.7997 42.9409 46.6453 41.962 47.1789C41.5002 47.4313 39.8788 48.0799 39.3862 47.9649C39.1071 47.8993 39.0825 47.5545 38.9758 47.2302C38.7377 46.5324 38.1938 45.4221 38.1548 44.3733C38.0953 43.0475 37.9619 40.8268 39.3862 41.0895C40.5667 41.3385 41.7061 41.7531 42.77 [...]
+<path d="M44.4433 43.0659L44.431 43.3964C43.9774 43.694 43.2467 43.6919 42.748 43.9423C43.3788 43.9618 43.9978 44.118 44.5623 44.4C44.55 44.677 44.5397 44.9541 44.5295 45.2312C43.7085 45.7997 42.9409 46.6453 41.962 47.1789C41.5002 47.4313 39.8788 48.0799 39.3862 47.9649C39.1071 47.8993 39.0825 47.5545 38.9758 47.2302C38.7377 46.5324 38.1938 45.4221 38.1548 44.3733C38.0953 43.0475 37.9619 40.8268 39.3862 41.0895C40.5667 41.3385 41.7061 41.7531 42.7706 42.3209C43.3001 42.637 43.6162 43.004 [...]
+<path fill-rule="evenodd" clip-rule="evenodd" d="M45.2682 44.6503C45.141 43.9279 44.9953 43.7206 45.0507 43.0925C46.9758 41.8078 47.337 45.2968 45.2682 44.6503Z" fill="#D33833"/>
+<path d="M45.2682 44.6503C45.141 43.9279 44.9953 43.7206 45.0507 43.0925C46.9758 41.8078 47.337 45.2968 45.2682 44.6503Z" stroke="#D33833" stroke-width="2.5" stroke-miterlimit="5"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M48.0516 45.2353C48.0516 45.2353 47.4523 44.3794 47.8812 44.1229C48.3102 43.8663 48.735 44.1229 48.9916 43.696C49.2481 43.2691 48.9916 43.0105 49.0777 42.4974C49.1639 41.9843 49.5908 41.9002 50.0177 41.814C50.4446 41.7278 51.6432 41.5574 51.8135 41.9843L51.3005 40.4451L50.2743 40.1044L47.0254 41.9843L46.855 42.9264V44.8063" fill="#EF3D3A"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M39.0764 48.0572C38.9738 46.7218 38.8629 45.3878 38.7439 44.0551C38.5633 42.0643 39.2221 42.4132 40.9481 42.4132C41.2108 42.4132 42.5716 42.7273 42.668 42.9263C43.1339 43.8786 41.8881 43.6672 43.2057 44.3856C44.3181 44.991 46.2843 44.0161 45.8328 42.6698C45.5803 42.3701 44.5234 42.5754 44.1437 42.3784L42.1385 41.3399C41.2888 40.8986 39.3247 40.2562 38.4176 40.8719C36.121 42.4338 38.5633 46.3353 39.3822 47.9649" fill="#EF3D3A"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M41.3279 17.7583C38.9964 17.2164 37.8388 18.7331 37.1308 20.3094C36.5007 20.1554 36.7511 19.2975 36.9112 18.8604C37.3216 17.7131 39.0087 16.1923 40.3838 16.3976C40.9748 16.4858 41.7753 17.0276 41.3279 17.7624" fill="#231F20"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M52.6835 20.412H52.7943C53.3197 21.5079 53.7774 22.6696 54.4362 23.6321C53.9908 24.6583 51.0662 25.586 51.1114 23.7245C51.7435 23.4474 52.8353 23.6691 53.3977 23.314C53.0734 22.4253 52.6055 21.6721 52.6794 20.4079" fill="#231F20"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M42.5206 20.4407C43.0193 21.3581 43.1835 22.3206 43.8936 23.0123C44.2138 23.3242 44.8356 23.7039 44.5278 24.57C44.456 24.7753 43.9285 25.2309 43.6247 25.3212C42.5144 25.6475 39.9305 25.3889 40.8027 24.0036C41.7202 24.0467 42.9557 24.6008 43.6412 23.9338C43.1137 23.0903 42.1737 21.4238 42.5206 20.4448" fill="#231F20"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M52.2668 29.7522C50.5941 30.8256 48.7285 31.9934 45.9886 31.7224C45.6708 31.4179 45.4722 31.0099 45.4285 30.5719C45.3849 30.1339 45.4991 29.6948 45.7505 29.3335C46.0461 29.8425 45.8593 30.7701 46.6844 30.92C48.2401 31.1847 50.0482 29.9677 51.1667 29.5428C51.8604 28.375 51.1072 27.944 50.4833 27.1908C49.2047 25.6495 47.4889 23.7388 47.5505 21.4319C48.0677 21.0563 48.1128 22.0045 48.1867 22.1769C48.8537 23.7388 50.5346 25.7378 51.7619 27.075 [...]
+<path fill-rule="evenodd" clip-rule="evenodd" d="M30.2225 28.6214C29.6971 28.3217 29.5801 27.0041 28.9644 26.9671C28.0839 26.9138 28.244 28.6768 28.2481 29.7071C27.6365 29.157 27.5278 27.4679 27.9752 26.5977C27.4682 26.3473 27.2425 26.8707 26.9613 27.0554C27.3225 24.4304 30.7992 25.8384 30.2225 28.6214Z" fill="#231F20"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M53.3302 30.8441C52.5524 32.3259 51.4523 33.9575 49.1681 34.0048C49.1208 33.5266 49.086 32.8 49.1681 32.5106C50.9146 32.3423 51.9921 31.4537 53.3282 30.8441" fill="#231F20"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M42.389 31.8046C43.8462 32.5722 46.5225 32.6543 48.503 32.5968C48.5931 33.0909 48.6289 33.5933 48.6097 34.0951C46.0648 34.2223 43.0561 33.5922 42.389 31.8046Z" fill="#231F20"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M42.1119 33.2331C43.1196 35.7636 46.5819 35.4722 49.5004 35.4024C49.3672 35.773 49.0979 36.0791 48.7472 36.2582C47.8113 36.64 45.2315 36.9294 43.9323 36.2377C43.1114 35.8006 42.5798 34.8113 42.1283 34.2305C41.9108 33.9514 40.8251 33.2351 42.1119 33.2331Z" fill="#231F20"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M52.144 47.185C50.9619 49.2107 49.831 51.2897 48.4293 53.0752C49.0162 51.3472 49.2687 48.4533 49.3569 46.247C50.5883 45.6724 51.6412 46.3763 52.144 47.185Z" fill="#81B0C4"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M58.506 54.4626C57.1823 54.7274 56.2484 56.0142 54.9616 55.9321C55.6717 54.9306 56.9155 54.5099 58.506 54.4626Z" fill="#231F20"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M59.0909 56.5335C58.0114 56.6484 56.7451 56.8229 55.6491 56.7388C56.1684 55.9465 58.1632 56.2195 59.0909 56.5335Z" fill="#231F20"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M59.4645 58.3191C58.2516 58.3457 56.7452 58.3191 55.5917 58.2246C56.2731 57.4919 58.6703 57.9537 59.4645 58.3191Z" fill="#231F20"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M49.8638 63.2057C50.0382 64.7286 50.6416 66.272 50.5657 67.9405C49.8946 68.1663 49.5108 68.3633 48.6118 68.3613C48.5482 66.9451 48.3594 64.7779 48.4066 63.4356C48.8499 63.4643 49.5005 63.1196 49.8556 63.214" fill="#DCD9D8"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M47.9097 40.7653C47.294 41.1634 46.7809 41.6601 46.198 42.0849C44.9009 42.1486 44.1928 41.9946 43.2405 41.2496C43.2549 41.1901 43.3514 41.2168 43.3555 41.1429C44.7429 41.7586 46.5079 40.8905 47.9097 40.7653Z" fill="#F0D6B7"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M40.6237 50.2266C41.0034 48.5847 42.4975 47.7186 43.8562 46.8094C45.2559 48.5868 46.1138 50.871 47.0456 53.0773C44.829 52.4103 42.5653 51.3267 40.6237 50.2266Z" fill="#81B0C4"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M48.4148 63.4274C48.3594 64.7778 48.5482 66.9451 48.62 68.3531C49.5189 68.3531 49.9027 68.1581 50.5738 67.9323C50.6498 66.2638 50.0464 64.7204 49.8719 63.1975C49.5087 63.1113 48.8581 63.4561 48.4148 63.4274ZM34.43 55.7434C35.0231 61.1883 35.881 65.765 37.4531 70.5881C40.9421 71.6471 45.1556 71.7395 48.2424 70.7831C47.6759 68.0616 47.9222 64.7491 47.5918 61.845C47.3414 59.6634 47.4686 57.4673 47.1279 55.2405C43.3865 54.4606 38.1016 55.0579 [...]
+<path fill-rule="evenodd" clip-rule="evenodd" d="M40.0697 32.4531C40.1826 32.3033 40.8024 32.0755 41.6685 32.4921C41.6685 32.4921 40.6423 32.6625 40.7265 34.3741L40.2996 34.2879C40.2996 34.2879 39.8583 32.7364 40.0697 32.4531Z" fill="#F7E4CD"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M47.5691 47.1583C47.5695 47.2518 47.5422 47.3432 47.4905 47.4211C47.4389 47.499 47.3653 47.5598 47.2791 47.5959C47.1929 47.6319 47.0979 47.6416 47.0062 47.6236C46.9145 47.6056 46.8302 47.5608 46.764 47.4949C46.6978 47.4289 46.6526 47.3448 46.6342 47.2532C46.6158 47.1616 46.6251 47.0666 46.6607 46.9802C46.6964 46.8938 46.7569 46.82 46.8346 46.768C46.9122 46.7161 47.0036 46.6883 47.097 46.6883C47.2219 46.6883 47.3416 46.7378 47.4301 46.8259C [...]
+<path fill-rule="evenodd" clip-rule="evenodd" d="M48.039 49.3379C48.0394 49.4315 48.012 49.523 47.9603 49.601C47.9086 49.6789 47.8349 49.7397 47.7485 49.7757C47.6622 49.8117 47.5671 49.8212 47.4754 49.8031C47.3836 49.7849 47.2993 49.7399 47.2332 49.6738C47.167 49.6076 47.122 49.5233 47.1039 49.4316C47.0857 49.3398 47.0953 49.2447 47.1312 49.1584C47.1672 49.0721 47.228 48.9984 47.306 48.9467C47.3839 48.8949 47.4755 48.8675 47.569 48.868C47.6936 48.868 47.8132 48.9175 47.9013 49.0056C47.98 [...]
+</svg>
diff --git a/static/img/Homepage/sup-8-ghaction.png b/static/img/Homepage/sup-8-ghaction.png
new file mode 100644
index 000000000..254ebf395
Binary files /dev/null and b/static/img/Homepage/sup-8-ghaction.png differ
diff --git a/static/img/Homepage/sup-8-ghaction.svg b/static/img/Homepage/sup-8-ghaction.svg
new file mode 100644
index 000000000..413cdd9a5
--- /dev/null
+++ b/static/img/Homepage/sup-8-ghaction.svg
@@ -0,0 +1,6 @@
+<svg width="80" height="81" viewBox="0 0 80 81" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M22.5634 10.7915C29.5019 10.7915 35.1269 16.4147 35.1269 23.3518C35.1269 30.1698 29.6919 35.715 22.9176 35.9031C22.9176 36.48 22.943 37.5699 23.2695 38.2279C23.7224 39.1407 26.4392 40.84 29.1035 40.84H30.0607C30.6622 36.5577 34.3396 33.2622 38.7887 33.2622C43.2199 33.2622 46.8864 36.5309 47.5101 40.7879H52.4622C53.0861 36.5309 56.7525 33.2622 61.1836 33.2622C66.0527 33.2622 69.9999 37.2083 69.9999 42.0763C69.9999 46.9441 66.0527 50.8902 61.1836 50.8902C56.7525 50.8902 53.0859 47 [...]
+<path d="M41.2251 63.2631C41.9366 63.2631 42.5137 62.6864 42.5137 61.9749C42.5137 61.2636 41.9366 60.6867 41.2251 60.6867C40.5136 60.6867 39.9366 61.2636 39.9366 61.9749C39.9366 62.6864 40.5136 63.2631 41.2251 63.2631Z" fill="#85B3DF"/>
+<path d="M36.2919 63.2631C37.0034 63.2631 37.5805 62.6864 37.5805 61.9749C37.5805 61.2636 37.0034 60.6867 36.2919 60.6867C35.5804 60.6867 35.0034 61.2636 35.0034 61.9749C35.0034 62.6864 35.5804 63.2631 36.2919 63.2631Z" fill="#85B3DF"/>
+<path d="M61.1837 68.215C57.7379 68.215 54.9447 65.4223 54.9447 61.9774C54.9447 58.5324 57.7379 55.7397 61.1837 55.7397C64.6293 55.7397 67.4229 58.5324 67.4229 61.9774C67.4229 65.4223 64.6293 68.215 61.1837 68.215ZM61.1837 53.1633C56.7526 53.1633 53.086 56.4322 52.4623 60.6891H51.0204C50.3909 60.6891 49.8802 61.2661 49.8802 61.9774C49.8802 62.6889 50.3909 63.2656 51.0204 63.2656H52.4623C53.086 67.5226 56.7526 70.7915 61.1837 70.7915C66.0527 70.7915 70 66.8452 70 61.9774C70 57.1096 66.052 [...]
+</svg>
diff --git a/static/img/Homepage/sup-9-glci.png b/static/img/Homepage/sup-9-glci.png
new file mode 100644
index 000000000..7c0790266
Binary files /dev/null and b/static/img/Homepage/sup-9-glci.png differ
diff --git a/static/img/Homepage/sup-9-glci.svg b/static/img/Homepage/sup-9-glci.svg
new file mode 100644
index 000000000..4f6fecb97
--- /dev/null
+++ b/static/img/Homepage/sup-9-glci.svg
@@ -0,0 +1,12 @@
+<svg width="80" height="81" viewBox="0 0 80 81" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M57.4018 21.5107L57.3512 21.3814L52.4512 8.59349C52.3514 8.34292 52.1749 8.13034 51.9469 7.98615C51.7188 7.84451 51.4526 7.77629 51.1845 7.79071C50.9163 7.80512 50.659 7.90147 50.4473 8.06675C50.2383 8.23629 50.0865 8.46598 50.0124 8.72471L46.7039 18.8471H33.3068L29.9983 8.72471C29.9267 8.46384 29.7745 8.23225 29.5634 8.06301C29.3517 7.89772 29.0945 7.80137 28.8263 7.78696C28.5581 7.77254 28.292 7.84076 28.0638 7.9824C27.8368 8.12764 27.6606 8.33989 27.5596 8.58974L22.6502 21.37 [...]
+<path d="M57.4018 21.5107L57.3512 21.3814C54.9637 21.8718 52.7139 22.8831 50.7623 24.3431L39.9951 32.4803C43.6598 35.2527 46.8502 37.6615 46.8502 37.6615L54.3595 32.038L54.3782 32.023C55.9533 30.8351 57.0998 29.1676 57.6451 27.2717C58.1904 25.3757 58.105 23.3539 57.4018 21.5107Z" fill="#FC6D26"/>
+<path d="M33.1456 37.6615L36.8384 40.4564L39.0878 42.1547C39.3509 42.3545 39.6722 42.4626 40.0026 42.4626C40.3329 42.4626 40.6542 42.3545 40.9173 42.1547L43.1668 40.4564L46.8595 37.6615C46.8595 37.6615 43.6729 35.2452 40.0007 32.4803C36.336 35.2452 33.1456 37.6615 33.1456 37.6615Z" fill="#FCA326"/>
+<path d="M29.2373 24.3431C27.2869 22.8805 25.0377 21.8667 22.6502 21.3739L22.6015 21.5032C21.8958 23.3462 21.8086 25.3687 22.353 27.2656C22.8974 29.1625 24.0438 30.831 25.6195 32.0192L25.6363 32.0324L25.6813 32.0642L33.1456 37.654L39.9951 32.4729L29.2373 24.3431Z" fill="#FC6D26"/>
+<path d="M19.72 64.8179C19.72 66.8379 18.66 67.6979 16.48 67.6979H13.24C11.06 67.6979 10 66.8579 10 64.8179V57.0979C10 55.0779 11.06 54.2179 13.24 54.2179H16.5C18.66 54.2179 19.74 55.0779 19.74 57.0979V57.6579C19.74 57.7979 19.64 57.9379 19.5 57.9779L18.16 58.3379C17.96 58.3979 17.74 58.2379 17.74 58.0179V57.4579C17.74 56.4779 17.42 56.0579 16.24 56.0579H13.5C12.32 56.0579 11.98 56.4779 11.98 57.4579V64.4579C11.98 65.4379 12.32 65.8579 13.5 65.8579H16.22C17.4 65.8579 17.72 65.4379 17.72 [...]
+<path d="M22.56 65.8379H25.98V56.0379H22.8C22.62 56.0379 22.48 55.8979 22.48 55.7179V54.5379C22.48 54.3579 22.62 54.2179 22.8 54.2179H31.16C31.34 54.2179 31.48 54.3579 31.48 54.5379V55.7179C31.48 55.8979 31.34 56.0379 31.16 56.0379H27.96V65.8379H31.38C31.56 65.8379 31.7 65.9779 31.7 66.1579V67.3579C31.7 67.5379 31.56 67.6779 31.38 67.6779H22.56C22.38 67.6779 22.24 67.5379 22.24 67.3579V66.1579C22.22 65.9979 22.38 65.8379 22.56 65.8379Z" fill="#251B3F"/>
+<path d="M57.76 64.8179C57.76 66.8379 56.7 67.6979 54.52 67.6979H51.26C49.1 67.6979 48.02 66.8579 48.02 64.8179V57.0979C48.02 55.0779 49.08 54.2179 51.26 54.2179H54.52C56.68 54.2179 57.76 55.0779 57.76 57.0979V57.6579C57.76 57.7979 57.66 57.9379 57.52 57.9779L56.18 58.3379C55.98 58.3979 55.76 58.2379 55.76 58.0179V57.4579C55.76 56.4779 55.44 56.0579 54.26 56.0579H51.54C50.36 56.0579 50.02 56.4779 50.02 57.4579V64.4579C50.02 65.4379 50.36 65.8579 51.54 65.8579H54.26C55.44 65.8579 55.76 65 [...]
+<path d="M70 64.8179C70 66.8379 69 67.6979 66.82 67.6979H60.56C60.38 67.6979 60.24 67.5579 60.24 67.3779V54.5579C60.24 54.3779 60.38 54.2379 60.56 54.2379H66.82C68.98 54.2379 70 55.0779 70 57.1179V64.8179ZM68 57.4579C68 56.4779 67.68 56.0579 66.5 56.0579H62.22V65.8579H66.5C67.68 65.8579 68 65.4379 68 64.4579V57.4579Z" fill="#251B3F"/>
+<path d="M42.6 46.4779C42.48 46.4379 42.36 46.4779 42.3 46.5779L35.92 58.2179C35.7 58.6379 35.76 59.1379 36.08 59.4779L39.14 62.7179L42.74 46.7379C42.78 46.6379 42.7 46.5179 42.6 46.4779Z" fill="#D72D20"/>
+<path d="M43.38 60.7579L40.32 57.5179L36.72 73.4979C36.7 73.6179 36.76 73.7379 36.86 73.7779C36.88 73.7979 36.92 73.7979 36.94 73.7979C37.02 73.7979 37.1 73.7579 37.14 73.6779L43.52 62.0379C43.78 61.6179 43.72 61.0979 43.38 60.7579Z" fill="#F8911E"/>
+</svg>
diff --git a/static/img/Homepage/sup-A-feishu.png b/static/img/Homepage/sup-A-feishu.png
new file mode 100644
index 000000000..4e10b21c3
Binary files /dev/null and b/static/img/Homepage/sup-A-feishu.png differ
diff --git a/static/img/Homepage/sup-A-feishu.svg b/static/img/Homepage/sup-A-feishu.svg
new file mode 100644
index 000000000..e008c377b
--- /dev/null
+++ b/static/img/Homepage/sup-A-feishu.svg
@@ -0,0 +1,9 @@
+<svg width="80" height="81" viewBox="0 0 80 81" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+<rect x="11" y="11.7915" width="58" height="58" fill="url(#pattern0)"/>
+<defs>
+<pattern id="pattern0" patternContentUnits="objectBoundingBox" width="1" height="1">
+<use xlink:href="#image0_1170_3599" transform="scale(0.00142857)"/>
+</pattern>
+<image id="image0_1170_3599" width="700" height="700" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAArwAAAK8CAYAAAANumxDAAAgAElEQVR4nO3dXZDd9Xkn+Od/TtMNGgkOEhMGKokb7wyzssBuSaQKe7BpUWXsdk2NhS+2Zm8GQWWTys1y4HIvgkRymUStrUpRMamo2av1XgxKucrYzni6nRdPqgLp9tiYOLnoZpMNwwyy2kaRkeg+v73obhBCL/1yzvn9Xz6fKkpCEtJzhb79nOf3PBEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA [...]
+</defs>
+</svg>
diff --git a/tailwind.config.js b/tailwind.config.js
index a9fad24be..8102ec317 100644
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -45,7 +45,7 @@ module.exports = {
heading0: ['48px', { lineHeight: '64px' }],
heading1: ['32px', { lineHeight: '40px' }],
heading2: ['24px', { lineHeight: '30px' }],
- heading3: ['20px', { lineHeight: 1.25 }],
+ heading3: ['20px', { lineHeight: '25px' }],
heading4: ['16px', { lineHeight: 1.25 }],
label14: ['14px', { lineHeight: 1.43 }],
label16: ['16px', { lineHeight: '24px' }],