diff --git a/src/pages/pricing.tsx b/src/pages/pricing.tsx index d84e1ca..aa6c103 100644 --- a/src/pages/pricing.tsx +++ b/src/pages/pricing.tsx @@ -11,7 +11,6 @@ import { SegmentedControl, Center, Badge, - Anchor, ThemeIcon, } from "@mantine/core"; import styled from "styled-components"; @@ -35,21 +34,12 @@ export const purchaseLinks = { "https://herowand.lemonsqueezy.com/checkout/buy/577928ea-fb09-4076-9307-3e5931b35ad0?desc=0&enabled=82417", }; -const StyledPaperFree = styled(Paper)` +const StyledPaper = styled(Paper)<{ $highlight?: boolean } & any>` padding: 1.5em; - width: 400px; - border-radius: 1em; + width: 350px; + border-radius: 4px; border: 2px solid #e9e9e9; - background: white; - box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); -`; - -const StyledPaper = styled(Paper)` - padding: 1.5em; - width: 400px; - border-radius: 1em; - border: 2px solid #e9e9e9; - border-top: 3px solid #625bf6; + ${({ $highlight }) => $highlight && "border-top: 3px solid #625bf6;"} background: white; box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); `; @@ -72,11 +62,21 @@ export const PricingCards = () => { styles={{ label: { color: "black" } }} /> - + - + Partner @@ -119,7 +119,7 @@ export const PricingCards = () => { > - Integrate JSON Crack Premium to your website + JSON Crack Premium Widget @@ -155,10 +155,10 @@ export const PricingCards = () => { - + - + Premium @@ -230,7 +230,12 @@ export const PricingCards = () => { - Compact graph visualizations & fast rendering + Compact Graphs & High Performance + + + + + Compare Data Differences @@ -240,12 +245,7 @@ export const PricingCards = () => { - Built-in tabs for multiple documents - - - - - Compare data differences + Built-in tabs for Multiple Documents @@ -256,10 +256,10 @@ export const PricingCards = () => { - + - + Free @@ -285,7 +285,7 @@ export const PricingCards = () => { my="md" rightSection={} > - Get Started + Free forever { - + - - Get custom pricing for enterprise plan.{" "} - - Contact us - - ); };