open-vault/website/public/img/practice-pattern.svg
Alex Carpenter 927f46d5d7
Homepage redesign (#13159)
* homepage setup

* [Homepage] `<IoHomeHero />` component (#13160)

* init <Hero /> component

* adds loading animation

* updates variable naming

* makes index optional

* Update hero-pattern.svg

* prefix with IoHome

* updates usage

* [Homepage] `<IoHomePreFooter />` component (#13182)

* adds <IoHomePreFooter />

* adds interfaces

* [Homepage] `<IoHomeHero />` component (#13160)

* init <Hero /> component

* adds loading animation

* updates variable naming

* makes index optional

* Update hero-pattern.svg

* prefix with IoHome

* updates usage

* adds <IoHomePreFooter />

* adds interfaces

* adds key

* [Homepage] `<IoHomeCallToAction />` component (#13164)

* adding brand to cta

* cleanup homepage

* [Homepage] `<IoHomeVideo />` component (#13161)

* init <Video /> component

* adjusts sizing and border radius

* responsive styling

* fix hover svg gitter

* adjust play icon sizing

* include temp thumbnail

* dialog implementation

* conditionally display person and show helpers

* rename component

* updates dialog naming

* add homepage styling

* simplify background color

* page level styling

* [Homepage] `<IoHomeCaseStudies />` (#13190)

* adds <IoHomeCaseStudies />

* adds interface

* animate gradient

* update min-heights

* Homepage `<IoHomeCard />` component (#13151)

* init <Card /> component

* fixes heading color

* adds product logos and hover styles

* update naming

* simplifies inset spacing

* use ternary and add key

* removes repo link

* removes need for camelCase package

* adds keys

* adds in practice cards

* adds in practice background

* use case cards

* update min col sizing

* adds feature component (#13203)

* fixes card hover bug

* [Homepage] connect homepage to dato content (#13227)

* connect homepage to dato

* Check for internal link

* fix return types

* adds youtube video

* hook up meta tags and chunk cards

* removes chunking

* fix ts return

* fix prop naming

* fix return type

* mobile sizing adjustments

* [Homepage] Usecase pages (#13240)

* init usecase page

* updates use case call to action

* card container component

* themeing

* convert to using strictly props

* responsive spacing

* reworking sections component

* adds callout and hero patterns

* adds priority

* makes feature link optional

* [Homepage] connect use case template to dato (#13295)

* Start connecting to dato

* Fix spacing when no video is present

* Remove log

* adds images

* hook up cards

* pass eyebrow and products

* Delete index.tsx

* Use card container on homepage

* use react video player

* [Homepage] fix mobile video (#13309)

* Removing attributes

* update url

* spacing adjustments

* Allow previewing draft content (#13312)

* fix heading width

* fix feature max width

* adjust in practice padding

* increase icon sizing

* adjust icon alignment

* update eyebrow

* update hero pattern

* update usecase hero pattern

* add hover scale

* [Homepage] populate use case dropdown from use case pages (#13325)

* create standard layout

* removes unused subnav data

* removes static use case pages

* removes use cases style

* bump subnav and use hashicorp vault logo

* fixes use cases paths

* removes hashistack menu

* removes subnav top border

* conditionally render video callout avatar

* hook up data and conditionals

* update components to work with other products

* extract in practice section for reuse

* use Products type

* fix type error

* rework cta logic

* removes type

* updates accent method

* fix button prop

* refactor customer case study

* refactor case studies component

* cleanup margin

* refactor data props

* Spacing updates and introduce intro component

* adds intro interface

* Delete style.css

* fix intro description color

* add revalidate code to homepage

* bump subnav

* make stats optional

* adjust border radius based on customer story

* cleanup temp files

* redirect /home to homepage

* reorder resources

* fix: move heading and description

* fix: logo alignment

* fix: section background color

* feat: optional tutorial and docs links

* fix: removes case studies background

* formatting

* feat: sort use cases in nav

* fix: card overflow (#13429)

* fix: adjust overflow method

* fix: padding on desktop

* fix: scroll padding-right on mobile

* remove debugger

* increase last item width

* card container overflow method (#13434)

* use flex

* formatting

* add comment
2021-12-15 10:32:45 -05:00

40 lines
14 KiB
XML

<svg width="456" height="589" viewBox="0 0 456 589" fill="none" xmlns="http://www.w3.org/2000/svg">
<g opacity="0.7">
<path d="M152.798 90.4851C152.634 90.2694 152.319 90.1381 151.992 90.1381C151.828 90.1381 151.677 90.1663 151.526 90.2319C151.374 90.2976 151.261 90.3913 151.173 90.4945L68.6519 196.925L68.589 197L70.743 197L152.004 92.22L227.836 190.004L228 190.22L228 187.454L152.823 90.532L152.798 90.4851Z" fill="#FFEC6E"/>
<path d="M152.647 57.6715C152.596 57.634 152.533 57.5965 152.458 57.559C152.307 57.4933 152.155 57.4652 152.004 57.4652C151.84 57.4652 151.677 57.5027 151.538 57.559L151.45 57.5965L151.45 57.6059C151.337 57.6715 151.248 57.7466 151.185 57.831L43.32 196.925L43.257 197L45.4111 197L151.992 59.5471L227.836 157.341L228 157.547L228 154.771L152.798 57.8122C152.773 57.7747 152.722 57.7278 152.647 57.6715Z" fill="#FFEC6E"/>
<path d="M152.798 74.1486C152.634 73.933 152.319 73.8017 151.992 73.8017C151.828 73.8017 151.677 73.8298 151.526 73.8954C151.374 73.9611 151.261 74.0549 151.173 74.158L55.9797 196.925L55.9293 197L58.0707 197L152.004 75.8836L227.836 173.668L228 173.884L228 171.108L152.823 74.1862L152.798 74.1486Z" fill="#FFEC6E"/>
<path d="M152.798 25.1487C152.634 24.933 152.319 24.8017 151.992 24.8017C151.828 24.8017 151.677 24.8298 151.526 24.8954C151.374 24.9611 151.261 25.0549 151.173 25.158L17.9881 196.925L17.9251 197L20.0665 197L152.004 26.8836L227.836 124.668L228 124.884L228 122.108L152.823 25.1862L152.798 25.1487Z" fill="#FFEC6E"/>
<path d="M152.823 41.4101L152.735 41.4101L152.722 41.4007L152.71 41.3632L152.634 41.3351C152.609 41.3163 152.584 41.2976 152.546 41.2788C152.521 41.2694 152.495 41.2507 152.458 41.2319C152.42 41.2131 152.382 41.2038 152.344 41.1944C152.269 41.1663 152.193 41.1475 152.118 41.1475C152.067 41.1381 152.029 41.1381 151.992 41.1381C151.929 41.1381 151.866 41.1475 151.815 41.1569C151.79 41.1569 151.752 41.1663 151.702 41.1756L151.601 41.2038C151.576 41.2131 151.551 41.2131 151.526 41.2319L151.437 41.2694C151.387 41.2882 151.362 41.3163 151.337 41.3351L151.211 41.4101L151.211 41.4476C151.198 41.4664 151.173 41.4851 151.16 41.5039L30.6478 196.925L30.5848 197L32.7388 197L152.004 43.22L227.836 141.004L228 141.211L228 138.435L152.823 41.5132L152.823 41.4101ZM152.395 41.3726C152.395 41.3726 152.395 41.3632 152.395 41.3726V41.3726Z" fill="#FFEC6E"/>
<path d="M7.40688 197L152.004 10.5565L227.836 108.341L228 108.557L228 108.547L228 105.781L228 105.771L156.841 14.017L152.836 8.8497L152.81 8.8122C152.647 8.5965 152.332 8.46522 152.004 8.46522C151.84 8.46522 151.689 8.49334 151.538 8.55899C151.387 8.62463 151.274 8.71841 151.185 8.82157L5.31582 196.925L5.25284 197L7.40688 197Z" fill="#FFEC6E"/>
<g clip-path="url(#clip0_2_43)">
<path d="M81.3255 197.071L81.2708 197.001L83.4187 197.001L228 383.444L228 386.212L81.3255 197.071ZM144.601 197.001L146.748 197.001L228 301.775L228 304.543L144.656 197.071L144.601 197.001ZM106.604 197.001L108.752 197.001L228 350.775L228 353.543L106.659 197.071L106.604 197.001ZM93.9345 197.001L96.0818 197.001L228 367.107L228 369.875L93.9892 197.071L93.9345 197.001ZM119.268 197.001L121.415 197.001L228 334.439L228 337.207L119.322 197.071L119.268 197.001ZM131.937 197.001L134.085 197.001L228 318.107L228 320.875L131.992 197.071L131.937 197.001Z" fill="#FFEC6E"/>
<path d="M222.742 197.001L228 203.785L228 206.553L220.595 197.001L222.742 197.001ZM157.257 197.001L159.405 197.001L228 285.459L228 288.217L157.312 197.071L157.257 197.001ZM169.928 197.001L172.075 197.001L228 269.127L228 271.89L169.983 197.071L169.928 197.001ZM182.591 197.001L184.738 197.001L228 252.79L228 255.553L182.646 197.071L182.591 197.001ZM210.072 197.001L228 220.127L228 222.885L207.925 197.001L210.072 197.001ZM197.408 197.001L228 236.459L228 239.222L195.261 197.001L197.408 197.001Z" fill="#FFEC6E"/>
<path d="M37.1952 335.487C37.2769 335.383 37.3938 335.296 37.5344 335.236C37.675 335.175 37.8343 335.143 37.9966 335.143C38.1625 335.143 38.3256 335.176 38.4696 335.237C38.6147 335.301 38.7349 335.393 38.8184 335.502L83.3986 393.001L81.2514 393.001L37.9966 337.221L-3.37625e-05 386.216L-3.35201e-05 383.444L37.1693 335.525L37.1952 335.487ZM37.9966 255.553L-2.66228e-05 304.548L-2.63805e-05 301.776L37.1694 253.857L37.1952 253.819C37.2771 253.715 37.3941 253.628 37.5346 253.568C37.6752 253.507 37.8344 253.475 37.9966 253.475C38.1628 253.475 38.326 253.507 38.4702 253.569C38.6149 253.633 38.7348 253.725 38.8184 253.834L146.681 392.93L146.735 393.001L144.588 393.001L37.9966 255.553ZM37.1952 270.155C37.2771 270.051 37.3941 269.964 37.5346 269.904C37.6752 269.844 37.8344 269.812 37.9966 269.811C38.1627 269.811 38.326 269.844 38.4702 269.905C38.6149 269.97 38.7348 270.061 38.8184 270.17L134.067 393.001L131.919 393.001L37.9966 271.889L-2.8051e-05 320.884L-2.78086e-05 318.112L37.1693 270.194L37.1952 270.155ZM37.9966 286.138C38.1608 286.138 38.3223 286.17 38.4653 286.23C38.5941 286.285 38.7008 286.365 38.7747 286.461L121.341 392.93L121.395 393.001L119.248 393.001L37.9966 288.221L-2.94787e-05 337.216L-2.92368e-05 334.449L37.1952 286.482C37.2771 286.378 37.3941 286.292 37.5346 286.231C37.6752 286.171 37.8344 286.139 37.9966 286.138V286.138ZM37.9966 302.475C38.1613 302.475 38.3231 302.507 38.4665 302.567C38.5938 302.622 38.6994 302.701 38.7728 302.796L108.671 392.93L108.726 393.001L106.578 393.001L37.9966 304.553L-3.09065e-05 353.548L-3.06646e-05 350.781L37.1952 302.819C37.2771 302.714 37.3941 302.628 37.5346 302.568C37.6752 302.507 37.8344 302.475 37.9966 302.475V302.475ZM37.2241 319.126C37.2527 319.087 37.2909 319.053 37.3366 319.024C37.3703 318.999 37.4063 318.975 37.4443 318.953C37.4717 318.936 37.5019 318.92 37.5341 318.908C37.5682 318.89 37.6061 318.877 37.646 318.868C37.7157 318.842 37.7919 318.826 37.8699 318.822C37.9112 318.814 37.9539 318.81 37.9966 318.811C38.1584 318.808 38.318 318.839 38.4573 318.9L38.5459 318.94L38.5483 318.944C38.5863 318.963 38.6199 318.986 38.648 319.013C38.6609 319.022 38.6738 319.033 38.699 319.055C38.7279 319.071 38.7507 319.092 38.7648 319.116C38.7874 319.138 38.8076 319.161 38.8251 319.185L96.0624 393.001L93.9152 393.001L37.9966 320.885L-3.23348e-05 369.885L-3.20924e-05 367.112L37.2062 319.144L37.2241 319.126ZM37.6781 319.013L37.6795 319.013L37.6774 319.009L37.6781 319.013ZM37.6046 319.042L37.6055 319.042L37.6036 319.04L37.6046 319.042Z" fill="#FFEC6E"/>
</g>
<g clip-path="url(#clip1_2_43)">
<path d="M37.1952 450.514C37.2769 450.619 37.3939 450.705 37.5344 450.766C37.675 450.826 37.8343 450.858 37.9967 450.859C38.1626 450.859 38.3256 450.826 38.4696 450.765C38.6148 450.7 38.735 450.609 38.8184 450.499L83.3987 393.001L81.2515 393.001L37.9967 448.781L1.46656e-05 399.786L1.44233e-05 402.558L37.1694 450.476L37.1952 450.514ZM37.9966 530.449L7.52598e-06 481.454L7.28363e-06 484.226L37.1694 532.145L37.1952 532.183C37.2771 532.287 37.3941 532.374 37.5347 532.434C37.6752 532.494 37.8344 532.526 37.9966 532.527C38.1628 532.527 38.326 532.494 38.4703 532.433C38.6149 532.368 38.7348 532.277 38.8184 532.168L146.681 393.071L146.735 393.001L144.588 393.001L37.9966 530.449ZM37.1952 515.847C37.2771 515.951 37.3941 516.037 37.5347 516.098C37.6752 516.158 37.8344 516.19 37.9966 516.19C38.1628 516.19 38.326 516.158 38.4703 516.097C38.6149 516.032 38.7348 515.941 38.8184 515.831L134.067 393.001L131.919 393.001L37.9966 514.113L8.95415e-06 465.118L8.7118e-06 467.89L37.1694 515.808L37.1952 515.847ZM37.9966 499.863C38.1609 499.863 38.3223 499.832 38.4653 499.772C38.5941 499.716 38.7008 499.637 38.7747 499.54L121.341 393.071L121.396 393.001L119.248 393.001L37.9966 497.781L1.03819e-05 448.786L1.014e-05 451.553L37.1952 499.519C37.2771 499.624 37.3941 499.71 37.5347 499.77C37.6752 499.831 37.8344 499.863 37.9966 499.863ZM37.9967 483.527C38.1613 483.527 38.3231 483.495 38.4665 483.435C38.5938 483.38 38.6995 483.301 38.7728 483.205L108.671 393.071L108.726 393.001L106.578 393.001L37.9967 481.449L1.18097e-05 432.454L1.15678e-05 435.221L37.1952 483.183C37.2771 483.287 37.3941 483.374 37.5347 483.434C37.6752 483.494 37.8344 483.526 37.9967 483.527V483.527ZM37.2241 466.875C37.2527 466.914 37.2909 466.949 37.3367 466.978C37.3704 467.003 37.4063 467.027 37.4443 467.049C37.4718 467.066 37.5019 467.081 37.5341 467.094C37.5683 467.111 37.6061 467.125 37.6461 467.133C37.7158 467.16 37.7919 467.175 37.87 467.18C37.9112 467.188 37.9539 467.192 37.9967 467.19C38.1584 467.194 38.3181 467.163 38.4573 467.102L38.5459 467.061L38.5484 467.058C38.5864 467.039 38.62 467.016 38.6481 466.989C38.661 466.979 38.6739 466.969 38.6991 466.947C38.728 466.931 38.7508 466.91 38.7649 466.885C38.7875 466.864 38.8077 466.841 38.8252 466.816L96.0624 393.001L93.9152 393.001L37.9967 465.117L1.32379e-05 416.117L1.29956e-05 418.889L37.2063 466.858L37.2241 466.875ZM37.6781 466.989L37.6795 466.989L37.6774 466.993L37.6781 466.989ZM37.6046 466.959L37.6055 466.96L37.6036 466.962L37.6046 466.959Z" fill="#FFEC6E"/>
</g>
<g clip-path="url(#clip2_2_43)">
<path d="M265.195 138.486C265.277 138.382 265.394 138.295 265.534 138.235C265.675 138.175 265.834 138.143 265.997 138.142C266.163 138.142 266.326 138.175 266.47 138.236C266.615 138.301 266.735 138.392 266.818 138.502L311.399 196L309.251 196L265.997 140.22L228 189.215L228 186.443L265.169 138.524L265.195 138.486ZM265.997 58.5519L228 107.547L228 104.775L265.169 56.8563L265.195 56.8178C265.277 56.7136 265.394 56.6271 265.535 56.5668C265.675 56.5064 265.834 56.4745 265.997 56.474C266.163 56.4741 266.326 56.5065 266.47 56.5678C266.615 56.6325 266.735 56.7238 266.818 56.833L374.681 195.929L374.735 196L372.588 196L265.997 58.5519ZM265.195 73.1542C265.277 73.05 265.394 72.9634 265.535 72.9031C265.675 72.8428 265.834 72.8108 265.997 72.8103C266.163 72.8105 266.326 72.8428 266.47 72.9042C266.615 72.9689 266.735 73.0602 266.818 73.1693L362.067 196L359.919 196L265.997 74.8883L228 123.883L228 121.111L265.169 73.1926L265.195 73.1542ZM265.997 89.1375C266.161 89.1375 266.322 89.1691 266.465 89.2291C266.594 89.2845 266.701 89.3643 266.775 89.4604L349.341 195.929L349.395 196L347.248 196L265.997 91.2201L228 140.215L228 137.448L265.195 89.4814C265.277 89.3772 265.394 89.2906 265.535 89.2303C265.675 89.17 265.834 89.1381 265.997 89.1375V89.1375ZM265.997 105.474C266.161 105.474 266.323 105.506 266.466 105.566C266.594 105.621 266.699 105.7 266.773 105.795L336.671 195.929L336.726 196L334.578 196L265.997 107.552L228 156.547L228 153.78L265.195 105.818C265.277 105.714 265.394 105.627 265.535 105.567C265.675 105.506 265.834 105.474 265.997 105.474V105.474ZM265.224 122.125C265.253 122.086 265.291 122.052 265.337 122.023C265.37 121.998 265.406 121.974 265.444 121.952C265.472 121.935 265.502 121.919 265.534 121.907C265.568 121.889 265.606 121.876 265.646 121.868C265.716 121.841 265.792 121.825 265.87 121.821C265.911 121.813 265.954 121.809 265.997 121.81C266.158 121.807 266.318 121.838 266.457 121.899L266.546 121.939L266.548 121.943C266.586 121.962 266.62 121.985 266.648 122.012C266.661 122.021 266.674 122.032 266.699 122.054C266.728 122.07 266.751 122.091 266.765 122.115C266.787 122.137 266.808 122.16 266.825 122.184L324.062 196L321.915 196L265.997 123.884L228 172.884L228 170.112L265.206 122.143L265.224 122.125ZM265.678 122.012L265.679 122.012L265.677 122.008L265.678 122.012ZM265.605 122.042L265.606 122.041L265.604 122.039L265.605 122.042Z" fill="#FFEC6E"/>
</g>
<g clip-path="url(#clip3_2_43)">
<path d="M374.675 196.071L374.729 196.001L372.581 196.001L228 382.444L228 385.212L374.675 196.071ZM311.399 196.001L309.252 196.001L228 300.775L228 303.543L311.344 196.071L311.399 196.001ZM349.396 196.001L347.248 196.001L228 349.775L228 352.543L349.341 196.071L349.396 196.001ZM362.066 196.001L359.918 196.001L228 366.107L228 368.875L362.011 196.071L362.066 196.001ZM336.733 196.001L334.585 196.001L228 333.439L228 336.207L336.678 196.071L336.733 196.001ZM324.063 196.001L321.915 196.001L228 317.107L228 319.875L324.008 196.071L324.063 196.001Z" fill="#FFEC6E"/>
<path d="M418.805 334.487C418.723 334.383 418.606 334.296 418.466 334.236C418.325 334.176 418.166 334.143 418.003 334.143C417.837 334.143 417.674 334.176 417.53 334.237C417.385 334.302 417.265 334.393 417.182 334.503L372.601 392.001L374.749 392.001L418.003 336.221L456 385.216L456 382.444L418.831 334.525L418.805 334.487ZM418.003 254.553L456 303.548L456 300.776L418.831 252.857L418.805 252.819C418.723 252.715 418.606 252.628 418.465 252.568C418.325 252.507 418.166 252.475 418.003 252.475C417.837 252.475 417.674 252.507 417.53 252.569C417.385 252.633 417.265 252.725 417.182 252.834L309.319 391.93L309.265 392.001L311.412 392.001L418.003 254.553ZM418.805 269.155C418.723 269.051 418.606 268.964 418.465 268.904C418.325 268.844 418.166 268.812 418.003 268.811C417.837 268.811 417.674 268.844 417.53 268.905C417.385 268.97 417.265 269.061 417.182 269.17L321.933 392.001L324.081 392.001L418.003 270.889L456 319.884L456 317.112L418.831 269.194L418.805 269.155ZM418.003 285.138C417.839 285.138 417.678 285.17 417.535 285.23C417.406 285.285 417.299 285.365 417.225 285.461L334.659 391.93L334.604 392.001L336.752 392.001L418.003 287.221L456 336.216L456 333.449L418.805 285.482C418.723 285.378 418.606 285.292 418.465 285.231C418.325 285.171 418.166 285.139 418.003 285.138ZM418.003 301.475C417.839 301.475 417.677 301.507 417.534 301.567C417.406 301.622 417.301 301.701 417.227 301.796L347.329 391.93L347.274 392.001L349.422 392.001L418.003 303.553L456 352.548L456 349.781L418.805 301.819C418.723 301.715 418.606 301.628 418.465 301.568C418.325 301.507 418.166 301.475 418.003 301.475V301.475ZM418.776 318.126C418.747 318.087 418.709 318.053 418.663 318.024C418.63 317.999 418.594 317.975 418.556 317.953C418.528 317.936 418.498 317.92 418.466 317.908C418.432 317.89 418.394 317.877 418.354 317.868C418.284 317.842 418.208 317.826 418.13 317.822C418.089 317.814 418.046 317.81 418.003 317.811C417.842 317.808 417.682 317.839 417.543 317.9L417.454 317.94L417.452 317.944C417.414 317.963 417.38 317.986 417.352 318.013C417.339 318.022 417.326 318.033 417.301 318.055C417.272 318.071 417.249 318.092 417.235 318.116C417.212 318.138 417.192 318.161 417.175 318.185L359.938 392.001L362.085 392.001L418.003 319.885L456 368.885L456 366.112L418.794 318.144L418.776 318.126ZM418.322 318.013L418.321 318.013L418.323 318.009L418.322 318.013ZM418.395 318.042L418.394 318.042L418.396 318.04L418.395 318.042Z" fill="white"/>
</g>
</g>
<defs>
<clipPath id="clip0_2_43">
<rect width="228" height="196" fill="white" transform="translate(228 393.001) rotate(-180)"/>
</clipPath>
<clipPath id="clip1_2_43">
<rect width="228" height="196" fill="white" transform="translate(1.52588e-05 393.001)"/>
</clipPath>
<clipPath id="clip2_2_43">
<rect width="228" height="196" fill="white" transform="translate(456 196) rotate(-180)"/>
</clipPath>
<clipPath id="clip3_2_43">
<rect width="228" height="196" fill="white" transform="translate(456 392.001) rotate(-180)"/>
</clipPath>
</defs>
</svg>