Skip to content

Commit

Permalink
fixing issues with mobile and adding newsltter back in
Browse files Browse the repository at this point in the history
  • Loading branch information
David Boyne authored and David Boyne committed Aug 19, 2024
1 parent 4fccfd7 commit 12299b0
Show file tree
Hide file tree
Showing 8 changed files with 106 additions and 43 deletions.
8 changes: 5 additions & 3 deletions src/components/Landing/Companies.tsx

Large diffs are not rendered by default.

15 changes: 10 additions & 5 deletions src/components/Landing/CrossCloud.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -1048,7 +1048,7 @@ const platforms = [
}
]

export default function Example() {
export default function CrossCloud() {

const [selectedPlatform, setSelectedPlatform] = React.useState(platforms[0])

Expand All @@ -1064,9 +1064,12 @@ export default function Example() {
Wing platforms specify how and where your application is deployed. They determine both the cloud environment and the provisioning engine that the code will be deployed with.
</p>
</div>
<div className="mx-auto mt-16 max-w-2xl sm:mt-20 lg:mt-12 lg:max-w-none">
<div className="mx-auto mt-8 max-w-2xl sm:mt-20 lg:mt-12 lg:max-w-none">
<div className='grid grid-cols-12 gap-8 '>
<div className="col-span-5 bg-gray-300 dark:bg-gradient-to-tl from-wing via-wing/45 to-wing/80 transition-all shadow-[0_10px_20px_0_#3737373d] dark:shadow-[0_10px_100px_0_#2ad5c15c] p-[2px] rounded-md max-h-[550px]" >

<span className='col-span-12 -mb-4 block md:hidden font-bold'>1. Write your code</span>
<div className="col-span-12 md:col-span-5 bg-gray-300 dark:bg-gradient-to-tl from-wing via-wing/45 to-wing/80 transition-all shadow-[0_10px_20px_0_#3737373d] dark:shadow-[0_10px_100px_0_#2ad5c15c] p-[2px] rounded-md max-h-[550px]" >

<CodeBlock
language="js"
className='h-full w-full p-0 m-0 !rounded-none'
Expand All @@ -1075,7 +1078,8 @@ export default function Example() {
{codeExample}
</CodeBlock>
</div>
<div className=" col-span-2">
<span className='col-span-12 -mb-4 block md:hidden font-bold'>2. Compile to a Wing platform</span>
<div className="col-span-12 md:col-span-2">
<div className="grid grid-cols-1 gap-4">
{platforms.map((platform, index) => {
const isSelected = selectedPlatform.platform === platform.platform
Expand All @@ -1088,7 +1092,8 @@ export default function Example() {
})}
</div>
</div>
<div className="col-span-5 bg-gray-300 dark:bg-gradient-to-tl from-wing via-wing/45 to-wing/80 transition-all shadow-[0_10px_20px_0_#3737373d] dark:shadow-[0_10px_100px_0_#2ad5c15c] p-[2px] rounded-md max-h-[550px]" >
<span className='col-span-12 -mb-4 block md:hidden font-bold '>3. Generated output</span>
<div className="col-span-12 md:col-span-5 bg-gray-300 dark:bg-gradient-to-tl from-wing via-wing/45 to-wing/80 transition-all shadow-[0_10px_20px_0_#3737373d] dark:shadow-[0_10px_100px_0_#2ad5c15c] p-[2px] rounded-md max-h-[550px]" >
<CodeBlock
language="json"
className='h-full w-full p-0 m-0 !rounded-none overflow-auto '
Expand Down
43 changes: 33 additions & 10 deletions src/components/Landing/Newsletter.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -12,48 +12,71 @@
}
```
*/
import React from 'react'
import React, { useCallback, useEffect, useLayoutEffect } from 'react'
import { CalendarDaysIcon, HandRaisedIcon } from '@heroicons/react/24/outline'

export default function Example() {

useEffect(() => {

setTimeout(() => {
// @ts-ignore
if (window.hbspt) {
// @ts-ignore
window.hbspt.forms.create({
region: "eu1",
portalId: "26754295",
formId: "5d8c70c8-d16b-4ee0-b06c-b7fb2931f505",
target: '#hubspotForm',
onFormReady: function ($form) {
// $('input[name="url"]').val(window.location.href).change();
}
});
}
}, 200);


}, []);

return (
<div className="relative isolate overflow-hidden dark:bg-gray-900 py-16 sm:py-24 lg:py-32">
<div className="mx-auto max-w-7xl px-6 lg:px-8">
<div className="mx-auto grid max-w-2xl grid-cols-1 gap-x-8 gap-y-16 lg:max-w-none lg:grid-cols-2">
<div className="max-w-xl lg:max-w-lg">
<h2 className="text-3xl font-bold tracking-tight dark:text-white sm:text-4xl">Keep up with Wing</h2>
<p className="mt-4 text-lg leading-8 dark:text-gray-300">
Nostrud amet eu ullamco nisi aute in ad minim nostrud adipisicing velit quis. Duis tempor incididunt
dolore.
We are working towards 1.0 release. Subscribe to our newsletter to get updates on our progress.
</p>
<div className="mt-6 flex max-w-md gap-x-4">
<label htmlFor="email-address" className="sr-only">
Email address
</label>
<input
{/* <input id="email-5d8c70c8-d16b-4ee0-b06c-b7fb2931f505" name="email" required="" placeholder="Email*" type="email" class="hs-input invalid error" inputmode="email" autocomplete="email" value=""></input> */}
<div id="hubspotForm"></div>
{/* <input
id="email-address"
name="email"
type="email"
required
placeholder="Enter your email"
autoComplete="email"
className="min-w-0 flex-auto rounded-md border-0 bg-white/5 px-3.5 py-2 text-white shadow-sm ring-1 ring-inset ring-white/10 focus:ring-2 focus:ring-inset focus:ring-indigo-500 sm:text-sm sm:leading-6"
/>
<a
/> */}
{/* <a
className="flex-none rounded-md bg-wing/70 px-3.5 py-2.5 text-sm font-semibold text-white shadow-sm hover:bg-indigo-400 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-500"
>
Subscribe
</a>
</a> */}
</div>
</div>
<dl className="grid grid-cols-1 gap-x-8 gap-y-10 sm:grid-cols-2 lg:pt-2">
<div className="flex flex-col items-start">
<div className="hidden dark:block rounded-md bg-white/5 p-2 ring-1 ring-white/10">
<CalendarDaysIcon aria-hidden="true" className="h-6 w-6 text-white" />
</div>
<dt className="mt-4 font-semibold dark:text-white">Weekly articles</dt>
<dt className="mt-4 font-semibold dark:text-white">Monthly updates</dt>
<dd className="mt-2 leading-7 dark:text-gray-400 ml-0">
Non laboris consequat cupidatat laborum magna. Eiusmod non irure cupidatat duis commodo amet.
Get packaged updates directly into your inbox. New features, bug fixes, and more.
</dd>
</div>
<div className="flex flex-col items-start">
Expand All @@ -62,7 +85,7 @@ export default function Example() {
</div>
<dt className="mt-4 font-semibold dark:text-white">No spam</dt>
<dd className="mt-2 leading-7 dark:text-gray-400 ml-0">
Officia excepteur ullamco ut sint duis proident non adipisicing. Voluptate incididunt anim.
We will keep the content focused on Wing and related topics. No spam, ever.
</dd>
</div>
</dl>
Expand Down
4 changes: 2 additions & 2 deletions src/components/PlatformIcons.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -17,10 +17,10 @@ export const GCPPlatformIcon = ({ className }: { className?: string }) => {
}

export const TerraformIcon = ({ className }: { className?: string }) => {
return <svg className={`w-6 h-6 ${className}`} viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" fill="none"><g id="SVGRepo_bgCarrier" stroke-width="0"></g><g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"></g><g id="SVGRepo_iconCarrier"> <g fill="#7B42BC" fill-rule="evenodd" clip-rule="evenodd"> <path d="M5.825 2.82l4.35 2.524v5.052L5.825 7.87V2.82zM10.651 5.344v5.052L15 7.87V2.82l-4.349 2.524zM1 0v5.05l4.349 2.527V2.526L1 0zM5.825 13.474L10.174 16v-5.051L5.825 8.423v5.051z"></path> </g> </g></svg>
return <svg className={`w-6 h-6 ${className}`} viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" fill="none"><g id="SVGRepo_bgCarrier" strokeWidth="0"></g><g id="SVGRepo_tracerCarrier" strokeLinecap="round" strokeLinejoin="round"></g><g id="SVGRepo_iconCarrier"> <g fill="#7B42BC" fillRule="evenodd" clipRule="evenodd"> <path d="M5.825 2.82l4.35 2.524v5.052L5.825 7.87V2.82zM10.651 5.344v5.052L15 7.87V2.82l-4.349 2.524zM1 0v5.05l4.349 2.527V2.526L1 0zM5.825 13.474L10.174 16v-5.051L5.825 8.423v5.051z"></path> </g> </g></svg>
}
export const CDKIcon = ({ className }: { className?: string }) => {
return <svg className={`w-6 h-6 ${className}`} viewBox="0 0 80 80" xmlns="http://www.w3.org/2000/svg">
<path d="M68,39.3055249 C68,46.2347078 63.2662495,48.7760413 60.4452559,49.6748056 L59.8457203,47.7683056 C62.6597657,46.8725405 66.0147828,44.6771162 66.0147828,39.3055249 C66.0147828,32.5143058 60.4561746,30.8187505 58.0669656,30.404859 C57.5339348,30.3128831 57.1736179,29.8080155 57.2530266,29.2701566 L57.2530266,29.2701566 C57.0167857,26.175968 55.5775032,23.9505516 53.3907865,23.3067204 C51.5743127,22.7728604 49.6228442,23.4806748 48.4257582,25.1142464 C48.2083769,25.4111686 47.8411117,25.562129 47.4807948,25.5091429 C47.1175,25.455157 46.8137618,25.2022234 46.691671,24.8533149 C45.8668132,22.503931 44.6717124,20.5274493 43.1401173,18.9788554 C41.2601166,17.0793535 36.1025223,12.9944248 28.8128047,16.1016099 C24.6031515,17.8971391 21.3057057,23.0697826 21.3057057,27.8765221 C21.3057057,28.4113818 21.3374692,28.9502405 21.4009962,29.4791018 C21.4595601,29.9769712 21.1429179,30.4418493 20.6605101,30.5658168 C18.1670773,31.2066488 13.9852172,33.1821307 13.9852172,39.2215469 C13.9852172,39.4174955 13.9901803,39.6094452 14.0001064,39.7983956 C14.1867168,43.686376 17.0275626,47.0265001 20.9106475,47.923265 L20.4659588,49.871754 C15.7212897,48.7750416 12.2461669,44.674117 12.0168743,39.8983694 C12.004963,39.6804266 12,39.4524864 12,39.2215469 C12,32.3143583 16.6374674,29.7670263 19.352252,28.8692617 C19.3314072,28.5383485 19.3204885,28.2064355 19.3204885,27.8765221 C19.3204885,22.2340018 23.0685786,16.3805368 28.0395625,14.2600929 C33.8641899,11.7747446 40.0362302,13.0114203 44.5456511,17.5672256 C45.9482071,18.9848538 47.0976479,20.7044029 47.9741213,22.6948809 C49.6426964,21.2822513 51.8492653,20.7703856 53.9476399,21.3882236 C56.8262049,22.2350015 58.7528582,24.906301 59.1826577,28.5943338 C61.9986883,29.25716 68,31.5805507 68,39.3055249 L68,39.3055249 Z M56.8986653,61.3137534 L49.9633089,65.1997343 L49.9633089,56.5540016 L56.8986653,52.6120354 L56.8986653,61.3137534 Z M39.0078877,61.28876 L32.0874205,65.2767142 L32.0874205,56.5200105 L39.0078877,52.5900411 L39.0078877,61.28876 Z M31.091834,54.7904641 L24.1693816,50.9054829 L31.1037453,47.0205017 L37.9716043,50.8824889 L31.091834,54.7904641 Z M23.1211869,52.6060369 L30.1022032,56.5240095 L30.1022032,65.2817128 L23.1211869,61.2867605 L23.1211869,52.6060369 Z M40.029282,32.0534267 L46.9110375,35.8984184 L40.0004963,39.7634048 L33.1445486,35.9184131 L40.029282,32.0534267 Z M42.0323661,50.8844884 L48.9548186,47.0045059 L55.8653597,50.9034834 L48.9707003,54.8224557 L42.0323661,50.8844884 Z M40.9931049,52.5890414 L47.9780917,56.5540016 L47.9780917,65.1997343 L40.9931049,61.2807621 L40.9931049,52.5890414 Z M47.9641952,45.2719602 L40.9931049,49.1779359 L40.9931049,41.4949507 L47.9641952,37.5969729 L47.9641952,45.2719602 Z M32.0973465,37.6189672 L39.0078877,41.493951 L39.0078877,49.1749367 L32.0973465,45.2889558 L32.0973465,37.6189672 Z M58.3915486,50.0367107 C58.3865856,50.0337115 58.38063,50.0327118 58.3756669,50.0297126 L58.3766595,50.0277131 L49.9494124,45.2739597 L49.9494124,35.8984184 C49.9494124,35.5435114 49.7637946,35.2165972 49.4600564,35.0366444 C49.4521155,35.0326454 49.4451672,35.0306459 49.4372264,35.026647 L49.4392116,35.0236478 L40.5106971,30.0359558 C40.2089441,29.8689995 39.8436641,29.8689995 39.5458816,30.0369555 L30.6223301,35.045642 L30.6233228,35.0476415 C30.6163745,35.0516404 30.6084336,35.0526402 30.6014854,35.0566391 C30.2987397,35.2365919 30.1121293,35.5645059 30.1121293,35.9184131 L30.1121293,45.2869563 L21.6461705,50.0307123 L21.6481557,50.0327118 C21.6402148,50.0367107 21.632274,50.0387102 21.6253257,50.0427092 C21.3225801,50.2216622 21.1359697,50.550576 21.1359697,50.9044832 L21.1359697,61.8686079 C21.1359697,62.2285135 21.3275431,62.5604265 21.6382296,62.7373801 L30.5965223,67.8650354 L30.6044632,67.8700341 L30.6044632,67.8690343 C30.7573249,67.9560115 30.9260684,68 31.0948118,68 C31.2645479,68 31.4352766,67.9560115 31.5881383,67.8680346 L40.0074446,63.0163069 L48.4882925,67.7740593 L48.4892851,67.77106 C48.639169,67.855038 48.8039421,67.9000262 48.9707003,67.9000262 C49.136466,67.9000262 49.3032242,67.8580372 49.4531081,67.7740593 L58.3746743,62.7753701 C58.6893312,62.5984165 58.8838825,62.2645041 58.8838825,61.9015993 L58.8838825,50.9004842 C58.8838825,50.5445775 58.6972721,50.2166635 58.3915486,50.0367107 L58.3915486,50.0367107 Z" id="AWS-Cloud-Development-Kit_Icon_64_Squid" fill="currentColor" stroke="none" stroke-width="1" fill-rule="evenodd"/>
<path d="M68,39.3055249 C68,46.2347078 63.2662495,48.7760413 60.4452559,49.6748056 L59.8457203,47.7683056 C62.6597657,46.8725405 66.0147828,44.6771162 66.0147828,39.3055249 C66.0147828,32.5143058 60.4561746,30.8187505 58.0669656,30.404859 C57.5339348,30.3128831 57.1736179,29.8080155 57.2530266,29.2701566 L57.2530266,29.2701566 C57.0167857,26.175968 55.5775032,23.9505516 53.3907865,23.3067204 C51.5743127,22.7728604 49.6228442,23.4806748 48.4257582,25.1142464 C48.2083769,25.4111686 47.8411117,25.562129 47.4807948,25.5091429 C47.1175,25.455157 46.8137618,25.2022234 46.691671,24.8533149 C45.8668132,22.503931 44.6717124,20.5274493 43.1401173,18.9788554 C41.2601166,17.0793535 36.1025223,12.9944248 28.8128047,16.1016099 C24.6031515,17.8971391 21.3057057,23.0697826 21.3057057,27.8765221 C21.3057057,28.4113818 21.3374692,28.9502405 21.4009962,29.4791018 C21.4595601,29.9769712 21.1429179,30.4418493 20.6605101,30.5658168 C18.1670773,31.2066488 13.9852172,33.1821307 13.9852172,39.2215469 C13.9852172,39.4174955 13.9901803,39.6094452 14.0001064,39.7983956 C14.1867168,43.686376 17.0275626,47.0265001 20.9106475,47.923265 L20.4659588,49.871754 C15.7212897,48.7750416 12.2461669,44.674117 12.0168743,39.8983694 C12.004963,39.6804266 12,39.4524864 12,39.2215469 C12,32.3143583 16.6374674,29.7670263 19.352252,28.8692617 C19.3314072,28.5383485 19.3204885,28.2064355 19.3204885,27.8765221 C19.3204885,22.2340018 23.0685786,16.3805368 28.0395625,14.2600929 C33.8641899,11.7747446 40.0362302,13.0114203 44.5456511,17.5672256 C45.9482071,18.9848538 47.0976479,20.7044029 47.9741213,22.6948809 C49.6426964,21.2822513 51.8492653,20.7703856 53.9476399,21.3882236 C56.8262049,22.2350015 58.7528582,24.906301 59.1826577,28.5943338 C61.9986883,29.25716 68,31.5805507 68,39.3055249 L68,39.3055249 Z M56.8986653,61.3137534 L49.9633089,65.1997343 L49.9633089,56.5540016 L56.8986653,52.6120354 L56.8986653,61.3137534 Z M39.0078877,61.28876 L32.0874205,65.2767142 L32.0874205,56.5200105 L39.0078877,52.5900411 L39.0078877,61.28876 Z M31.091834,54.7904641 L24.1693816,50.9054829 L31.1037453,47.0205017 L37.9716043,50.8824889 L31.091834,54.7904641 Z M23.1211869,52.6060369 L30.1022032,56.5240095 L30.1022032,65.2817128 L23.1211869,61.2867605 L23.1211869,52.6060369 Z M40.029282,32.0534267 L46.9110375,35.8984184 L40.0004963,39.7634048 L33.1445486,35.9184131 L40.029282,32.0534267 Z M42.0323661,50.8844884 L48.9548186,47.0045059 L55.8653597,50.9034834 L48.9707003,54.8224557 L42.0323661,50.8844884 Z M40.9931049,52.5890414 L47.9780917,56.5540016 L47.9780917,65.1997343 L40.9931049,61.2807621 L40.9931049,52.5890414 Z M47.9641952,45.2719602 L40.9931049,49.1779359 L40.9931049,41.4949507 L47.9641952,37.5969729 L47.9641952,45.2719602 Z M32.0973465,37.6189672 L39.0078877,41.493951 L39.0078877,49.1749367 L32.0973465,45.2889558 L32.0973465,37.6189672 Z M58.3915486,50.0367107 C58.3865856,50.0337115 58.38063,50.0327118 58.3756669,50.0297126 L58.3766595,50.0277131 L49.9494124,45.2739597 L49.9494124,35.8984184 C49.9494124,35.5435114 49.7637946,35.2165972 49.4600564,35.0366444 C49.4521155,35.0326454 49.4451672,35.0306459 49.4372264,35.026647 L49.4392116,35.0236478 L40.5106971,30.0359558 C40.2089441,29.8689995 39.8436641,29.8689995 39.5458816,30.0369555 L30.6223301,35.045642 L30.6233228,35.0476415 C30.6163745,35.0516404 30.6084336,35.0526402 30.6014854,35.0566391 C30.2987397,35.2365919 30.1121293,35.5645059 30.1121293,35.9184131 L30.1121293,45.2869563 L21.6461705,50.0307123 L21.6481557,50.0327118 C21.6402148,50.0367107 21.632274,50.0387102 21.6253257,50.0427092 C21.3225801,50.2216622 21.1359697,50.550576 21.1359697,50.9044832 L21.1359697,61.8686079 C21.1359697,62.2285135 21.3275431,62.5604265 21.6382296,62.7373801 L30.5965223,67.8650354 L30.6044632,67.8700341 L30.6044632,67.8690343 C30.7573249,67.9560115 30.9260684,68 31.0948118,68 C31.2645479,68 31.4352766,67.9560115 31.5881383,67.8680346 L40.0074446,63.0163069 L48.4882925,67.7740593 L48.4892851,67.77106 C48.639169,67.855038 48.8039421,67.9000262 48.9707003,67.9000262 C49.136466,67.9000262 49.3032242,67.8580372 49.4531081,67.7740593 L58.3746743,62.7753701 C58.6893312,62.5984165 58.8838825,62.2645041 58.8838825,61.9015993 L58.8838825,50.9004842 C58.8838825,50.5445775 58.6972721,50.2166635 58.3915486,50.0367107 L58.3915486,50.0367107 Z" id="AWS-Cloud-Development-Kit_Icon_64_Squid" fill="currentColor" stroke="none" strokeWidth="1" fillRule="evenodd"/>
</svg>
}
25 changes: 25 additions & 0 deletions src/css/custom.css
Original file line number Diff line number Diff line change
Expand Up @@ -380,4 +380,29 @@ html[data-theme="dark"] h2[itemprop="headline"] a {
.navbar__item[href="/blog"] {
display: none;
}
}


/* Newsletter */
.hs-form input{
background-color: white;
color: black;
/* border: solid 0px #212627; */
/* font-size: 16px; */
/* color: white; */
/* -moz-border-radius: 0px; */
/* -webkit-border-radius: 0px; */
/* border-radius: 4px; */
/* padding: 10px 12px; */
/* width: 340px; */
}

#hubspotForm .actions input[type="submit"] {
background: rgb(42 213 193 / 0.8);
color:white;
font-weight: bold;
border: none;
border-radius: 4px;
padding: 1em 2em;
margin: 1em 0;
}
Loading

0 comments on commit 12299b0

Please sign in to comment.