clients/landing: adjust gradient

polarsource · Nov 8, 2024 · 7047bee · 7047bee
1 parent bb59bbb
commit 7047bee
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 8 deletions.
diff --git a/clients/apps/web/src/components/Landing/API.tsx b/clients/apps/web/src/components/Landing/API.tsx
@@ -11,7 +11,7 @@ import Button from 'polarkit/components/ui/atoms/button'
 
 export const API = () => {
   return (
-    <div className="dark:bg-polar-950 rounded-4xl flex w-full flex-col gap-y-16 bg-gray-50 p-8 md:p-16 dark:md:bg-[radial-gradient(400px_at_top,rgba(20,20,25,1)_0%,rgba(7,7,9,1)_100%)]">
+    <div className="dark:bg-polar-950 rounded-4xl flex w-full flex-col gap-y-16 bg-gray-50 p-8 md:p-16 dark:md:bg-[radial-gradient(400px_at_top,rgba(20,20,25,1)_0%,rgba(9,9,11,1)_100%)]">
       <div className="flex flex-col items-center gap-y-8">
         <span className="dark:text-polar-500 text-lg text-gray-400">
           Built for Developers

diff --git a/clients/apps/web/src/components/Landing/Checkout.tsx b/clients/apps/web/src/components/Landing/Checkout.tsx
@@ -1,12 +1,15 @@
+import { Checkout as CheckoutComponent } from '@/components/Checkout/Checkout'
+import {
+  CHECKOUT_PREVIEW,
+  ORGANIZATION,
+} from '@/components/Customization/utils'
+import { KeyboardArrowRight } from '@mui/icons-material'
 import Link from 'next/link'
 import Button from 'polarkit/components/ui/atoms/button'
-import { KeyboardArrowRight } from '@mui/icons-material'
-import { Checkout as CheckoutComponent } from '@/components/Checkout/Checkout'
-import { ORGANIZATION, CHECKOUT_PREVIEW } from '@/components/Customization/utils'
 
 export const Checkout = () => {
   return (
-    <div className="dark:bg-polar-950 hidden md:flex rounded-4xl w-full flex-col overflow-hidden bg-gray-50 dark:md:bg-[radial-gradient(400px_at_top,rgba(20,20,25,1)_0%,rgba(7,7,9,1)_100%)]">
+    <div className="dark:bg-polar-950 rounded-4xl hidden w-full flex-col overflow-hidden bg-gray-50 md:flex dark:md:bg-[radial-gradient(400px_at_top,rgba(20,20,25,1)_0%,rgba(9,9,11,1)_100%)]">
       <div className="flex flex-col items-center gap-y-8 px-8 pt-8 md:px-16 md:pt-16">
         <span className="dark:text-polar-500 text-lg text-gray-400">
           Built for simplicity
@@ -26,8 +29,11 @@ export const Checkout = () => {
         </Link>
       </div>
       <div className="relative h-[490px] overflow-hidden">
-        <div className="absolute shadow-3xl rounded-4xl top-16 left-8 pointer-events-none right-8 md:left-16 md:right-16 flex flex-col items-center">
-          <CheckoutComponent organization={ORGANIZATION} checkout={CHECKOUT_PREVIEW} />
+        <div className="shadow-3xl rounded-4xl pointer-events-none absolute left-8 right-8 top-16 flex flex-col items-center md:left-16 md:right-16">
+          <CheckoutComponent
+            organization={ORGANIZATION}
+            checkout={CHECKOUT_PREVIEW}
+          />
         </div>
       </div>
     </div>

diff --git a/clients/apps/web/src/components/Landing/Pricing.tsx b/clients/apps/web/src/components/Landing/Pricing.tsx
@@ -4,7 +4,7 @@ export const Pricing = () => {
   return (
     <div
       id="pricing"
-      className="dark:bg-polar-950 rounded-4xl flex w-full flex-col gap-y-12 bg-gray-50 p-8 md:p-16 dark:md:bg-[radial-gradient(400px_at_top,rgba(20,20,25,1)_0%,rgba(7,7,9,1)_100%)]"
+      className="dark:bg-polar-950 rounded-4xl flex w-full flex-col gap-y-12 bg-gray-50 p-8 md:p-16 dark:md:bg-[radial-gradient(400px_at_top,rgba(20,20,25,1)_0%,rgba(9,9,11,1)_100%)]"
     >
       <div className="flex flex-col items-center gap-y-6">
         <span className="dark:text-polar-500 text-lg text-gray-400">