Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

docs(PPDSC-2438): add about overview page #475

Merged
merged 17 commits into from
Nov 23, 2022
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -2281,7 +2281,7 @@ exports[`SiteHeader has first item highlighted (About) if we are on a section wi
aria-current="page"
class="emotion-143"
data-testid="styled-indicator"
href="/about/introduction"
href="/about/overview"
>
<span
class="emotion-144"
Expand Down Expand Up @@ -5336,7 +5336,7 @@ exports[`SiteHeader has first item highlighted (About) if we are on the /about s
aria-current="page"
class="emotion-143"
data-testid="styled-indicator"
href="/about/introduction"
href="/about/overview"
>
<span
class="emotion-144"
Expand Down Expand Up @@ -8281,7 +8281,7 @@ exports[`SiteHeader has no highlighted items if we are on the homepage 1`] = `
aria-current="false"
class="emotion-143"
data-testid="styled-indicator"
href="/about/introduction"
href="/about/overview"
>
<span
class="emotion-144"
Expand Down
145 changes: 81 additions & 64 deletions site/components/illustrations/about/contact-us-hero-illustration.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -5,79 +5,92 @@ import {Path} from '../path';
import {Rect} from '../rect';

export const ContactUsHeroIllustration: React.FC = () => {
const clip0 = getSSRId();
const filter0 = getSSRId();

return (
<Svg
width="1345"
width="1344"
height="759"
viewBox="0 0 1345 759"
viewBox="0 0 1344 759"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<Rect width="1344" height="759" fill="illustrationBackground020" />
<Path
d="M420.227 329.887C419.502 329.483 418.798 329.033 418.189 328.47C411.106 321.926 411.25 309.767 418.77 303.5L670.109 143.72C676.071 138.75 684.737 138.761 690.686 143.745L926.261 304.712C933.597 310.858 933.898 321.921 927.176 328.471C926.568 329.064 925.86 329.544 925.13 329.977L691.382 468.632C690.651 469.065 689.965 469.57 689.272 470.06C683.863 473.886 676.633 473.986 671.119 470.31C670.428 469.85 669.745 469.375 669.021 468.97L420.227 329.887Z"
fill="blue030"
/>
<Path
d="M420.227 329.887C419.502 329.483 418.798 329.033 418.189 328.47C411.106 321.926 411.25 309.767 418.77 303.5L670.109 143.72C676.071 138.75 684.737 138.761 690.686 143.745L926.261 304.712C933.597 310.858 933.898 321.921 927.176 328.471C926.568 329.064 925.86 329.544 925.13 329.977L691.382 468.632C690.651 469.065 689.965 469.57 689.272 470.06C683.863 473.886 676.633 473.986 671.119 470.31C670.428 469.85 669.745 469.375 669.021 468.97L420.227 329.887Z"
fill="blue030"
/>
<Path
d="M420.227 329.887C419.502 329.483 418.798 329.033 418.189 328.47C411.106 321.926 411.25 309.767 418.77 303.5L670.109 143.72C676.071 138.75 684.737 138.761 690.686 143.745L926.261 304.712C933.597 310.858 933.898 321.921 927.176 328.471C926.568 329.064 925.86 329.544 925.13 329.977L691.382 468.632C690.651 469.065 689.965 469.57 689.272 470.06C683.863 473.886 676.633 473.986 671.119 470.31C670.428 469.85 669.745 469.375 669.021 468.97L420.227 329.887Z"
fill="blue030"
/>
<g filter={`url(#${filter0})`}>
<g clipPath={`url(#${clip0})`}>
<Rect width="1344" height="759" fill="illustrationBackground020" />
<Path
d="M482 207C482 202.582 485.582 199 490 199H854C858.418 199 862 202.582 862 207V360.93C862 363.762 860.503 366.383 858.064 367.821L681.992 471.646C679.523 473.102 676.464 473.126 673.972 471.709L486.044 364.801C483.544 363.378 482 360.723 482 357.847V207Z"
fill="white"
d="M1345 0.626221H0V758.374H1345V0.626221Z"
fill="illustrationBackground020"
/>
<Path
d="M420.227 329.887C419.502 329.483 418.798 329.033 418.189 328.47C411.106 321.926 411.25 309.767 418.77 303.5L670.109 143.72C676.071 138.75 684.737 138.761 690.686 143.745L926.261 304.712C933.597 310.858 933.898 321.921 927.176 328.471C926.568 329.064 925.86 329.544 925.13 329.977L691.382 468.632C690.651 469.065 689.965 469.57 689.272 470.06C683.863 473.886 676.633 473.986 671.119 470.31C670.428 469.85 669.745 469.375 669.021 468.97L420.227 329.887Z"
fill="illustrationPalette030"
/>
<Path
d="M420.227 329.887C419.502 329.483 418.798 329.033 418.189 328.47C411.106 321.926 411.25 309.767 418.77 303.5L670.109 143.72C676.071 138.75 684.737 138.761 690.686 143.745L926.261 304.712C933.597 310.858 933.898 321.921 927.176 328.471C926.568 329.064 925.86 329.544 925.13 329.977L691.382 468.632C690.651 469.065 689.965 469.57 689.272 470.06C683.863 473.886 676.633 473.986 671.119 470.31C670.428 469.85 669.745 469.375 669.021 468.97L420.227 329.887Z"
fill="illustrationPalette030"
/>
<Path
d="M420.227 329.887C419.502 329.483 418.798 329.033 418.189 328.47C411.106 321.926 411.25 309.767 418.77 303.5L670.109 143.72C676.071 138.75 684.737 138.761 690.686 143.745L926.261 304.712C933.597 310.858 933.898 321.921 927.176 328.471C926.568 329.064 925.86 329.544 925.13 329.977L691.382 468.632C690.651 469.065 689.965 469.57 689.272 470.06C683.863 473.886 676.633 473.986 671.119 470.31C670.428 469.85 669.745 469.375 669.021 468.97L420.227 329.887Z"
fill="illustrationPalette030"
/>
<g filter={`url(#${filter0})`}>
<Path
d="M482 207C482 202.582 485.582 199 490 199H854C858.418 199 862 202.582 862 207V360.93C862 363.762 860.503 366.383 858.064 367.821L681.992 471.646C679.523 473.102 676.464 473.126 673.972 471.709L486.044 364.801C483.544 363.378 482 360.723 482 357.847V207Z"
fill="white"
/>
</g>
<g opacity="0.2">
<Path
d="M545 252C541.686 252 539 254.686 539 258C539 261.314 541.686 264 545 264H798C801.314 264 804 261.314 804 258C804 254.686 801.314 252 798 252H545Z"
fill="illustrationSubtle010"
/>
<Path
d="M545 288C541.686 288 539 290.686 539 294C539 297.314 541.686 300 545 300H798C801.314 300 804 297.314 804 294C804 290.686 801.314 288 798 288H545Z"
fill="illustrationSubtle010"
/>
<Path
d="M539 330C539 326.686 541.686 324 545 324H798C801.314 324 804 326.686 804 330C804 333.314 801.314 336 798 336H545C541.686 336 539 333.314 539 330Z"
fill="illustrationSubtle010"
/>
<Path
d="M545 360C541.686 360 539 362.686 539 366C539 369.314 541.686 372 545 372H798C801.314 372 804 369.314 804 366C804 362.686 801.314 360 798 360H545Z"
fill="illustrationSubtle010"
/>
</g>
<Path
d="M430.305 617C414.648 617 407.296 597.993 418.161 587.392C418.857 586.714 419.672 586.173 420.518 585.696L665.044 447.73C665.89 447.252 666.68 446.682 667.475 446.124C673.461 441.924 681.471 441.96 687.421 446.227C688.138 446.741 688.85 447.265 689.61 447.713L923.646 585.768C924.405 586.216 925.14 586.717 925.774 587.33C936.736 597.926 929.376 617 913.695 617H430.305Z"
fill="illustrationPalette050"
/>
<Path
d="M430.305 617C414.648 617 407.296 597.993 418.161 587.392C418.857 586.714 419.672 586.173 420.518 585.696L665.044 447.73C665.89 447.252 666.68 446.682 667.475 446.124C673.461 441.924 681.471 441.96 687.421 446.227C688.138 446.741 688.85 447.265 689.61 447.713L923.646 585.768C924.405 586.216 925.14 586.717 925.774 587.33C936.736 597.926 929.376 617 913.695 617H430.305Z"
fill="illustrationPalette050"
/>
<Path
d="M430.305 617C414.648 617 407.296 597.993 418.161 587.392C418.857 586.714 419.672 586.173 420.518 585.696L665.044 447.73C665.89 447.252 666.68 446.682 667.475 446.124C673.461 441.924 681.471 441.96 687.421 446.227C688.138 446.741 688.85 447.265 689.61 447.713L923.646 585.768C924.405 586.216 925.14 586.717 925.774 587.33C936.736 597.926 929.376 617 913.695 617H430.305Z"
fill="illustrationPalette050"
/>
<Path
d="M430.305 617C414.648 617 407.296 597.993 418.161 587.392C418.857 586.714 419.672 586.173 420.518 585.696L665.044 447.73C665.89 447.252 666.68 446.682 667.475 446.124C673.461 441.924 681.471 441.96 687.421 446.227C688.138 446.741 688.85 447.265 689.61 447.713L923.646 585.768C924.405 586.216 925.14 586.717 925.774 587.33C936.736 597.926 929.376 617 913.695 617H430.305Z"
stroke="#446BE4"
/>
<Path
d="M421.21 327.396C420.486 326.991 419.782 326.541 419.17 325.981C413.465 320.755 412.466 312.337 416.251 306C414.211 308.686 413 312.036 413 315.669V600.669C413 609.506 420.163 616.669 429 616.669H916C924.837 616.669 932 609.506 932 600.669V315.669C932 313.633 931.62 311.686 930.926 309.894C932.593 315.416 931.217 321.674 926.803 325.979C926.194 326.572 925.487 327.052 924.756 327.486L691.639 465.807C691.028 466.17 690.449 466.582 689.87 466.995L689.866 466.997L689.862 467C689.751 467.079 689.641 467.158 689.529 467.236C684.136 471.05 676.929 471.15 671.431 467.485L671.3 467.398L671.092 467.258C670.516 466.871 669.938 466.484 669.333 466.145L421.21 327.396Z"
fill="illustrationPalette040"
/>
<Path
d="M430.339 618.041C414.651 618.041 407.285 599.028 418.173 588.425C418.869 587.747 419.684 587.208 420.53 586.731L665.533 448.729C666.379 448.253 667.169 447.683 667.964 447.126C673.962 442.923 681.991 442.959 687.953 447.229C688.67 447.742 689.382 448.266 690.142 448.713L924.634 586.803C925.393 587.251 926.128 587.75 926.762 588.363C937.748 598.961 930.373 618.041 914.661 618.041H430.339Z"
fill="illustrationPalette060"
/>
<Path
d="M430.339 618.041C414.651 618.041 407.285 599.028 418.173 588.425C418.869 587.747 419.684 587.208 420.53 586.731L665.533 448.729C666.379 448.253 667.169 447.683 667.964 447.126C673.962 442.923 681.991 442.959 687.953 447.229C688.67 447.742 689.382 448.266 690.142 448.713L924.634 586.803C925.393 587.251 926.128 587.75 926.762 588.363C937.748 598.961 930.373 618.041 914.661 618.041H430.339Z"
fill="illustrationPalette060"
/>
<Path
d="M430.339 618.041C414.651 618.041 407.285 599.028 418.173 588.425C418.869 587.747 419.684 587.208 420.53 586.731L665.533 448.729C666.379 448.253 667.169 447.683 667.964 447.126C673.962 442.923 681.991 442.959 687.953 447.229C688.67 447.742 689.382 448.266 690.142 448.713L924.634 586.803C925.393 587.251 926.128 587.75 926.762 588.363C937.748 598.961 930.373 618.041 914.661 618.041H430.339Z"
fill="illustrationPalette060"
/>
</g>
<Path
d="M545 252C541.686 252 539 254.686 539 258C539 261.314 541.686 264 545 264H798C801.314 264 804 261.314 804 258C804 254.686 801.314 252 798 252H545Z"
fill="neutral030"
/>
<Path
d="M545 288C541.686 288 539 290.686 539 294C539 297.314 541.686 300 545 300H798C801.314 300 804 297.314 804 294C804 290.686 801.314 288 798 288H545Z"
fill="neutral030"
/>
<Path
d="M539 330C539 326.686 541.686 324 545 324H798C801.314 324 804 326.686 804 330C804 333.314 801.314 336 798 336H545C541.686 336 539 333.314 539 330Z"
fill="neutral030"
/>
<Path
d="M545 360C541.686 360 539 362.686 539 366C539 369.314 541.686 372 545 372H798C801.314 372 804 369.314 804 366C804 362.686 801.314 360 798 360H545Z"
fill="neutral030"
/>
<Path
d="M430.305 617C414.648 617 407.296 597.993 418.161 587.392C418.857 586.714 419.672 586.173 420.518 585.696L665.044 447.73C665.89 447.252 666.68 446.682 667.475 446.124C673.461 441.924 681.471 441.96 687.421 446.227C688.138 446.741 688.85 447.265 689.61 447.713L923.646 585.768C924.405 586.216 925.14 586.717 925.774 587.33C936.736 597.926 929.376 617 913.695 617H430.305Z"
fill="blue050"
/>
<Path
d="M430.305 617C414.648 617 407.296 597.993 418.161 587.392C418.857 586.714 419.672 586.173 420.518 585.696L665.044 447.73C665.89 447.252 666.68 446.682 667.475 446.124C673.461 441.924 681.471 441.96 687.421 446.227C688.138 446.741 688.85 447.265 689.61 447.713L923.646 585.768C924.405 586.216 925.14 586.717 925.774 587.33C936.736 597.926 929.376 617 913.695 617H430.305Z"
fill="blue050"
/>
<Path
d="M430.305 617C414.648 617 407.296 597.993 418.161 587.392C418.857 586.714 419.672 586.173 420.518 585.696L665.044 447.73C665.89 447.252 666.68 446.682 667.475 446.124C673.461 441.924 681.471 441.96 687.421 446.227C688.138 446.741 688.85 447.265 689.61 447.713L923.646 585.768C924.405 586.216 925.14 586.717 925.774 587.33C936.736 597.926 929.376 617 913.695 617H430.305Z"
fill="blue050"
/>
<Path
d="M421.21 327.396C420.486 326.991 419.782 326.541 419.17 325.981C413.465 320.755 412.466 312.337 416.251 306C414.211 308.686 413 312.036 413 315.669V600.669C413 609.506 420.163 616.669 429 616.669H916C924.837 616.669 932 609.506 932 600.669V315.669C932 313.633 931.62 311.686 930.926 309.894C932.593 315.416 931.217 321.674 926.803 325.979C926.194 326.572 925.487 327.052 924.756 327.486L691.639 465.807C691.028 466.17 690.449 466.582 689.87 466.995L689.866 466.997L689.862 467C689.751 467.079 689.641 467.158 689.529 467.236C684.136 471.05 676.929 471.15 671.431 467.485L671.3 467.398L671.092 467.258C670.516 466.871 669.938 466.484 669.333 466.145L421.21 327.396Z"
fill="blue040"
/>
<Path
d="M430.339 618.041C414.651 618.041 407.285 599.028 418.173 588.425C418.869 587.747 419.684 587.208 420.53 586.731L665.533 448.729C666.379 448.253 667.169 447.683 667.964 447.126C673.962 442.923 681.991 442.959 687.953 447.229C688.67 447.742 689.382 448.266 690.142 448.713L924.634 586.803C925.393 587.251 926.128 587.75 926.762 588.363C937.748 598.961 930.373 618.041 914.661 618.041H430.339Z"
fill="blue050"
/>
<Path
d="M430.339 618.041C414.651 618.041 407.285 599.028 418.173 588.425C418.869 587.747 419.684 587.208 420.53 586.731L665.533 448.729C666.379 448.253 667.169 447.683 667.964 447.126C673.962 442.923 681.991 442.959 687.953 447.229C688.67 447.742 689.382 448.266 690.142 448.713L924.634 586.803C925.393 587.251 926.128 587.75 926.762 588.363C937.748 598.961 930.373 618.041 914.661 618.041H430.339Z"
fill="blue050"
/>
<Path
d="M430.339 618.041C414.651 618.041 407.285 599.028 418.173 588.425C418.869 587.747 419.684 587.208 420.53 586.731L665.533 448.729C666.379 448.253 667.169 447.683 667.964 447.126C673.962 442.923 681.991 442.959 687.953 447.229C688.67 447.742 689.382 448.266 690.142 448.713L924.634 586.803C925.393 587.251 926.128 587.75 926.762 588.363C937.748 598.961 930.373 618.041 914.661 618.041H430.339Z"
fill="blue050"
/>
<defs>
<filter
id={filter0}
Expand All @@ -104,17 +117,21 @@ export const ContactUsHeroIllustration: React.FC = () => {
<feBlend
mode="normal"
in2="BackgroundImageFix"
result="effect1_dropShadow"
result="effect1_dropShadow_955_138389"
/>
<feBlend
mode="normal"
in="SourceGraphic"
in2="effect1_dropShadow"
in2="effect1_dropShadow_955_138389"
result="shape"
/>
</filter>
<clipPath id={clip0}>
<Rect width="1344" height="759" fill="white" />
</clipPath>
</defs>
</Svg>
);
};

export default ContactUsHeroIllustration;
Loading