diff --git a/site/src/components/landing-page/landing-page.scss b/site/src/components/landing-page/landing-page.scss index bffd7caeef..8f87c65a5f 100644 --- a/site/src/components/landing-page/landing-page.scss +++ b/site/src/components/landing-page/landing-page.scss @@ -24,6 +24,9 @@ landing-page { } .announcement { + position: relative; + top: 60px; + a { text-decoration: none; color: #fff; @@ -52,7 +55,7 @@ landing-page { font-weight: 800; padding: 2px 6px; border-radius: 100px; - flex: 0 0 38px; + flex: 0 0 70px; text-align: center; } .message { @@ -66,7 +69,7 @@ landing-page { color: $color-yellow; font-weight: 600; padding-right: 4px; - flex: 0 0 76px; + flex: 0 0 94px; } .icon { fill: $color-yellow; @@ -76,9 +79,15 @@ landing-page { margin-left: 2px; } + @media screen and (max-width: $breakpoint-lg) { + top: 20px; + } + @media screen and (max-width: $breakpoint-md) { max-width: 100%; padding: 0; + top: 0; + a { display: flex; width: 100%; @@ -89,7 +98,7 @@ landing-page { flex: 1; } .cta { - flex: 0 0 70px; + flex: 0 0 94px; padding-right: 0; } } diff --git a/site/src/components/landing-page/landing-page.tsx b/site/src/components/landing-page/landing-page.tsx index df2cd1c83f..d9a6375d9f 100644 --- a/site/src/components/landing-page/landing-page.tsx +++ b/site/src/components/landing-page/landing-page.tsx @@ -22,6 +22,18 @@ export class LandingPage { render() { return [ +
+ + Live demo + + Capacitor 2.0 features and capabilities + + + Register Now + + + +
,