From f3adf1280b88c2e1ef3f1494406c90179a2db77f Mon Sep 17 00:00:00 2001 From: AykutSarac Date: Sat, 4 Jan 2025 01:13:59 +0300 Subject: [PATCH] update landing --- public/assets/bf2-image.png | Bin 0 -> 12202 bytes public/assets/step1-visual.png | Bin 0 -> 8986 bytes public/assets/step2-visual.png | Bin 0 -> 3699 bytes public/assets/step3-visual.png | Bin 0 -> 7548 bytes src/data/faq.json | 6 +- src/layout/Landing/Features.tsx | 21 ++- src/layout/Landing/HeroSection.tsx | 4 +- src/layout/Landing/LovedBy.tsx | 2 +- src/layout/Landing/Section1.tsx | 230 +++++++++++++---------------- src/layout/Landing/Section2.tsx | 171 +++++++++++++++++++++ src/layout/Landing/Section3.tsx | 117 +++++++++++++++ src/layout/Landing/SeePremium.tsx | 106 ------------- src/pages/index.tsx | 8 +- 13 files changed, 416 insertions(+), 249 deletions(-) create mode 100644 public/assets/bf2-image.png create mode 100644 public/assets/step1-visual.png create mode 100644 public/assets/step2-visual.png create mode 100644 public/assets/step3-visual.png create mode 100644 src/layout/Landing/Section2.tsx create mode 100644 src/layout/Landing/Section3.tsx delete mode 100644 src/layout/Landing/SeePremium.tsx diff --git a/public/assets/bf2-image.png b/public/assets/bf2-image.png new file mode 100644 index 0000000000000000000000000000000000000000..a5463b827c18cc87f6fa60a99313c79d8da4e9aa GIT binary patch literal 12202 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 RJN%1-o7x7~OEqmH{s;WND@FhS literal 0 HcmV?d00001 diff --git a/public/assets/step1-visual.png b/public/assets/step1-visual.png new file mode 100644 index 0000000000000000000000000000000000000000..a0296cba6b1da39d883db780e358af5e090089e1 GIT binary patch literal 8986 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 HSL{Ck8z8@U literal 0 HcmV?d00001 diff --git a/public/assets/step3-visual.png b/public/assets/step3-visual.png new file mode 100644 index 0000000000000000000000000000000000000000..95a7fd3777c001255f60a47e9c6603080ff42afa GIT binary patch literal 7548 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, color: "yellow", }, { - title: "Convert", + title: "Convert Data", description: "Convert JSON to CSV, YAML to JSON, XML to JSON, and more. Our JSON converter supports multiple formats for easy data exchange.", icon: , color: "orange", }, { - title: "Format & Validate", + title: "JSON Formatter and JSON Validator", description: "Format and beautify your JSON data to make it more readable. Validate JSON, YAML, and CSV.", icon: , color: "green", }, { - title: "Generate Code", - description: "Generate TypeScript interface, Golang structs, JSON Schema and more.", + title: "Generate Code/Types", + description: "Generate TypeScript interface, Golang structs, Rust serde, JSON Schema and more.", icon: , color: "grape", }, { - title: "JSON Schema", + title: "JSON Schema Generator", description: - "Generate JSON Schema, create mock data, and validate JSON Schema from various data formats like JSON, YAML, XML, and CSV.", + "Validate JSON Schema, create mock data, and generate JSON Schema from various data formats like JSON, YAML, XML, and CSV.", icon: , color: "cyan", }, @@ -65,9 +65,9 @@ const features: FeatureItem[] = [ color: "teal.5", }, { - title: "Download Image", + title: "Export Image", description: - "Export image of the graph as PNG, JPEG, or SVG. Share your data visualization with others.", + "Export image of the graphs as PNG, JPEG, or SVG. Share your data visualization with others.", icon: , color: "blue.4", }, @@ -122,8 +122,7 @@ export const Features = () => { fz={{ base: 16, sm: 18 }} w={{ base: "100%", xs: "80%", sm: "60%", md: "40%" }} > - All in one tool for JSON, YAML, CSV, XML, and TOML. Formatter, validator, visualizer, and - editor. + All in one tool for JSON, YAML, CSV, XML, and TOML. { Visualize JSON into interactive graphs - The best online JSON viewer tool to visualize, format{" "} - and explore. + The best online JSON viewer to visualize, format and{" "} + explore. diff --git a/src/layout/Landing/LovedBy.tsx b/src/layout/Landing/LovedBy.tsx index 49601fd..b79630c 100644 --- a/src/layout/Landing/LovedBy.tsx +++ b/src/layout/Landing/LovedBy.tsx @@ -61,7 +61,7 @@ const Featured = ({ stars }: LovedByProps) => { export const LovedBy = ({ stars }: LovedByProps) => { return ( - + - - - json crack - - - + + + visualize + + + Visualize your JSON + + + Your data will automatically be turned into a visual tree graph so you can quickly + understand your data at a glance. + + + + + export image + + + Export to image + + + Once you're satisfied, you can export an image of your graph as PNG, JPEG, or SVG + and share with others. + + + ); }; diff --git a/src/layout/Landing/Section2.tsx b/src/layout/Landing/Section2.tsx new file mode 100644 index 0000000..c064359 --- /dev/null +++ b/src/layout/Landing/Section2.tsx @@ -0,0 +1,171 @@ +import React from "react"; +import { + Button, + Container, + Flex, + Image, + JsonInput, + List, + SimpleGrid, + Stack, + Text, + Title, +} from "@mantine/core"; +import styled from "styled-components"; +import { LuBadgeCheck } from "react-icons/lu"; + +const StyledDottedContainer = styled.div` + position: relative; + background-color: #f3f3f3; + background-image: radial-gradient(#e0e0e0 3px, transparent 0); + background-size: 40px 40px; + border: 1px solid #e0e0e0; + + width: 100%; + min-width: 300px; + max-width: 500px; + border-radius: 15px; + height: 460px; + + .jc { + position: absolute; + top: 0; + left: 0; + padding: 12px; + border-radius: 15px; + transform: translate(-80px, 10%); + border: 1px solid #000; + box-shadow: 0px 4px 0px 0px #000; + background: #f3f3f3; + --line-color-1: #e3e3e3; + --line-color-2: #e5e5e5; + background-image: linear-gradient(var(--line-color-1) 1.5px, transparent 1.5px), + linear-gradient(90deg, var(--line-color-1) 1.5px, transparent 1.5px), + linear-gradient(var(--line-color-2) 1px, transparent 1px), + linear-gradient(90deg, var(--line-color-2) 1px, transparent 1px); + background-position: + -1.5px -1.5px, + -1.5px -1.5px, + -1px -1px, + -1px -1px; + background-size: + 100px 100px, + 100px 100px, + 20px 20px, + 20px 20px; + } + + .jcode { + position: absolute; + top: 0; + left: 0; + transform: translate(80%, 80%); + width: 273px; + border-radius: 15px; + border: 1px solid #000; + box-shadow: 0px 4px 0px 0px #000; + overflow: hidden; + } + + @media only screen and (max-width: 1085px) { + display: none; + } +`; + +export const Section2 = () => { + return ( + + + + + Don't waste time with JSON formatters + + + Format JSON and transform into a readable graph in seconds. JSON Crack is an open-source + online tool that helps you visualize and understand data. + + } + > + + VS Code Extension + Open-source + JSON Validator/Formatter + Export Image + + + + + + json crack + + + + + ); +}; diff --git a/src/layout/Landing/Section3.tsx b/src/layout/Landing/Section3.tsx new file mode 100644 index 0000000..b7c1bae --- /dev/null +++ b/src/layout/Landing/Section3.tsx @@ -0,0 +1,117 @@ +import React from "react"; +import { + Button, + Container, + Flex, + Image, + List, + SimpleGrid, + Stack, + Text, + Title, +} from "@mantine/core"; +import styled from "styled-components"; +import { LuBadgeCheck } from "react-icons/lu"; + +const StyledDottedContainer = styled.div` + position: relative; + width: 100%; + min-width: 300px; + max-width: 500px; + border-radius: 15px; + height: 460px; + + .jc { + position: absolute; + top: 0; + left: 0; + padding: 12px; + border-radius: 15px; + border: 1px solid #e0e0e0; + background: #f3f3f3; + --line-color-1: #e3e3e3; + --line-color-2: #e5e5e5; + background-image: linear-gradient(var(--line-color-1) 1.5px, transparent 1.5px), + linear-gradient(90deg, var(--line-color-1) 1.5px, transparent 1.5px), + linear-gradient(var(--line-color-2) 1px, transparent 1px), + linear-gradient(90deg, var(--line-color-2) 1px, transparent 1px); + background-position: + -1.5px -1.5px, + -1.5px -1.5px, + -1px -1px, + -1px -1px; + background-size: + 100px 100px, + 100px 100px, + 20px 20px, + 20px 20px; + } + + @media only screen and (max-width: 1085px) { + display: none; + } +`; + +export const Section3 = () => { + return ( + + + + json, csv, yaml, xml + + + + Visualize and convert to multiple formats + + + JSON Crack supports formats like TOML, CSV, YAML, and XML, making it easier to visualize + your data, no matter the type. + + } + > + + JSON to CSV + YAML to JSON + XML to JSON + and more... + + + + + + + ); +}; diff --git a/src/layout/Landing/SeePremium.tsx b/src/layout/Landing/SeePremium.tsx deleted file mode 100644 index 8771849..0000000 --- a/src/layout/Landing/SeePremium.tsx +++ /dev/null @@ -1,106 +0,0 @@ -import React from "react"; -import { - Title, - Image, - Flex, - Box, - Button, - Text, - Paper, - Container, - Mark, - Avatar, - Rating, - Stack, -} from "@mantine/core"; -import styled from "styled-components"; -import { FaArrowRightLong } from "react-icons/fa6"; - -const StyledImageWrapper = styled.div` - margin: 0 -30px -30px; - padding-left: 30px; - padding-top: 30px; -`; - -export const SeePremium = () => { - return ( - - - - - - Todiagram Logo - - Upgrade to{" "} - <Mark color="yellow.5" px="4" py="2" style={{ borderRadius: 4 }}> - ToDiagram - </Mark> - - - - - Try out the premium features of ToDiagram and create beautiful diagrams with ease. - - - - - - - - - - - Loved by 400+ users - - - - - - - - - ToDiagram Editor - - - - - - ); -}; diff --git a/src/pages/index.tsx b/src/pages/index.tsx index 59621bc..e2a6c9b 100644 --- a/src/pages/index.tsx +++ b/src/pages/index.tsx @@ -8,7 +8,8 @@ import { HeroPreview } from "src/layout/Landing/HeroPreview"; import { HeroSection } from "src/layout/Landing/HeroSection"; import { LovedBy } from "src/layout/Landing/LovedBy"; import { Section1 } from "src/layout/Landing/Section1"; -import { SeePremium } from "src/layout/Landing/SeePremium"; +import { Section2 } from "src/layout/Landing/Section2"; +import { Section3 } from "src/layout/Landing/Section3"; import Layout from "src/layout/PageLayout"; export const HomePage = (props: InferGetStaticPropsType) => { @@ -18,10 +19,11 @@ export const HomePage = (props: InferGetStaticPropsType) + + - - + ); };