From 88509378147b9f797fb6cafc6fcbdc48db008410 Mon Sep 17 00:00:00 2001 From: diffim Date: Thu, 14 Sep 2023 22:42:38 +0400 Subject: [PATCH 1/4] initialized code for showcase --- package-lock.json | 257 +++++++++++ package.json | 10 +- src/components/Showcase.tsx | 33 +- src/pages/timeline.tsx | 854 ++++++++++++++++++------------------ src/styles/globals.css | 125 +++--- 5 files changed, 773 insertions(+), 506 deletions(-) diff --git a/package-lock.json b/package-lock.json index ac95173..cda6e5c 100644 --- a/package-lock.json +++ b/package-lock.json @@ -25,6 +25,7 @@ "postcss": "8.4.29", "react": "18.2.0", "react-dom": "18.2.0", + "react-syntax-highlighter": "^15.5.0", "tailwind-merge": "^1.14.0", "tailwindcss": "3.3.3", "tailwindcss-animate": "^1.0.7", @@ -32,6 +33,7 @@ "typescript": "5.2.2" }, "devDependencies": { + "@types/react-syntax-highlighter": "^15.5.7", "@types/three": "0.144.0" } }, @@ -1137,6 +1139,14 @@ "tslib": "^2.4.0" } }, + "node_modules/@types/hast": { + "version": "2.3.5", + "resolved": "https://registry.npmjs.org/@types/hast/-/hast-2.3.5.tgz", + "integrity": "sha512-SvQi0L/lNpThgPoleH53cdjB3y9zpLlVjRbqB3rH8hx1jiRSBGAhyjV3H+URFjNVRqt2EdYNrbZE5IsGlNfpRg==", + "dependencies": { + "@types/unist": "^2" + } + }, "node_modules/@types/json5": { "version": "0.0.29", "resolved": "https://registry.npmjs.org/@types/json5/-/json5-0.0.29.tgz", @@ -1183,6 +1193,15 @@ "@types/react": "*" } }, + "node_modules/@types/react-syntax-highlighter": { + "version": "15.5.7", + "resolved": "https://registry.npmjs.org/@types/react-syntax-highlighter/-/react-syntax-highlighter-15.5.7.tgz", + "integrity": "sha512-bo5fEO5toQeyCp0zVHBeggclqf5SQ/Z5blfFmjwO5dkMVGPgmiwZsJh9nu/Bo5L7IHTuGWrja6LxJVE2uB5ZrQ==", + "dev": true, + "dependencies": { + "@types/react": "*" + } + }, "node_modules/@types/scheduler": { "version": "0.16.3", "resolved": "https://registry.npmjs.org/@types/scheduler/-/scheduler-0.16.3.tgz", @@ -1197,6 +1216,11 @@ "@types/webxr": "*" } }, + "node_modules/@types/unist": { + "version": "2.0.8", + "resolved": "https://registry.npmjs.org/@types/unist/-/unist-2.0.8.tgz", + "integrity": "sha512-d0XxK3YTObnWVp6rZuev3c49+j4Lo8g4L1ZRm9z5L0xpoZycUPshHgczK5gsUMaZOstjVYYi09p5gYvUtfChYw==" + }, "node_modules/@types/webxr": { "version": "0.5.4", "resolved": "https://registry.npmjs.org/@types/webxr/-/webxr-0.5.4.tgz", @@ -1766,6 +1790,33 @@ "url": "https://github.com/chalk/chalk?sponsor=1" } }, + "node_modules/character-entities": { + "version": "1.2.4", + "resolved": "https://registry.npmjs.org/character-entities/-/character-entities-1.2.4.tgz", + "integrity": "sha512-iBMyeEHxfVnIakwOuDXpVkc54HijNgCyQB2w0VfGQThle6NXn50zU6V/u+LDhxHcDUPojn6Kpga3PTAD8W1bQw==", + "funding": { + "type": "github", + "url": "https://github.com/sponsors/wooorm" + } + }, + "node_modules/character-entities-legacy": { + "version": "1.1.4", + "resolved": "https://registry.npmjs.org/character-entities-legacy/-/character-entities-legacy-1.1.4.tgz", + "integrity": "sha512-3Xnr+7ZFS1uxeiUDvV02wQ+QDbc55o97tIV5zHScSPJpcLm/r0DFPcoY3tYRp+VZukxuMeKgXYmsXQHO05zQeA==", + "funding": { + "type": "github", + "url": "https://github.com/sponsors/wooorm" + } + }, + "node_modules/character-reference-invalid": { + "version": "1.1.4", + "resolved": "https://registry.npmjs.org/character-reference-invalid/-/character-reference-invalid-1.1.4.tgz", + "integrity": "sha512-mKKUkUbhPpQlCOfIuZkvSEgktjPFIsZKRRbC6KWVEMvlzblj3i3asQv5ODsrwt0N3pHAEvjP8KTQPHkp0+6jOg==", + "funding": { + "type": "github", + "url": "https://github.com/sponsors/wooorm" + } + }, "node_modules/chevrotain": { "version": "10.5.0", "resolved": "https://registry.npmjs.org/chevrotain/-/chevrotain-10.5.0.tgz", @@ -1856,6 +1907,15 @@ "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz", "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==" }, + "node_modules/comma-separated-tokens": { + "version": "1.0.8", + "resolved": "https://registry.npmjs.org/comma-separated-tokens/-/comma-separated-tokens-1.0.8.tgz", + "integrity": "sha512-GHuDRO12Sypu2cV70d1dkA2EUmXHgntrzbpvOB+Qy+49ypNfGgFQIC2fhhXbnyrJRynDCAARsT7Ou0M6hirpfw==", + "funding": { + "type": "github", + "url": "https://github.com/sponsors/wooorm" + } + }, "node_modules/commander": { "version": "4.1.1", "resolved": "https://registry.npmjs.org/commander/-/commander-4.1.1.tgz", @@ -2609,6 +2669,18 @@ "reusify": "^1.0.4" } }, + "node_modules/fault": { + "version": "1.0.4", + "resolved": "https://registry.npmjs.org/fault/-/fault-1.0.4.tgz", + "integrity": "sha512-CJ0HCB5tL5fYTEA7ToAq5+kTwd++Borf1/bifxd9iT70QcXr4MRrO3Llf8Ifs70q+SJcGHFtnIE/Nw6giCtECA==", + "dependencies": { + "format": "^0.2.0" + }, + "funding": { + "type": "github", + "url": "https://github.com/sponsors/wooorm" + } + }, "node_modules/fflate": { "version": "0.6.10", "resolved": "https://registry.npmjs.org/fflate/-/fflate-0.6.10.tgz", @@ -2677,6 +2749,14 @@ "is-callable": "^1.1.3" } }, + "node_modules/format": { + "version": "0.2.2", + "resolved": "https://registry.npmjs.org/format/-/format-0.2.2.tgz", + "integrity": "sha512-wzsgA6WOq+09wrU1tsJ09udeR/YZRaeArL9e1wPbFg3GG2yDnC2ldKpxs4xunpFF9DgqCqOIra3bc1HWrJ37Ww==", + "engines": { + "node": ">=0.4.x" + } + }, "node_modules/fraction.js": { "version": "4.3.6", "resolved": "https://registry.npmjs.org/fraction.js/-/fraction.js-4.3.6.tgz", @@ -2967,6 +3047,39 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/hast-util-parse-selector": { + "version": "2.2.5", + "resolved": "https://registry.npmjs.org/hast-util-parse-selector/-/hast-util-parse-selector-2.2.5.tgz", + "integrity": "sha512-7j6mrk/qqkSehsM92wQjdIgWM2/BW61u/53G6xmC8i1OmEdKLHbk419QKQUjz6LglWsfqoiHmyMRkP1BGjecNQ==", + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/unified" + } + }, + "node_modules/hastscript": { + "version": "6.0.0", + "resolved": "https://registry.npmjs.org/hastscript/-/hastscript-6.0.0.tgz", + "integrity": "sha512-nDM6bvd7lIqDUiYEiu5Sl/+6ReP0BMk/2f4U/Rooccxkj0P5nm+acM5PrGJ/t5I8qPGiqZSE6hVAwZEdZIvP4w==", + "dependencies": { + "@types/hast": "^2.0.0", + "comma-separated-tokens": "^1.0.0", + "hast-util-parse-selector": "^2.0.0", + "property-information": "^5.0.0", + "space-separated-tokens": "^1.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/unified" + } + }, + "node_modules/highlight.js": { + "version": "10.7.3", + "resolved": "https://registry.npmjs.org/highlight.js/-/highlight.js-10.7.3.tgz", + "integrity": "sha512-tzcUFauisWKNHaRkN4Wjl/ZA07gENAjFl3J/c480dprkGTg5EQstgaNFqBfUqCq54kZRIEcreTsAgF/m2quD7A==", + "engines": { + "node": "*" + } + }, "node_modules/ignore": { "version": "5.2.4", "resolved": "https://registry.npmjs.org/ignore/-/ignore-5.2.4.tgz", @@ -3033,6 +3146,28 @@ "loose-envify": "^1.0.0" } }, + "node_modules/is-alphabetical": { + "version": "1.0.4", + "resolved": "https://registry.npmjs.org/is-alphabetical/-/is-alphabetical-1.0.4.tgz", + "integrity": "sha512-DwzsA04LQ10FHTZuL0/grVDk4rFoVH1pjAToYwBrHSxcrBIGQuXrQMtD5U1b0U2XVgKZCTLLP8u2Qxqhy3l2Vg==", + "funding": { + "type": "github", + "url": "https://github.com/sponsors/wooorm" + } + }, + "node_modules/is-alphanumerical": { + "version": "1.0.4", + "resolved": "https://registry.npmjs.org/is-alphanumerical/-/is-alphanumerical-1.0.4.tgz", + "integrity": "sha512-UzoZUr+XfVz3t3v4KyGEniVL9BDRoQtY7tOyrRybkVNjDFWyo1yhXNGrrBTQxp3ib9BLAWs7k2YKBQsFRkZG9A==", + "dependencies": { + "is-alphabetical": "^1.0.0", + "is-decimal": "^1.0.0" + }, + "funding": { + "type": "github", + "url": "https://github.com/sponsors/wooorm" + } + }, "node_modules/is-array-buffer": { "version": "3.0.2", "resolved": "https://registry.npmjs.org/is-array-buffer/-/is-array-buffer-3.0.2.tgz", @@ -3133,6 +3268,15 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/is-decimal": { + "version": "1.0.4", + "resolved": "https://registry.npmjs.org/is-decimal/-/is-decimal-1.0.4.tgz", + "integrity": "sha512-RGdriMmQQvZ2aqaQq3awNA6dCGtKpiDFcOzrTWrDAT2MiWrKQVPmxLGHl7Y2nNu6led0kEyoX0enY0qXYsv9zw==", + "funding": { + "type": "github", + "url": "https://github.com/sponsors/wooorm" + } + }, "node_modules/is-extglob": { "version": "2.1.1", "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz", @@ -3177,6 +3321,15 @@ "node": ">=0.10.0" } }, + "node_modules/is-hexadecimal": { + "version": "1.0.4", + "resolved": "https://registry.npmjs.org/is-hexadecimal/-/is-hexadecimal-1.0.4.tgz", + "integrity": "sha512-gyPJuv83bHMpocVYoqof5VDiZveEoGoFL8m3BXNb2VW8Xs+rz9kqO8LOQ5DH6EsuvilT1ApazU0pyl+ytbPtlw==", + "funding": { + "type": "github", + "url": "https://github.com/sponsors/wooorm" + } + }, "node_modules/is-map": { "version": "2.0.2", "resolved": "https://registry.npmjs.org/is-map/-/is-map-2.0.2.tgz", @@ -3539,6 +3692,19 @@ "loose-envify": "cli.js" } }, + "node_modules/lowlight": { + "version": "1.20.0", + "resolved": "https://registry.npmjs.org/lowlight/-/lowlight-1.20.0.tgz", + "integrity": "sha512-8Ktj+prEb1RoCPkEOrPMYUN/nCggB7qAWe3a7OpMjWQkh3l2RD5wKRQ+o8Q8YuI9RG/xs95waaI/E6ym/7NsTw==", + "dependencies": { + "fault": "^1.0.0", + "highlight.js": "~10.7.0" + }, + "funding": { + "type": "github", + "url": "https://github.com/sponsors/wooorm" + } + }, "node_modules/lru-cache": { "version": "6.0.0", "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz", @@ -3932,6 +4098,23 @@ "node": ">=6" } }, + "node_modules/parse-entities": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/parse-entities/-/parse-entities-2.0.0.tgz", + "integrity": "sha512-kkywGpCcRYhqQIchaWqZ875wzpS/bMKhz5HnN3p7wveJTkTtyAB/AlnS0f8DFSqYW1T82t6yEAkEcB+A1I3MbQ==", + "dependencies": { + "character-entities": "^1.0.0", + "character-entities-legacy": "^1.0.0", + "character-reference-invalid": "^1.0.0", + "is-alphanumerical": "^1.0.0", + "is-decimal": "^1.0.0", + "is-hexadecimal": "^1.0.0" + }, + "funding": { + "type": "github", + "url": "https://github.com/sponsors/wooorm" + } + }, "node_modules/path-exists": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-4.0.0.tgz", @@ -4149,6 +4332,14 @@ "node": ">= 0.8.0" } }, + "node_modules/prismjs": { + "version": "1.29.0", + "resolved": "https://registry.npmjs.org/prismjs/-/prismjs-1.29.0.tgz", + "integrity": "sha512-Kx/1w86q/epKcmte75LNrEoT+lX8pBpavuAbvJWRXar7Hz8jrtF+e3vY751p0R8H9HdArwaCTNDDzHg/ScJK1Q==", + "engines": { + "node": ">=6" + } + }, "node_modules/prop-types": { "version": "15.8.1", "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.8.1.tgz", @@ -4159,6 +4350,18 @@ "react-is": "^16.13.1" } }, + "node_modules/property-information": { + "version": "5.6.0", + "resolved": "https://registry.npmjs.org/property-information/-/property-information-5.6.0.tgz", + "integrity": "sha512-YUHSPk+A30YPv+0Qf8i9Mbfe/C0hdPXk1s1jPVToV8pk8BQtpw10ct89Eo7OWkutrwqvT0eicAxlOg3dOAu8JA==", + "dependencies": { + "xtend": "^4.0.0" + }, + "funding": { + "type": "github", + "url": "https://github.com/sponsors/wooorm" + } + }, "node_modules/punycode": { "version": "2.3.0", "resolved": "https://registry.npmjs.org/punycode/-/punycode-2.3.0.tgz", @@ -4324,6 +4527,21 @@ } } }, + "node_modules/react-syntax-highlighter": { + "version": "15.5.0", + "resolved": "https://registry.npmjs.org/react-syntax-highlighter/-/react-syntax-highlighter-15.5.0.tgz", + "integrity": "sha512-+zq2myprEnQmH5yw6Gqc8lD55QHnpKaU8TOcFeC/Lg/MQSs8UknEA0JC4nTZGFAXC2J2Hyj/ijJ7NlabyPi2gg==", + "dependencies": { + "@babel/runtime": "^7.3.1", + "highlight.js": "^10.4.1", + "lowlight": "^1.17.0", + "prismjs": "^1.27.0", + "refractor": "^3.6.0" + }, + "peerDependencies": { + "react": ">= 0.14.0" + } + }, "node_modules/react-use-measure": { "version": "2.1.1", "resolved": "https://registry.npmjs.org/react-use-measure/-/react-use-measure-2.1.1.tgz", @@ -4374,6 +4592,28 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/refractor": { + "version": "3.6.0", + "resolved": "https://registry.npmjs.org/refractor/-/refractor-3.6.0.tgz", + "integrity": "sha512-MY9W41IOWxxk31o+YvFCNyNzdkc9M20NoZK5vq6jkv4I/uh2zkWcfudj0Q1fovjUQJrNewS9NMzeTtqPf+n5EA==", + "dependencies": { + "hastscript": "^6.0.0", + "parse-entities": "^2.0.0", + "prismjs": "~1.27.0" + }, + "funding": { + "type": "github", + "url": "https://github.com/sponsors/wooorm" + } + }, + "node_modules/refractor/node_modules/prismjs": { + "version": "1.27.0", + "resolved": "https://registry.npmjs.org/prismjs/-/prismjs-1.27.0.tgz", + "integrity": "sha512-t13BGPUlFDR7wRB5kQDG4jjl7XeuH6jbJGt11JHPL96qwsEHNX2+68tFXqc1/k+/jALsbSWJKUOT/hcYAZ5LkA==", + "engines": { + "node": ">=6" + } + }, "node_modules/regenerator-runtime": { "version": "0.14.0", "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.14.0.tgz", @@ -4607,6 +4847,15 @@ "node": ">=0.10.0" } }, + "node_modules/space-separated-tokens": { + "version": "1.1.5", + "resolved": "https://registry.npmjs.org/space-separated-tokens/-/space-separated-tokens-1.1.5.tgz", + "integrity": "sha512-q/JSVd1Lptzhf5bkYm4ob4iWPjx0KiRe3sRFBNrVqbJkFaBm5vbbowy1mymoPNLRa52+oadOhJ+K49wsSeSjTA==", + "funding": { + "type": "github", + "url": "https://github.com/sponsors/wooorm" + } + }, "node_modules/stats.js": { "version": "0.17.0", "resolved": "https://registry.npmjs.org/stats.js/-/stats.js-0.17.0.tgz", @@ -5315,6 +5564,14 @@ "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz", "integrity": "sha512-l4Sp/DRseor9wL6EvV2+TuQn63dMkPjZ/sp9XkghTEbV9KlPS1xUsZ3u7/IQO4wxtcFB4bgpQPRcR3QCvezPcQ==" }, + "node_modules/xtend": { + "version": "4.0.2", + "resolved": "https://registry.npmjs.org/xtend/-/xtend-4.0.2.tgz", + "integrity": "sha512-LKYU1iAXJXUgAXn9URjiu+MWhyUXHsvfp7mcuYm9dSUKK0/CjtrUwFAxD82/mCWbtLsGjFIad0wIsod4zrTAEQ==", + "engines": { + "node": ">=0.4" + } + }, "node_modules/yallist": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz", diff --git a/package.json b/package.json index 88869cc..17adf91 100644 --- a/package.json +++ b/package.json @@ -10,6 +10,9 @@ }, "dependencies": { "@radix-ui/react-dropdown-menu": "^2.0.5", + "@react-three/drei": "9.32.4", + "@react-three/fiber": "8.8.7", + "@react-three/postprocessing": "2.6.2", "@types/node": "20.6.0", "@types/react": "18.2.21", "@types/react-dom": "18.2.7", @@ -23,16 +26,15 @@ "postcss": "8.4.29", "react": "18.2.0", "react-dom": "18.2.0", + "react-syntax-highlighter": "^15.5.0", "tailwind-merge": "^1.14.0", "tailwindcss": "3.3.3", "tailwindcss-animate": "^1.0.7", - "typescript": "5.2.2", "three": "0.145.0", - "@react-three/drei": "9.32.4", - "@react-three/fiber": "8.8.7", - "@react-three/postprocessing": "2.6.2" + "typescript": "5.2.2" }, "devDependencies": { + "@types/react-syntax-highlighter": "^15.5.7", "@types/three": "0.144.0" } } diff --git a/src/components/Showcase.tsx b/src/components/Showcase.tsx index 276b041..dfb79e7 100644 --- a/src/components/Showcase.tsx +++ b/src/components/Showcase.tsx @@ -9,10 +9,11 @@ import { RedirectButton, ShowcaseSocialConnectionCard, } from "./showcase/Components"; +import CodeTabs from "./showcase/CodeTabs"; function Showcase() { return ( -
+

@@ -189,24 +190,28 @@ function Showcase() {

} description={ -
+
Complete user Token Management solution all in caching servers.
} className=" showcase-5 col-span-full w-full lg:col-span-6 " > -
-
- - Never - - - {" "} - more than a{" "} - - - Class - +
+
+
+ + Never + + + {" "} + more than a{" "} + + + Class + +
+ +
diff --git a/src/pages/timeline.tsx b/src/pages/timeline.tsx index 9089f61..56434d9 100644 --- a/src/pages/timeline.tsx +++ b/src/pages/timeline.tsx @@ -1,195 +1,195 @@ import React from "react"; import { - PercentageSVG, - PercentageSVGThird, - PercentageSVGSecondTimeline, + PercentageSVG, + PercentageSVGThird, + PercentageSVGSecondTimeline, } from "../components/timeline/Components"; import { TimelineCard } from "../components/timeline/TimelineCard"; import { Information } from "../components/timeline/Information"; import Carousel from "../components/timeline/CarouselSlider"; -import ArrowIcon from '../components/ArrowIcon' +import ArrowIcon from "../components/ArrowIcon"; function Timeline() { - return ( - <> -
-
- + return ( + <> +
+
+ - + - + - + - + - + - -
+ +
-
-
-
Overview
+
+
+
Overview
-
+
Embed security into the developer workflow.
- + With GitHub, developers can secure their
code in minutes and organizations can
automatically comply with regulations. -
-
- -
-
- +
+ -
+
-

- {`TrustAuthx not only simplifies your user, token and session + > +

+ {`TrustAuthx not only simplifies your user, token and session management but also trims your expenses significantly. Say goodbye to costly alternatives that can set you back. With AuthLite, you'll save valuable time and also enjoy over 65% in savings. It's a win-win for your efficiency and your budget.`} -

-
- - - - - -
- } - ButtonText="Let’s Get Started It’s Free" - > -
+ + +
+ } + ButtonText="Let’s Get Started It’s Free" + > +
-

- {`A Smoother Signup Experience. We've re-imagined the signup + > +

+ {`A Smoother Signup Experience. We've re-imagined the signup process, significantly reducing the time it takes, benefiting everyone involved, and ultimately enhancing conversion rates. Say goodbye to lengthy signups and hello to quicker results.`} -

-
-

- {`No More Separate Sign-Up and Log-In Processes. Our +

+
+

+ {`No More Separate Sign-Up and Log-In Processes. Our straightforward 'Log-On' eliminates the need for separate sign-up and log-in steps, making access swift and hassle-free.`} -

{" "} -
- -
- -
- + +
+ +
+ -
- Save Cost up-to -
- -
- 90% - 65% -
- - - -
-
+ 90% + 65% +
+ + + +
+
- Up by :) -
- - 138% -
- -
-
-
-
- -
-
-
- - - -
- - - - - - - - - - -
- {/* required - */} - -
-
+ > + Up by :) +
+ + 138% +
+ +
+
+
+
+ +
+
+
+ + + +
+ + + + + + + + + + +
+ {/* required + */} + +
+
LLMAI, Transformer Model for Cybersecurity: - + Enable real-time inference
on extensive telemetry data, including raw @@ -199,334 +199,342 @@ function Timeline() { threats. - -
- {/* button */} - - {/* placing next to each other */} - -
-
- + Request Enterprise Access + + +
+ {/* button */} + + {/* placing next to each other */} + +
+
+ -
+
- Speed matters when its about authentication, conversion, token - maintenance or security with TrustAuthx Auth-lite High - performing caching infrastructure get all your data accessed - at the speed of internet . -
- - - - - -
- } - ButtonText="Let’s Get Started It’s Free" - > -
+ + +
+ } + ButtonText="Let’s Get Started It’s Free" + > +
-

- Embrace the elegance of standardized simplicity, making - security and user access straightforward. With its user- - friendly approach, navigating authentication and - authorization has never been easier. -

- -
+ > +

+ Embrace the elegance of standardized simplicity, making + security and user access straightforward. With its user- + friendly approach, navigating authentication and + authorization has never been easier. +

+ +
Extract data from other Auth2.O sources -
+
- + Supports analytical & Dependency workflows -
-
- - - } - buttonLink="" - header="Get Benefited with large Co-Relational Data warehouses " - > -
} + buttonLink="" + header="Get Benefited with large Co-Relational Data warehouses " + > +
- Make your PlanetScale data accessible across your organization - by safely extracting and loading data from Planet into other - databases, such as BigQuery, Snowflake, or Redshift. -
- -
- - {/* next part */} -
- + -
- Save Cost up-to -
- -
- 90% - 65% -
- - -
-
-
+ > + Save Cost up-to +
+ +
+ 90% + 65% +
+ + +
+
+
Get Speed & Supercharge your App with high-performing Caching Servers -
-
- -
- - - - -
-
- -
- - -
-
- Say goodbye to Multiple validation of same user. Our managed - infra. helps to save large amount of validation resource - using a CDW. -
- -
+
+ +
+ + +
+
+ Say goodbye to Multiple validation of same user. Our managed + infra. helps to save large amount of validation resource + using a CDW. +
+ + -
-
-
-
-
-
- -
-
- - -
- -
-
- Checkout What They Say?{" "} -
- -
+ > + Data Wrenching + +
+
+
+
+
+
+ +
+
+ + +
+ +
+
+ Checkout What They Say?{" "} +
+ +
Embed security into the developer workflow.
- + With GitHub, developers can secure. -
- -
- - {[ - , - ]} - - -
-
- Make your PlanetScale data accessible across your -
- organization by safely extracting and loading data from -
- PlanetScale into other databases, such as BigQuery, -
- Snowflake, or Redshift. -
- -
-
- Extract data to other sources -
- -
- -
- Supports analytical workflows -
-
- -
- + > + Learn more about Connect + + - -
-
-
-
-
- - ); + > + Let’s Get Started + + +
+
+
+
+
+ + ); } function GradientCard({ - logo, - number, - header, - description, - footer, - }: { - logo: string; - number: string; - header: string; - description: string; - footer: React.ReactNode; + logo, + number, + header, + description, + footer, +}: { + logo: string; + number: string; + header: string; + description: string; + footer: React.ReactNode; }) { - return ( -
-
- + return ( +
+
+ - {number} -
+ {number} +
-
- +
+ -
{header}
+
{header}
-
- {description} -
-
+
+ {description} +
+
-
+
{footer} -
-
- ); +
+
+ ); } function GradientCardSvg({ children }: { children: React.ReactNode }) { - return ( -
- - - - - - - - - - - -

- {children} -

-
- ); + return ( +
+ + + + + + + + + + + +

+ {children} +

+
+ ); } export default Timeline; diff --git a/src/styles/globals.css b/src/styles/globals.css index 4ee96b9..89d6461 100644 --- a/src/styles/globals.css +++ b/src/styles/globals.css @@ -86,10 +86,10 @@ .gradientbg { background: linear-gradient( - 90deg, - rgba(188.03, 0, 255, 0.24) 0%, - rgba(77.27, 0, 255, 0.24) 50%, - rgba(0, 56.67, 255, 0.24) 100% + 90deg, + rgba(188.03, 0, 255, 0.24) 0%, + rgba(77.27, 0, 255, 0.24) 50%, + rgba(0, 56.67, 255, 0.24) 100% ); } @@ -99,10 +99,9 @@ .showcase-4 { background: linear-gradient(47deg, #0e2bfd 0%, #0cf 100%); - box-shadow: - 0px 10px 50px -2.5px rgba(0, 0, 0, 0.1), - 0px 2.28853px 11.4427px -1.66667px rgba(0, 0, 0, 0.1), - 0px 0.60219px 3.01094px -0.83333px rgba(0, 0, 0, 0.1); + box-shadow: 0px 10px 50px -2.5px rgba(0, 0, 0, 0.1), + 0px 2.28853px 11.4427px -1.66667px rgba(0, 0, 0, 0.1), + 0px 0.60219px 3.01094px -0.83333px rgba(0, 0, 0, 0.1); } .showcase-6 { @@ -113,62 +112,58 @@ .showcase-9 { background: linear-gradient(302deg, #00f6ff 0%, #2b00ff 100%); - box-shadow: - 0px 10px 50px -2.5px rgba(0, 0, 0, 0.1), - 0px 2.28853px 11.4427px -1.66667px rgba(0, 0, 0, 0.1), - 0px 0.60219px 3.01094px -0.83333px rgba(0, 0, 0, 0.1); + box-shadow: 0px 10px 50px -2.5px rgba(0, 0, 0, 0.1), + 0px 2.28853px 11.4427px -1.66667px rgba(0, 0, 0, 0.1), + 0px 0.60219px 3.01094px -0.83333px rgba(0, 0, 0, 0.1); } .timeline-radial-gradient { background: radial-gradient( - 150.86% 133.6% at 131.45% 64.97%, - #4f4848 0%, - #000 86.35% + 150.86% 133.6% at 131.45% 64.97%, + #4f4848 0%, + #000 86.35% ); } .showcase-6-shadow { - box-shadow: - 0px 10px 50px -3.75px rgba(0, 0, 0, 0.01), - 0px 2.28853px 11.4427px -2.5px rgba(0, 0, 0, 0.03), - 0px 0.60219px 3.01094px -1.25px rgba(0, 0, 0, 0.04); + box-shadow: 0px 10px 50px -3.75px rgba(0, 0, 0, 0.01), + 0px 2.28853px 11.4427px -2.5px rgba(0, 0, 0, 0.03), + 0px 0.60219px 3.01094px -1.25px rgba(0, 0, 0, 0.04); } .showcase-7 { background: linear-gradient(133deg, #00aeff 0%, #00ff6e 100%); - box-shadow: - 0px 10px 50px -2.5px rgba(0, 0, 0, 0.1), - 0px 2.28853px 11.4427px -1.66667px rgba(0, 0, 0, 0.1), - 0px 0.60219px 3.01094px -0.83333px rgba(0, 0, 0, 0.1); + box-shadow: 0px 10px 50px -2.5px rgba(0, 0, 0, 0.1), + 0px 2.28853px 11.4427px -1.66667px rgba(0, 0, 0, 0.1), + 0px 0.60219px 3.01094px -0.83333px rgba(0, 0, 0, 0.1); } .showcase-2 { background: radial-gradient( - 70.71% 70.71% at 50% 50%, - #c499e6 0%, - rgba(255, 255, 255, 0.4) 100% + 70.71% 70.71% at 50% 50%, + #c499e6 0%, + rgba(255, 255, 255, 0.4) 100% ); - box-shadow: - 0px 10px 50px -2.5px rgba(0, 0, 0, 0.1), - 0px 2.28853px 11.4427px -1.66667px rgba(0, 0, 0, 0.1), - 0px 0.60219px 3.01094px -0.83333px rgba(0, 0, 0, 0.1); + box-shadow: 0px 10px 50px -2.5px rgba(0, 0, 0, 0.1), + 0px 2.28853px 11.4427px -1.66667px rgba(0, 0, 0, 0.1), + 0px 0.60219px 3.01094px -0.83333px rgba(0, 0, 0, 0.1); } .showcase-3 { background: linear-gradient(233deg, #faffc6 -19.83%, #e00 84.46%); - box-shadow: - 0px 10px 50px -2.5px rgba(0, 0, 0, 0.1), - 0px 2.28853px 11.4427px -1.66667px rgba(0, 0, 0, 0.1), - 0px 0.60219px 3.01094px -0.83333px rgba(0, 0, 0, 0.1); + box-shadow: 0px 10px 50px -2.5px rgba(0, 0, 0, 0.1), + 0px 2.28853px 11.4427px -1.66667px rgba(0, 0, 0, 0.1), + 0px 0.60219px 3.01094px -0.83333px rgba(0, 0, 0, 0.1); } .showcase-5 { - background: url("/showcase/5.svg"); + border-radius: 20px; + background: linear-gradient(238deg, #60f 0%, #f700ff 100%); + background-size: cover; - box-shadow: - 0px 10px 50px -2.5px rgba(0, 0, 0, 0.1), - 0px 2.28853px 11.4427px -1.66667px rgba(0, 0, 0, 0.1), - 0px 0.60219px 3.01094px -0.83333px rgba(0, 0, 0, 0.1); + box-shadow: 0px 10px 50px -2.5px rgba(0, 0, 0, 0.1), + 0px 2.28853px 11.4427px -1.66667px rgba(0, 0, 0, 0.1), + 0px 0.60219px 3.01094px -0.83333px rgba(0, 0, 0, 0.1); } .showcase-1-btn { @@ -186,9 +181,9 @@ .showcase-percentage-first-gradient { background: linear-gradient( - 180deg, - rgba(255, 255, 255, 0.05) 0%, - rgba(255, 255, 255, 0.2) 100% + 180deg, + rgba(255, 255, 255, 0.05) 0%, + rgba(255, 255, 255, 0.2) 100% ); } @@ -202,11 +197,11 @@ .gradient-text-ai { background: linear-gradient( - 114deg, - #9eff00 26.62%, - rgba(38, 180, 225, 0.85) 42.39%, - rgba(174, 117, 219, 0.8) 61.26%, - #ff9228 76.25% + 114deg, + #9eff00 26.62%, + rgba(38, 180, 225, 0.85) 42.39%, + rgba(174, 117, 219, 0.8) 61.26%, + #ff9228 76.25% ); background-clip: text; -webkit-background-clip: text; @@ -227,10 +222,10 @@ .textgradient { background: linear-gradient( - 90deg, - #d35dfd 0.01%, - #9263ff 50.01%, - #6a8bff 100% + 90deg, + #d35dfd 0.01%, + #9263ff 50.01%, + #6a8bff 100% ); -webkit-background-clip: text; -webkit-text-fill-color: transparent; @@ -238,25 +233,25 @@ } #gradient-canvas { - width:100%; - height:100%; - --gradient-color-1: #9EFF00; - --gradient-color-2: #00B89C; - --gradient-color-3: #D1FFD0; + width: 100%; + height: 100%; + --gradient-color-1: #9eff00; + --gradient-color-2: #00b89c; + --gradient-color-3: #d1ffd0; --gradient-color-4: #fff; - z-index:0; + z-index: 0; } -h1{ +h1 { font-family: sohne-var, "Helvetica Neue", Arial, sans-serif; font-weight: 800; - font-size:4rem; + font-size: 4rem; color: #343434; - position:absolute; + position: absolute; padding: 2rem; - top:0; - z-index:100; - text-align:center; - width:100%; + top: 0; + z-index: 100; + text-align: center; + width: 100%; mix-blend-mode: difference; -} \ No newline at end of file +} From 82923aa6da1a0d7119932058a11c39aa68d8dff0 Mon Sep 17 00:00:00 2001 From: diffim Date: Thu, 14 Sep 2023 22:43:00 +0400 Subject: [PATCH 2/4] added new files --- public/showcase/code-section/circle-1.svg | 22 +++++++ public/showcase/code-section/circle-2.svg | 3 + public/showcase/code-section/circle-3.svg | 18 ++++++ public/showcase/code-section/cone.svg | 9 +++ src/components/showcase/CodeTabs.tsx | 76 +++++++++++++++++++++++ src/pages/demo-code.tsx | 12 ++++ 6 files changed, 140 insertions(+) create mode 100644 public/showcase/code-section/circle-1.svg create mode 100644 public/showcase/code-section/circle-2.svg create mode 100644 public/showcase/code-section/circle-3.svg create mode 100644 public/showcase/code-section/cone.svg create mode 100644 src/components/showcase/CodeTabs.tsx create mode 100644 src/pages/demo-code.tsx diff --git a/public/showcase/code-section/circle-1.svg b/public/showcase/code-section/circle-1.svg new file mode 100644 index 0000000..f1e7664 --- /dev/null +++ b/public/showcase/code-section/circle-1.svg @@ -0,0 +1,22 @@ + + + + + + + + + + + + + + + + + + + + + + diff --git a/public/showcase/code-section/circle-2.svg b/public/showcase/code-section/circle-2.svg new file mode 100644 index 0000000..11a862d --- /dev/null +++ b/public/showcase/code-section/circle-2.svg @@ -0,0 +1,3 @@ + + + diff --git a/public/showcase/code-section/circle-3.svg b/public/showcase/code-section/circle-3.svg new file mode 100644 index 0000000..4813abd --- /dev/null +++ b/public/showcase/code-section/circle-3.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + + + + + + diff --git a/public/showcase/code-section/cone.svg b/public/showcase/code-section/cone.svg new file mode 100644 index 0000000..6430f90 --- /dev/null +++ b/public/showcase/code-section/cone.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/src/components/showcase/CodeTabs.tsx b/src/components/showcase/CodeTabs.tsx new file mode 100644 index 0000000..7c37236 --- /dev/null +++ b/src/components/showcase/CodeTabs.tsx @@ -0,0 +1,76 @@ +import React, { useState } from "react"; +import { Light as SyntaxHighlighter } from "react-syntax-highlighter"; + +interface CodeTabsProps {} + +const CodeTabs: React.FC = () => { + const [activeTab, setActiveTab] = useState("python"); + + const handleTabClick = (tab: string) => { + setActiveTab(tab); + }; + + const getCode = () => { + switch (activeTab) { + case "python": + return ` + def trust_authx(): + # Python code + pass + `; + case "javascript": + return ` + function trustAuth() { + // JavaScript code + } + `; + case "go": + return ` + func TrustAuthX() { + // Go code + } + `; + default: + return ""; + } + }; + + return ( +
+
+ + + +
+ +
+ + {getCode()} + +
+
+ ); +}; + +export default CodeTabs; diff --git a/src/pages/demo-code.tsx b/src/pages/demo-code.tsx new file mode 100644 index 0000000..2232aeb --- /dev/null +++ b/src/pages/demo-code.tsx @@ -0,0 +1,12 @@ +import CodeTabs from "../components/showcase/CodeTabs"; +import React from "react"; + +function REAL() { + return ( +
+ +
+ ); +} + +export default REAL; From bd82e95a609b945d2d0a6dd5b129ff87e0e6f2a3 Mon Sep 17 00:00:00 2001 From: diffim Date: Thu, 14 Sep 2023 22:47:29 +0400 Subject: [PATCH 3/4] fixed cards in timeline --- src/styles/globals.css | 53 ++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 53 insertions(+) diff --git a/src/styles/globals.css b/src/styles/globals.css index 89d6461..3b4d8cf 100644 --- a/src/styles/globals.css +++ b/src/styles/globals.css @@ -3,6 +3,49 @@ @tailwind utilities; @layer base { + .carousel { + position: relative; + width: 538px; + height: 614px; + perspective: 500px; + transform-style: preserve-3d; + } + + .card-container { + position: absolute; + width: 100%; + height: 100%; + transform: rotateY(calc(var(--offset) * 50deg)) + scaleY(calc(1 + var(--abs-offset) * -0.4)) + translateZ(calc(var(--abs-offset) * -30rem)) + translateX(calc(var(--direction) * -5rem)); + filter: blur(calc(var(--abs-offset) * 1rem)); + transition: all 0.3s ease-out; + } + + .nav { + color: black; + font-size: 5rem; + position: absolute; + display: flex; + align-items: center; + justify-content: center; + top: 50%; + z-index: 2; + cursor: pointer; + user-select: none; + background: unset; + border: unset; + &.left { + transform: translateX(-120%) translatey(-50%); + } + + &.right { + right: 0; + transform: translateX(120%) translatey(-50%); + } + } + :root { --background: 0 0% 100%; --foreground: 240 10% 3.9%; @@ -104,6 +147,16 @@ 0px 0.60219px 3.01094px -0.83333px rgba(0, 0, 0, 0.1); } + .timeline-gradientcard-gradient { + background: linear-gradient( + 38deg, + #000 30.83%, + #151515 54.12%, + #555 100.02% + ); + box-shadow: 0px 33.00911px 67.08302px -15.97215px rgba(0, 0, 0, 0.4); + } + .showcase-6 { background: linear-gradient(238deg, #60f 0%, #f700ff 100%); background-attachment: fixed; From 26cd3e495606f2fed5120df00680743a85ff5b3d Mon Sep 17 00:00:00 2001 From: diffim Date: Thu, 14 Sep 2023 22:59:41 +0400 Subject: [PATCH 4/4] fixed spacing between texts --- src/pages/timeline.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/pages/timeline.tsx b/src/pages/timeline.tsx index 56434d9..02c1fa4 100644 --- a/src/pages/timeline.tsx +++ b/src/pages/timeline.tsx @@ -208,8 +208,8 @@ function Timeline() { {/* placing next to each other */} -
-
+
+