diff --git a/.eslintrc.cjs b/.eslintrc.cjs index 90da43a5..6e161bfc 100644 --- a/.eslintrc.cjs +++ b/.eslintrc.cjs @@ -2,7 +2,7 @@ const path = require("node:path"); const paddingLineBetweenStatements = [ "error", - { blankLine: "always", prev: "*", next: "return" }, + { blankLine: "always", next: "return", prev: "*" }, ] .concat( [ @@ -15,16 +15,16 @@ const paddingLineBetweenStatements = [ "if", ] .map((item) => [ - { blankLine: "always", prev: item, next: "*" }, - { blankLine: "always", prev: "*", next: item }, + { blankLine: "always", next: "*", prev: item }, + { blankLine: "always", next: item, prev: "*" }, ]) .flat(), ) .concat([ { blankLine: "any", - prev: ["singleline-const"], next: ["singleline-const"], + prev: ["singleline-const"], }, ]); @@ -33,55 +33,61 @@ module.exports = { browser: true, es2021: true, }, - settings: { - react: { - version: "detect", - }, - }, extends: [ "next/core-web-vitals", "plugin:@typescript-eslint/recommended", "plugin:react-hooks/recommended", + "plugin:jsx-a11y/recommended", ], parser: "@typescript-eslint/parser", parserOptions: { project: path.join(__dirname, "tsconfig.json"), }, - plugins: ["@typescript-eslint", "react-hooks", "@stylistic"], + plugins: ["@typescript-eslint", "react-hooks", "@stylistic", "perfectionist"], rules: { - // @TODO: These should be removed when fixed - "@typescript-eslint/no-explicit-any": "off", "@next/next/no-img-element": "off", - "jsx-a11y/alt-text": "off", - "react/display-name": "off", + "@stylistic/padding-line-between-statements": paddingLineBetweenStatements, + + "@typescript-eslint/consistent-type-imports": "error", + "@typescript-eslint/no-explicit-any": "off", + "@typescript-eslint/no-shadow": "error", + "@typescript-eslint/no-unused-vars": "error", + "@typescript-eslint/no-use-before-define": "error", + "@typescript-eslint/no-var-requires": "off", "arrow-body-style": "error", "camelcase": "off", "global-require": "off", + "jsx-a11y/anchor-is-valid": "off", "no-console": ["error", { allow: ["warn", "error"] }], "no-shadow": "off", "no-unused-vars": "off", "no-useless-return": "error", "object-shorthand": "error", + + "perfectionist/sort-enums": "error", + "perfectionist/sort-exports": "error", + "perfectionist/sort-interfaces": "error", + "perfectionist/sort-object-types": "error", + "perfectionist/sort-objects": "error", + "perfectionist/sort-union-types": "error", + "prefer-const": "error", "prefer-template": "error", "quote-props": ["error", "consistent-as-needed"], - "@stylistic/padding-line-between-statements": paddingLineBetweenStatements, - - "@typescript-eslint/consistent-type-imports": "error", - "@typescript-eslint/no-shadow": "error", - "@typescript-eslint/no-unused-vars": "error", - "@typescript-eslint/no-use-before-define": "error", - "@typescript-eslint/no-var-requires": "off", + "react-hooks/exhaustive-deps": "error", + "react-hooks/rules-of-hooks": "error", "react/destructuring-assignment": [ "error", "always", { destructureInSignature: "always" }, ], + "react/display-name": "off", "react/function-component-definition": "off", "react/jsx-boolean-value": "error", + "react/jsx-curly-brace-presence": "error", "react/jsx-filename-extension": "off", "react/jsx-fragments": "error", "react/jsx-key": ["error", { warnOnDuplicates: true }], @@ -97,8 +103,10 @@ module.exports = { "react/react-in-jsx-scope": "off", "react/require-default-props": "off", "react/self-closing-comp": "error", - - "react-hooks/exhaustive-deps": "error", - "react-hooks/rules-of-hooks": "error", + }, + settings: { + react: { + version: "detect", + }, }, }; diff --git a/i18n.js b/i18n.js index 34d1224b..8c8b7ff1 100644 --- a/i18n.js +++ b/i18n.js @@ -1,26 +1,26 @@ module.exports = { - locales: ["en", "zh-HK", "zh-CN"], defaultLocale: "en", + loadLocaleFrom: (lang, ns) => + import(`./public/locales/${lang}/${ns}.json`).then((m) => m.default), + locales: ["en", "zh-HK", "zh-CN"], pages: { "*": ["common"], "/": ["home"], - "/contact": ["contact"], "/about": ["about"], - "/terms-and-conditions": ["terms_and_conditions"], - "/privacy-policy": ["policy"], - "/staking-service": ["staking_service"], - "/infrastructure": ["validator_infrastructure"], - "/developer-tools": ["developer_tools"], - "/products": ["products"], "/analytics-tools": ["analytics_tools"], + "/author/[author]": ["blog"], + "/blog": ["blog"], + "/blog/[title]": ["blog"], + "/contact": ["contact"], + "/developer-tools": ["developer_tools"], "/enterprise-solution": ["enterprise_solution"], + "/infrastructure": ["validator_infrastructure"], + "/privacy-policy": ["policy"], + "/products": ["products"], "/staking": ["staking"], + "/staking-service": ["staking_service"], "/staking/[title]": ["staking"], - "/blog": ["blog"], - "/blog/[title]": ["blog"], "/tag/[tag]": ["blog"], - "/author/[author]": ["blog"], + "/terms-and-conditions": ["terms_and_conditions"], }, - loadLocaleFrom: (lang, ns) => - import(`./public/locales/${lang}/${ns}.json`).then((m) => m.default), }; diff --git a/next-sitemap.config.js b/next-sitemap.config.js index fe225177..a2f40d8d 100644 --- a/next-sitemap.config.js +++ b/next-sitemap.config.js @@ -1,11 +1,4 @@ module.exports = { - // These are not tracked for now - changefreq: null, - autoLastmod: false, - priority: null, - - generateRobotsTxt: false, - siteUrl: "https://www.forbole.com", additionalPaths: async () => { if (!process.env.GHOST_PRIVATE_KEY || !process.env.NEXT_PUBLIC_GHOST_API) return []; @@ -29,8 +22,8 @@ module.exports = { const getTags = () => ghostAdminApi.tags.browse({ - limit: 1000, fields: "slug", + limit: 1000, }); const [tags, posts] = await Promise.all([getTags(), getPosts()]); @@ -50,4 +43,9 @@ module.exports = { loc, })); }, + autoLastmod: false, + changefreq: null, + generateRobotsTxt: false, + priority: null, + siteUrl: "https://www.forbole.com", }; diff --git a/next.config.js b/next.config.js index 8de1d519..18aa1efd 100644 --- a/next.config.js +++ b/next.config.js @@ -9,7 +9,9 @@ const withBundleAnalyzer = bundleAnalyzer({ }); const baseConfig = nextTranslate({ - poweredByHeader: false, + eslint: { + ignoreDuringBuilds: true, + }, images: { remotePatterns: [ { @@ -17,16 +19,12 @@ const baseConfig = nextTranslate({ protocol: "https", }, { - protocol: "https", hostname: "www.forbole.com", + protocol: "https", }, ], }, - rewrites: async () => - ["/rss", "/rss/"].map((path) => ({ - destination: "/rss.xml", - source: path, - })), + poweredByHeader: false, redirects: async () => [ { destination: "/zh-HK/:path*", @@ -39,6 +37,11 @@ const baseConfig = nextTranslate({ source: `${prefix}/native-staking`, })), ], + rewrites: async () => + ["/rss", "/rss/"].map((path) => ({ + destination: "/rss.xml", + source: path, + })), webpack: (config) => { config.module.rules.push({ test: /\.svg$/, @@ -47,9 +50,6 @@ const baseConfig = nextTranslate({ return config; }, - eslint: { - ignoreDuringBuilds: true, - }, }); module.exports = million.next(withBundleAnalyzer(baseConfig), { auto: true }); diff --git a/package.json b/package.json index e2d67ddf..a31a1644 100644 --- a/package.json +++ b/package.json @@ -22,27 +22,27 @@ }, "dependencies": { "@apollo/client": "^3.8.8", - "@emotion/react": "^11.11.1", + "@emotion/react": "^11.11.3", "@emotion/server": "^11.11.0", "@emotion/styled": "^11.11.0", - "@mui/icons-material": "^5.15.1", - "@mui/lab": "^5.0.0-alpha.157", - "@mui/material": "^5.15.1", + "@mui/icons-material": "^5.15.2", + "@mui/lab": "^5.0.0-alpha.158", + "@mui/material": "^5.15.2", "@n8tb1t/use-scroll-position": "^2.0.3", "@next/bundle-analyzer": "^14.0.4", "@socialgouv/matomo-next": "^1.8.0", "@tryghost/admin-api": "^1.13.11", "@tryghost/content-api": "^1.11.20", - "axios": "^1.6.2", + "axios": "^1.6.3", "dotenv": "^16.3.1", "dotenv-defaults": "^5.0.2", "framer-motion": "^10.16.16", "graphql": "^16.8.1", - "isomorphic-dompurify": "^1.13.0", + "isomorphic-dompurify": "^2.0.0", "jsdom": "^23.0.1", "markdown-to-jsx": "^7.3.2", "million": "^2.6.4", - "moment": "^2.29.4", + "moment": "^2.30.1", "moment-timezone": "^0.5.43", "next": "^14.0.4", "next-sitemap": "^4.2.3", @@ -71,19 +71,21 @@ "@types/react-dom": "^18.2.18", "@types/rss": "^0.0.32", "@types/validator": "^13.11.7", - "@typescript-eslint/eslint-plugin": "^6.15.0", - "@typescript-eslint/parser": "^6.15.0", + "@typescript-eslint/eslint-plugin": "^6.16.0", + "@typescript-eslint/parser": "^6.16.0", "autoprefixer": "^10.4.16", "eslint": "^8.56.0", "eslint-config-next": "^14.0.4", + "eslint-plugin-jsx-a11y": "^6.8.0", + "eslint-plugin-perfectionist": "^2.5.0", "eslint-plugin-playwright": "^0.20.0", "husky": "^8.0.3", - "i18next-parser": "^8.9.0", + "i18next-parser": "^8.11.0", "postcss": "^8.4.32", "prettier": "^3.1.1", "rss": "^1.2.2", "sass": "^1.69.5", - "stylelint": "^16.0.2", + "stylelint": "^16.1.0", "stylelint-config-standard-scss": "^12.0.0", "stylelint-order": "^6.0.4", "stylelint-scss": "^6.0.0", diff --git a/playwright.config.ts b/playwright.config.ts index edd17158..02ae55e6 100644 --- a/playwright.config.ts +++ b/playwright.config.ts @@ -8,27 +8,27 @@ if (process.env.E2E_MANUAL !== "true") { // https://playwright.dev/docs/test-configuration export default defineConfig({ - timeout: 30000, globalTimeout: 600000, + grepInvert, projects: [ { name: "Desktop", use: { - viewport: { width: 1024, height: 768 }, + viewport: { height: 768, width: 1024 }, }, }, { name: "Mobile", + testIgnore: [/backend.spec.ts/], use: { - viewport: { width: 375, height: 812 }, + viewport: { height: 812, width: 375 }, }, - testIgnore: [/backend.spec.ts/], }, ], + testDir: "./e2e", + timeout: 30000, use: { baseURL: "http://localhost:3000", trace: "retain-on-failure", }, - testDir: "./e2e", - grepInvert, }); diff --git a/scripts/rss.xml.ts b/scripts/rss.xml.ts index b85019b9..b4156804 100644 --- a/scripts/rss.xml.ts +++ b/scripts/rss.xml.ts @@ -29,10 +29,10 @@ export const main = async () => { .filter((p: any) => !p.title.includes(stakingGuidePrefix)) .forEach((post: any) => { feed.item({ - title: post.title, + date: post.created_at, description: post.excerpt, + title: post.title, url: `${site_url}/blog/${post.slug}`, - date: post.created_at, }); }); diff --git a/src/api/authors/index.ts b/src/api/authors/index.ts index 99bdebbe..e46f350a 100644 --- a/src/api/authors/index.ts +++ b/src/api/authors/index.ts @@ -22,10 +22,10 @@ export const getPostsByAuthor = async (query: { try { const posts = await api.posts.browse({ filter: `author:${query.author}`, + formats: "html", include: "tags,authors", limit: 5, page: query?.page || 1, - formats: "html", }); return posts ?? null; diff --git a/src/api/index.ts b/src/api/index.ts index 7859b590..579e91de 100644 --- a/src/api/index.ts +++ b/src/api/index.ts @@ -4,7 +4,7 @@ const GhostContentAPI = require("@tryghost/content-api/cjs/content-api"); // Create API instance with site credentials export const ghostApi = new GhostContentAPI({ - url: process.env.NEXT_PUBLIC_GHOST_API, key: process.env.NEXT_PUBLIC_GHOST_KEY, + url: process.env.NEXT_PUBLIC_GHOST_API, version: "v3.0", }); diff --git a/src/api/networks/index.ts b/src/api/networks/index.ts index daf74ace..2f6a3e21 100644 --- a/src/api/networks/index.ts +++ b/src/api/networks/index.ts @@ -3,18 +3,18 @@ import type { IPost } from "./interface"; /** Gets posts from remote */ export const getNetworkPosts = async ({ - limit = 11, - page = 1, // filter = "tag:-[hash-zhs,hash-zht]", filter = "tags:[staking]", + limit = 11, + page = 1, }: IPost) => { try { return await api.posts.browse({ + filter, + formats: "html", include: "tags,authors", limit, page, - filter, - formats: "html", }); } catch (err) { // eslint-disable-next-line no-console diff --git a/src/api/networks/interface.ts b/src/api/networks/interface.ts index 3a8f7b6f..6a8e2b31 100644 --- a/src/api/networks/interface.ts +++ b/src/api/networks/interface.ts @@ -1,5 +1,5 @@ export interface IPost { + filter?: string; limit?: number; page?: number; - filter?: string; } diff --git a/src/api/posts/index.ts b/src/api/posts/index.ts index 08a5f27e..8b414fae 100644 --- a/src/api/posts/index.ts +++ b/src/api/posts/index.ts @@ -5,17 +5,17 @@ export const stakingGuidePrefix = "how-to-stake"; /** Gets posts from remote */ export const getPosts = async ({ + filter = "tags:-[careers]", limit = 11, page = 1, - filter = "tags:-[careers]", }: IPost) => { try { return await api.posts.browse({ + filter, + formats: "html", include: "tags,authors", limit, page, - filter, - formats: "html", }); } catch (err) { // eslint-disable-next-line no-console @@ -27,15 +27,15 @@ export const getPosts = async ({ /** Gets posts from remote based on See More on mobile device */ export const getAllPosts = async ({ - limit, filter = "tags:-[careers]", + limit, }: IPost) => { try { return await api.posts.browse({ - include: "tags,authors", - limit, filter, formats: "html", + include: "tags,authors", + limit, }); } catch (err) { // eslint-disable-next-line no-console @@ -51,8 +51,8 @@ export const getSinglePost = async (slug: string) => { return await api.posts.read( { slug }, { - include: "tags,authors", formats: "html", + include: "tags,authors", }, ); } catch (err) { diff --git a/src/api/posts/interface.ts b/src/api/posts/interface.ts index 3a8f7b6f..6a8e2b31 100644 --- a/src/api/posts/interface.ts +++ b/src/api/posts/interface.ts @@ -1,5 +1,5 @@ export interface IPost { + filter?: string; limit?: number; page?: number; - filter?: string; } diff --git a/src/api/tags/index.ts b/src/api/tags/index.ts index cc8bc172..62a98e11 100644 --- a/src/api/tags/index.ts +++ b/src/api/tags/index.ts @@ -1,13 +1,13 @@ import { ghostApi as api } from "../index"; -export const getPostsByTag = async (query: { tag: string; page?: number }) => { +export const getPostsByTag = async (query: { page?: number; tag: string }) => { try { const posts = await api.posts.browse({ filter: `tags:${query.tag}`, + formats: "html", include: "tags,authors", limit: 10, page: query?.page || 1, - formats: "html", }); return posts ?? null; diff --git a/src/api/whatsnew/index.ts b/src/api/whatsnew/index.ts index b68a0e8e..0e87c6ba 100644 --- a/src/api/whatsnew/index.ts +++ b/src/api/whatsnew/index.ts @@ -18,7 +18,7 @@ export const getPageByTag = async (tag: string) => { const pages = (await api.pages.browse({ filter: `tag:${tag}`, published_at: "desc", - })) as { title: string; html: string; id: string }[]; + })) as { html: string; id: string; title: string }[]; const data = pages.map((res) => { const window = parseMd(res.html); @@ -29,19 +29,19 @@ export const getPageByTag = async (tag: string) => { ); return { - title: res.title, - list, - imageHref: window.document.querySelector("img")?.src, - btnName: window.document.querySelector("a")?.innerHTML, btnClick: window.document.querySelector("a")?.href, + btnName: window.document.querySelector("a")?.innerHTML, + imageHref: window.document.querySelector("img")?.src, + list, + title: res.title, }; }) as { - title: string; - list: string[]; - imageHref: string; - btnName: string; btnClick: string; + btnName: string; id: string; + imageHref: string; + list: string[]; + title: string; }[]; return data ?? null; diff --git a/src/components/Carousel/index.tsx b/src/components/Carousel/index.tsx index 74f8e856..44aba7c7 100644 --- a/src/components/Carousel/index.tsx +++ b/src/components/Carousel/index.tsx @@ -20,7 +20,7 @@ type PersonInfo = { position: string; }; -const PersonCard = ({ desc, name, position, img }: PersonInfo) => ( +const PersonCard = ({ desc, img, name, position }: PersonInfo) => ( {img && } @@ -68,15 +68,15 @@ const Carousel = ({ personList }: CarouselProps) => { void; desc?: string; disabled?: boolean; imageAlt?: string; @@ -18,8 +19,8 @@ type Props = { }; const IntroPanel = ({ + btnLink, btnName, - btn_Click, desc, disabled, imageAlt, @@ -57,38 +58,36 @@ const IntroPanel = ({ > {title} - {btnName && ( - - {btnName} - + {btnName && btnLink && ( + + + {btnName} + + )} diff --git a/src/components/arrow/index.tsx b/src/components/arrow/index.tsx index bc11f63b..1eb7e209 100644 --- a/src/components/arrow/index.tsx +++ b/src/components/arrow/index.tsx @@ -13,12 +13,12 @@ export enum Direction { type Props = { className: string; - sx?: SxProps; direction?: Direction; role?: string; + sx?: SxProps; }; -export default function Arraw({ className, sx, direction, role }: Props) { +export default function Arraw({ className, direction, role, sx }: Props) { const theme = useTheme(); const [rotate, setRotate] = useState(0); @@ -45,24 +45,24 @@ export default function Arraw({ className, sx, direction, role }: Props) { className={className} role={role} sx={{ - "userSelect": "none", - "display": "flex", - "width": "48px", - "height": "48px", - [theme.breakpoints.down("laptop")]: { - width: "36px", - height: "36px", - }, - "cursor": "pointer", "& svg": { - "transition": "fill 0.3s", - "filter": - "drop-shadow(0px 14px 64px rgba(2, 38, 225, 0.12)) drop-shadow(0px 8px 22px rgba(2, 38, 225, 0.12))", - "fill": " #FFF", "& path": { stroke: theme.palette.custom.forbole.blue, }, + "fill": " #FFF", + "filter": + "drop-shadow(0px 14px 64px rgba(2, 38, 225, 0.12)) drop-shadow(0px 8px 22px rgba(2, 38, 225, 0.12))", + "transition": "fill 0.3s", + }, + "cursor": "pointer", + "display": "flex", + "height": "48px", + [theme.breakpoints.down("laptop")]: { + height: "36px", + width: "36px", }, + "userSelect": "none", + "width": "48px", ...sx, }} zIndex={2} diff --git a/src/components/background.module.scss b/src/components/background.module.scss index 7bd99bd3..8ee7979f 100644 --- a/src/components/background.module.scss +++ b/src/components/background.module.scss @@ -11,3 +11,32 @@ display: none; } } + +.horseWrapperDesktop { + height: 50vw; + left: 0; + position: absolute; + right: 0; + top: 0; + + @media (max-width: 550px) { + img { + display: none; + } + } +} + +.horseWrapperMobile { + height: 120vw; + left: 0; + margin-top: 100px; + position: absolute; + right: 0; + top: 0; + + @media (min-width: 550px) { + img { + display: none; + } + } +} diff --git a/src/components/background.tsx b/src/components/background.tsx index 81676ef4..e167fb6c 100644 --- a/src/components/background.tsx +++ b/src/components/background.tsx @@ -17,17 +17,17 @@ const Background = ({ displayHorse }: { displayHorse?: boolean }) => { { {displayHorse && ( <> - + Forbole Horse Logo - + Forbole Horse Logo diff --git a/src/components/cardSwiper/index.tsx b/src/components/cardSwiper/index.tsx index 4988cc6b..e017871c 100644 --- a/src/components/cardSwiper/index.tsx +++ b/src/components/cardSwiper/index.tsx @@ -11,12 +11,12 @@ import { BoxCSS } from "./BoxCSS"; SwiperCore.use([Navigation]); type Props = { + className?: string; imagesList: string[]; style?: CSSProperties; - className?: string; }; -const CardSwiper = ({ imagesList, style, className }: Props) => { +const CardSwiper = ({ className, imagesList, style }: Props) => { const theme = useTheme(); return ( @@ -24,15 +24,15 @@ const CardSwiper = ({ imagesList, style, className }: Props) => { { className="c-prev" direction={Direction.Left} sx={{ - position: "absolute", left: "5px", + position: "absolute", top: "50%", transform: "translateY(-50%)", }} diff --git a/src/components/contact-form/index.tsx b/src/components/contact-form/index.tsx index 870f8686..7aae376c 100644 --- a/src/components/contact-form/index.tsx +++ b/src/components/contact-form/index.tsx @@ -15,15 +15,15 @@ import CtaButton from "../cta-button"; import FormInput from "../formInput"; type Props = { + canSubmit: boolean; + handleInputChange: (event: any) => void; + handleSubmit: (event: any) => void; inputs: { - name: string; - email: string; company: string; + email: string; help: string; + name: string; }; - handleInputChange: (event: any) => void; - handleSubmit: (event: any) => void; - canSubmit: boolean; isLoading: boolean; }; @@ -31,9 +31,6 @@ const MenuProps = { PaperProps: { style: {}, sx: { - "backgroundColor": "white", - "borderRadius": "8px", - "boxShadow": "4px 8px 24px 0px rgba(116, 81, 255, 0.28)", "& li:hover": { backgroundColor: "rgba(107, 97, 254, 0.24)", }, @@ -43,12 +40,15 @@ const MenuProps = { "& li.Mui-selected:hover": { backgroundColor: "rgba(107, 97, 254, 0.8)", }, + "backgroundColor": "white", + "borderRadius": "8px", + "boxShadow": "4px 8px 24px 0px rgba(116, 81, 255, 0.28)", }, }, }; const ContactFrom = forwardRef( - ({ inputs, handleInputChange, handleSubmit, canSubmit, isLoading }, ref) => { + ({ canSubmit, handleInputChange, handleSubmit, inputs, isLoading }, ref) => { const theme = useTheme(); const { t } = useTranslation("enterprise_solution"); @@ -69,26 +69,26 @@ const ContactFrom = forwardRef( component="div" ref={ref} sx={{ - maxWidth: "776px", - padding: "40px", - gap: "32px", - borderRadius: "24px", - margin: "40px auto", background: "linear-gradient(180deg, #FFF 0%, rgba(255, 255, 255, 0.64) 64.58%, #FFF 100%)", + borderRadius: "24px", boxShadow: "0px 10px 32px -4px rgba(2, 38, 225, 0.10), 0px 6px 14px -6px rgba(2, 38, 225, 0.12)", color: "#202A43", + gap: "32px", + margin: "40px auto", + maxWidth: "776px", + padding: "40px", [theme.breakpoints.down("laptop")]: { - padding: "24px", gap: "24px", + padding: "24px", }, }} > ( return selected; }} sx={{ - "borderRadius": "8px", - "&>.MuiOutlinedInput-notchedOutline": { - borderWidth: "2px", - borderColor: - theme.palette.mode === "light" ? "#fff" : "#2D3843", - }, "&:hover>.MuiOutlinedInput-notchedOutline": { borderColor: theme.palette.custom.forbole.indigo, }, "&.Mui-focused .MuiOutlinedInput-notchedOutline": { borderColor: theme.palette.custom.forbole.indigo, }, - "boxShadow": "4px 8px 24px 0px rgba(116, 81, 255, 0.28)", - "fontSize": "16px", + "&>.MuiOutlinedInput-notchedOutline": { + borderColor: + theme.palette.mode === "light" ? "#fff" : "#2D3843", + borderWidth: "2px", + }, "&>div": { padding: "14px 18px", }, + "borderRadius": "8px", + "boxShadow": "4px 8px 24px 0px rgba(116, 81, 255, 0.28)", + "fontSize": "16px", }} value={inputs.help} > diff --git a/src/components/cta-button/index.tsx b/src/components/cta-button/index.tsx index de7c3057..436d39ad 100644 --- a/src/components/cta-button/index.tsx +++ b/src/components/cta-button/index.tsx @@ -3,29 +3,29 @@ import { LoadingButton } from "@mui/lab"; import { styled } from "@mui/material/styles"; const ColorButton = styled(LoadingButton)(() => ({ - "flexShrink": 0, - "borderRadius": "45px", - "color": "rgba(235, 238, 245, 1)", - "background": "linear-gradient(175.41deg, #623DF5 11.57%, #362187 173.5%)", - "whiteSpace": "nowrap", - "fontWeight": "590", - "height": "45px", - "fontSize": "16px", - "padding": " 0px 16px", - "transition": "transform 0.2s ease-in-out", + "&:disabled": { + background: "#EBEEF5", + boxShadow: + "0px 10px 32px -4px rgba(125, 92, 255, 0.1),0px 6px 14px -6px rgba(126, 94, 255, 0.28)", + color: "rgba(195, 204, 226, 1)", + }, "&:hover": { - transform: "scale(1.02)", background: "linear-gradient(175.41deg, #623DF5 11.57%, #362187 173.5%),linear-gradient(0deg, rgba(0, 0, 0, 0.32), rgba(0, 0, 0, 0.32))", boxShadow: "0px 10px 32px -4px rgba(125, 92, 255, 0.1), 0px 6px 14px -6px rgba(126, 94, 255, 0.28)", + transform: "scale(1.02)", }, - "&:disabled": { - background: "#EBEEF5", - color: "rgba(195, 204, 226, 1)", - boxShadow: - "0px 10px 32px -4px rgba(125, 92, 255, 0.1),0px 6px 14px -6px rgba(126, 94, 255, 0.28)", - }, + "background": "linear-gradient(175.41deg, #623DF5 11.57%, #362187 173.5%)", + "borderRadius": "45px", + "color": "rgba(235, 238, 245, 1)", + "flexShrink": 0, + "fontSize": "16px", + "fontWeight": "590", + "height": "45px", + "padding": " 0px 16px", + "transition": "transform 0.2s ease-in-out", + "whiteSpace": "nowrap", })); export default function CtaButton(props: LoadingButtonProps) { diff --git a/src/components/footer/components/social_media/index.tsx b/src/components/footer/components/social_media/index.tsx index 7f695f75..6ee6a140 100644 --- a/src/components/footer/components/social_media/index.tsx +++ b/src/components/footer/components/social_media/index.tsx @@ -106,6 +106,7 @@ const SocialMedia = () => { { - const { isTablet, isMobile } = useWindowDimensions(); +const Footer = ({ itemColor, red }: FooterProps) => { + const { isMobile, isTablet } = useWindowDimensions(); const { t } = useTranslation("common"); const wrapperStyle = { - style: { - color: itemColor, - }, + style: itemColor + ? { + color: itemColor, + } + : {}, }; return ( diff --git a/src/components/footer/types.ts b/src/components/footer/types.ts index 3e999c7d..da46634f 100644 --- a/src/components/footer/types.ts +++ b/src/components/footer/types.ts @@ -1,5 +1,5 @@ export interface FooterProps { - staking?: boolean; - red?: boolean; itemColor?: string; + red?: boolean; + staking?: boolean; } diff --git a/src/components/formInput/index.tsx b/src/components/formInput/index.tsx index 325c8a29..350712c4 100644 --- a/src/components/formInput/index.tsx +++ b/src/components/formInput/index.tsx @@ -2,29 +2,15 @@ import InputBase from "@mui/material/InputBase"; import { styled } from "@mui/material/styles"; const FormInput = styled(InputBase)(({ theme }) => ({ - "display": "block", - "boxShadow": "4px 8px 24px 0px rgba(116, 81, 255, 0.28)", - "borderRadius": "8px", - - "& .MuiInputBase-input:placeholder": { - color: "#878787", - }, "& .MuiInputBase-input": { - "display": "block", - "width": "calc( 100% - 36px)", - "marginTop": theme.spacing(2), - "position": "relative", + "&:focus": { + borderColor: theme.palette.custom.forbole.indigo, + }, "backgroundColor": theme.palette.mode === "light" ? "#FFF" : "#1A2027", "border": "2px solid", "borderColor": theme.palette.mode === "light" ? "#fff" : "#2D3843", "borderRadius": "8px", - "fontSize": "16px", - "padding": "12px 16px", - "transition": theme.transitions.create([ - "border-color", - "background-color", - "box-shadow", - ]), + "display": "block", // Use the system font instead of the default Roboto font. "fontFamily": [ "-apple-system", @@ -38,10 +24,24 @@ const FormInput = styled(InputBase)(({ theme }) => ({ '"Segoe UI Emoji"', '"Segoe UI Symbol"', ].join(","), - "&:focus": { - borderColor: theme.palette.custom.forbole.indigo, - }, + "fontSize": "16px", + "marginTop": theme.spacing(2), + "padding": "12px 16px", + "position": "relative", + "transition": theme.transitions.create([ + "border-color", + "background-color", + "box-shadow", + ]), + "width": "calc( 100% - 36px)", + }, + "& .MuiInputBase-input:placeholder": { + color: "#878787", }, + "borderRadius": "8px", + + "boxShadow": "4px 8px 24px 0px rgba(116, 81, 255, 0.28)", + "display": "block", })); export default FormInput; diff --git a/src/components/four-table/config.ts b/src/components/four-table/config.ts index ff53c89c..e00cfd0d 100644 --- a/src/components/four-table/config.ts +++ b/src/components/four-table/config.ts @@ -7,28 +7,28 @@ const usePlans = () => { return useMemo( () => [ { - title: t("plan_item1_title"), - price: "0", + btnHref: "https://devtools.forbole.com", + btnName: t("try_now"), currency: t("plan_item1_currency"), description: t("plan_item1_description"), features: t("plan_item1_features"), image: "/images/assets/24.png", - btnName: t("try_now"), - btnHref: "https://devtools.forbole.com", + price: "0", + title: t("plan_item1_title"), }, { - title: t("plan_item2_title"), - price: "50", + btnHref: "", + btnName: t("contact_us"), currency: t("plan_item2_currency"), description: t("plan_item2_description"), features: t("plan_item2_features"), image: "/images/assets/24.png", - btnName: t("contact_us"), - btnHref: "", + price: "50", + title: t("plan_item2_title"), }, { - title: t("plan_item3_title"), - price: "200", + btnHref: "", + btnName: t("contact_us"), currency: t("plan_item3_currency"), description: t("plan_item3_description"), features: [ @@ -37,12 +37,12 @@ const usePlans = () => { t("plan_item3_features_3"), ], image: "/images/assets/24.png", - btnName: t("contact_us"), - btnHref: "", + price: "200", + title: t("plan_item3_title"), }, { - title: t("plan_item4_title"), - price: t("plan_item4_price"), + btnHref: "", + btnName: t("contact_us"), currency: t("plan_item4_currency"), description: t("plan_item4_description"), features: [ @@ -53,8 +53,8 @@ const usePlans = () => { t("plan_item4_features_5"), ], image: "/images/assets/24.png", - btnName: t("contact_us"), - btnHref: "", + price: t("plan_item4_price"), + title: t("plan_item4_title"), }, ], [t], diff --git a/src/components/four-table/styles.module.css b/src/components/four-table/index.module.scss similarity index 79% rename from src/components/four-table/styles.module.css rename to src/components/four-table/index.module.scss index 819d8c8e..b5525adc 100644 --- a/src/components/four-table/styles.module.css +++ b/src/components/four-table/index.module.scss @@ -1,51 +1,72 @@ +@import "src/styles/sass.scss"; + +.cta { + bottom: 24px; + left: 24px; + position: absolute; + right: 24px; + + @include down-laptop { + display: none; + } + + button { + width: 100%; + } +} + .active { - flex-grow: 0; - flex-shrink: 1; - flex-basis: 346px; - height: 536px; - border: 3px solid rgb(253, 63, 97); background-image: linear-gradient( 315deg, rgba(212, 49, 238, 0.24) 0%, rgba(255, 66, 107, 0.24) 100% ); + border: 3px solid rgb(253, 63, 97); + flex: 0 1 346px; + height: 536px; } .money { font-size: 64px; } + .popular { - position: absolute; - top: -18px; - right: 0; - gap: 8px; - box-sizing: border-box; - padding: 0 11px; - width: 126px; - height: 32px; align-items: center; - border-radius: 32px; background: linear-gradient(315deg, #ee3131 0%, #ff426b 100%); + border-radius: 32px; + box-sizing: border-box; color: #fff; + gap: 8px; + height: 32px; + padding: 0 11px; + position: absolute; + right: 0; text-align: center; + top: -18px; + width: 126px; } + .popular > span { - font-weight: 590; font-size: 18px; font-style: normal; + font-weight: 590; line-height: normal; } + .none { display: none; } + @media (max-width: 1024.95px) { .active { flex-basis: max-content; width: 100%; } + .money { font-size: 48px; } + .active .money span { font-size: 48px; } diff --git a/src/components/four-table/index.tsx b/src/components/four-table/index.tsx index d0b26f53..b005695a 100644 --- a/src/components/four-table/index.tsx +++ b/src/components/four-table/index.tsx @@ -1,11 +1,11 @@ import { Box, Divider, Stack, Typography, useTheme } from "@mui/material"; import useTranslation from "next-translate/useTranslation"; -import { useRouter } from "next/router"; +import Link from "next/link"; import CtaButton from "@src/components/cta-button"; import usePlans from "./config"; -import styles from "./styles.module.css"; +import * as styles from "./index.module.scss"; const clickItem = 2; @@ -14,7 +14,6 @@ type Props = { btnHref: () => void }; const FourTable = ({ btnHref }: Props) => { const { t } = useTranslation("developer_tools"); const theme = useTheme(); - const router = useRouter(); const plans = usePlans(); return ( @@ -22,13 +21,13 @@ const FourTable = ({ btnHref }: Props) => { direction="row" sx={{ alignItems: "flex-end", - minHeight: "536px", gap: "16px", + minHeight: "536px", [theme.breakpoints.down("laptop")]: { - flexDirection: "column", - justifyContent: "center", alignItems: "center", + flexDirection: "column", gap: "24px", + justifyContent: "center", }, }} > @@ -37,20 +36,20 @@ const FourTable = ({ btnHref }: Props) => { className={indexTop === clickItem ? styles.active : ""} key={indexTop} sx={{ - position: "relative", - height: "496px", - flexGrow: 1, - flexShrink: 1, - flexBasis: "270px", - padding: "24px", - borderRadius: "24px", backgroundColor: "#fff", + borderRadius: "24px", boxShadow: "0px 10px 32px -4px rgba(245, 20, 47, 0.16), 0px 6px 14px -6px rgba(249, 106, 122, 0.20)", + flexBasis: "270px", + flexGrow: 1, + flexShrink: 1, + height: "496px", + padding: "24px", + position: "relative", [theme.breakpoints.down("laptop")]: { + flexBasis: "max-content", flexGrow: 0, flexShrink: 0, - flexBasis: "max-content", width: "75%", }, }} @@ -73,9 +72,9 @@ const FourTable = ({ btnHref }: Props) => { { color: "#202A43", fontSize: "32px", fontWeight: "590", + letterSpacing: "-0.508px", marginTop: "-23px", pr: "7px", - letterSpacing: "-0.508px", }} > { { { { )} - router.push(Plan.btnHref) : btnHref} - sx={{ - position: "absolute", - left: "24px", - right: "24px", - bottom: "24px", - [theme.breakpoints.down("laptop")]: { display: "none" }, - }} - > - {Plan.btnName} - + {Plan.btnHref ? ( + + {Plan.btnName} + + ) : ( + + {Plan.btnName} + + )} ))} diff --git a/src/components/guide_nav/index.tsx b/src/components/guide_nav/index.tsx index 7faa7f1f..feb13b42 100644 --- a/src/components/guide_nav/index.tsx +++ b/src/components/guide_nav/index.tsx @@ -27,8 +27,8 @@ const GuideNav = ({ staking }: GuideNavProps) => { diff --git a/src/components/header-card/index.module.scss b/src/components/header-card/index.module.scss index 6d2f3917..f1dd244b 100644 --- a/src/components/header-card/index.module.scss +++ b/src/components/header-card/index.module.scss @@ -87,18 +87,20 @@ $card-box-shadow: } } -.image2 { +.image2 img { display: none; - @include down-laptop { + @include down-tablet { display: block; + object-fit: cover; } } -.image3 { +.image3 img { display: none; - @include up-laptop { + @include up-tablet { display: block; + object-fit: cover; } } diff --git a/src/components/intro_card/index.tsx b/src/components/intro_card/index.tsx index 08aea0ca..70a73444 100644 --- a/src/components/intro_card/index.tsx +++ b/src/components/intro_card/index.tsx @@ -1,28 +1,29 @@ import { Typography } from "@mui/material"; import Box from "@mui/material/Box"; import Image from "next/image"; +import Link from "next/link"; import CtaButton from "../cta-button"; import * as styles from "./index.module.scss"; type Props = { - title?: string; - desc?: string; - list?: string[]; - imageHref?: string; + btnLink?: string; btnName?: string; - btnClick?: () => void; + desc?: string; disabled?: boolean; + imageHref?: string; + list?: string[]; + title?: string; }; const IntroCard = ({ - title, - desc, - list, - imageHref = "", + btnLink, btnName, + desc, disabled, - btnClick, + imageHref = "", + list, + title, }: Props) => ( @@ -48,13 +49,11 @@ const IntroCard = ({ ))} - - {btnName} - + + + {btnName} + + ); diff --git a/src/components/key_data/components/stats/components/stats_card/index.tsx b/src/components/key_data/components/stats/components/stats_card/index.tsx index 61c55a40..23a155ae 100644 --- a/src/components/key_data/components/stats/components/stats_card/index.tsx +++ b/src/components/key_data/components/stats/components/stats_card/index.tsx @@ -6,9 +6,9 @@ import { convertToMoney } from "@src/utils/convert_to_money"; import useStyles from "./useStyles"; -const StatsCard = ({ title, stats }: any) => { +const StatsCard = ({ stats, title }: any) => { const styles = useStyles(); - const { counterValue, counterRef } = useCounter(stats); + const { counterRef, counterValue } = useCounter(stats); const { t } = useTranslation("common"); return ( diff --git a/src/components/key_data/components/stats/components/stats_card/useStyles.ts b/src/components/key_data/components/stats/components/stats_card/useStyles.ts index 79e74118..c90cffc4 100644 --- a/src/components/key_data/components/stats/components/stats_card/useStyles.ts +++ b/src/components/key_data/components/stats/components/stats_card/useStyles.ts @@ -5,27 +5,27 @@ const useStyles = () => { return { root: css({ - "display": "flex", - "flexDirection": "column", - "alignItems": "center", - "padding": theme.spacing(4, 3), - "background": theme.palette.common.white, - "boxShadow": - "0px 6px 14px -6px rgba(2, 38, 225, 0.12), 0px 10px 32px -4px rgba(2, 38, 225, 0.1)", - "borderRadius": theme.spacing(3), "& .MuiTypography-h3": { - paddingTop: theme.spacing(2), - fontWeight: 700, + /* Secondary Color/Gradient/Validator/FB Validator Gradient 04 */ + background: "linear-gradient(315deg, #EE3131 0%, #FF426B 100%)", + backgroundClip: "text", fontSize: theme.spacing(3), + fontWeight: 700, + letterSpacing: "0.0015em", lineHeight: "29px", + paddingTop: theme.spacing(2), /* identical to box height */ textAlign: "center", - letterSpacing: "0.0015em", - /* Secondary Color/Gradient/Validator/FB Validator Gradient 04 */ - background: "linear-gradient(315deg, #EE3131 0%, #FF426B 100%)", - backgroundClip: "text", textFillColor: "transparent", }, + "alignItems": "center", + "background": theme.palette.common.white, + "borderRadius": theme.spacing(3), + "boxShadow": + "0px 6px 14px -6px rgba(2, 38, 225, 0.12), 0px 10px 32px -4px rgba(2, 38, 225, 0.1)", + "display": "flex", + "flexDirection": "column", + "padding": theme.spacing(4, 3), }), }; }; diff --git a/src/components/key_data/components/stats/useStyles.ts b/src/components/key_data/components/stats/useStyles.ts index 889b1572..28cbf618 100644 --- a/src/components/key_data/components/stats/useStyles.ts +++ b/src/components/key_data/components/stats/useStyles.ts @@ -6,13 +6,13 @@ const useStyles = () => { return { grid: css({ display: "grid", + gridGap: theme.spacing(2), gridTemplateColumns: "repeat(1, 1fr)", gridTemplateRows: "repeat(3, 1fr)", - gridGap: theme.spacing(2), [theme.breakpoints.up("laptop")]: { + gridGap: theme.spacing(3), gridTemplateColumns: "repeat(3, 1fr)", gridTemplateRows: "repeat(1, 1fr)", - gridGap: theme.spacing(3), }, }), }; diff --git a/src/components/key_data/index.tsx b/src/components/key_data/index.tsx index 11f12af3..4eec634f 100644 --- a/src/components/key_data/index.tsx +++ b/src/components/key_data/index.tsx @@ -8,11 +8,11 @@ const KeyData = () => { return ( { if (blueBg) { diff --git a/src/components/layout_val/index.tsx b/src/components/layout_val/index.tsx index 0c2f94c7..31d47d46 100644 --- a/src/components/layout_val/index.tsx +++ b/src/components/layout_val/index.tsx @@ -126,14 +126,14 @@ const LayoutVal = ({ > { const menuCompanyList = useMemo( () => [ { - name: t("about"), link: "/about", + name: t("about"), }, { - name: t("blog"), link: "/blog", + name: t("blog"), }, { - name: t("contact"), link: "/contact", + name: t("contact"), }, ], [t], diff --git a/src/components/nav/components/lang_menu_button/index.tsx b/src/components/nav/components/lang_menu_button/index.tsx index 650353c8..1cca5fa4 100644 --- a/src/components/nav/components/lang_menu_button/index.tsx +++ b/src/components/nav/components/lang_menu_button/index.tsx @@ -9,8 +9,8 @@ import MenuList from "../menu_list"; import * as styles from "./index.module.scss"; const LangMenuButton = () => { - const { t, lang } = useTranslation("common"); - const { locales, asPath } = useRouter(); + const { lang, t } = useTranslation("common"); + const { asPath, locales } = useRouter(); const [anchor, setAnchor] = useState(); const theme = useTheme(); const onClose = useCallback(() => setAnchor(undefined), [setAnchor]); @@ -21,8 +21,8 @@ const LangMenuButton = () => { const localeToDisplay = { "en": t("en"), - "zh-HK": t("zh-HK"), "zh-CN": t("zh-CN"), + "zh-HK": t("zh-HK"), }; const langText = (() => { @@ -71,16 +71,16 @@ const LangMenuButton = () => { }} anchorEl={anchor} anchorOrigin={{ - vertical: "bottom", horizontal: "right", + vertical: "bottom", }} id="basic-menu" keepMounted onClose={onClose} open={!!anchor} transformOrigin={{ - vertical: "top", horizontal: "right", + vertical: "top", }} > diff --git a/src/components/nav/components/menu_list/index.tsx b/src/components/nav/components/menu_list/index.tsx index 565881ce..243de685 100644 --- a/src/components/nav/components/menu_list/index.tsx +++ b/src/components/nav/components/menu_list/index.tsx @@ -8,16 +8,16 @@ import { anchorElContext } from "@src/utils/menu"; import * as styles from "./index.module.scss"; type Props = { + className?: string; menuList: { icon?: React.ReactNode; link: string; locale?: string; name: string; }[]; - className?: string; }; -const MenuList = ({ menuList, className }: Props) => { +const MenuList = ({ className, menuList }: Props) => { const { setAnchorEl } = useContext(anchorElContext); const handleClose = useCallback(() => { diff --git a/src/components/nav/components/mobile_nav_menu/index.module.scss b/src/components/nav/components/mobile_nav_menu/index.module.scss new file mode 100644 index 00000000..bae1481d --- /dev/null +++ b/src/components/nav/components/mobile_nav_menu/index.module.scss @@ -0,0 +1,11 @@ +@import "src/styles/sass.scss"; + +.button { + background: transparent; + border: none; + color: inherit; + display: inline-block; + font-family: inherit; + font-size: inherit; + font-weight: inherit; +} diff --git a/src/components/nav/components/mobile_nav_menu/index.tsx b/src/components/nav/components/mobile_nav_menu/index.tsx index ca0c2887..6c613eca 100644 --- a/src/components/nav/components/mobile_nav_menu/index.tsx +++ b/src/components/nav/components/mobile_nav_menu/index.tsx @@ -4,7 +4,7 @@ import { Collapse, ListItem, Stack, useTheme } from "@mui/material"; import IconButton from "@mui/material/IconButton"; import Menu from "@mui/material/Menu"; import useTranslation from "next-translate/useTranslation"; -import { useRouter } from "next/router"; +import Link from "next/link"; import type { MouseEvent } from "react"; import { useContext, useEffect, useState } from "react"; @@ -20,10 +20,10 @@ import { anchorElContext } from "@src/utils/menu"; import CompanyMenuButton from "../company_menu_button"; import LangMenuButton from "../lang_menu_button"; import ProductsMenuButton from "../products_menu_button"; +import * as styles from "./index.module.scss"; const MobileNavMenu = () => { - const router = useRouter(); - const { t, lang } = useTranslation("common"); + const { lang, t } = useTranslation("common"); const theme = useTheme(); const { windowDimensions } = useWindowDimensions(); const { width } = windowDimensions; @@ -40,8 +40,8 @@ const MobileNavMenu = () => { const langToDisplay = { "en": t("en"), - "zh-HK": t("zh-HK"), "zh-CN": t("zh-CN"), + "zh-HK": t("zh-HK"), }; const [openDrawer, setOpenDrawer] = useState(false); @@ -83,8 +83,8 @@ const MobileNavMenu = () => { onClick={handleClick} sx={{ [theme.breakpoints.up("laptop")]: { - width: theme.spacing(7), height: theme.spacing(7), + width: theme.spacing(7), }, }} > @@ -103,18 +103,18 @@ const MobileNavMenu = () => { sx: { backgroundImage: "none", borderRadius: theme.spacing(3), - width: theme.spacing(27.5), left: `${width - width / 4}px` as any, [theme.breakpoints.down("laptop")]: { - width: "100%", - top: "100px!important" as any, - left: "0", - right: "16px", - backgroundColor: "#FFFFFF", background: "rgba(255, 255, 255)", + backgroundColor: "#FFFFFF", boxShadow: "0px 10px 32px -4px rgba(2, 38, 225, 0.10), 0px 6px 14px -6px rgba(2, 38, 225, 0.12)", + left: "0", + right: "16px", + top: "100px!important" as any, + width: "100%", }, + width: theme.spacing(27.5), }, }, }} @@ -128,26 +128,16 @@ const MobileNavMenu = () => { py="16px" > - { - router.push("/staking"); - }} - > - {t("StakeNow")} - + + {t("StakeNow")} + a": { - width: "100%", textAlign: "left", textDecoration: "none", + width: "100%", }, "background": openShowProducts ? "linear-gradient(139deg, #623DF5 0%, #362187 100%)" @@ -155,28 +145,29 @@ const MobileNavMenu = () => { "color": openShowProducts ? theme.palette.common.white : theme.palette.custom.forbole.indigo, + "display": "flex", + "fontSize": theme.spacing(2), + "fontWeight": 700, + "height": theme.spacing(7), + "justifyContent": "space-between", + "padding": theme.spacing(0, 4), }} > -
{ - router.push("/products").finally(handleClose); - }} - role="button" - > - {t("Products")} -
-
+ + +
+ @@ -187,17 +178,10 @@ const MobileNavMenu = () => { handlerCLickShowCompany(); }} sx={{ - "display": "flex", - "justifyContent": "space-between", - "fontSize": theme.spacing(2), - "fontWeight": 700, - - "height": theme.spacing(7), - "padding": theme.spacing(0, 4), "> a": { - width: "100%", textAlign: "left", textDecoration: "none", + width: "100%", }, "background": openShowCompany ? "linear-gradient(139deg, #623DF5 0%, #362187 100%)" @@ -205,6 +189,13 @@ const MobileNavMenu = () => { "color": openShowCompany ? theme.palette.common.white : theme.palette.custom.forbole.indigo, + "display": "flex", + + "fontSize": theme.spacing(2), + "fontWeight": 700, + "height": theme.spacing(7), + "justifyContent": "space-between", + "padding": theme.spacing(0, 4), }} >
{t("Company")}
@@ -221,17 +212,10 @@ const MobileNavMenu = () => { a": { - width: "100%", textAlign: "left", textDecoration: "none", + width: "100%", }, "background": openDrawer ? "linear-gradient(139deg, #623DF5 0%, #362187 100%)" @@ -239,6 +223,13 @@ const MobileNavMenu = () => { "color": openDrawer ? theme.palette.common.white : theme.palette.custom.forbole.indigo, + "display": "flex", + "fontSize": theme.spacing(2), + "fontWeight": 700, + + "height": theme.spacing(7), + "justifyContent": "space-between", + "padding": theme.spacing(0, 4), }} > diff --git a/src/components/nav/components/products_menu_button/index.tsx b/src/components/nav/components/products_menu_button/index.tsx index d0d6b01e..f388bc47 100644 --- a/src/components/nav/components/products_menu_button/index.tsx +++ b/src/components/nav/components/products_menu_button/index.tsx @@ -9,24 +9,24 @@ const ProductsMenuButton = () => { const menuProductsList = useMemo( () => [ { - name: t("validator-infrastructure"), link: "/infrastructure", + name: t("validator-infrastructure"), }, { - name: t("native-staking-service"), link: "/staking-service", + name: t("native-staking-service"), }, { - name: t("blockchain-data-analytics-tools"), link: "/analytics-tools", + name: t("blockchain-data-analytics-tools"), }, { - name: t("developer-tools"), link: "/developer-tools", + name: t("developer-tools"), }, { - name: t("enterprise-solution"), link: "/enterprise-solution", + name: t("enterprise-solution"), }, ], [t], diff --git a/src/components/nav/index.tsx b/src/components/nav/index.tsx index afbc99ac..3b009e89 100644 --- a/src/components/nav/index.tsx +++ b/src/components/nav/index.tsx @@ -16,12 +16,12 @@ import { useNavHook } from "./hooks"; import * as styles from "./index.module.scss"; interface NavProps { - staking?: boolean; - stakeNowRef?: RefObject; itemColor?: string; + stakeNowRef?: RefObject; + staking?: boolean; } -const Nav = ({ staking, stakeNowRef, itemColor }: NavProps) => { +const Nav = ({ itemColor, stakeNowRef, staking }: NavProps) => { const colors = useColor(); const { displayBackground } = useNavHook(); const { t } = useTranslation("staking"); @@ -31,9 +31,9 @@ const Nav = ({ staking, stakeNowRef, itemColor }: NavProps) => { if (stakeNowRef !== undefined && stakeNowRef.current !== null) { window.scrollTo({ + behavior: "smooth", left: 0, top: stakeNowRef.current?.offsetTop, - behavior: "smooth", }); } }; diff --git a/src/components/product-panel/index.module.scss b/src/components/product-panel/index.module.scss new file mode 100644 index 00000000..23fe6374 --- /dev/null +++ b/src/components/product-panel/index.module.scss @@ -0,0 +1,17 @@ +@import "src/styles/sass.scss"; + +body .imgMobile { + display: none; + + @include down-tablet { + display: block; + } +} + +body .imgDesktop { + display: none; + + @include up-tablet { + display: block; + } +} diff --git a/src/components/product-panel/index.tsx b/src/components/product-panel/index.tsx index 17350edf..92eb1aef 100644 --- a/src/components/product-panel/index.tsx +++ b/src/components/product-panel/index.tsx @@ -1,17 +1,21 @@ import { Box, Stack, Typography, useTheme } from "@mui/material"; import { forwardRef } from "react"; +import * as styles from "./index.module.scss"; + type Props = { - title?: string; - imageHref: string; children?: React.ReactNode; + // @deprecated + imageHref?: string; + imageHrefs?: string[]; + imgFull?: boolean; index: number; + title?: string; value: number; - imgFull?: boolean; }; const productPanel = forwardRef( - ({ title, imageHref, children, index, value, imgFull }, ref) => { + ({ children, imageHref, imageHrefs, imgFull, index, title, value }, ref) => { const theme = useTheme(); // eslint-disable-next-line eqeqeq @@ -25,13 +29,13 @@ const productPanel = forwardRef( component="div" ref={ref} sx={{ - display: "flex", - flexDirection: "column", - gap: "40px", - borderRadius: "40px", background: "linear-gradient(179deg, #FFF 0%, rgba(255, 255, 255, 0.50) 34.90%, #FFF 100%)", + borderRadius: "40px", boxShadow: "4px 8px 24px 0px rgba(116, 81, 255, 0.16)", + display: "flex", + flexDirection: "column", + gap: "40px", [theme.breakpoints.down("laptop")]: { padding: "32px 24px", }, @@ -43,9 +47,9 @@ const productPanel = forwardRef( {title && ( {title} @@ -65,33 +69,50 @@ const productPanel = forwardRef( > - + {imageHrefs ? ( + <> + + + + ) : ( + + )} {children} diff --git a/src/components/scroll_to_bottom/index.tsx b/src/components/scroll_to_bottom/index.tsx index f6f394f3..00c2fa8d 100644 --- a/src/components/scroll_to_bottom/index.tsx +++ b/src/components/scroll_to_bottom/index.tsx @@ -9,9 +9,9 @@ const ScrollToBottom = ({ bottomRef }: any) => { e.preventDefault(); window.scrollTo({ + behavior: "smooth", left: 0, top: ref.current.offsetTop - 100, - behavior: "smooth", }); }; diff --git a/src/components/scroll_to_top/index.tsx b/src/components/scroll_to_top/index.tsx index 3e1dab21..edb3e9fd 100644 --- a/src/components/scroll_to_top/index.tsx +++ b/src/components/scroll_to_top/index.tsx @@ -14,9 +14,9 @@ const ScrollToTop = ({ topRef }: TopProps) => { e.preventDefault(); window.scrollTo({ + behavior: "smooth", left: 0, top: topRef?.current.offsetTop - 100, - behavior: "smooth", }); }, [topRef], diff --git a/src/components/section/index.tsx b/src/components/section/index.tsx index 477fb5df..a4015005 100644 --- a/src/components/section/index.tsx +++ b/src/components/section/index.tsx @@ -19,9 +19,9 @@ type Props = { const Translate = Trans; const Section = ({ + desc, maxWidth, title, - desc, title_large, title_large_trans, }: Props) => ( diff --git a/src/components/selection-tab/index.tsx b/src/components/selection-tab/index.tsx index 867f2f0a..dad8c0a3 100644 --- a/src/components/selection-tab/index.tsx +++ b/src/components/selection-tab/index.tsx @@ -5,8 +5,9 @@ import type { ReactElement, ReactNode, SyntheticEvent } from "react"; interface StyledTabsProps { children?: ReactNode; - value: number; + className?: string; onChange: (event: SyntheticEvent, newValue: number) => void; + value: number; } export const StyledTabs = styled((props: StyledTabsProps) => ( @@ -15,24 +16,24 @@ export const StyledTabs = styled((props: StyledTabsProps) => ( TabIndicatorProps={{ children: }} /> ))({ - "padding": "4px", - "borderRadius": "24px", - "background": "#1D1E22", "& .MuiTabs-indicator": { + backgroundColor: "transparent", display: "flex", justifyContent: "center", - backgroundColor: "transparent", }, "& .MuiTabs-indicatorSpan": { maxWidth: 40, width: "100%", }, + "background": "#1D1E22", + "borderRadius": "24px", + "padding": "4px", }); interface StyledTabProps { className?: string; disabled?: boolean; - icon?: string | ReactElement; + icon?: ReactElement | string; label: string; onClick?: (e: any) => void; value?: string; @@ -41,27 +42,27 @@ interface StyledTabProps { export const StyledTab = styled((props: StyledTabProps) => ( ))(({ theme }) => ({ - "textTransform": "none", - "minHeight": "45px", - "color": "#fff", - "borderRadius": "200px", - "fontSize": "16px", - "fontWeight": 590, - "textShadow": "none", - "&.Mui-selected": { - background: - "linear-gradient(175.41deg, #623DF5 11.57%, #362187 173.5%),linear-gradient(175.41deg, #623DF5 11.57%, #362187 173.5%)", + "&.Mui-disabled": { + boxShadow: "4px 8px 24px 0px rgba(42, 34, 194, 0.16)", + color: "#fff", + opacity: "0.5", }, "&.Mui-hover": { background: "linear-gradient(175.41deg, #623DF5 11.57%, #362187 173.5%),linear-gradient(0deg, rgba(0, 0, 0, 0.32), rgba(0, 0, 0, 0.32))", boxShadow: "4px 8px 24px 0px rgba(42, 34, 194, 0.16)", }, - "&.Mui-disabled": { - color: "#fff", - boxShadow: "4px 8px 24px 0px rgba(42, 34, 194, 0.16)", - opacity: "0.5", + "&.Mui-selected": { + background: + "linear-gradient(175.41deg, #623DF5 11.57%, #362187 173.5%),linear-gradient(175.41deg, #623DF5 11.57%, #362187 173.5%)", }, + "borderRadius": "200px", + "color": "#fff", + "fontSize": "16px", + "fontWeight": 590, + "minHeight": "45px", + "textShadow": "none", + "textTransform": "none", [theme.breakpoints.down("laptop")]: { fontSize: "12px", }, diff --git a/src/components/signature-card/index.tsx b/src/components/signature-card/index.tsx index 782a1313..7246ba4d 100644 --- a/src/components/signature-card/index.tsx +++ b/src/components/signature-card/index.tsx @@ -8,19 +8,19 @@ function SignatureCard() { const data = useMemo( () => [ { - title: t("websocket_service"), - desc: t("rpc"), active: true, + desc: t("rpc"), + title: t("websocket_service"), }, { - title: t("archive_node"), - desc: t("rpc"), active: false, + desc: t("rpc"), + title: t("archive_node"), }, { - title: t("extra_chain"), - desc: t("rpc_api_graphql"), active: false, + desc: t("rpc_api_graphql"), + title: t("extra_chain"), }, ], [t], @@ -36,37 +36,37 @@ function SignatureCard() { {d.title} {d.desc} @@ -89,18 +89,18 @@ function SignatureCard() { {d.active && ( √ @@ -110,9 +110,9 @@ function SignatureCard() { fontSize: "12px", fontStyle: "normal", fontWeight: "590", + letterSpacing: "-0.408px", lineHeight: "16px", whiteSpace: "nowrap", - letterSpacing: "-0.408px", }} > {t("unlimited_usage")} diff --git a/src/components/success-modal/index.tsx b/src/components/success-modal/index.tsx index 9d5eb752..7797a253 100644 --- a/src/components/success-modal/index.tsx +++ b/src/components/success-modal/index.tsx @@ -12,16 +12,16 @@ import { forwardRef } from "react"; import { Close } from "../icons"; type Props = { - fixed?: any; + bottom_word?: string; close?: (b: boolean) => void; - up_word?: string; + fixed?: any; middle_word?: string; - bottom_word?: string; open: boolean; + up_word?: string; }; const Alert = forwardRef>( - ({ fixed, close, up_word, middle_word, bottom_word }, ref) => { + ({ bottom_word, close, fixed, middle_word, up_word }, ref) => { const theme = useTheme(); const matches = useMediaQuery(theme.breakpoints.down("laptop")); @@ -29,22 +29,22 @@ const Alert = forwardRef>( >( {middle_word && ( >( close?.(false)} style={{ + alignSelf: "flex-start", + boxSizing: "content-box", cursor: "pointer", flexShrink: "0", - padding: matches ? "8px" : "1em", - marginTop: matches ? "-4px" : "0", marginRight: matches ? "-4px" : "0", - alignSelf: "flex-start", - boxSizing: "content-box", + marginTop: matches ? "-4px" : "0", + padding: matches ? "8px" : "1em", }} /> )} >( ); export default function SuccessModal({ - fixed, + bottom_word, close, + fixed, + middle_word, open, up_word, - middle_word, - bottom_word, }: Props) { if (!fixed) { return ( @@ -169,8 +169,8 @@ export default function SuccessModal({ backdrop: { sx() { return { - background: "rgba(123, 123, 123, 0.20)", backdropFilter: "blur(8px)", + background: "rgba(123, 123, 123, 0.20)", }; }, }, diff --git a/src/components/tags/index.tsx b/src/components/tags/index.tsx index e235b86d..4468e56d 100644 --- a/src/components/tags/index.tsx +++ b/src/components/tags/index.tsx @@ -10,12 +10,12 @@ type BaseTag = { }; interface TagsProps { - tags: BaseTag[]; details?: boolean; noPadding?: boolean; + tags: BaseTag[]; } -const Tags = ({ tags, details, noPadding }: TagsProps) => { +const Tags = ({ details, noPadding, tags }: TagsProps) => { const { t } = useTranslation("blog"); const theme = useTheme(); diff --git a/src/components/talk-modal/index.tsx b/src/components/talk-modal/index.tsx index 10d6e0d7..f9e00734 100644 --- a/src/components/talk-modal/index.tsx +++ b/src/components/talk-modal/index.tsx @@ -19,47 +19,47 @@ import FormInput from "../formInput"; import { Close } from "../icons"; interface Props { + canSubmit: boolean; close?: (b: boolean) => void; - staking?: any; - open?: boolean; + handleCheckedChange: (event: any) => void; + handleClear: (field: any) => void; + handleInputChange: (event: any) => void; + handleSubmit: (event: any) => void; inputs: { - "name": string; - "email": string; - "company": string; - "telegram": string; "agree": boolean; - "specify": string; + "company": string; "Data API": boolean; + "email": string; "GraphQL": boolean; + "name": string; "Other": boolean; "RPC Endpoints": boolean; + "specify": string; + "telegram": string; }; - handleInputChange: (event: any) => void; - handleCheckedChange: (event: any) => void; - handleSubmit: (event: any) => void; - handleClear: (field: any) => void; - canSubmit: boolean; isLoading: boolean; + open?: boolean; + staking?: any; } const TalkModal = ({ + canSubmit, close, - staking, - open = false, - inputs, + handleCheckedChange, + handleClear, handleInputChange, handleSubmit, - handleClear, - canSubmit, - handleCheckedChange, + inputs, isLoading, + open = false, + staking, }: Props) => { const theme = useTheme(); const { t } = useTranslation("developer_tools"); const inputRef = useRef(null); const handleToggle = (e: any) => { - const { name, checked } = e.target; + const { checked, name } = e.target; if (name === "Other") { if (checked) { @@ -93,8 +93,8 @@ const TalkModal = ({ backdrop: { sx() { return { - background: "rgba(123, 123, 123, 0.20)", backdropFilter: "blur(8px)", + background: "rgba(123, 123, 123, 0.20)", }; }, }, @@ -105,22 +105,22 @@ const TalkModal = ({ > @@ -152,16 +152,16 @@ const TalkModal = ({ close?.(false)} style={{ - flexShrink: "0", border: "8px solid transparent", boxSizing: "content-box", + flexShrink: "0", }} /> )} {selectList.map((value) => ( @@ -267,11 +267,11 @@ const TalkModal = ({ name={value.name} onChange={handleToggle} sx={{ - "py": "0", - "color": "#AFAFAF", "&.Mui-checked": { color: "#EE3131", }, + "color": "#AFAFAF", + "py": "0", }} value={value.name} /> @@ -280,12 +280,12 @@ const TalkModal = ({ label={value.label} labelPlacement="start" sx={{ - width: "100%", + fontSize: "16px", justifyContent: "space-between", + lineHeight: "30px", m: 0, p: "12px 0", - fontSize: "16px", - lineHeight: "30px", + width: "100%", }} /> @@ -293,10 +293,10 @@ const TalkModal = ({ @@ -325,11 +325,11 @@ const TalkModal = ({ control={ } @@ -337,10 +337,10 @@ const TalkModal = ({ name="agree" onChange={handleCheckedChange} sx={{ + alignItems: "flex-start", + lineHeight: "30px", mr: 0, verticalAlign: "top", - lineHeight: "30px", - alignItems: "flex-start", }} /> diff --git a/src/environment.d.ts b/src/environment.d.ts index 85960c73..e89594d7 100644 --- a/src/environment.d.ts +++ b/src/environment.d.ts @@ -1,9 +1,9 @@ /* eslint-disable no-unused-vars */ declare namespace NodeJS { interface ProcessEnv { - NEXT_PUBLIC_MATOMO_URL: string; - NEXT_PUBLIC_MATOMO_SITE_ID: string; NEXT_PUBLIC_COINGECKO_API: string; + NEXT_PUBLIC_MATOMO_SITE_ID: string; + NEXT_PUBLIC_MATOMO_URL: string; } } diff --git a/src/hooks/get_screen_size.ts b/src/hooks/get_screen_size.ts index d6e2b8dc..6c904471 100644 --- a/src/hooks/get_screen_size.ts +++ b/src/hooks/get_screen_size.ts @@ -2,18 +2,18 @@ import { useTheme } from "@mui/material"; import { useEffect, useState } from "react"; const getWindowDimensions = () => { - const { innerWidth: width, innerHeight: height } = window; + const { innerHeight: height, innerWidth: width } = window; return { - width, height, + width, }; }; export const useWindowDimensions = () => { const [windowDimensions, setWindowDimensions] = useState({ - width: 0, height: 0, + width: 0, }); // <-- don't invoke the function here const theme = useTheme(); @@ -63,5 +63,5 @@ export const useWindowDimensions = () => { theme?.breakpoints?.values?.laptop, ]); - return { windowDimensions, isDesktop, isTablet, isMobile }; + return { isDesktop, isMobile, isTablet, windowDimensions }; }; diff --git a/src/models/post.ts b/src/models/post.ts index 016d07e4..56783203 100644 --- a/src/models/post.ts +++ b/src/models/post.ts @@ -70,22 +70,22 @@ class Post { const { excerptLimit = 250 } = options ?? {}; return new Post({ - id: data.uuid, - canonicalUrl: data.canonical_url, author: data, + canonicalUrl: data.canonical_url, createdAt: moment(data.created_at).format("Do MMM YYYY, h:mm a"), customExcerpt: data.custom_excerpt, excerpt: this.formatExcerpt(data.excerpt, excerptLimit), + featured: data.featured, featureImage: data.feature_image, featureImageCaption: data.feature_image_caption, - featured: data.featured, html: data.html, + id: data.uuid, + primaryAuthor: Author.fromJson(data.primary_author), publishedAt: moment(data.published_at).format("Do MMM YYYY, h:mm a"), slug: data.slug, + tags: this.formatTags(data.tags), title: data.title, visibility: data.visibility, - primaryAuthor: Author.fromJson(data.primary_author), - tags: this.formatTags(data.tags), }); } } diff --git a/src/models/tag.ts b/src/models/tag.ts index 4c819929..28f1d31f 100644 --- a/src/models/tag.ts +++ b/src/models/tag.ts @@ -18,10 +18,10 @@ class Tag { static fromJson(data: any) { return new Tag({ + count: { posts: pathOr("", ["count", "posts"], data) }, name: data.name, slug: data.slug ?? data.name, url: data.url ?? data.name, - count: { posts: pathOr("", ["count", "posts"], data) }, }); } } diff --git a/src/pages/api/contact.ts b/src/pages/api/contact.ts index 631a6d5a..e5ff1afb 100644 --- a/src/pages/api/contact.ts +++ b/src/pages/api/contact.ts @@ -11,9 +11,9 @@ const handler = async (req: NextApiRequest, res: NextApiResponse) => { { devtools: "A new customer just wanted to get in touch with us via Developer Tools form", - staking: "Inquiry From Forbole Validator Website", enterprise: "A new customer just wanted to get in touch with us via Contact form", + staking: "Inquiry From Forbole Validator Website", }[source as string] || "A new enquiry from Forbole's website"; const email = diff --git a/src/pages/api/subscribe.ts b/src/pages/api/subscribe.ts index 9bb25401..5f45768c 100644 --- a/src/pages/api/subscribe.ts +++ b/src/pages/api/subscribe.ts @@ -10,16 +10,16 @@ const handler = async (req: NextApiRequest, res: NextApiResponse) => { if (process.env.NODE_ENV === "production") { await transporter.sendMail({ from: inputs.email, - to: process.env.SEND_EMAIL_TO || "newsletter@forbole.com", - subject: `A new customer: ${sanitize( - inputs.email, - )} just subscribed our newsletter`, html: `

Dear Administrator,

A new customer: ${sanitize(inputs.email)} just subscribed our newsletter.

Regards,

Forbole web system

`, + subject: `A new customer: ${sanitize( + inputs.email, + )} just subscribed our newsletter`, + to: process.env.SEND_EMAIL_TO || "newsletter@forbole.com", }); } diff --git a/src/pages/author/[author]/index.tsx b/src/pages/author/[author]/index.tsx index c931fc49..02262669 100644 --- a/src/pages/author/[author]/index.tsx +++ b/src/pages/author/[author]/index.tsx @@ -54,11 +54,11 @@ export async function getServerSideProps(context: { query: any }) { return { props: { author: JSON.parse(JSON.stringify(authorInfo)), + error, + meta: JSON.parse(JSON.stringify(meta)), post: JSON.parse(JSON.stringify(authorPosts)), - tags: JSON.parse(JSON.stringify(formattedTags)), sidePosts: JSON.parse(JSON.stringify(formattedSidePosts)), - meta: JSON.parse(JSON.stringify(meta)), - error, + tags: JSON.parse(JSON.stringify(formattedTags)), }, }; } diff --git a/src/pages/blog/[title]/index.tsx b/src/pages/blog/[title]/index.tsx index f72b165c..cee642a1 100644 --- a/src/pages/blog/[title]/index.tsx +++ b/src/pages/blog/[title]/index.tsx @@ -28,7 +28,7 @@ export const getStaticPaths: GetStaticPaths = async () => { path.params.title && !path.params.title.startsWith(stakingGuidePrefix), ); - return { paths, fallback: true }; + return { fallback: true, paths }; }; export const getStaticProps: GetStaticProps< diff --git a/src/pages/blog/index.tsx b/src/pages/blog/index.tsx index ac9b8ad1..5e71934a 100644 --- a/src/pages/blog/index.tsx +++ b/src/pages/blog/index.tsx @@ -50,11 +50,11 @@ export async function getServerSideProps(context: { query: any }) { return { props: { + error, + meta: JSON.parse(JSON.stringify(meta)), posts: JSON.parse(JSON.stringify(formattedPosts)), - tags: JSON.parse(JSON.stringify(formattedTags)), sidePosts: JSON.parse(JSON.stringify(formattedSidePosts)), - meta: JSON.parse(JSON.stringify(meta)), - error, + tags: JSON.parse(JSON.stringify(formattedTags)), }, }; } diff --git a/src/pages/staking/[title]/index.tsx b/src/pages/staking/[title]/index.tsx index fcb85bc0..a4a62199 100644 --- a/src/pages/staking/[title]/index.tsx +++ b/src/pages/staking/[title]/index.tsx @@ -31,7 +31,7 @@ export const getStaticPaths: GetStaticPaths = async () => { path.params.title && path.params.title.startsWith(stakingGuidePrefix), ); - return { paths, fallback: true }; + return { fallback: true, paths }; }; export const getStaticProps: GetStaticProps< diff --git a/src/pages/tag/[tag]/[page].tsx b/src/pages/tag/[tag]/[page].tsx index 579841b4..aa0591ae 100644 --- a/src/pages/tag/[tag]/[page].tsx +++ b/src/pages/tag/[tag]/[page].tsx @@ -60,11 +60,11 @@ export async function getServerSideProps(context: { query: any }) { return { props: { + error, + meta: JSON.parse(JSON.stringify(meta)), post: JSON.parse(JSON.stringify(formattedPost)), - tags: JSON.parse(JSON.stringify(formattedTags)), sidePosts: JSON.parse(JSON.stringify(formattedSidePosts)), - meta: JSON.parse(JSON.stringify(meta)), - error, + tags: JSON.parse(JSON.stringify(formattedTags)), }, }; } diff --git a/src/pages/tag/[tag]/index.tsx b/src/pages/tag/[tag]/index.tsx index e2d4f4d7..4fff29ac 100644 --- a/src/pages/tag/[tag]/index.tsx +++ b/src/pages/tag/[tag]/index.tsx @@ -24,7 +24,7 @@ export const getStaticPaths: GetStaticPaths = async () => { ) .flat(); - return { paths, fallback: "blocking" }; + return { fallback: "blocking", paths }; }; export const getStaticProps: GetStaticProps = async ( @@ -69,11 +69,11 @@ export const getStaticProps: GetStaticProps = async ( return { props: { + error, + meta: JSON.parse(JSON.stringify(meta)), post: JSON.parse(JSON.stringify(formattedPost)), - tags: JSON.parse(JSON.stringify(formattedTags)), sidePosts: JSON.parse(JSON.stringify(formattedSidePosts)), - meta: JSON.parse(JSON.stringify(meta)), - error, + tags: JSON.parse(JSON.stringify(formattedTags)), }, }; }; diff --git a/src/screens/Infrastructure/index.tsx b/src/screens/Infrastructure/index.tsx index 71048ca4..9440e31b 100644 --- a/src/screens/Infrastructure/index.tsx +++ b/src/screens/Infrastructure/index.tsx @@ -46,64 +46,64 @@ const Infrastructure = () => { if (onlyLargeScreen) { return [ { - name: "Michael McCaffrey", - position: "Lead Business Developer, Coreum", desc: `Forbole is an exceptional SaaS provider that offers valuable solutions, especially within the Cosmos ecosystem. Their expertise and commitment to delivering high-quality services have greatly benefited the Coreum blockchain. Their team has been responsive, knowledgeable, and efficient in addressing our needs and ensuring a seamless experience. I highly recommend Forbole to anyone seeking reliable and innovative SaaS solutions.`, img: "/icons/Michael McCaffrey-Coreum.png", + name: "Michael McCaffrey", + position: "Lead Business Developer, Coreum", }, { - name: "Boz Menzalji", - position: "COO of Overclock Labs, creator of Akash Network", desc: `Forbole's team has been a reliable partner from the earliest days for Akash Network, allowing us to tap into deep know-how for testnets, mainnet upgrades, and more. The tools they have contributed to the ecosystem, such as Big Dipper's Explorer, has been a great value-add to our growing ecosystem. We are fortunate to have a great partner with Forbole.`, img: "/icons/person_avatar.png", + name: "Boz Menzalji", + position: "COO of Overclock Labs, creator of Akash Network", }, { - name: "Calin Pasat", - position: "Node Foundation Director, Humans.ai", desc: `Working with Forbole has been an enlightening experience. As validators, they are reliably efficient, but it's their commitment to contributing to the broader ecosystem that truly sets them apart with open-source tools like Big Dipper Explorer. Their forward-thinking nature is evident in their proactive involvement in various projects, reflecting a deep understanding and a promising vision for the blockchain industry.`, img: "/icons/Calin Pasat-humansai.png", + name: "Calin Pasat", + position: "Node Foundation Director, Humans.ai", }, ]; } return [ { - name: "Boz Menzalji", - position: "COO of Overclock Labs, creator of Akash Network", desc: `Forbole's team has been a reliable partner from the earliest days for Akash Network, allowing us to tap into deep know-how for testnets, mainnet upgrades, and more. The tools they have contributed to the ecosystem, such as Big Dipper's Explorer, has been a great value-add to our growing ecosystem. We are fortunate to have a great partner with Forbole.`, img: "/icons/person_avatar.png", + name: "Boz Menzalji", + position: "COO of Overclock Labs, creator of Akash Network", }, { - name: "Michael McCaffrey", - position: "Lead Business Developer, Coreum", desc: `Forbole is an exceptional SaaS provider that offers valuable solutions, especially within the Cosmos ecosystem. Their expertise and commitment to delivering high-quality services have greatly benefited the Coreum blockchain. Their team has been responsive, knowledgeable, and efficient in addressing our needs and ensuring a seamless experience. I highly recommend Forbole to anyone seeking reliable and innovative SaaS solutions.`, img: "/icons/Michael McCaffrey-Coreum.png", + name: "Michael McCaffrey", + position: "Lead Business Developer, Coreum", }, { - name: "Calin Pasat", - position: "Node Foundation Director, Humans.ai", desc: `Working with Forbole has been an enlightening experience. As validators, they are reliably efficient, but it's their commitment to contributing to the broader ecosystem that truly sets them apart with open-source tools like Big Dipper Explorer. Their forward-thinking nature is evident in their proactive involvement in various projects, reflecting a deep understanding and a promising vision for the blockchain industry.`, img: "/icons/Calin Pasat-humansai.png", + name: "Calin Pasat", + position: "Node Foundation Director, Humans.ai", }, ]; }, [onlyLargeScreen]); @@ -152,8 +152,8 @@ const Infrastructure = () => { { @@ -214,8 +214,8 @@ const Infrastructure = () => { { @@ -242,6 +243,7 @@ const Infrastructure = () => { @@ -253,8 +255,8 @@ const Infrastructure = () => { /> {[ - { title: "infrastructure_item", img: "desk_toggle_1@2x.png" }, - { title: "expertise_item", img: "desk_toggle_2@2x.png" }, + { img: "desk_toggle_1@2x.png", title: "infrastructure_item" }, + { img: "desk_toggle_2@2x.png", title: "expertise_item" }, ].map((opt, indexUpper) => ( { { [theme.breakpoints.up("laptop")]: { fontSize: "20px", }, - "&:before": { - content: "url(/icons/outlined.svg)", - marginRight: "16px", - }, }} > {item} @@ -299,8 +301,8 @@ const Infrastructure = () => { { }} breakpoints={{ 1023: { - spaceBetween: 16, centeredSlides: false, + spaceBetween: 16, }, }} centeredSlides diff --git a/src/screens/analytics_tools/index.tsx b/src/screens/analytics_tools/index.tsx index 3993cd06..e185ff5c 100644 --- a/src/screens/analytics_tools/index.tsx +++ b/src/screens/analytics_tools/index.tsx @@ -1,6 +1,6 @@ import { Container, Grid, Stack, useMediaQuery, useTheme } from "@mui/material"; import useTranslation from "next-translate/useTranslation"; -import { useRouter } from "next/router"; +import Link from "next/link"; import { useMemo, useRef } from "react"; import IntroPanel from "@src/components/Intro_panel"; @@ -16,7 +16,6 @@ import * as styles from "./index.module.scss"; const AnalyticsTools = () => { const topRef = useRef(null); const theme = useTheme(); - const router = useRouter(); const { t } = useTranslation("analytics_tools"); const isMobile = useMediaQuery(theme.breakpoints.down("tablet"), { @@ -73,12 +72,9 @@ const AnalyticsTools = () => { title={t("data_visualization")} title_large_trans={t("free")} /> - router.push("https://bigdipper.live/")} - > - {t("try_now")} - + + {t("try_now")} + { init({ - url: MATOMO_URL, siteId: MATOMO_SITE_ID, + url: MATOMO_URL, }); }, []); diff --git a/src/screens/app/innerApp/index.tsx b/src/screens/app/innerApp/index.tsx index 7d1c4505..6685be57 100644 --- a/src/screens/app/innerApp/index.tsx +++ b/src/screens/app/innerApp/index.tsx @@ -5,7 +5,7 @@ import "react-toastify/dist/ReactToastify.css"; import { lightTemplate } from "@src/styles"; -const InnerApp = ({ pageProps, Component }: any) => { +const InnerApp = ({ Component, pageProps }: any) => { const muiTheme = createTheme(lightTemplate); return ( diff --git a/src/screens/author/components/author_posts/hooks.tsx b/src/screens/author/components/author_posts/hooks.tsx index 2923f225..188a3a20 100644 --- a/src/screens/author/components/author_posts/hooks.tsx +++ b/src/screens/author/components/author_posts/hooks.tsx @@ -3,7 +3,7 @@ import { useRouter } from "next/router"; export const useBlogPostsHook = () => { const router: any = useRouter(); - const handleAuthorPageChange = (e: any, value: any) => { + const handleAuthorPageChange = (_e: any, value: any) => { router.push({ pathname: `/author/${router.query.author}`, query: { page: value }, diff --git a/src/screens/author/components/author_posts/index.tsx b/src/screens/author/components/author_posts/index.tsx index 131ba712..d9d939cb 100644 --- a/src/screens/author/components/author_posts/index.tsx +++ b/src/screens/author/components/author_posts/index.tsx @@ -12,7 +12,7 @@ interface IProps { meta: AuthorMeta; } -const AuthorPosts = ({ main, blogs, meta }: IProps) => { +const AuthorPosts = ({ blogs, main, meta }: IProps) => { const currentPage = meta.pagination?.page || 0; const totalPages = meta.pagination?.pages || 0; diff --git a/src/screens/author/index.tsx b/src/screens/author/index.tsx index 5ff16737..b91acd26 100644 --- a/src/screens/author/index.tsx +++ b/src/screens/author/index.tsx @@ -16,10 +16,10 @@ type Props = { tags: any; }; -const AuthorTitlePosts = ({ post, tags, author, meta }: Props) => { +const AuthorTitlePosts = ({ author, meta, post, tags }: Props) => { const { t } = useTranslation("blog"); - const { featureImage, excerpt, error } = post; + const { error, excerpt, featureImage } = post; useBlogHook(error, t); @@ -42,21 +42,21 @@ const AuthorTitlePosts = ({ post, tags, author, meta }: Props) => { "@type": "ProfilePage", "mainEntity": { "@type": "Person", - "name": author.name, + "agentInteractionStatistic": { + "@type": "InteractionCounter", + "interactionType": "https://schema.org/WriteAction", + "userInteractionCount": meta.pagination?.total, + }, "alternateName": author.slug, - "identifier": author.id, - "url": `https://www.forbole.com/author/${author.slug}/`, - "image": author.profile_image, "brand": { "@type": "Organization", "name": "Forbole", "url": "https://www.forbole.com/", }, - "agentInteractionStatistic": { - "@type": "InteractionCounter", - "interactionType": "https://schema.org/WriteAction", - "userInteractionCount": meta.pagination?.total, - }, + "identifier": author.id, + "image": author.profile_image, + "name": author.name, + "url": `https://www.forbole.com/author/${author.slug}/`, }, }), }} diff --git a/src/screens/blog/components/blog_posts/components/post/index.tsx b/src/screens/blog/components/blog_posts/components/post/index.tsx index 01467451..19c9168e 100644 --- a/src/screens/blog/components/blog_posts/components/post/index.tsx +++ b/src/screens/blog/components/blog_posts/components/post/index.tsx @@ -11,13 +11,13 @@ import useHKT from "@src/hooks/useHKT"; import * as styles from "./index.module.scss"; -const Post = ({ post, main = false, refProp }: any) => { +const Post = ({ main = false, post, refProp }: any) => { const { t } = useTranslation("blog"); const { isDesktop, isMobile } = useWindowDimensions(); - const { featureImage, title, excerpt, publishedAt, slug, author } = post; + const { author, excerpt, featureImage, publishedAt, slug, title } = post; - const cmsLoader = ({ src, width, quality }: any) => + const cmsLoader = ({ quality, src, width }: any) => `${src}?w=${width}&q=${quality || 75}`; const time = useHKT(publishedAt); diff --git a/src/screens/blog/components/blog_posts/hooks.tsx b/src/screens/blog/components/blog_posts/hooks.tsx index 9e439cce..cd91ec0e 100644 --- a/src/screens/blog/components/blog_posts/hooks.tsx +++ b/src/screens/blog/components/blog_posts/hooks.tsx @@ -3,7 +3,7 @@ import { useRouter } from "next/router"; export const useBlogPostsHook = () => { const router = useRouter(); - const handlePageChange = (e: any, value: any) => { + const handlePageChange = (_e: any, value: any) => { router.push({ pathname: router.pathname, query: { page: value }, diff --git a/src/screens/blog/components/blog_posts/index.tsx b/src/screens/blog/components/blog_posts/index.tsx index 0e7ebc96..06ab7245 100644 --- a/src/screens/blog/components/blog_posts/index.tsx +++ b/src/screens/blog/components/blog_posts/index.tsx @@ -11,12 +11,12 @@ import { useBlogPostsHook } from "./hooks"; import * as styles from "./index.module.scss"; import type { IProps } from "./interface"; -const BlogPosts = ({ main, blogs: blogsUpper, meta }: IProps) => { +const BlogPosts = ({ blogs: blogsUpper, main, meta }: IProps) => { const { t } = useTranslation("blog"); const router = useRouter(); const theme = useTheme(); - const { windowDimensions, isMobile } = useWindowDimensions(); + const { isMobile, windowDimensions } = useWindowDimensions(); const { width } = windowDimensions; const currentPage = pathOr(0, ["pagination", "page"], meta); @@ -41,7 +41,7 @@ const BlogPosts = ({ main, blogs: blogsUpper, meta }: IProps) => { [lastView, isMobile], ); - const seeMorePages = (_e: any, { limit, blogs }: any) => { + const seeMorePages = (_e: any, { blogs, limit }: any) => { const lastPost = blogs.length; if (limit + 15 >= totalPosts) { @@ -62,49 +62,49 @@ const BlogPosts = ({ main, blogs: blogsUpper, meta }: IProps) => { desktop: { breakpoint: { max: 3000, min: 1100 }, }, - tablet: { - breakpoint: { max: 1100, min: 464 }, - }, mobile: { breakpoint: { max: 464, min: 0 }, }, + tablet: { + breakpoint: { max: 1100, min: 464 }, + }, }; const paginationStyle = { sx: { + "& .MuiPaginationItem-firstLast": { + background: "rgba(239, 239, 239, 1)", + color: "rgba(52, 56, 62, 1)", + opacity: 1, + }, + "& .MuiPaginationItem-previousNext": { + background: "rgba(239, 239, 239, 1)", + color: "rgba(52, 56, 62, 1)", + opacity: 1, + }, "& .MuiPaginationItem-root": { color: theme.palette.primary.main, }, "& .MuiPaginationItem-root.Mui-disabled": { - opacity: 1, background: "rgba(239, 239, 239, 1)", color: "rgba(175, 175, 175, 1)", + opacity: 1, }, "& .MuiPaginationItem-root.Mui-selected": { backgroundColor: theme.palette.custom.forbole.purple, color: theme.palette.primary.main, }, - "& .MuiPaginationItem-previousNext": { - opacity: 1, - background: "rgba(239, 239, 239, 1)", - color: "rgba(52, 56, 62, 1)", - }, - "& .MuiPaginationItem-firstLast": { - opacity: 1, - background: "rgba(239, 239, 239, 1)", - color: "rgba(52, 56, 62, 1)", - }, [theme.breakpoints.down("tablet")]: { display: "none", margin: theme.spacing(32, 0), }, - [theme.breakpoints.up("tablet")]: { - paddingTop: theme.spacing(7), - }, [theme.breakpoints.up("laptop")]: { height: "366px", zIndex: 3, }, + [theme.breakpoints.up("tablet")]: { + paddingTop: theme.spacing(7), + }, }, }; @@ -137,7 +137,7 @@ const BlogPosts = ({ main, blogs: blogsUpper, meta }: IProps) => { ); }; diff --git a/src/screens/contact/hooks.tsx b/src/screens/contact/hooks.tsx index 7c2ad41c..b9fd8aa9 100644 --- a/src/screens/contact/hooks.tsx +++ b/src/screens/contact/hooks.tsx @@ -8,16 +8,16 @@ import isEmail from "validator/lib/isEmail"; const useContactForm = () => { const [inputs, setInputs] = useState({ - name: "", - email: "", - company: "", - telegram: "", agree: false, - specify: "", + careers: false, collaboration: false, + company: "", + email: "", enterprise_solution: false, - careers: false, + name: "", other: false, + specify: "", + telegram: "", }); const [canSubmit, setCanSubmit] = useState(false); @@ -76,8 +76,6 @@ const useContactForm = () => { axios .post("/api/contact", { from: inputs.email, - subject: - "A new customer just wanted to get in touch with us via Enterprise form", html: `

Dear Administrator,

A new customer: ${sanitize( @@ -93,20 +91,22 @@ const useContactForm = () => {

Regards,

Forbole web system

`, + subject: + "A new customer just wanted to get in touch with us via Enterprise form", }) .then((res) => { if (res.status === 200) { setInputs({ - name: "", - email: "", - company: "", - telegram: "", agree: false, + careers: false, collaboration: false, + company: "", + email: "", enterprise_solution: false, - careers: false, + name: "", other: false, specify: "", + telegram: "", }); } @@ -132,7 +132,7 @@ const useContactForm = () => { }; const handleCheckedChange = (event: any) => { - const { name, checked } = event.target; + const { checked, name } = event.target; setInputs((input) => ({ ...input, @@ -148,16 +148,16 @@ const useContactForm = () => { }; return { - handleSubmit, - handleInputChange, + canSubmit, + handleCheckedChange, handleClear, + handleInputChange, + handleSubmit, inputs, + isLoading, setInputs, - canSubmit, - handleCheckedChange, - success, setSuccess, - isLoading, + success, }; }; diff --git a/src/screens/contact/index.tsx b/src/screens/contact/index.tsx index 771e40a3..60c5272c 100644 --- a/src/screens/contact/index.tsx +++ b/src/screens/contact/index.tsx @@ -13,7 +13,7 @@ import { } from "@mui/material"; import { useTheme } from "@mui/material/styles"; import useTranslation from "next-translate/useTranslation"; -import { useRouter } from "next/router"; +import Link from "next/link"; import { useRef } from "react"; import CtaButton from "@src/components/cta-button"; @@ -28,19 +28,18 @@ const Contact = () => { const { t } = useTranslation("contact"); const { - inputs, - handleInputChange, - handleSubmit, - handleClear, canSubmit, handleCheckedChange, - success, - setSuccess, + handleClear, + handleInputChange, + handleSubmit, + inputs, isLoading, + setSuccess, + success, } = useContactForm(); const theme = useTheme(); - const router = useRouter(); const selectList = [ { label: t("item_1"), name: "collaboration" }, @@ -52,7 +51,7 @@ const Contact = () => { const inputRef = useRef(null); const handleToggle = (e: any) => { - const { name, checked } = e.target; + const { checked, name } = e.target; if (name === "other") { if (checked) { @@ -77,30 +76,23 @@ const Contact = () => { - { - router.push("mailto:info@forbole.com"); - }} - > - - - { - router.push("https://t.me/forbole"); - }} - > - - + + + + + + + + + + {t("method")} diff --git a/src/screens/developer_tools/hooks.tsx b/src/screens/developer_tools/hooks.tsx index ec279a53..ea7c834a 100644 --- a/src/screens/developer_tools/hooks.tsx +++ b/src/screens/developer_tools/hooks.tsx @@ -8,16 +8,16 @@ import isEmail from "validator/lib/isEmail"; const useTalkModalForm = () => { const [inputs, setInputs] = useState({ - "name": "", - "email": "", - "company": "", - "telegram": "", - "specify": "", "agree": false, + "company": "", "Data API": false, + "email": "", "GraphQL": false, + "name": "", "Other": false, "RPC Endpoints": false, + "specify": "", + "telegram": "", }); const [canSubmit, setCanSubmit] = useState(false); @@ -71,7 +71,6 @@ const useTalkModalForm = () => { axios .post("/api/contact", { from: inputs.email, - source: "devtools", html: `

Dear Administrator,

A new customer: ${sanitize( @@ -87,20 +86,21 @@ const useTalkModalForm = () => {

Regards,

Forbole web system

`, + source: "devtools", }) .then((res) => { if (res.status === 200) { setInputs({ - "name": "", - "email": "", - "company": "", - "telegram": "", "agree": false, - "specify": "", + "company": "", "Data API": false, + "email": "", "GraphQL": false, + "name": "", "Other": false, "RPC Endpoints": false, + "specify": "", + "telegram": "", }); } @@ -126,7 +126,7 @@ const useTalkModalForm = () => { }; const handleCheckedChange = (event: any) => { - const { name, checked } = event.target; + const { checked, name } = event.target; setInputs((input) => ({ ...input, @@ -142,16 +142,16 @@ const useTalkModalForm = () => { }; return { - handleSubmit, - handleInputChange, + canSubmit, + handleCheckedChange, handleClear, + handleInputChange, + handleSubmit, inputs, + isLoading, setInputs, - canSubmit, - handleCheckedChange, - success, setSuccess, - isLoading, + success, }; }; diff --git a/src/screens/developer_tools/index.tsx b/src/screens/developer_tools/index.tsx index 7871cfd8..78a3ba44 100644 --- a/src/screens/developer_tools/index.tsx +++ b/src/screens/developer_tools/index.tsx @@ -26,15 +26,15 @@ import * as styles from "./index.module.scss"; const DeveloperTools = () => { const { - inputs, - handleInputChange, - handleSubmit, - handleClear, canSubmit, handleCheckedChange, - success, - setSuccess, + handleClear, + handleInputChange, + handleSubmit, + inputs, isLoading, + setSuccess, + success, } = useTalkModalForm(); const { t } = useTranslation("developer_tools"); diff --git a/src/screens/enterprise_solution/hook.ts b/src/screens/enterprise_solution/hook.ts index 4869f7f0..54269ff2 100644 --- a/src/screens/enterprise_solution/hook.ts +++ b/src/screens/enterprise_solution/hook.ts @@ -8,10 +8,10 @@ import isEmail from "validator/lib/isEmail"; const useContactForm = () => { const [inputs, setInputs] = useState({ - name: "", - email: "", company: "", + email: "", help: "", + name: "", }); const [canSubmit, setCanSubmit] = useState(false); @@ -36,7 +36,6 @@ const useContactForm = () => { axios .post("/api/contact", { from: inputs.email, - source: "enterprise", html: `

Dear Administrator,

A new customer: ${sanitize(inputs.email)} contacted us today.

@@ -48,14 +47,15 @@ const useContactForm = () => {

Regards,

Forbole web system

`, + source: "enterprise", }) .then((res) => { if (res.status === 200) { setInputs({ - name: "", - email: "", company: "", + email: "", help: "", + name: "", }); } @@ -97,16 +97,16 @@ const useContactForm = () => { }; return { - handleSubmit, - handleInputChange, + canSubmit, + handleCheckedChange, handleClear, + handleInputChange, + handleSubmit, inputs, + isLoading, setInputs, - canSubmit, - handleCheckedChange, - success, setSuccess, - isLoading, + success, }; }; diff --git a/src/screens/enterprise_solution/index.tsx b/src/screens/enterprise_solution/index.tsx index 856e9c5e..16ef2289 100644 --- a/src/screens/enterprise_solution/index.tsx +++ b/src/screens/enterprise_solution/index.tsx @@ -17,13 +17,13 @@ import * as styles from "./index.module.scss"; const EnterpriseSolution = () => { const { - inputs, + canSubmit, handleInputChange, handleSubmit, - canSubmit, - success, - setSuccess, + inputs, isLoading, + setSuccess, + success, } = useContactForm(); const topRef = useRef(null); @@ -40,9 +40,9 @@ const EnterpriseSolution = () => { e.preventDefault(); window.scrollTo({ + behavior: "smooth", left: 0, top: ref.current.offsetTop - 100, - behavior: "smooth", }); }; diff --git a/src/screens/home/index.tsx b/src/screens/home/index.tsx index 07123ff4..4c0e1ad1 100644 --- a/src/screens/home/index.tsx +++ b/src/screens/home/index.tsx @@ -1,7 +1,6 @@ import { Box, Container, Grid, Stack, Typography } from "@mui/material"; import { useTheme } from "@mui/material/styles"; import useTranslation from "next-translate/useTranslation"; -import { useRouter } from "next/router"; import type { FC } from "react"; import { useRef } from "react"; @@ -16,12 +15,12 @@ import * as styles from "./index.module.scss"; import { FilterBG } from "./styles"; export type Page = { - title: string; - list: string[]; - imageHref: string; - btnName: string; btnClick: string; + btnName: string; id: string; + imageHref: string; + list: string[]; + title: string; }; type Props = { pages: Page[] }; @@ -31,7 +30,6 @@ const Home: FC = ({ pages }) => { const theme = useTheme(); const topRef = useRef(null); const bottomRef = useRef(null); - const router = useRouter(); const { isMobile, isTablet } = useWindowDimensions(); const filteredPages = pages.reduce((pageList: Page[], current) => { @@ -71,16 +69,14 @@ const Home: FC = ({ pages }) => { > {t("title")} { - router.push("infrastructure"); - }} desc={t("Validator_Infrastructure_desc")} imageHref={ isMobile @@ -93,10 +89,8 @@ const Home: FC = ({ pages }) => { { - router.push("staking-service"); - }} desc={t("Native_Staking_Service_desc")} imageHref={ isMobile @@ -109,10 +103,8 @@ const Home: FC = ({ pages }) => { { - router.push("analytics-tools"); - }} desc={t("Blockchain_Data_Analytics_Tools_desc")} imageHref={ isMobile @@ -125,10 +117,8 @@ const Home: FC = ({ pages }) => { { - router.push("developer-tools"); - }} desc={t("Developer_Tools_desc")} imageHref={ isMobile @@ -141,10 +131,8 @@ const Home: FC = ({ pages }) => { { - router.push("enterprise-solution"); - }} desc={t("Enterprise_Solution_desc")} imageHref={ isMobile @@ -165,10 +153,10 @@ const Home: FC = ({ pages }) => { spacing={theme.spacing(2)} > {filteredPages.map( - ({ title, list, imageHref, btnName, btnClick, id }, idx) => ( + ({ btnClick, btnName, id, imageHref, list, title }, idx) => ( router.push(btnClick)} + btnLink={btnClick} btnName={btnName} disabled={!btnClick || false} imageHref={imageHref} diff --git a/src/screens/network_guides/components/guide/index.tsx b/src/screens/network_guides/components/guide/index.tsx index 44f22116..0f34bb48 100644 --- a/src/screens/network_guides/components/guide/index.tsx +++ b/src/screens/network_guides/components/guide/index.tsx @@ -51,8 +51,8 @@ const Guide = ({ post }: { post: PostDetail }) => { i18nKey="staking title" ns="staking" values={{ - title1: titleArray.slice(0, 1).join(" "), coloredTitle, + title1: titleArray.slice(0, 1).join(" "), title2: titleArray.slice(4).join(" "), }} /> diff --git a/src/screens/network_guides/components/network_info/components/info_card/index.tsx b/src/screens/network_guides/components/network_info/components/info_card/index.tsx index f4b9bdb3..a8ab44f6 100644 --- a/src/screens/network_guides/components/network_info/components/info_card/index.tsx +++ b/src/screens/network_guides/components/network_info/components/info_card/index.tsx @@ -6,7 +6,7 @@ import { convertToMoney } from "@src/utils/convert_to_money"; import useStyles from "./useStyles"; -const InfoCard = ({ title, stats, type }: any) => { +const InfoCard = ({ stats, title, type }: any) => { const { t } = useTranslation("staking"); const styles = useStyles(); diff --git a/src/screens/network_guides/components/network_info/components/info_card/useStyles.ts b/src/screens/network_guides/components/network_info/components/info_card/useStyles.ts index 47732a70..6fe923a9 100644 --- a/src/screens/network_guides/components/network_info/components/info_card/useStyles.ts +++ b/src/screens/network_guides/components/network_info/components/info_card/useStyles.ts @@ -5,27 +5,27 @@ const useStyles = () => { return { root: css({ - "display": "flex", - "flexDirection": "column", - "alignItems": "center", - "padding": theme.spacing(4, 3), - "background": theme.palette.common.white, - "boxShadow": - "0px 6px 14px -6px rgba(2, 38, 225, 0.12), 0px 10px 32px -4px rgba(2, 38, 225, 0.1)", - "borderRadius": theme.spacing(3), "& .MuiTypography-h3": { - paddingTop: theme.spacing(2), - fontWeight: 700, + /* Secondary Color/Gradient/Validator/FB Validator Gradient 04 */ + background: "linear-gradient(286.17deg, #D431EE 0%, #FF426B 100%)", + backgroundClip: "text", fontSize: theme.spacing(3), + fontWeight: 700, + letterSpacing: "0.0015em", lineHeight: "29px", + paddingTop: theme.spacing(2), /* identical to box height */ textAlign: "center", - letterSpacing: "0.0015em", - /* Secondary Color/Gradient/Validator/FB Validator Gradient 04 */ - background: "linear-gradient(286.17deg, #D431EE 0%, #FF426B 100%)", - backgroundClip: "text", textFillColor: "transparent", }, + "alignItems": "center", + "background": theme.palette.common.white, + "borderRadius": theme.spacing(3), + "boxShadow": + "0px 6px 14px -6px rgba(2, 38, 225, 0.12), 0px 10px 32px -4px rgba(2, 38, 225, 0.1)", + "display": "flex", + "flexDirection": "column", + "padding": theme.spacing(4, 3), }), }; }; diff --git a/src/screens/network_guides/components/network_info/hooks.tsx b/src/screens/network_guides/components/network_info/hooks.tsx index ce751047..fb1bedcd 100644 --- a/src/screens/network_guides/components/network_info/hooks.tsx +++ b/src/screens/network_guides/components/network_info/hooks.tsx @@ -26,7 +26,7 @@ export const useNetworkGuidesHook = () => { [], ); - const { loading: networkGuideLoading, data: networkGuideData } = + const { data: networkGuideData, loading: networkGuideLoading } = useQuery(networkGuideQuery); const networkGuides: Record = useMemo(() => { @@ -42,8 +42,8 @@ export const useNetworkGuidesHook = () => { const getAPYBlock = (stats: string) => stats ? { - title: t("apy"), stats, + title: t("apy"), type: t("percentage"), } : undefined; @@ -55,8 +55,8 @@ export const useNetworkGuidesHook = () => { [data.metric.instance], [ { - title: t("commission"), stats: data.commissionRate, + title: t("commission"), type: t("percentage"), }, ], @@ -90,8 +90,8 @@ export const useNetworkGuidesHook = () => { [ ...acc[data.metric.instance], { - title: t("staked by forbole"), stats: data.TVL, + title: t("staked by forbole"), type: t("money"), }, ], @@ -107,8 +107,8 @@ export const useNetworkGuidesHook = () => { [ ...acc[data.metric.instance], { - title: t("unbonding period"), stats: data.unbondingTime, + title: t("unbonding period"), type: t("string"), }, ], diff --git a/src/screens/network_guides/components/network_info/index.tsx b/src/screens/network_guides/components/network_info/index.tsx index 71fb5f0e..f52ce908 100644 --- a/src/screens/network_guides/components/network_info/index.tsx +++ b/src/screens/network_guides/components/network_info/index.tsx @@ -46,13 +46,13 @@ const mappings: Record = { const NetworkInfo = ({ post }: any) => { const theme = useTheme(); const { t } = useTranslation("staking"); - const { title, tags, excerpt, featureImage } = post; + const { excerpt, featureImage, tags, title } = post; const onlyLargeScreen = useMediaQuery(theme.breakpoints.up("laptop")); const [isCopySuccess, setIsCopySuccess] = useState(false); const [readMore, setReadMore] = useState(false); const { sanitize } = DOMPurify; - const cmsLoader = ({ src, width, quality }: any) => + const cmsLoader = ({ quality, src, width }: any) => `${src}?w=${width}&q=${quality || 75}`; const networkData = (() => { diff --git a/src/screens/network_guides/index.tsx b/src/screens/network_guides/index.tsx index 999ee075..054c0f68 100644 --- a/src/screens/network_guides/index.tsx +++ b/src/screens/network_guides/index.tsx @@ -12,9 +12,9 @@ import { LaptopCSS } from "./styles"; const NetworkGuides = ({ post }: any) => { useEffect(() => { window.scrollTo({ + behavior: "smooth", left: 0, top: 0, - behavior: "smooth", }); }, []); diff --git a/src/screens/policy/index.tsx b/src/screens/policy/index.tsx index 460d7bb1..d32cbb23 100644 --- a/src/screens/policy/index.tsx +++ b/src/screens/policy/index.tsx @@ -111,8 +111,8 @@ const Policy = () => { color: "#000", fontSize: "11pt", - margin: 0, lineHeight: "1.15", + margin: 0, orphans: 2, paddingBottom: 0, paddingTop: 0, @@ -231,8 +231,8 @@ const Policy = () => { color: "#000", fontSize: "11pt", - margin: 0, lineHeight: "1.15", + margin: 0, marginLeft: "8em", orphans: 2, paddingBottom: 0, @@ -252,9 +252,9 @@ const Policy = () => { color: "#000", fontSize: "11pt", - margin: 0, height: "11pt", lineHeight: "1.15", + margin: 0, marginLeft: "8em", orphans: 2, paddingBottom: 0, @@ -272,8 +272,8 @@ const Policy = () => { color: "#000", fontSize: "11pt", - margin: 0, lineHeight: "1.15", + margin: 0, marginLeft: "8em", orphans: 2, paddingBottom: 0, @@ -294,9 +294,9 @@ const Policy = () => { color: "#000", fontSize: "11pt", - margin: 0, height: "11pt", lineHeight: "1.15", + margin: 0, marginLeft: "8em", orphans: 2, paddingBottom: 0, @@ -314,8 +314,8 @@ const Policy = () => { color: "#000", fontSize: "11pt", - margin: 0, lineHeight: "1.15", + margin: 0, marginLeft: "8em", orphans: 2, paddingBottom: 0, @@ -338,9 +338,9 @@ const Policy = () => { color: "#000", fontSize: "11pt", - margin: 0, height: "11pt", lineHeight: "1.15", + margin: 0, marginLeft: "8em", orphans: 2, paddingBottom: 0, @@ -358,8 +358,8 @@ const Policy = () => { color: "#000", fontSize: "11pt", - margin: 0, lineHeight: "1.15", + margin: 0, marginLeft: "8em", orphans: 2, paddingBottom: 0, @@ -381,9 +381,9 @@ const Policy = () => { color: "#000", fontSize: "11pt", - margin: 0, height: "11pt", lineHeight: "1.15", + margin: 0, marginLeft: "8em", orphans: 2, paddingBottom: 0, @@ -401,8 +401,8 @@ const Policy = () => { color: "#000", fontSize: "11pt", - margin: 0, lineHeight: "1.15", + margin: 0, marginLeft: "8em", orphans: 2, paddingBottom: 0, @@ -437,8 +437,8 @@ const Policy = () => { color: "#000", fontSize: "11pt", - margin: 0, lineHeight: "1.15", + margin: 0, marginLeft: "8em", orphans: 2, paddingBottom: 0, @@ -461,9 +461,9 @@ const Policy = () => { color: "#000", fontSize: "11pt", - margin: 0, height: "11pt", lineHeight: "1.15", + margin: 0, marginLeft: "8em", orphans: 2, paddingBottom: 0, @@ -481,8 +481,8 @@ const Policy = () => { color: "#000", fontSize: "11pt", - margin: 0, lineHeight: "1.15", + margin: 0, marginLeft: "8em", orphans: 2, paddingBottom: 0, @@ -506,9 +506,9 @@ const Policy = () => { color: "#000", fontSize: "11pt", - margin: 0, height: "11pt", lineHeight: "1.15", + margin: 0, marginLeft: "8em", orphans: 2, paddingBottom: 0, @@ -526,8 +526,8 @@ const Policy = () => { color: "#000", fontSize: "11pt", - margin: 0, lineHeight: "1.15", + margin: 0, marginLeft: "8em", orphans: 2, paddingBottom: 0, @@ -1160,8 +1160,8 @@ const Policy = () => { color: "#000", fontSize: "11pt", - margin: 0, lineHeight: "1.15", + margin: 0, orphans: 2, @@ -1205,8 +1205,8 @@ const Policy = () => { style={{ color: "#000", fontSize: "11pt", - margin: 0, lineHeight: "1.15", + margin: 0, orphans: 2, textAlign: "left", @@ -1232,8 +1232,8 @@ const Policy = () => { style={{ color: "#000", fontSize: "11pt", - margin: 0, lineHeight: "1.15", + margin: 0, orphans: 2, textAlign: "left", @@ -1248,8 +1248,8 @@ const Policy = () => { style={{ color: "#000", fontSize: "11pt", - margin: 0, lineHeight: "1.15", + margin: 0, orphans: 2, textAlign: "left", @@ -1267,12 +1267,12 @@ const Policy = () => { style={{ color: "#000", fontSize: "11pt", - margin: 0, lineHeight: "1.15", + margin: 0, + marginLeft: "4em", orphans: 2, textAlign: "right", widows: 2, - marginLeft: "4em", }} > {t("desc3")?.trim()} diff --git a/src/screens/products/index.module.scss b/src/screens/products/index.module.scss index 646d32cc..105f0390 100644 --- a/src/screens/products/index.module.scss +++ b/src/screens/products/index.module.scss @@ -274,3 +274,15 @@ min-width: 0; padding: 0; } + +.mobileOnly { + @include up-tablet { + display: none; + } +} + +.notMobile { + @include down-tablet { + display: none; + } +} diff --git a/src/screens/products/index.tsx b/src/screens/products/index.tsx index b8edb03d..644be1b5 100644 --- a/src/screens/products/index.tsx +++ b/src/screens/products/index.tsx @@ -1,13 +1,7 @@ -import { - Container, - Stack, - Typography, - useMediaQuery, - useTheme, -} from "@mui/material"; +import { Box, Container, Stack, Typography } from "@mui/material"; import useTranslation from "next-translate/useTranslation"; import dynamic from "next/dynamic"; -import { useRouter } from "next/router"; +import Link from "next/link"; import { useMemo, useRef, useState } from "react"; import CtaButton from "@src/components/cta-button"; @@ -30,31 +24,31 @@ const Products = () => { const individuals = useMemo( () => [ { - title: t("staking"), benefits: [t("earn"), t("secure"), t("ownership")], - usecases: [t("stake"), t("income")], + btnHref: "/staking-service", + btnName: t("seemore"), imageHref: "/products/tab2@2x.png", imageHref_m: "/products/tab2_m@2x.png", - btnName: t("seemore"), - btnHref: "/staking-service", + title: t("staking"), + usecases: [t("stake"), t("income")], }, { - title: t("analytics"), benefits: [t("real-time"), t("bird-eye-view"), t("free")], - usecases: [t("transactions"), t("viewandvote")], + btnHref: "/analytics-tools", + btnName: t("seemore"), imageHref: "/products/tab3@2x.png", imageHref_m: "/products/tab3_m@2x.png", - btnName: t("seemore"), - btnHref: "/analytics-tools", + title: t("analytics"), + usecases: [t("transactions"), t("viewandvote")], }, { - title: t("developer"), benefits: [t("nodes"), t("free-trial"), t("pricing")], - usecases: [t("RPC"), t("GraphQL"), t("data-api")], + btnHref: "/developer-tools", + btnName: t("seemore"), imageHref: "/products/tab4@2x.png", imageHref_m: "/products/tab4_m@2x.png", - btnName: t("seemore"), - btnHref: "/developer-tools", + title: t("developer"), + usecases: [t("RPC"), t("GraphQL"), t("data-api")], }, ], [t], @@ -63,67 +57,61 @@ const Products = () => { const businesses = useMemo( () => [ { - title: t("validator-infrastructure"), benefits: [t("security"), t("expertise"), t("record")], - usecases: [t("new-network"), t("strengthen-network")], + btnHref: "/infrastructure", + btnName: t("seemore"), imageHref: "/products/tab1@2x.png", imageHref_m: "/products/tab1_m@2x.png", - btnName: t("seemore"), - btnHref: "/infrastructure", + title: t("validator-infrastructure"), + usecases: [t("new-network"), t("strengthen-network")], }, { - title: t("staking"), benefits: [t("100% control"), t("asset-variety"), t("balance")], - usecases: [t("stake-token"), t("stake-of-clients")], + btnHref: "/staking-service", + btnName: t("seemore"), imageHref: "/products/tab2@2x.png", imageHref_m: "/products/tab2_m@2x.png", - btnName: t("seemore"), - btnHref: "/staking-service", + title: t("staking"), + usecases: [t("stake-token"), t("stake-of-clients")], }, { - title: t("analytics"), benefits: [ t("custom-visualization"), t("modularized-development"), t("fast"), ], - usecases: [t("own-explorer"), t("query-data")], + btnHref: "/analytics-tools", + btnName: t("seemore"), imageHref: "/products/tab3@2x.png", imageHref_m: "/products/tab3_m@2x.png", - btnName: t("seemore"), - btnHref: "/analytics-tools", + title: t("analytics"), + usecases: [t("own-explorer"), t("query-data")], }, { - title: t("developer"), benefits: [t("high"), t("custom-offering"), t("team-support")], + btnHref: "/developer-tools", + btnName: t("seemore"), + imageHref: "/products/tab4@2x.png", + imageHref_m: "/products/tab4_m@2x.png", + title: t("developer"), usecases: [ t("run-decentralized-apps"), t("analyze-decentralized-apps"), ], - imageHref: "/products/tab4@2x.png", - imageHref_m: "/products/tab4_m@2x.png", - btnName: t("seemore"), - btnHref: "/developer-tools", }, { - title: t("enterprise-solution"), benefits: [t("free-consultation"), t("iteration"), t("end-to-end")], - usecases: [t("staking-API"), t("Implementation")], + btnHref: "/enterprise-solution", + btnName: t("seemore"), imageHref: "/products/tab5@2x.png", imageHref_m: "/products/tab5_m@2x.png", - btnName: t("seemore"), - btnHref: "/enterprise-solution", + title: t("enterprise-solution"), + usecases: [t("staking-API"), t("Implementation")], }, ], [t], ); - const theme = useTheme(); - - const isMobile = useMediaQuery(theme.breakpoints.down("tablet"), { - noSsr: true, - }); - const [v1, setV1] = useState(0); const [v2, setV2] = useState(0); const topRef = useRef(null); @@ -131,15 +119,14 @@ const Products = () => { const businessesRef = useRef(null); const PanelRef1 = useRef(null); const PanelRef2 = useRef(null); - const router = useRouter(); const scrollToRef = (e: any, ref: any) => { e.preventDefault(); window.scrollTo({ + behavior: "smooth", left: 0, top: ref.current.offsetTop - 100, - behavior: "smooth", }); }; @@ -157,18 +144,14 @@ const Products = () => { {t("why")} , + , , ]} i18nKey="bridging" @@ -177,19 +160,23 @@ const Products = () => { scrollToRef(e, individualsRef)} - startIcon={} + startIcon={ + + } > {t("for-individuals")} scrollToRef(e, businessesRef)} - startIcon={} + startIcon={ + + } > {t("for-businesses")} @@ -201,7 +188,7 @@ const Products = () => { , + , , ]} i18nKey="safe-path" @@ -210,72 +197,75 @@ const Products = () => { - {!isMobile && ( - + + } + label={t("staking")} + /> + + } + label={t("analytics")} + /> + + } + label={t("developer")} + /> + + + { + handleChange(e, 0); + scrollBottom(e, PanelRef1); + }} + startIcon={ + + } > - } - label={t("staking")} - /> - } - label={t("analytics")} - /> - } - label={t("developer")} - /> - - )} - {isMobile && ( - <> - { - handleChange(e, 0); - scrollBottom(e, PanelRef1); - }} - startIcon={ - - } - > - {t("staking")} - - { - handleChange(e, 1); - scrollBottom(e, PanelRef1); - }} - startIcon={ - - } - > - {t("analytics")} - - { - handleChange(e, 2); - scrollBottom(e, PanelRef1); - }} - startIcon={ - - } - > - {t("developer")} - - - )} + {t("staking")} + + { + handleChange(e, 1); + scrollBottom(e, PanelRef1); + }} + startIcon={ + + } + > + {t("analytics")} + + { + handleChange(e, 2); + scrollBottom(e, PanelRef1); + }} + startIcon={ + + } + > + {t("developer")} + + {individuals.map((item, index) => ( { ))} - router.push(item.btnHref)}> - {item.btnName} - + + {item.btnName} + ))} @@ -314,7 +304,7 @@ const Products = () => { , + , , ]} i18nKey="trusted" @@ -324,121 +314,131 @@ const Products = () => { - {!isMobile && ( - <> - - - } - label={t("validator-infrastructure")} - /> - - } - label={t("staking")} - /> - - } - label={t("analytics")} - /> - - - - - - - - - } - label={t("developer")} - /> - - } - label={t("enterprise-solution")} - /> - - - )} - {isMobile && ( - <> - { - handleChange2(e, 0); - scrollBottom(e, PanelRef2); - }} - startIcon={ - - } - > - {t("validator-infrastructure")} - + + + } + label={t("validator-infrastructure")} + /> + + } + label={t("staking")} + /> + + } + label={t("analytics")} + /> + + + + + + + + + } + label={t("developer")} + /> + + } + label={t("enterprise-solution")} + /> + + + { + handleChange2(e, 0); + scrollBottom(e, PanelRef2); + }} + startIcon={ + + } + > + {t("validator-infrastructure")} + + { + handleChange2(e, 1); + scrollBottom(e, PanelRef2); + }} + startIcon={ + + } + > + {t("staking")} + + { + handleChange2(e, 2); + scrollBottom(e, PanelRef2); + }} + startIcon={ + + } + > + {t("analytics")} + + { - handleChange2(e, 1); + handleChange2(e, 3); scrollBottom(e, PanelRef2); }} startIcon={ - + } > - {t("staking")} + {t("developer")} { - handleChange2(e, 2); + handleChange2(e, 4); scrollBottom(e, PanelRef2); }} startIcon={ - + } > - {t("analytics")} + {t("enterprise-solution")} - - { - handleChange2(e, 3); - scrollBottom(e, PanelRef2); - }} - startIcon={ - - } - > - {t("developer")} - - { - handleChange2(e, 4); - scrollBottom(e, PanelRef2); - }} - startIcon={ - - } - > - {t("enterprise-solution")} - - - - )} + + {businesses.map((item, index) => ( { ))} - router.push(item.btnHref)}> - {item.btnName} - + + {item.btnName} + ))} diff --git a/src/screens/staking/components/calculate_rewards/components/calculator/index.tsx b/src/screens/staking/components/calculate_rewards/components/calculator/index.tsx index 97e4c805..9e663283 100644 --- a/src/screens/staking/components/calculate_rewards/components/calculator/index.tsx +++ b/src/screens/staking/components/calculate_rewards/components/calculator/index.tsx @@ -37,17 +37,17 @@ const Calculator = () => { const onlyLargeScreen = useMediaQuery(theme.breakpoints.up("laptop")); const { - selectedToken, - setSelectedToken, - totalEarnings, handleChange, - tokens, monthlyPeriods, + selectedToken, setMonthlyPeriods, + setSelectedToken, + tokens, + totalEarnings, } = useCalculateRewardsHook(); const networkData = cosmosNetworkKeys - .map((x: string | number) => getNetworkInfo(x)) + .map((x: number | string) => getNetworkInfo(x)) .filter(Boolean) .filter((x) => !skippedRewardsNetworks.has(x.key)) .filter((x) => getCanClickNetwork(x)); @@ -100,25 +100,25 @@ const Calculator = () => { { const { value } = e.target; diff --git a/src/screens/staking/components/faq/components/card/index.tsx b/src/screens/staking/components/faq/components/card/index.tsx index ab88077d..b0f31cf1 100644 --- a/src/screens/staking/components/faq/components/card/index.tsx +++ b/src/screens/staking/components/faq/components/card/index.tsx @@ -13,17 +13,17 @@ import type { FAQProps } from "../../config"; import * as styles from "./index.module.scss"; const Card = ({ - question, - para1, - para2, - trans, - para3, - desc, bullet1, bullet2, bullet3, + desc, expanded, + para1, + para2, + para3, + question, setExpanded, + trans, }: FAQProps) => ( void; + trans?: string; } export const useFaq = (): FAQProps[] => { @@ -27,33 +27,34 @@ export const useFaq = (): FAQProps[] => { () => [ { - question: t("staking q"), para1: t("staking para 1"), para2: t("staking para 2"), + question: t("staking q"), }, { - question: t("difference q"), para1: t("difference para 1"), + question: t("difference q"), }, { - question: t("unstaking q"), para1: t("unstaking para 1"), para2: t("unstaking para 2"), para3: t("unstaking para 3"), + question: t("unstaking q"), }, { - question: t("risks q"), para1: t("risks para 1"), + question: t("risks q"), }, { - question: t("benefits q"), - desc: t("benefits desc"), bullet1: t("benefits bullet 1"), bullet2: t("benefits bullet 2"), + desc: t("benefits desc"), + question: t("benefits q"), }, { - question: t("reward q"), para1: t("reward para 1"), + para3: t("reward para 3"), + question: t("reward q"), trans: ( { ns="staking" /> ), - para3: t("reward para 3"), }, { - question: t("receiving q"), bullet1: t("receiving bullet 1"), bullet2: t("receiving bullet 2"), + question: t("receiving q"), }, { - question: t("drop q"), - desc: t("drop desc"), bullet1: t("drop bullet 1"), bullet2: t("drop bullet 2"), + desc: t("drop desc"), + question: t("drop q"), }, { - question: t("claim q"), para1: t("claim para 1"), + question: t("claim q"), }, ] as FAQProps[], [t], diff --git a/src/screens/staking/components/faq/index.tsx b/src/screens/staking/components/faq/index.tsx index dacf0a14..3beebe7b 100644 --- a/src/screens/staking/components/faq/index.tsx +++ b/src/screens/staking/components/faq/index.tsx @@ -25,15 +25,15 @@ const FAQ = () => { if (i > middleIndex) return null; const { - question, - para1, - para2, - trans, - para3, - desc, bullet1, bullet2, bullet3, + desc, + para1, + para2, + para3, + question, + trans, } = x; return ( @@ -63,15 +63,15 @@ const FAQ = () => { if (i <= middleIndex) return null; const { - question, - para1, - para2, - trans, - para3, - desc, bullet1, bullet2, bullet3, + desc, + para1, + para2, + para3, + question, + trans, } = x; return ( diff --git a/src/screens/staking/components/hero/components/stats/components/stats_card/index.tsx b/src/screens/staking/components/hero/components/stats/components/stats_card/index.tsx index 36157e58..8ca63457 100644 --- a/src/screens/staking/components/hero/components/stats/components/stats_card/index.tsx +++ b/src/screens/staking/components/hero/components/stats/components/stats_card/index.tsx @@ -6,9 +6,9 @@ import { convertToMoney } from "@src/utils/convert_to_money"; import * as styles from "./index.module.scss"; -const StatsCard = ({ title, stats }: any) => { +const StatsCard = ({ stats, title }: any) => { const { t } = useTranslation("common"); - const { counterValue, counterRef } = useCounter(stats); + const { counterRef, counterValue } = useCounter(stats); return ( diff --git a/src/screens/staking/components/hero/components/stats/hooks.tsx b/src/screens/staking/components/hero/components/stats/hooks.tsx index 30c42a41..c7c94749 100644 --- a/src/screens/staking/components/hero/components/stats/hooks.tsx +++ b/src/screens/staking/components/hero/components/stats/hooks.tsx @@ -9,7 +9,7 @@ import { networkNumber } from "@src/utils/network_info"; const elrondNetworkFunctions = networkFunctions.elrond; type StatsItem = { - stats: string | number; + stats: number | string; title: string; }; @@ -19,22 +19,22 @@ export const useStatsHook = () => { const stats: StatsItem[] = useMemo( () => [ { - title: t("full tvl"), stats: "-", + title: t("full tvl"), }, { - title: t("users staking"), stats: "-", + title: t("users staking"), }, { - title: t("supporting networks"), stats: networkNumber, + title: t("supporting networks"), }, ], [t], ); - const { loading: statsQueryLoading, data: statsQueryData } = + const { data: statsQueryData, loading: statsQueryLoading } = useQuery(statsQuery); const parsedStats = useMemo(() => { diff --git a/src/screens/staking/components/hooks.ts b/src/screens/staking/components/hooks.ts index 3786082f..29efca01 100644 --- a/src/screens/staking/components/hooks.ts +++ b/src/screens/staking/components/hooks.ts @@ -3,8 +3,8 @@ import { useEffect, useRef, useState } from "react"; export const useCounter = (targetValue: unknown) => { const [counterValue, setCounterValue] = useState(0); const counterRef = useRef(null); - const divisor = useRef(null); - const intervalId = useRef(null); + const divisor = useRef(null); + const intervalId = useRef(null); const hasViewed = useRef(false); const clearInterval = () => { diff --git a/src/screens/staking/components/how_it_works/components/how_to_card/index.tsx b/src/screens/staking/components/how_it_works/components/how_to_card/index.tsx index 997e3437..f8581713 100644 --- a/src/screens/staking/components/how_it_works/components/how_to_card/index.tsx +++ b/src/screens/staking/components/how_it_works/components/how_to_card/index.tsx @@ -2,21 +2,13 @@ import { Box, Typography, useMediaQuery, useTheme } from "@mui/material"; import Image from "next/legacy/image"; -const HowToCard = ({ id, image, title, desc }: any) => { +const HowToCard = ({ desc, id, image, title }: any) => { const theme = useTheme(); const onlyLargeScreen = useMediaQuery(theme.breakpoints.up("laptop")); return ( { : ("-5px !important" as any), maxWidth: "150% !important" as any, }, + "alignItems": "flex-start", + "background": theme.palette.common.white, + "borderRadius": theme.spacing(3), + "boxShadow": + "0px 6px 14px -6px rgba(2, 38, 225, 0.12), 0px 10px 32px -4px rgba(2, 38, 225, 0.1)", + "display": "flex", + "flexDirection": "column", + "padding": theme.spacing(4, 3), }} > { color={theme.palette.custom.forbole.blue} fontWeight={600} sx={{ - padding: theme.spacing(5.75, 0, 3, 0), fontSize: theme.spacing(2.25), + padding: theme.spacing(5.75, 0, 3, 0), [theme.breakpoints.up("laptop")]: { fontSize: theme.spacing(2.5), padding: theme.spacing(2.5, 0), @@ -68,8 +68,8 @@ const HowToCard = ({ id, image, title, desc }: any) => { color={theme.palette.custom.forbole.blue} fontSize={onlyLargeScreen ? theme.spacing(2) : theme.spacing(1.75)} sx={{ - textAlign: "start", lineHeight: theme.spacing(2.5), + textAlign: "start", [theme.breakpoints.up("laptop")]: { lineHeight: theme.spacing(3), }, diff --git a/src/screens/staking/components/how_it_works/index.tsx b/src/screens/staking/components/how_it_works/index.tsx index 7ed26aab..738cd63c 100644 --- a/src/screens/staking/components/how_it_works/index.tsx +++ b/src/screens/staking/components/how_it_works/index.tsx @@ -15,28 +15,28 @@ const HowItWorks = () => { const howTos = useMemo( () => [ { + desc: t("trusted provider desc"), id: 1, image: "/images/assets/image_provider.png", title: t("trusted provider"), - desc: t("trusted provider desc"), }, { + desc: t("stake desc"), id: 2, image: "/images/assets/image_stake.png", title: t("stake"), - desc: t("stake desc"), }, { + desc: t("rewards desc"), id: 3, image: "/images/assets/image_rewards.png", title: t("rewards"), - desc: t("rewards desc"), }, { + desc: t("non-custodial desc"), id: 4, image: "/images/assets/image_non-custodial.png", title: t("non-custodial"), - desc: t("non-custodial desc"), }, ], [t], @@ -75,14 +75,14 @@ const HowItWorks = () => { /> diff --git a/src/screens/staking/components/networks/components/network_grid/components/network_card/index.tsx b/src/screens/staking/components/networks/components/network_grid/components/network_card/index.tsx index 8f31c049..d656c09d 100644 --- a/src/screens/staking/components/networks/components/network_grid/components/network_card/index.tsx +++ b/src/screens/staking/components/networks/components/network_grid/components/network_card/index.tsx @@ -22,8 +22,8 @@ import * as styles from "./index.module.scss"; interface CardProp { network: Network; networkSummary: ParamsProps; - showMobilePopover: string; setShowMobilePopover: Dispatch>; + showMobilePopover: string; } const NetworkCard = ({ @@ -173,8 +173,8 @@ const NetworkCard = ({ ref={ref} transition={{ duration: 0.3 }} variants={{ - initial: { opacity: 0, scale: 0.8 }, appear: { opacity: 1, scale: 1 }, + initial: { opacity: 0, scale: 0.8 }, }} whileInView="appear" > diff --git a/src/screens/staking/components/networks/components/network_grid/config.ts b/src/screens/staking/components/networks/components/network_grid/config.ts index 0573cf2a..d20557b5 100644 --- a/src/screens/staking/components/networks/components/network_grid/config.ts +++ b/src/screens/staking/components/networks/components/network_grid/config.ts @@ -2,9 +2,9 @@ import { cosmosNetworkKeys } from "@src/utils/network_info"; export type ParamsProps = { APY: number; - TVL: number; bonded: number; custom?: Record; + TVL: number; }; export type NetworkProps = { @@ -12,8 +12,8 @@ export type NetworkProps = { }; const defaultParams: ParamsProps = { - bonded: 0, APY: 0, + bonded: 0, TVL: 0, }; diff --git a/src/screens/staking/components/networks/components/network_grid/hooks.ts b/src/screens/staking/components/networks/components/network_grid/hooks.ts index 23fe24d4..94b74e90 100644 --- a/src/screens/staking/components/networks/components/network_grid/hooks.ts +++ b/src/screens/staking/components/networks/components/network_grid/hooks.ts @@ -18,7 +18,7 @@ import { const elrondNetworkFunctions = networkFunctions.elrond; export const useNetworkHook = () => { - const { loading: networkGridLoading, data: networkGridData } = + const { data: networkGridData, loading: networkGridLoading } = useQuery(networkGridQuery); const cosmosNetworks = useMemo(() => { @@ -66,7 +66,6 @@ export const useNetworkHook = () => { () => ({ ethereum: { APY: 0, - TVL: 0, bonded: 0, custom: { "POOL APY": "3.16%", @@ -74,6 +73,7 @@ export const useNetworkHook = () => { "SOLO AVG APY": "4%", "SOLO MEV APY": "5,69%", }, + TVL: 0, }, }), [], @@ -81,7 +81,7 @@ export const useNetworkHook = () => { const elrondNetwork = useMemo(() => { if (!networkGridLoading && networkGridData) { - const { elrondBondedToken, elrondAPY, elrondTVL } = networkGridData; + const { elrondAPY, elrondBondedToken, elrondTVL } = networkGridData; return pipe( reduce( @@ -122,7 +122,7 @@ export const useNetworkHook = () => { const solanaNetwork = useMemo(() => { if (!networkGridLoading && networkGridData) { - const { solanaTVL, solanaBondedToken } = networkGridData; + const { solanaBondedToken, solanaTVL } = networkGridData; return pipe( assocPath([solanaTVL.metric.instance, "TVL"], solanaTVL.TVL), @@ -138,7 +138,7 @@ export const useNetworkHook = () => { const oasisNetwork = useMemo(() => { if (!networkGridLoading && networkGridData) { - const { oasisTVL, oasisBondedToken } = networkGridData; + const { oasisBondedToken, oasisTVL } = networkGridData; const networkWithTVL = { ...oasisNetworkParams, diff --git a/src/screens/staking/components/networks/components/network_grid/index.tsx b/src/screens/staking/components/networks/components/network_grid/index.tsx index f85ca835..c5fbc610 100644 --- a/src/screens/staking/components/networks/components/network_grid/index.tsx +++ b/src/screens/staking/components/networks/components/network_grid/index.tsx @@ -10,11 +10,11 @@ import type { NetworkProps } from "./config"; import useStyles from "./useStyles"; type Props = { - sortedNetworks: Network[]; allNetworkInfo: NetworkProps; + sortedNetworks: Network[]; }; -const NetworkGrid = ({ sortedNetworks, allNetworkInfo }: Props) => { +const NetworkGrid = ({ allNetworkInfo, sortedNetworks }: Props) => { const styles = useStyles(); const [showMobilePopover, setShowMobilePopover] = useState(""); diff --git a/src/screens/staking/components/networks/components/network_grid/useStyles.ts b/src/screens/staking/components/networks/components/network_grid/useStyles.ts index 910c1f54..007dcd7b 100644 --- a/src/screens/staking/components/networks/components/network_grid/useStyles.ts +++ b/src/screens/staking/components/networks/components/network_grid/useStyles.ts @@ -6,26 +6,26 @@ const useStyles = () => { return { grid: css({ display: "grid", - gridTemplateRows: "repeat(5, 1fr)", gridTemplateColumns: "repeat(2, 1fr)", + gridTemplateRows: "repeat(5, 1fr)", [theme.breakpoints.up("tablet")]: { - gridTemplateRows: "repeat(3, 1fr)", gridTemplateColumns: "repeat(5, 1fr)", + gridTemplateRows: "repeat(3, 1fr)", }, }), root: css({ "& .home__networks": { - padding: theme.spacing(3, 0, 12, 0), display: "grid", + gridGap: theme.spacing(2), gridTemplateColumns: `repeat(auto-fit, minmax(${theme.spacing( 15, )}, 1fr))`, justifyContent: "space-between", - gridGap: theme.spacing(2), + padding: theme.spacing(3, 0, 12, 0), [theme.breakpoints.up("laptop")]: { + gridGap: theme.spacing(3), gridTemplateColumns: `repeat(5, minmax(${theme.spacing(15)}, 1fr))`, padding: theme.spacing(5, 0, 12, 0), - gridGap: theme.spacing(3), }, }, }), diff --git a/src/screens/staking/components/networks/components/search_bar/index.tsx b/src/screens/staking/components/networks/components/search_bar/index.tsx index 5c97e359..f21c9c7f 100644 --- a/src/screens/staking/components/networks/components/search_bar/index.tsx +++ b/src/screens/staking/components/networks/components/search_bar/index.tsx @@ -58,11 +58,11 @@ function useSearch(InputProps: ComponentProps["InputProps"]) { } interface OptionsProps { - props: HTMLAttributes; network: Network; + props: HTMLAttributes; } -const Options = ({ props, network }: OptionsProps) => { +const Options = ({ network, props }: OptionsProps) => { const styles = useStyles(); return ( @@ -171,8 +171,8 @@ const SearchBar = ({ sortedNetworks }: Props) => { const top = elementPosition + window.pageYOffset - headerOffset; window.scrollTo({ - top, behavior: "smooth", + top, }); }, []); diff --git a/src/screens/staking/components/networks/components/search_bar/useStyles.ts b/src/screens/staking/components/networks/components/search_bar/useStyles.ts index 7937fa00..99b82144 100644 --- a/src/screens/staking/components/networks/components/search_bar/useStyles.ts +++ b/src/screens/staking/components/networks/components/search_bar/useStyles.ts @@ -4,113 +4,52 @@ const useStyles = () => { const theme = useTheme(); return { - root: { - [theme.breakpoints.down("tablet")]: { - width: "100%", - }, - "&&.searchbox__focused": { - [theme.breakpoints.down("tablet")]: { - "position": "fixed !important", - "top": 0, - "left": 0, - "right": 0, - "zIndex": 10, - "height": theme.spacing(8), - "display": "flex", - "gap": theme.spacing(2), - "alignItems": "center", - "padding": theme.spacing(0, 2, 0, 4), - "backdropFilter": "blur(16px)", - "background": - "linear-gradient(180deg, #FFFFFF 0%, rgba(255, 255, 255, 0) 100%)", - "& .searchbox__cancel-btn": { - display: "inline-flex", - }, - }, - }, - "& .MuiAutocomplete-inputRoot": { - backgroundColor: alpha(theme.palette.common.white, 0.2), - }, - "&& .searchbox__cancel-btn": { - color: theme.palette.custom.forbole.indigo6, - display: "none", - }, - "& .MuiAutocomplete-root": { - "width": "100%", - [theme.breakpoints.up("tablet")]: { - width: theme.spacing(36.375), - minWidth: theme.spacing(36.375), - height: theme.spacing(4.75), - float: "right", - }, - "& .MuiInputBase-root": { - padding: `${theme.spacing(0.5, 2.25, 0.5, 2.25)} !important`, - mixBlendMode: "normal", - backdropFilter: "blur(4px)", - borderRadius: theme.spacing(3), - background: theme.palette.common.white, - border: "1px solid rgba(219, 219, 219, 0.2) !important" as any, - boxShadow: - "0px 6px 14px -6px rgb(2 38 225 / 12%), 0px 10px 32px -4px rgb(2 38 225 / 10%)", - }, - }, - }, - textField: { - "& .MuiOutlinedInput-notchedOutline": { - border: "none", - }, - }, listItem: { - "height": `${theme.spacing(7)} !important`, - "display": "flex !important", - "flexFlow": "row nowrap !important", - "justifyContent": "space-between !important", - "alignItems": "center !important", - "cursor": "pointer !important", - "padding": `0 !important`, "& .MuiListItemIcon-root": { - "flex": `0 0 ${theme.spacing(7)} !important`, - "justifyContent": "center !important", - "width": theme.spacing(7), "& .image": { - display: "flex", - justifyContent: "center", alignItems: "center", - width: `${theme.spacing(4)} !important`, - height: `${theme.spacing(4)} !important`, - borderRadius: "100%", - padding: 0, - margin: 0, border: "1px solid rgba(177, 177, 242, 0.3)", + borderRadius: "100%", boxShadow: "0px 8px 22px -6px rgb(2 38 225 / 12%), 0px 14px 64px -4px rgb(2 38 225 / 12%)", + display: "flex", + height: `${theme.spacing(4)} !important`, + justifyContent: "center", + margin: 0, + padding: 0, + width: `${theme.spacing(4)} !important`, }, + "flex": `0 0 ${theme.spacing(7)} !important`, + "justifyContent": "center !important", + "width": theme.spacing(7), }, "& .MuiListItemText-root": { - flexFlow: "row wrap !important", - flex: `1 0 ${theme.spacing(3)} !important`, - padding: "0 !important", /* Neutral Color/Light Grey 01 */ color: theme.palette.custom.forbole.indigo6, + flex: `1 0 ${theme.spacing(3)} !important`, + flexFlow: "row wrap !important", + fontSize: theme.typography.body2.fontSize, fontStyle: "normal", fontWeight: 600, - fontSize: theme.typography.body2.fontSize, lineHeight: 1.42, + padding: "0 !important", }, + "alignItems": "center !important", + "cursor": "pointer !important", + "display": "flex !important", + "flexFlow": "row nowrap !important", + "height": `${theme.spacing(7)} !important`, + "justifyContent": "space-between !important", + "padding": `0 !important`, }, paper: { - margin: theme.spacing(2, 0), + backdropFilter: "blur(24px)", /* Secondary Color/Royal Blue Transparent 04 */ backgroundColor: alpha(theme.palette.primary.main, 0.9), - backdropFilter: "blur(24px)", borderRadius: theme.spacing(1.5), + margin: theme.spacing(2, 0), }, popper: { - "zIndex": "2001 !important", - "& .MuiPaper-root": { - boxShadow: - "0px 6px 14px -6px rgb(2 38 225 / 12%), 0px 10px 32px -4px rgb(2 38 225 / 10%)", - }, "& .MuiAutocomplete-listbox": { maxHeight: `calc(50vh - ${theme.spacing(10)})`, [theme.breakpoints.up("tablet")]: { @@ -120,21 +59,82 @@ const useStyles = () => { "& .MuiAutocomplete-noOptions": { color: "#1D1E22", }, + "& .MuiPaper-root": { + boxShadow: + "0px 6px 14px -6px rgb(2 38 225 / 12%), 0px 10px 32px -4px rgb(2 38 225 / 10%)", + }, [theme.breakpoints.down("tablet")]: { - position: "fixed !important", - top: `${theme.spacing(8)} !important`, - bottom: "0 !important", - left: "0 !important", - right: "0 !important", - padding: `${theme.spacing(0, 4)} !important`, - width: "100% !important", + backdropFilter: "blur(16px)", backgroundColor: "linear-gradient(180deg, #FFFFFF 0%, rgba(255, 255, 255, 0) 100%) !important", - backdropFilter: "blur(16px)", - transform: "none !important", + bottom: "0 !important", /* Shadow/Secondary (Validator)/Drop Shadow 02 */ boxShadow: "0px 6px 14px -6px rgba(2, 38, 225, 0.12), 0px 10px 32px -4px rgba(2, 38, 225, 0.1)", + left: "0 !important", + padding: `${theme.spacing(0, 4)} !important`, + position: "fixed !important", + right: "0 !important", + top: `${theme.spacing(8)} !important`, + transform: "none !important", + width: "100% !important", + }, + "zIndex": "2001 !important", + }, + root: { + "& .MuiAutocomplete-inputRoot": { + backgroundColor: alpha(theme.palette.common.white, 0.2), + }, + "& .MuiAutocomplete-root": { + "& .MuiInputBase-root": { + backdropFilter: "blur(4px)", + background: theme.palette.common.white, + border: "1px solid rgba(219, 219, 219, 0.2) !important" as any, + borderRadius: theme.spacing(3), + boxShadow: + "0px 6px 14px -6px rgb(2 38 225 / 12%), 0px 10px 32px -4px rgb(2 38 225 / 10%)", + mixBlendMode: "normal", + padding: `${theme.spacing(0.5, 2.25, 0.5, 2.25)} !important`, + }, + [theme.breakpoints.up("tablet")]: { + float: "right", + height: theme.spacing(4.75), + minWidth: theme.spacing(36.375), + width: theme.spacing(36.375), + }, + "width": "100%", + }, + "&& .searchbox__cancel-btn": { + color: theme.palette.custom.forbole.indigo6, + display: "none", + }, + "&&.searchbox__focused": { + [theme.breakpoints.down("tablet")]: { + "& .searchbox__cancel-btn": { + display: "inline-flex", + }, + "alignItems": "center", + "backdropFilter": "blur(16px)", + "background": + "linear-gradient(180deg, #FFFFFF 0%, rgba(255, 255, 255, 0) 100%)", + "display": "flex", + "gap": theme.spacing(2), + "height": theme.spacing(8), + "left": 0, + "padding": theme.spacing(0, 2, 0, 4), + "position": "fixed !important", + "right": 0, + "top": 0, + "zIndex": 10, + }, + }, + [theme.breakpoints.down("tablet")]: { + width: "100%", + }, + }, + textField: { + "& .MuiOutlinedInput-notchedOutline": { + border: "none", }, }, }; diff --git a/src/screens/staking/components/networks/index.tsx b/src/screens/staking/components/networks/index.tsx index 7ef822df..e156c5df 100644 --- a/src/screens/staking/components/networks/index.tsx +++ b/src/screens/staking/components/networks/index.tsx @@ -37,7 +37,7 @@ const Networks = () => { }; const allNetworkData = allNetworkKeys - .map((x: string | number) => getNetworkInfo(x)) + .map((x: number | string) => getNetworkInfo(x)) .filter(Boolean); const sortedNetworks = [...allNetworkData].sort((a, b) => diff --git a/src/screens/staking/components/why_forbole/index.tsx b/src/screens/staking/components/why_forbole/index.tsx index 4ee2f5f3..41335e29 100644 --- a/src/screens/staking/components/why_forbole/index.tsx +++ b/src/screens/staking/components/why_forbole/index.tsx @@ -14,19 +14,19 @@ const WhyForbole = () => { const reasons = useMemo( () => [ { - title: t("reputable validator"), desc: t("reputable validator desc"), image: "/images/assets/image_journey.png", + title: t("reputable validator"), }, { - title: t("security focus"), desc: t("security focus desc"), image: "/images/assets/image_security.png", + title: t("security focus"), }, { - title: t("our future"), desc: t("our future desc"), image: "/images/assets/image_future.png", + title: t("our future"), }, ], [t], diff --git a/src/screens/staking/index.tsx b/src/screens/staking/index.tsx index bd4ae80b..49d67fc4 100644 --- a/src/screens/staking/index.tsx +++ b/src/screens/staking/index.tsx @@ -19,9 +19,9 @@ const Staking = () => { useEffect(() => { window.scrollTo({ + behavior: "smooth", left: 0, top: 0, - behavior: "smooth", }); }, []); diff --git a/src/screens/staking_service/index.tsx b/src/screens/staking_service/index.tsx index 99a7915e..e222f6ab 100644 --- a/src/screens/staking_service/index.tsx +++ b/src/screens/staking_service/index.tsx @@ -1,7 +1,6 @@ import { Container, Grid, Stack, useMediaQuery, useTheme } from "@mui/material"; import useTranslation from "next-translate/useTranslation"; import Link from "next/link"; -import { useRouter } from "next/router"; import { useRef } from "react"; import IntroPanel from "@src/components/Intro_panel"; @@ -25,8 +24,6 @@ const StakingService = () => { noSsr: true, }); - const router = useRouter(); - const horseStyle = { style: { display: "block", margin: "0 auto" }, }; @@ -61,14 +58,11 @@ const StakingService = () => { title={t("section_2nd_title")} title_large_trans={t("section_2nd_large_title")} /> - { - router.push("/staking"); - }} - > - {t("stake_now")} - + + + {t("stake_now")} + + { - const router: any = useRouter(); - - const handleTagPageChange = (e: any, value: any) => { - router.push({ - pathname: `/tag/${router.query.tag}/${value === 1 ? "" : value}`, - }); - }; - - return { - handleTagPageChange, - }; -}; diff --git a/src/screens/tag/components/tag_posts/index.tsx b/src/screens/tag/components/tag_posts/index.tsx index 0a1d615b..3a569758 100644 --- a/src/screens/tag/components/tag_posts/index.tsx +++ b/src/screens/tag/components/tag_posts/index.tsx @@ -1,17 +1,23 @@ import { Box, Pagination } from "@mui/material"; +import { useRouter } from "next/router"; import { pathOr } from "ramda"; import Post from "@src/screens/blog/components/blog_posts/components/post"; -import { useBlogPostsHook } from "./hooks"; import * as styles from "./index.module.scss"; import type { IProps } from "./interface"; -const TagPosts = ({ main, blogs, meta }: IProps) => { +const TagPosts = ({ blogs, main, meta }: IProps) => { const currentPage = pathOr(0, ["pagination", "page"], meta); const totalPages = pathOr(0, ["pagination", "pages"], meta); - const { handleTagPageChange } = useBlogPostsHook(); + const router: any = useRouter(); + + const handleTagPageChange = (_e: any, value: any) => { + router.push({ + pathname: `/tag/${router.query.tag}/${value === 1 ? "" : value}`, + }); + }; return ( diff --git a/src/screens/tag/components/tag_posts/interface.ts b/src/screens/tag/components/tag_posts/interface.ts index f48a8080..d91f460f 100644 --- a/src/screens/tag/components/tag_posts/interface.ts +++ b/src/screens/tag/components/tag_posts/interface.ts @@ -1,5 +1,5 @@ export interface IProps { - main: any; blogs: any[]; + main: any; meta: any; } diff --git a/src/screens/tag/index.tsx b/src/screens/tag/index.tsx index ccc6a8c1..73a5ec3b 100644 --- a/src/screens/tag/index.tsx +++ b/src/screens/tag/index.tsx @@ -9,7 +9,7 @@ import TagPosts from "./components/tag_posts"; import { useBlogHook } from "./hooks"; import * as styles from "./index.module.scss"; -const TagTitlePosts = ({ post, sidePosts = [], tags, meta, error }: any) => { +const TagTitlePosts = ({ error, meta, post, sidePosts = [], tags }: any) => { const { t } = useTranslation("blog"); useBlogHook(error, t); diff --git a/src/screens/terms_and_conditions/index.tsx b/src/screens/terms_and_conditions/index.tsx index 5393cfb0..831e0bbd 100644 --- a/src/screens/terms_and_conditions/index.tsx +++ b/src/screens/terms_and_conditions/index.tsx @@ -75,6 +75,7 @@ const TermsAndConditions = () => { className={styles.link} href="" onClick={(e) => scrollToRef(e, ref2)} + role="button" > Section 2 Additional Terms for Staking Service diff --git a/src/styles/sass.scss b/src/styles/sass.scss index 5690c4ef..0178d3a2 100644 --- a/src/styles/sass.scss +++ b/src/styles/sass.scss @@ -17,7 +17,7 @@ $breakpoint-laptop: 1025px; $breakpoint-desktop: 1208px; @mixin down-mobile { - @media (max-width: $breakpoint-mobile) { + @media (max-width: $breakpoint-mobile - 1) { @content; } } @@ -29,7 +29,7 @@ $breakpoint-desktop: 1208px; } @mixin down-tablet { - @media (max-width: $breakpoint-tablet) { + @media (max-width: $breakpoint-tablet - 1) { @content; } } @@ -41,7 +41,7 @@ $breakpoint-desktop: 1208px; } @mixin down-laptop { - @media (max-width: $breakpoint-laptop) { + @media (max-width: $breakpoint-laptop - 1) { @content; } } diff --git a/src/styles/theme/index.ts b/src/styles/theme/index.ts index 79cf4b02..175f71bf 100644 --- a/src/styles/theme/index.ts +++ b/src/styles/theme/index.ts @@ -8,29 +8,29 @@ const common: ThemeOptions = { breakpoints: { keys: ["mobile", "tablet", "laptop", "desktop"], values: { + desktop: 1208, + laptop: 1025, mobile: 375, tablet: 768, - laptop: 1025, - desktop: 1208, }, }, - typography: { - fontFamily: "-apple-system, BlinkMacSystemFont, sans-serif", - h1: { - "fontSize": "32px", - "@media (min-width: 769px)": { - fontSize: "64px", + components: { + MuiTypography: { + defaultProps: { + lineHeight: "normal", }, }, + }, + typography: { button: { textTransform: "none", }, - }, - components: { - MuiTypography: { - defaultProps: { - lineHeight: "normal", + fontFamily: "-apple-system, BlinkMacSystemFont, sans-serif", + h1: { + "@media (min-width: 769px)": { + fontSize: "64px", }, + "fontSize": "32px", }, }, }; diff --git a/src/styles/theme/light.ts b/src/styles/theme/light.ts index 52eb9134..cf61e7ad 100644 --- a/src/styles/theme/light.ts +++ b/src/styles/theme/light.ts @@ -5,17 +5,6 @@ const backgroundDefault = "#FFFFFF"; /** Custom theme overrides for dark mode */ export const lightThemeOverride = { palette: { - mode: "light" as PaletteMode, - type: "light" as PaletteMode, - primary: { - main: "#FFFFFF", - }, - secondary: { - main: "#4D2FC2", - }, - text: { - primary: "#000000", - }, background: { default: backgroundDefault, }, @@ -24,15 +13,26 @@ export const lightThemeOverride = { default: backgroundDefault, }, forbole: { - red: "#BD081C", - indigo: "#362187", - purple: "#6061E4", blue: "#202A43", + grey02: "#C2C2C2", + indigo: "#362187", indigo04: "#5047BA", indigo6: "#2A1A6A", - grey02: "#C2C2C2", primary: "#FFFFFF", + purple: "#6061E4", + red: "#BD081C", }, }, + mode: "light" as PaletteMode, + primary: { + main: "#FFFFFF", + }, + secondary: { + main: "#4D2FC2", + }, + text: { + primary: "#000000", + }, + type: "light" as PaletteMode, }, }; diff --git a/src/utils/api.ts b/src/utils/api.ts index 5274efcc..2e225762 100644 --- a/src/utils/api.ts +++ b/src/utils/api.ts @@ -1,12 +1,12 @@ import nodemailer from "nodemailer"; export const transporter = nodemailer.createTransport({ - service: "Mailgun", - host: "smtp.mailgun.org", - port: 465, - secure: true, auth: { - user: process.env.MAIL_GUN_USER, pass: process.env.MAIL_GUN_PW, + user: process.env.MAIL_GUN_USER, }, + host: "smtp.mailgun.org", + port: 465, + secure: true, + service: "Mailgun", }); diff --git a/src/utils/apollo.tsx b/src/utils/apollo.tsx index 632f87ac..9149216f 100644 --- a/src/utils/apollo.tsx +++ b/src/utils/apollo.tsx @@ -2,8 +2,8 @@ import { ApolloClient, ApolloProvider, InMemoryCache } from "@apollo/client"; import type { PropsWithChildren } from "react"; const apolloClient = new ApolloClient({ - uri: process.env.NEXT_PUBLIC_GRAPHQL_API, cache: new InMemoryCache(), + uri: process.env.NEXT_PUBLIC_GRAPHQL_API, }); // This is a big library so it should only be imported on the specific screens diff --git a/src/utils/ghost.ts b/src/utils/ghost.ts index 4904bb51..db05286f 100644 --- a/src/utils/ghost.ts +++ b/src/utils/ghost.ts @@ -57,8 +57,8 @@ export const getBlogPostSchema = ( const common = { "@context": "https://schema.org", - "name": title, "image": featureImage, + "name": title, "url": `https://www.forbole.com/${isGuide ? "staking" : "blog"}/${ post.slug }`, @@ -79,8 +79,8 @@ export const getBlogPostSchema = ( "@type": "TechArticle", "headline": title, ...(excerpt && { abstract: excerpt }), - "inLanguage": getLanguageFromLocale(locale), - "datePublished": publishedAt, author, + "datePublished": publishedAt, + "inLanguage": getLanguageFromLocale(locale), }); }; diff --git a/src/utils/network_functions.ts b/src/utils/network_functions.ts index 2b877ca6..19a6c34f 100644 --- a/src/utils/network_functions.ts +++ b/src/utils/network_functions.ts @@ -26,10 +26,10 @@ const nanoLikeToLike = defaultConverter(1000000000); const uEGLDToEGLD = defaultConverter(1000000000000000000); const defaultFunctions = (converter: any) => ({ + converter, gecko: "", marketPrice: (data: any) => toFixed(Number(data?.market_data?.current_price?.usd || 0)), - converter, }); const cosmos = clone(defaultFunctions(uAtomToAtom)); diff --git a/src/utils/network_info.ts b/src/utils/network_info.ts index 4732c65b..c53c5e69 100644 --- a/src/utils/network_info.ts +++ b/src/utils/network_info.ts @@ -1,51 +1,28 @@ export type Network = { address?: string; bigDipper?: string; + calculator?: { + bonded: string; + inflation: string; + stakingParams: string; + supply: string; + }; color?: string; delegate?: string; denom?: string; graphql: string; + guide?: string; heightSocket?: string; image: string; key: string; label?: string; name: string; value?: string; - guide?: string; - calculator?: { - bonded: string; - inflation: string; - supply: string; - stakingParams: string; - }; }; interface IStringIndex extends Record {} const logos: IStringIndex = { - "cosmos": { - address: "cosmosvaloper14kn0kk33szpwus9nh8n87fjel8djx0y070ymmj", - bigDipper: "https://cosmos.bigdipper.live/", - calculator: { - bonded: "http://lcd.cosmoshub.bigdipper.live/staking/pool", - inflation: "http://lcd.cosmoshub.bigdipper.live/minting/inflation", - supply: "http://lcd.cosmoshub.bigdipper.live/supply/total/uatom", - stakingParams: - "http://lcd.cosmoshub.bigdipper.live/staking/validators/cosmosvaloper14kn0kk33szpwus9nh8n87fjel8djx0y070ymmj", - }, - color: "#ba3fd9", - delegate: - "https://cosmos.bigdipper.live/validators/cosmosvaloper14kn0kk33szpwus9nh8n87fjel8djx0y070ymmj/delegate", - denom: "ATOM", - graphql: "cosmos", - guide: "how-to-stake-atom-on-cosmos-hub", - heightSocket: "wss://ws.cosmoshub.forbole.com", - image: "/images/network/cosmos_hub.png", - key: "cosmos", - label: "Cosmos Hub - ATOM", - name: "Cosmos Hub", - value: "cosmos", - }, "agoric": { address: "agoricvaloper1pcc069wu2utgnf5qsm6n2pk2x8xt6cah954t4g", bigDipper: "https://testnet.explorer.agoric.net/", @@ -56,8 +33,8 @@ const logos: IStringIndex = { guide: "how-to-stake-bld-on-agoric", image: "/images/network/agoric.png", key: "agoric", - name: "Agoric", label: "Agoric - BLD", + name: "Agoric", }, "akash": { address: "akashvaloper14kn0kk33szpwus9nh8n87fjel8djx0y0uzn073", @@ -81,6 +58,60 @@ const logos: IStringIndex = { label: "Akash - AKT", name: "Akash", }, + "archway": { + address: "archwayvaloper1esg4kluvdkfcxl0atcf2us2p9m9y9sjjsu04ex", + denom: "ARCH", + graphql: "archway", + guide: "how-to-stake-arch-on-archway-network", + image: "/images/network/archway.svg", + key: "archway", + label: "Archway", + name: "Archway", + }, + "assetmantle": { + address: "mantlevaloper14kn0kk33szpwus9nh8n87fjel8djx0y09q0ln7", + delegate: "https://wallet.assetmantle.one/", + denom: "mntl", + graphql: "assetmantle", + guide: "how-to-stake-mntl-on-assetmantle", + image: "/images/network/assetmantle.png", + key: "assetmantle", + label: "Assetmantle - MNTL", + name: "Assetmantle", + }, + "axelar": { + address: "axelarvaloper1r7ppsrmzpslqu3d3yf344kzjv32n9dn4xyt0sw", + delegate: "https://wallet.keplr.app/chains/axelar", + denom: "axl", + graphql: "axelar", + guide: "how-to-stake-axl-on-axelar", + image: "/images/network/axelar.png", + key: "axelar", + label: "Axelar - AXL", + name: "Axelar", + }, + "band": { + address: "bandvaloper14kn0kk33szpwus9nh8n87fjel8djx0y0wz502z", + delegate: "https://atomicwallet.io/band-staking", + denom: "band", + graphql: "band", + guide: "how-to-stake-band-on-band-protocol", + image: "/images/network/band_protocol.png", + key: "band", + label: "Band Protocol - BAND", + name: "Band Protocol", + }, + "bitcanna": { + address: "bcnavaloper1kkpevanspcg0zkxhnvptjszus52svxpcwe32yp", + delegate: "https://wallet.bitcanna.io/", + denom: "bcna", + graphql: "bitcanna", + guide: "how-to-stake-bcna-on-bitcanna", + image: "/images/network/bitcanna.png", + key: "bitcanna", + label: "BitCanna - BCNA", + name: "Bitcanna", + }, "bitsong": { address: "bitsongvaloper125hdkukw4pu2urhj4nv366q0avdqv24twga2kd", delegate: "https://wallet.bitsong.io/#/authentication/login", @@ -92,6 +123,98 @@ const logos: IStringIndex = { label: "BitSong - BTSG", name: "BitSong", }, + "celer": { + denom: "CELER", + graphql: "celer", + image: "/images/network/celer.png", + key: "celer", + name: "Celer", + }, + "celestia": { + denom: "tia", + graphql: "celestia", + image: "/images/network/celestia.svg", + key: "celestia", + label: "Celestia - TIA", + name: "Celestia", + }, + "cheqd": { + address: "cheqdvaloper1pknp3fyss23xeezcj6ypd8pl6d2ql4758zpxej", + delegate: "https://wallet.cheqd.io", + denom: "cheq", + graphql: "cheqd", + guide: "how-to-stake-cheq-on-cheqd", + image: "/images/network/cheqd.svg", + key: "cheqd", + label: "CHEQD Network - CHEQ", + name: "Cheqd", + }, + "chihuahua": { + address: "chihuahuavaloper14kn0kk33szpwus9nh8n87fjel8djx0y0teaa9l", + delegate: "https://chihuahua.omniflix.co/", + denom: "huahua", + graphql: "chihuahua", + guide: "how-to-stake-huahua-on-chihuahua", + image: "/images/network/chihuahua.png", + key: "chihuahua", + label: "Chihuahua Chain - HUAHUA", + name: "Chihuahua", + }, + "comdex": { + address: "comdexvaloper1e4wjh48ks5j5d9702d35q360ffmf3jj2xpuf3f", + delegate: "https://comdex.omniflix.co/", + denom: "cmdx", + graphql: "comdex", + guide: "how-to-stake-cmdx-on-comdex", + image: "/images/network/comdex.png", + key: "comdex", + label: "Comdex - CMDX", + name: "Comdex", + }, + "coreum": { + address: "corevaloper1k3wy8ztt2e0uq3j5deukjxu2um4a4z5tvz35la", + denom: "CORE", + graphql: "coreum", + guide: "how-to-stake-core-on-coreum", + image: "/images/network/coreum.svg", + key: "coreum", + label: "Coreum - CORE", + name: "Coreum", + }, + "cosmos": { + address: "cosmosvaloper14kn0kk33szpwus9nh8n87fjel8djx0y070ymmj", + bigDipper: "https://cosmos.bigdipper.live/", + calculator: { + bonded: "http://lcd.cosmoshub.bigdipper.live/staking/pool", + inflation: "http://lcd.cosmoshub.bigdipper.live/minting/inflation", + stakingParams: + "http://lcd.cosmoshub.bigdipper.live/staking/validators/cosmosvaloper14kn0kk33szpwus9nh8n87fjel8djx0y070ymmj", + supply: "http://lcd.cosmoshub.bigdipper.live/supply/total/uatom", + }, + color: "#ba3fd9", + delegate: + "https://cosmos.bigdipper.live/validators/cosmosvaloper14kn0kk33szpwus9nh8n87fjel8djx0y070ymmj/delegate", + denom: "ATOM", + graphql: "cosmos", + guide: "how-to-stake-atom-on-cosmos-hub", + heightSocket: "wss://ws.cosmoshub.forbole.com", + image: "/images/network/cosmos_hub.png", + key: "cosmos", + label: "Cosmos Hub - ATOM", + name: "Cosmos Hub", + value: "cosmos", + }, + "crescent": { + address: "crevaloper1ls9w867xu0q5zjze5vrakfa2zluahtv44gwn7y", + delegate: "https://crescent.disperze.network/", + denom: "cre", + graphql: "crescent", + guide: "how-to-stake-cre-on-crescent", + image: "/images/network/crescent.png", + key: "crescent", + label: "Crescent Network - CRE", + name: "Crescent", + }, "crypto.org": { address: "crocncl15xphw2m025acwnjd2ucq9t5ku4ggaqyecekzqa", bigDipper: "https://crypto-org.bigdipper.live/", @@ -119,9 +242,9 @@ const logos: IStringIndex = { calculator: { bonded: "http://lcd.emoney.forbole.com/staking/pool", inflation: "http://lcd.emoney.forbole.com/minting/inflation", - supply: "http://lcd.emoney.forbole.com/supply/total/nanolike", stakingParams: "http://lcd.emoney.forbole.com/staking/validators/emoneyvaloper1293pqwtzu67zp8txuya4yts03ccw5kgf98hz9y", + supply: "http://lcd.emoney.forbole.com/supply/total/nanolike", }, color: "#1e5877", delegate: @@ -135,6 +258,21 @@ const logos: IStringIndex = { label: "e-Money - NGM", name: "eMoney", }, + "elrond": { + address: "erd1qqqqqqqqqqqqqqqpqqqqqqqqqqqqqqqqqqqqqqqqqqqqq40llllsfjmn54", + denom: "egld", + graphql: "elrond", + image: "/images/network/elrond.png", + key: "elrond", + name: "MultiversX", + }, + "ethereum": { + denom: "ETH", + graphql: "ethereum", + image: "/images/network/ethereum.svg", + key: "ethereum", + name: "Ethereum", + }, "evmos": { address: "evmosvaloper1ak9t7kwk44azu6cefqdydqmy3hen28nvdjjvz0", delegate: "https://app.evmos.org/staking", @@ -158,91 +296,50 @@ const logos: IStringIndex = { label: "Fetch.ai - FET", name: "Fetch.ai", }, - "comdex": { - address: "comdexvaloper1e4wjh48ks5j5d9702d35q360ffmf3jj2xpuf3f", - delegate: "https://comdex.omniflix.co/", - denom: "cmdx", - graphql: "comdex", - guide: "how-to-stake-cmdx-on-comdex", - image: "/images/network/comdex.png", - key: "comdex", - label: "Comdex - CMDX", - name: "Comdex", - }, - "axelar": { - address: "axelarvaloper1r7ppsrmzpslqu3d3yf344kzjv32n9dn4xyt0sw", - delegate: "https://wallet.keplr.app/chains/axelar", - denom: "axl", - graphql: "axelar", - guide: "how-to-stake-axl-on-axelar", - image: "/images/network/axelar.png", - key: "axelar", - label: "Axelar - AXL", - name: "Axelar", + "gitopia": { + denom: "LORE", + graphql: "gitopia", + guide: "how-to-stake-lore-on-gitopia", + image: "/images/network/gitopia.svg", + key: "gitopia", + label: "Gitopia - LORE", + name: "Gitopia", }, - "bitcanna": { - address: "bcnavaloper1kkpevanspcg0zkxhnvptjszus52svxpcwe32yp", - delegate: "https://wallet.bitcanna.io/", - denom: "bcna", - graphql: "bitcanna", - guide: "how-to-stake-bcna-on-bitcanna", - image: "/images/network/bitcanna.png", - key: "bitcanna", - label: "BitCanna - BCNA", - name: "Bitcanna", + "gravity_bridge": { + address: "gravityvaloper1xwkkam88aep5jcu2hcj0a2hy79eyvcw6yhfgv6", + delegate: "https://wallet.keplr.app/chains/gravity-bridge", + denom: "GRAVITON", + graphql: "gravitybridge", + guide: "how-to-stake-grav-on-gravity-bridge", + image: "/images/network/gravity_bridge.png", + key: "gravity_bridge", + label: "Gravity Bridge - GRAVITON", + name: "Gravity Bridge", }, - "cheqd": { - address: "cheqdvaloper1pknp3fyss23xeezcj6ypd8pl6d2ql4758zpxej", - delegate: "https://wallet.cheqd.io", - denom: "cheq", - graphql: "cheqd", - guide: "how-to-stake-cheq-on-cheqd", - image: "/images/network/cheqd.svg", - key: "cheqd", - label: "CHEQD Network - CHEQ", - name: "Cheqd", - }, - "chihuahua": { - address: "chihuahuavaloper14kn0kk33szpwus9nh8n87fjel8djx0y0teaa9l", - delegate: "https://chihuahua.omniflix.co/", - denom: "huahua", - graphql: "chihuahua", - guide: "how-to-stake-huahua-on-chihuahua", - image: "/images/network/chihuahua.png", - key: "chihuahua", - label: "Chihuahua Chain - HUAHUA", - name: "Chihuahua", - }, - "terra_classic": { - address: "terravaloper1v6pfkm0nxpudgantwxwhz786l8me0wfs4lnpuw", - denom: "LUNC", - graphql: "terra_classic", - image: "/images/network/terra_classic.png", - key: "terra_classic", - label: "Terra Classic - LUNC", - name: "Terra Classic", + "humansai": { + denom: "HEART", + graphql: "humansai", + image: "/images/network/humansai.svg", + key: "humansai", + label: "", + name: "Humans.ai", }, - "persistence": { - address: "persistencevaloper17qamc7jjwfr6ye7cffranxkgxfum6esxe89vvv", - delegate: "https://wallet.keplr.app/chains/persistence", - denom: "xprt", - graphql: "persistence", - guide: "how-to-stake-xprt-on-persistence", - image: "/images/network/persistence.png", - key: "persistence", - label: "Persistence - XPRT", - name: "Persistence", + "injective": { + address: "injvaloper12s9d7l53ef2c8avrn7pgd6dfeeg2yzel58ztfx", + denom: "inj", + graphql: "injective", + image: "/images/network/injective.png", + key: "injective", + label: "Injective - INJ", + name: "Injective", }, - "crescent": { - address: "crevaloper1ls9w867xu0q5zjze5vrakfa2zluahtv44gwn7y", - delegate: "https://crescent.disperze.network/", - denom: "cre", - graphql: "crescent", - guide: "how-to-stake-cre-on-crescent", - image: "/images/network/crescent.png", - key: "crescent", - label: "Crescent Network - CRE", - name: "Crescent", + "islamic_coin": { + denom: "", + graphql: "islamic_coin", + image: "/images/network/islamic_coin.png", + key: "islamic_coin", + label: "", + name: "Islamic Coin", }, "ixo": { address: "ixovaloper1dvr6jp0j7jqjrzqp4xz333h2s85pxvzgzsdula", @@ -255,14 +352,13 @@ const logos: IStringIndex = { label: "IXO - IXO", name: "ixo", }, - "injective": { - address: "injvaloper12s9d7l53ef2c8avrn7pgd6dfeeg2yzel58ztfx", - denom: "inj", - graphql: "injective", - image: "/images/network/injective.png", - key: "injective", - label: "Injective - INJ", - name: "Injective", + "jackal": { + denom: "JKL", + graphql: "jackal", + image: "/images/network/jackal.png", + key: "jackal", + label: "Jackal Protocol - JKL", + name: "Jackal Protocol", }, "juno": { address: "junovaloper1pvwqfze548z95sdhun58trrvxhlhfrvky5ejtk", @@ -286,16 +382,13 @@ const logos: IStringIndex = { label: "Kava - KAVA", name: "Kava", }, - "band": { - address: "bandvaloper14kn0kk33szpwus9nh8n87fjel8djx0y0wz502z", - delegate: "https://atomicwallet.io/band-staking", - denom: "band", - graphql: "band", - guide: "how-to-stake-band-on-band-protocol", - image: "/images/network/band_protocol.png", - key: "band", - label: "Band Protocol - BAND", - name: "Band Protocol", + "kyve": { + denom: "KYVE", + graphql: "kyve", + image: "/images/network/kyve.svg", + key: "kyve", + label: "", + name: "KYVE", }, "likecoin": { address: "likevaloper1v8njts96gl5eqstnen4gksdy5k860fau6nxc04", @@ -308,16 +401,84 @@ const logos: IStringIndex = { label: "Likecoin - LIKE", name: "Likecoin", }, - "assetmantle": { - address: "mantlevaloper14kn0kk33szpwus9nh8n87fjel8djx0y09q0ln7", - delegate: "https://wallet.assetmantle.one/", - denom: "mntl", - graphql: "assetmantle", - guide: "how-to-stake-mntl-on-assetmantle", - image: "/images/network/assetmantle.png", - key: "assetmantle", - label: "Assetmantle - MNTL", - name: "Assetmantle", + "mars": { + address: "marsvaloper1799t9vxshqssrk5cgnywvlx0fnlk2ekdz328aa", + delegate: + "https://explorer.marsprotocol.io/validators/marsvaloper1799t9vxshqssrk5cgnywvlx0fnlk2ekdz328aa", + denom: "MARS", + graphql: "mars", + guide: "how-to-stake-mars-on-mars-hub", + image: "/images/network/mars.png", + key: "mars", + label: "Mars Protocol - MARS", + name: "Mars Protocol", + }, + "multiversx": { + denom: "", + graphql: "multiversx", + image: "/images/network/multiversx.png", + key: "multiversx", + label: "", + name: "MultiversX", + }, + "neutron": { + denom: "", + graphql: "neutron", + image: "/images/network/neutron.svg", + key: "neutron", + label: "", + name: "Neutron", + }, + "nolus": { + denom: "NLS", + graphql: "nolus", + image: "/images/network/nolus.svg", + key: "nolus", + label: "", + name: "Nolus", + }, + "nomic": { + address: "nomic1yvzvykkvqruhrvwn7776tm6ppmaf4gcnazas2e", + delegate: "https://app.nomic.io/", + denom: "NOM", + graphql: "nomic", + guide: "how-to-stake-nom-on-nomic", + image: "/images/network/nomic.png", + key: "nomic", + name: "Nomic Network", + }, + "nym": { + denom: "NYX", + graphql: "nym", + image: "/images/network/nym.svg", + key: "nym", + label: "NYM - NYX", + name: "NYM", + }, + "oasis": { + address: "oasis1qrtq873ddwnnjqyv66ezdc9ql2a07l37d5vae9k0", + denom: "ROSE", + graphql: "oasis", + guide: "how-to-stake-rose-on-oasis-network", + image: "/images/network/oasis.png", + key: "oasis", + name: "Oasis Network", + }, + "omniflix": { + denom: "FLIX", + graphql: "omniflix", + image: "/images/network/omniflix.png", + key: "omniflix", + label: "Omniflix Network - FLIX", + name: "Omniflix Network", + }, + "onomy": { + denom: "NOM", + graphql: "onomy", + image: "/images/network/onomy.png", + key: "onomy", + label: "Onomy Protocol - NOM", + name: "Onomy Protocol", }, "osmosis": { address: "osmovaloper14kn0kk33szpwus9nh8n87fjel8djx0y0fhtak5", @@ -330,6 +491,33 @@ const logos: IStringIndex = { label: "Osmosis - OSMO", name: "Osmosis", }, + "passage": { + address: "pasgvaloper1kq4lp40qwce50p4z7lef9sw9c5379yljegwjna", + denom: "PASG", + graphql: "passage", + image: "/images/network/passage.png", + key: "passage", + name: "Passage", + }, + "persistence": { + address: "persistencevaloper17qamc7jjwfr6ye7cffranxkgxfum6esxe89vvv", + delegate: "https://wallet.keplr.app/chains/persistence", + denom: "xprt", + graphql: "persistence", + guide: "how-to-stake-xprt-on-persistence", + image: "/images/network/persistence.png", + key: "persistence", + label: "Persistence - XPRT", + name: "Persistence", + }, + "picasso": { + denom: "PICA", + graphql: "picasso", + image: "/images/network/picasso.svg", + key: "picasso", + label: "Picasso - PICA", + name: "Picasso", + }, "provenance": { address: "pbvaloper1plh34z4gmfcypecdzudcfhytcyeulyxj0l8t75", denom: "hash", @@ -338,6 +526,28 @@ const logos: IStringIndex = { key: "provenance", name: "Provenance", }, + "quasar": { + denom: "qsr", + graphql: "quasar", + image: "/images/network/quasar.svg", + key: "quasar", + label: "Quasar - QSR", + name: "Quasar", + }, + "quicksilver": { + denom: "QCK", + graphql: "quicksilver", + image: "/images/network/quicksilver.png", + key: "quicksilver", + name: "Quicksilver Protocol", + }, + "radix": { + denom: "XRD", + graphql: "radix", + image: "/images/network/radix.png", + key: "radix", + name: "Radix", + }, "regen": { address: "regenvaloper14kn0kk33szpwus9nh8n87fjel8djx0y0c7xhe5", denom: "regen", @@ -347,6 +557,14 @@ const logos: IStringIndex = { label: "Regen - REGEN", name: "Regen", }, + "rizon": { + denom: "atolo", + graphql: "rizon", + image: "/images/network/rizon.svg", + key: "rizon", + label: "Rizon - ATOLO", + name: "Rizon", + }, "secret": { address: "secretvaloper1kvp570cd6zvzh8ffrhz7lmytt6v6u2gxz8tl0g", delegate: "https://wallet.keplr.app/chains/secret-network", @@ -369,34 +587,7 @@ const logos: IStringIndex = { label: "Sentinel - DVPN", name: "Sentinel", }, - "stafihub": { - address: "stafivaloper1pvwqfze548z95sdhun58trrvxhlhfrvkwtr9vz", - denom: "fis", - graphql: "stafihub", - image: "/images/network/stafihub.png", - key: "stafihub", - label: "Stafi - FIS", - name: "Stafihub", - }, - "stride": { - address: "stridevaloper19d8a9dr4kh85zcl5kq7fj64ad9r9dqfky93dgq", - delegate: "https://wallet.keplr.app/chains/stride", - denom: "strd", - graphql: "stride", - guide: "how-to-stake-strd-on-stride", - image: "/images/network/stride.png", - key: "stride", - label: "Stride - STRD", - name: "Stride", - }, - "elrond": { - address: "erd1qqqqqqqqqqqqqqqpqqqqqqqqqqqqqqqqqqqqqqqqqqqqq40llllsfjmn54", - denom: "egld", - graphql: "elrond", - image: "/images/network/elrond.png", - key: "elrond", - name: "MultiversX", - }, + "solana": { address: "76nwV8zz8tLz97SBRXH6uwHvgHXtqJDLQfF66jZhQ857", denom: "SOL", @@ -407,104 +598,6 @@ const logos: IStringIndex = { label: "Solana - SOL", name: "Solana", }, - "ethereum": { - denom: "ETH", - graphql: "ethereum", - image: "/images/network/ethereum.svg", - key: "ethereum", - name: "Ethereum", - }, - "gravity_bridge": { - address: "gravityvaloper1xwkkam88aep5jcu2hcj0a2hy79eyvcw6yhfgv6", - delegate: "https://wallet.keplr.app/chains/gravity-bridge", - denom: "GRAVITON", - graphql: "gravitybridge", - guide: "how-to-stake-grav-on-gravity-bridge", - image: "/images/network/gravity_bridge.png", - key: "gravity_bridge", - label: "Gravity Bridge - GRAVITON", - name: "Gravity Bridge", - }, - "jackal": { - denom: "JKL", - graphql: "jackal", - image: "/images/network/jackal.png", - key: "jackal", - label: "Jackal Protocol - JKL", - name: "Jackal Protocol", - }, - "terra": { - denom: "LUNA", - graphql: "terra", - image: "/images/network/terra.png", - key: "terra", - label: "Terra - LUNA", - name: "Terra", - }, - "nomic": { - address: "nomic1yvzvykkvqruhrvwn7776tm6ppmaf4gcnazas2e", - delegate: "https://app.nomic.io/", - denom: "NOM", - graphql: "nomic", - guide: "how-to-stake-nom-on-nomic", - image: "/images/network/nomic.png", - key: "nomic", - name: "Nomic Network", - }, - "nym": { - denom: "NYX", - graphql: "nym", - image: "/images/network/nym.svg", - key: "nym", - label: "NYM - NYX", - name: "NYM", - }, - "oasis": { - address: "oasis1qrtq873ddwnnjqyv66ezdc9ql2a07l37d5vae9k0", - denom: "ROSE", - graphql: "oasis", - guide: "how-to-stake-rose-on-oasis-network", - image: "/images/network/oasis.png", - key: "oasis", - name: "Oasis Network", - }, - "omniflix": { - denom: "FLIX", - graphql: "omniflix", - image: "/images/network/omniflix.png", - key: "omniflix", - label: "Omniflix Network - FLIX", - name: "Omniflix Network", - }, - "passage": { - address: "pasgvaloper1kq4lp40qwce50p4z7lef9sw9c5379yljegwjna", - denom: "PASG", - graphql: "passage", - image: "/images/network/passage.png", - key: "passage", - name: "Passage", - }, - "celer": { - denom: "CELER", - graphql: "celer", - image: "/images/network/celer.png", - key: "celer", - name: "Celer", - }, - "quicksilver": { - denom: "QCK", - graphql: "quicksilver", - image: "/images/network/quicksilver.png", - key: "quicksilver", - name: "Quicksilver Protocol", - }, - "radix": { - denom: "XRD", - graphql: "radix", - image: "/images/network/radix.png", - key: "radix", - name: "Radix", - }, "ssv": { denom: "SSV", graphql: "ssv", @@ -512,6 +605,15 @@ const logos: IStringIndex = { key: "ssv", name: "SSV Network", }, + "stafihub": { + address: "stafivaloper1pvwqfze548z95sdhun58trrvxhlhfrvkwtr9vz", + denom: "fis", + graphql: "stafihub", + image: "/images/network/stafihub.png", + key: "stafihub", + label: "Stafi - FIS", + name: "Stafihub", + }, "stargaze": { address: "starsvaloper12k8za208e5kt0j34w6au6v8py6t6cat2sqjzvw", delegate: "https://wallet.keplr.app/chains/stargaze", @@ -523,6 +625,28 @@ const logos: IStringIndex = { label: "Stargaze - STARS", name: "Stargaze", }, + "stride": { + address: "stridevaloper19d8a9dr4kh85zcl5kq7fj64ad9r9dqfky93dgq", + delegate: "https://wallet.keplr.app/chains/stride", + denom: "strd", + graphql: "stride", + guide: "how-to-stake-strd-on-stride", + image: "/images/network/stride.png", + key: "stride", + label: "Stride - STRD", + name: "Stride", + }, + "sui": { + address: + "0x1e1985024aafe50a8e4eafc5a89eb7ecd58ba08c39f37688bee00bd55c8b2059", + denom: "SUI", + graphql: "sui", + guide: "how-to-stake-sui-on-sui-network", + image: "/images/network/sui.svg", + key: "sui", + label: "Sui - SUI", + name: "Sui", + }, "teritori": { address: "torivaloper138664l4407d7hfwe8a82q25fk4vht53j9yl3e9", delegate: "https://explorer.teritori.com/teritori", @@ -534,6 +658,23 @@ const logos: IStringIndex = { label: "Teritori - TORI", name: "Teritori", }, + "terra": { + denom: "LUNA", + graphql: "terra", + image: "/images/network/terra.png", + key: "terra", + label: "Terra - LUNA", + name: "Terra", + }, + "terra_classic": { + address: "terravaloper1v6pfkm0nxpudgantwxwhz786l8me0wfs4lnpuw", + denom: "LUNC", + graphql: "terra_classic", + image: "/images/network/terra_classic.png", + key: "terra_classic", + label: "Terra Classic - LUNC", + name: "Terra Classic", + }, "tgrade": { denom: "TGD", graphql: "tgrade", @@ -541,11 +682,13 @@ const logos: IStringIndex = { key: "tgrade", name: "Tgrade", }, - "wormhole": { - graphql: "wormhole", - image: "/images/network/wormhole.png", - key: "wormhole", - name: "Wormhole", + "ununifi": { + denom: "GUU", + graphql: "ununifi", + image: "/images/network/ununifi.png", + key: "ununifi", + label: "Ununifi - GUU", + name: "Ununifi", }, "vsys": { denom: "VSYS", @@ -554,13 +697,12 @@ const logos: IStringIndex = { key: "vsys", name: "V Systems", }, - "ununifi": { - denom: "GUU", - graphql: "ununifi", - image: "/images/network/ununifi.png", - key: "ununifi", - label: "Ununifi - GUU", - name: "Ununifi", + + "wormhole": { + graphql: "wormhole", + image: "/images/network/wormhole.png", + key: "wormhole", + name: "Wormhole", }, "xpla": { denom: "XPLA", @@ -570,151 +712,9 @@ const logos: IStringIndex = { label: "XPLA - XPLA", name: "XPLA", }, - "onomy": { - denom: "NOM", - graphql: "onomy", - image: "/images/network/onomy.png", - key: "onomy", - label: "Onomy Protocol - NOM", - name: "Onomy Protocol", - }, - "mars": { - address: "marsvaloper1799t9vxshqssrk5cgnywvlx0fnlk2ekdz328aa", - delegate: - "https://explorer.marsprotocol.io/validators/marsvaloper1799t9vxshqssrk5cgnywvlx0fnlk2ekdz328aa", - denom: "MARS", - graphql: "mars", - guide: "how-to-stake-mars-on-mars-hub", - image: "/images/network/mars.png", - key: "mars", - label: "Mars Protocol - MARS", - name: "Mars Protocol", - }, - - "archway": { - address: "archwayvaloper1esg4kluvdkfcxl0atcf2us2p9m9y9sjjsu04ex", - denom: "ARCH", - graphql: "archway", - guide: "how-to-stake-arch-on-archway-network", - image: "/images/network/archway.svg", - key: "archway", - label: "Archway", - name: "Archway", - }, - "coreum": { - address: "corevaloper1k3wy8ztt2e0uq3j5deukjxu2um4a4z5tvz35la", - denom: "CORE", - graphql: "coreum", - guide: "how-to-stake-core-on-coreum", - image: "/images/network/coreum.svg", - key: "coreum", - label: "Coreum - CORE", - name: "Coreum", - }, - "humansai": { - denom: "HEART", - graphql: "humansai", - image: "/images/network/humansai.svg", - key: "humansai", - label: "", - name: "Humans.ai", - }, - "kyve": { - denom: "KYVE", - graphql: "kyve", - image: "/images/network/kyve.svg", - key: "kyve", - label: "", - name: "KYVE", - }, - "multiversx": { - denom: "", - graphql: "multiversx", - image: "/images/network/multiversx.png", - key: "multiversx", - label: "", - name: "MultiversX", - }, - "nolus": { - denom: "NLS", - graphql: "nolus", - image: "/images/network/nolus.svg", - key: "nolus", - label: "", - name: "Nolus", - }, - "neutron": { - denom: "", - graphql: "neutron", - image: "/images/network/neutron.svg", - key: "neutron", - label: "", - name: "Neutron", - }, - "gitopia": { - denom: "LORE", - graphql: "gitopia", - guide: "how-to-stake-lore-on-gitopia", - image: "/images/network/gitopia.svg", - key: "gitopia", - label: "Gitopia - LORE", - name: "Gitopia", - }, - "sui": { - address: - "0x1e1985024aafe50a8e4eafc5a89eb7ecd58ba08c39f37688bee00bd55c8b2059", - denom: "SUI", - graphql: "sui", - guide: "how-to-stake-sui-on-sui-network", - image: "/images/network/sui.svg", - key: "sui", - label: "Sui - SUI", - name: "Sui", - }, - "picasso": { - denom: "PICA", - graphql: "picasso", - image: "/images/network/picasso.svg", - key: "picasso", - label: "Picasso - PICA", - name: "Picasso", - }, - "rizon": { - denom: "atolo", - graphql: "rizon", - image: "/images/network/rizon.svg", - key: "rizon", - label: "Rizon - ATOLO", - name: "Rizon", - }, - "quasar": { - denom: "qsr", - graphql: "quasar", - image: "/images/network/quasar.svg", - key: "quasar", - label: "Quasar - QSR", - name: "Quasar", - }, - - "celestia": { - denom: "tia", - graphql: "celestia", - image: "/images/network/celestia.svg", - key: "celestia", - label: "Celestia - TIA", - name: "Celestia", - }, - "islamic_coin": { - denom: "", - graphql: "islamic_coin", - image: "/images/network/islamic_coin.png", - key: "islamic_coin", - label: "", - name: "Islamic Coin", - }, }; -export const getNetworkInfo = (key: string | number) => logos[key] || null; +export const getNetworkInfo = (key: number | string) => logos[key] || null; export const cosmosNetworkKeys = [ "agoric", diff --git a/src/utils/scroll.tsx b/src/utils/scroll.tsx index 64e22953..e181bd08 100644 --- a/src/utils/scroll.tsx +++ b/src/utils/scroll.tsx @@ -2,8 +2,8 @@ export const scrollBottom = (e: any, ref: any) => { e.preventDefault(); window.scrollTo({ + behavior: "smooth", left: 0, top: ref.current.offsetTop - 100, - behavior: "smooth", }); }; diff --git a/src/utils/social_media_info.tsx b/src/utils/social_media_info.tsx index eb02f253..c4f3afbc 100644 --- a/src/utils/social_media_info.tsx +++ b/src/utils/social_media_info.tsx @@ -10,9 +10,9 @@ import { } from "@src/components/icons"; interface SocialMediaProps { + component: FunctionComponent<{ fill?: string }>; key: string; url: string; - component: FunctionComponent<{ fill?: string }>; } interface SocialMediasProps { @@ -20,39 +20,39 @@ interface SocialMediasProps { } export const socialMedia: SocialMediasProps = { - telegram: { - key: "telegram", - url: "https://t.me/forbole", - component: Telegram, - }, - medium: { - key: "medium", - url: "https://medium.com/forbole", - component: Medium, - }, - twitter: { - key: "twitter", - url: "https://twitter.com/forbole", - component: Twitter, - }, github: { + component: Github, key: "github", url: "https://github.com/forbole", - component: Github, - }, - linkedIn: { - key: "linkedin", - url: "https://www.linkedin.com/company/forbole/", - component: LinkedIn, }, Instagram: { + component: Instagram, key: "Instagram", url: "https://www.instagram.com/forbole", - component: Instagram, }, Instagram_zh: { + component: Instagram, key: "Instagram", url: "https://www.instagram.com/forbole.hk", - component: Instagram, + }, + linkedIn: { + component: LinkedIn, + key: "linkedin", + url: "https://www.linkedin.com/company/forbole/", + }, + medium: { + component: Medium, + key: "medium", + url: "https://medium.com/forbole", + }, + telegram: { + component: Telegram, + key: "telegram", + url: "https://t.me/forbole", + }, + twitter: { + component: Twitter, + key: "twitter", + url: "https://twitter.com/forbole", }, }; diff --git a/yarn.lock b/yarn.lock index 693709e5..647ab342 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1451,7 +1451,7 @@ __metadata: languageName: node linkType: hard -"@babel/runtime@npm:^7.12.5, @babel/runtime@npm:^7.18.3, @babel/runtime@npm:^7.23.2, @babel/runtime@npm:^7.23.5, @babel/runtime@npm:^7.5.5, @babel/runtime@npm:^7.8.4, @babel/runtime@npm:^7.8.7": +"@babel/runtime@npm:^7.12.5, @babel/runtime@npm:^7.18.3, @babel/runtime@npm:^7.23.2, @babel/runtime@npm:^7.23.6, @babel/runtime@npm:^7.5.5, @babel/runtime@npm:^7.8.4, @babel/runtime@npm:^7.8.7": version: 7.23.6 resolution: "@babel/runtime@npm:7.23.6" dependencies: @@ -1730,38 +1730,38 @@ __metadata: languageName: node linkType: hard -"@csstools/css-parser-algorithms@npm:^2.3.2": - version: 2.3.2 - resolution: "@csstools/css-parser-algorithms@npm:2.3.2" +"@csstools/css-parser-algorithms@npm:^2.4.0": + version: 2.4.0 + resolution: "@csstools/css-parser-algorithms@npm:2.4.0" peerDependencies: - "@csstools/css-tokenizer": ^2.2.1 - checksum: ccae373a3ab5c10716418b69ce1f6db10a26d3a2d60b65df5fe69099afe4fb1d3192925f3c0f93c3b17c3ab1964b0f39ad2b0e97312ec4a51caa55d6b6a31672 + "@csstools/css-tokenizer": ^2.2.2 + checksum: bcfc067b9d1bd5e0bc6044bfbf6450a4a6837d88c5ffd081e2159d4e442c28f018b58c7c2b3ce176ba0bf76cbbce0fd3c65468a40b9867ad9b3e3ef90b9b2655 languageName: node linkType: hard -"@csstools/css-tokenizer@npm:^2.2.1": - version: 2.2.1 - resolution: "@csstools/css-tokenizer@npm:2.2.1" - checksum: 0c6901d291e99c567893846a47068057c2a28b3edc4219b6da589a530f55f51ddd4675f906f707b393bfe7a508ab2604bf3f75708f064db857bb277636bd5a44 +"@csstools/css-tokenizer@npm:^2.2.2": + version: 2.2.2 + resolution: "@csstools/css-tokenizer@npm:2.2.2" + checksum: 9e7374aab06a811f868a85127af1ff07ad7a56e22e8c46930e789a907098bdd4e6eec82e0cb0d4b8ac1cd5cd054c1f0e329ec50d8548f57d660aeee7cf9b3167 languageName: node linkType: hard -"@csstools/media-query-list-parser@npm:^2.1.5": - version: 2.1.5 - resolution: "@csstools/media-query-list-parser@npm:2.1.5" +"@csstools/media-query-list-parser@npm:^2.1.6": + version: 2.1.6 + resolution: "@csstools/media-query-list-parser@npm:2.1.6" peerDependencies: - "@csstools/css-parser-algorithms": ^2.3.2 - "@csstools/css-tokenizer": ^2.2.1 - checksum: ae0692c6f92cdc82053291c7a50028b692094dfed795f0259571c5eb40f4b3fa580182ac3701e56c2834e40a62a122ea6639299e43ae88b3a835ae4c869a1a12 + "@csstools/css-parser-algorithms": ^2.4.0 + "@csstools/css-tokenizer": ^2.2.2 + checksum: 06da3e5c01e4785963b821ee2eb31f4fcec622f3b0e4e0748113f287c876f241be211ba11d435d0cc1f0e9f2e26baf5fbf6f8563dc88a49709c3d49e79490b76 languageName: node linkType: hard -"@csstools/selector-specificity@npm:^3.0.0": - version: 3.0.0 - resolution: "@csstools/selector-specificity@npm:3.0.0" +"@csstools/selector-specificity@npm:^3.0.1": + version: 3.0.1 + resolution: "@csstools/selector-specificity@npm:3.0.1" peerDependencies: postcss-selector-parser: ^6.0.13 - checksum: 6f0e2fa9a3c5dcbc7a446fd827d3eb85ca775cc884f73f0bbb119ab49b4f5f0af8763dd23a37d423f4e7989069c09bb977e7e5f017db296e1417abb1fba75c30 + checksum: 4280f494726d5e38de74e28dee2ff74ec86244560dff4edeec3ddff3ac73c774c19535bd1bb70cad77949bfb359cf87e977d0ec3264591e3b7260342a20dd84f languageName: node linkType: hard @@ -1845,14 +1845,14 @@ __metadata: languageName: node linkType: hard -"@emotion/react@npm:^11.11.1": - version: 11.11.1 - resolution: "@emotion/react@npm:11.11.1" +"@emotion/react@npm:^11.11.3": + version: 11.11.3 + resolution: "@emotion/react@npm:11.11.3" dependencies: "@babel/runtime": "npm:^7.18.3" "@emotion/babel-plugin": "npm:^11.11.0" "@emotion/cache": "npm:^11.11.0" - "@emotion/serialize": "npm:^1.1.2" + "@emotion/serialize": "npm:^1.1.3" "@emotion/use-insertion-effect-with-fallbacks": "npm:^1.0.1" "@emotion/utils": "npm:^1.2.1" "@emotion/weak-memoize": "npm:^0.3.1" @@ -1862,7 +1862,7 @@ __metadata: peerDependenciesMeta: "@types/react": optional: true - checksum: 1aea4d735b537fbfbeda828bbf929488a7e1b5b7d131f14aeede8737e92bb3b611e15fec353e97f85aed7a65a1c86a695a04ba6e9be905231beef6bd624cb705 + checksum: ce995395b8714343715284beb8478afdfa72b89ed83981a15a170ca0f4a2f77d7a4a198fd50c1f9c6efcd0535768d168ff88c5921dc5f90bb33134c7a75f9455 languageName: node linkType: hard @@ -1879,6 +1879,19 @@ __metadata: languageName: node linkType: hard +"@emotion/serialize@npm:^1.1.3": + version: 1.1.3 + resolution: "@emotion/serialize@npm:1.1.3" + dependencies: + "@emotion/hash": "npm:^0.9.1" + "@emotion/memoize": "npm:^0.8.1" + "@emotion/unitless": "npm:^0.8.1" + "@emotion/utils": "npm:^1.2.1" + csstype: "npm:^3.0.2" + checksum: 875241eafaa30e7d3b7cf9b585d8c1f224cbf627a674e87eb1d7662dafa76a8c8d67f14a79dbf7d1eaa017e9f68389962990fbcc699d5ad65035a1a047432a3f + languageName: node + linkType: hard + "@emotion/server@npm:^11.11.0": version: 11.11.0 resolution: "@emotion/server@npm:11.11.0" @@ -2629,14 +2642,14 @@ __metadata: languageName: node linkType: hard -"@mui/base@npm:5.0.0-beta.28": - version: 5.0.0-beta.28 - resolution: "@mui/base@npm:5.0.0-beta.28" +"@mui/base@npm:5.0.0-beta.29": + version: 5.0.0-beta.29 + resolution: "@mui/base@npm:5.0.0-beta.29" dependencies: - "@babel/runtime": "npm:^7.23.5" + "@babel/runtime": "npm:^7.23.6" "@floating-ui/react-dom": "npm:^2.0.4" "@mui/types": "npm:^7.2.11" - "@mui/utils": "npm:^5.15.1" + "@mui/utils": "npm:^5.15.2" "@popperjs/core": "npm:^2.11.8" clsx: "npm:^2.0.0" prop-types: "npm:^15.8.1" @@ -2647,22 +2660,22 @@ __metadata: peerDependenciesMeta: "@types/react": optional: true - checksum: 31479d9548e1b29150e3b94bcb88edce409339ac047e78a8a70173a0fa2c7730b38f28c6b366e2b3dda3964f28e883153cae0dc2957218b1711bb58004ddc2d1 + checksum: 683837bc355778fc6cf3ba96cbac735f83166b7b238bff727d9a47cb2e11bb059bb7a89be371bf565dfc54981843d45932d5f5a115905e77b0c0b20af9d20a2a languageName: node linkType: hard -"@mui/core-downloads-tracker@npm:^5.15.1": - version: 5.15.1 - resolution: "@mui/core-downloads-tracker@npm:5.15.1" - checksum: 81e3afca19135336c1122aaa8bd69e411df95389c2654c03ce8a8787f4ee4b14403f58acfbf4eef1b9267685569ee9a0bee4b08cf15782d866e9277792d84657 +"@mui/core-downloads-tracker@npm:^5.15.2": + version: 5.15.2 + resolution: "@mui/core-downloads-tracker@npm:5.15.2" + checksum: bee88bdc7568c6bc564be6489035e86e1d89a8bab6e607fb1145d0f450693289ea7a3f216e1e30136ae0125a80da7d4729b0533160b9e50190bdc9bb1aafed22 languageName: node linkType: hard -"@mui/icons-material@npm:^5.15.1": - version: 5.15.1 - resolution: "@mui/icons-material@npm:5.15.1" +"@mui/icons-material@npm:^5.15.2": + version: 5.15.2 + resolution: "@mui/icons-material@npm:5.15.2" dependencies: - "@babel/runtime": "npm:^7.23.5" + "@babel/runtime": "npm:^7.23.6" peerDependencies: "@mui/material": ^5.0.0 "@types/react": ^17.0.0 || ^18.0.0 @@ -2670,19 +2683,19 @@ __metadata: peerDependenciesMeta: "@types/react": optional: true - checksum: 9ae975f7534094f6e80ffeb3946338a22b9656bb02544fa76e427daeff050c7db0ce83b261bca73a1aab17789d87cc19cc92749d0dc40501f889a9dbfb35709d + checksum: dc3cc687faed7905822e388168f6e73f6597f37f58aeebca981f85dacbe513f82a97c7366d09fd9da9bd53a90e11739c12a4b4f9c2d96b64b816a5e0f039971e languageName: node linkType: hard -"@mui/lab@npm:^5.0.0-alpha.157": - version: 5.0.0-alpha.157 - resolution: "@mui/lab@npm:5.0.0-alpha.157" +"@mui/lab@npm:^5.0.0-alpha.158": + version: 5.0.0-alpha.158 + resolution: "@mui/lab@npm:5.0.0-alpha.158" dependencies: - "@babel/runtime": "npm:^7.23.5" - "@mui/base": "npm:5.0.0-beta.28" - "@mui/system": "npm:^5.15.1" + "@babel/runtime": "npm:^7.23.6" + "@mui/base": "npm:5.0.0-beta.29" + "@mui/system": "npm:^5.15.2" "@mui/types": "npm:^7.2.11" - "@mui/utils": "npm:^5.15.1" + "@mui/utils": "npm:^5.15.2" clsx: "npm:^2.0.0" prop-types: "npm:^15.8.1" peerDependencies: @@ -2699,20 +2712,20 @@ __metadata: optional: true "@types/react": optional: true - checksum: f4cdd88ab544c5b30c465205a13706e7ce0b720eef61e84b983e215b742929384559e8abd842727e7ad3f545279262d6338cf3192167029c55fd1e418902af05 + checksum: 3458a201a12b354e01adeaa165825339fc5c0900eca4580eab8ab8d891b9b8e33ff1be4760b40fc5219dc8635c632d98b4b7956a22d53dd3bd5bd08afb223904 languageName: node linkType: hard -"@mui/material@npm:^5.15.1": - version: 5.15.1 - resolution: "@mui/material@npm:5.15.1" +"@mui/material@npm:^5.15.2": + version: 5.15.2 + resolution: "@mui/material@npm:5.15.2" dependencies: - "@babel/runtime": "npm:^7.23.5" - "@mui/base": "npm:5.0.0-beta.28" - "@mui/core-downloads-tracker": "npm:^5.15.1" - "@mui/system": "npm:^5.15.1" + "@babel/runtime": "npm:^7.23.6" + "@mui/base": "npm:5.0.0-beta.29" + "@mui/core-downloads-tracker": "npm:^5.15.2" + "@mui/system": "npm:^5.15.2" "@mui/types": "npm:^7.2.11" - "@mui/utils": "npm:^5.15.1" + "@mui/utils": "npm:^5.15.2" "@types/react-transition-group": "npm:^4.4.10" clsx: "npm:^2.0.0" csstype: "npm:^3.1.2" @@ -2732,16 +2745,16 @@ __metadata: optional: true "@types/react": optional: true - checksum: d5fc5cba599a691d84424bfa8d8a3dc18ecbf85ea1bd4fc92292b716a4df9facf391d3c164743f83ae8c69905f92c0061cd311d2c6c3a051a277614940b87b1b + checksum: c6ca6e4e25999b946d9d34052a67d9d29c2efec0da98e749c6f131f8f818d1c408f7dbc1a88a523c020cb6cf9b3ee00ec1ddafc2cc4a0f0a7b7a8b93bfd7c572 languageName: node linkType: hard -"@mui/private-theming@npm:^5.15.1": - version: 5.15.1 - resolution: "@mui/private-theming@npm:5.15.1" +"@mui/private-theming@npm:^5.15.2": + version: 5.15.2 + resolution: "@mui/private-theming@npm:5.15.2" dependencies: - "@babel/runtime": "npm:^7.23.5" - "@mui/utils": "npm:^5.15.1" + "@babel/runtime": "npm:^7.23.6" + "@mui/utils": "npm:^5.15.2" prop-types: "npm:^15.8.1" peerDependencies: "@types/react": ^17.0.0 || ^18.0.0 @@ -2749,15 +2762,15 @@ __metadata: peerDependenciesMeta: "@types/react": optional: true - checksum: 1d5e334601eac1e1f153c91094cd513e98ccb8fef2fcbcf8c048723d171ceda59b8231dcc3daa665e5e5ee7e39aae1b653040efb64320ef89d4ec1ad88eea4de + checksum: 1a507f5ba8d257af1d3e375d7eebaf1562127ea7995bc92249fdba386b835dfb70d14378c38b832e0a92fbf0a9ac3295483fd11f338916f97ec2ffabe09dacbf languageName: node linkType: hard -"@mui/styled-engine@npm:^5.15.1": - version: 5.15.1 - resolution: "@mui/styled-engine@npm:5.15.1" +"@mui/styled-engine@npm:^5.15.2": + version: 5.15.2 + resolution: "@mui/styled-engine@npm:5.15.2" dependencies: - "@babel/runtime": "npm:^7.23.5" + "@babel/runtime": "npm:^7.23.6" "@emotion/cache": "npm:^11.11.0" csstype: "npm:^3.1.2" prop-types: "npm:^15.8.1" @@ -2770,19 +2783,19 @@ __metadata: optional: true "@emotion/styled": optional: true - checksum: fcfa7cd3ba9ab24ad557ac9e980b46ff4d4dfddab41b1cdd57257a5ad57bf13e3891d771218dca1b1f405609c6e1e9895b80fcd90211a8877279f7774bb70e70 + checksum: 918580193afd32f35d60099bac67c67f00aa72c1bb76132bceebb6a9e4b8f46de080a598e0ea6677c900d9409afaa9ff91572e05482d3a4609b0e7faa39004e2 languageName: node linkType: hard -"@mui/system@npm:^5.15.1": - version: 5.15.1 - resolution: "@mui/system@npm:5.15.1" +"@mui/system@npm:^5.15.2": + version: 5.15.2 + resolution: "@mui/system@npm:5.15.2" dependencies: - "@babel/runtime": "npm:^7.23.5" - "@mui/private-theming": "npm:^5.15.1" - "@mui/styled-engine": "npm:^5.15.1" + "@babel/runtime": "npm:^7.23.6" + "@mui/private-theming": "npm:^5.15.2" + "@mui/styled-engine": "npm:^5.15.2" "@mui/types": "npm:^7.2.11" - "@mui/utils": "npm:^5.15.1" + "@mui/utils": "npm:^5.15.2" clsx: "npm:^2.0.0" csstype: "npm:^3.1.2" prop-types: "npm:^15.8.1" @@ -2798,7 +2811,7 @@ __metadata: optional: true "@types/react": optional: true - checksum: c8abf92fde14031b0e6af6ef2d947bde9e98ce08bb81550bb08fa56793adf1da086066299a7c09d7f26c6e3a6a780679064ed8e54914ae5d775bb87c44632dc5 + checksum: b57b9080b942c0149f882aa64094491696ce8d2cfd537ed5b14dad76b17978b1435a3f357342f283ae4c3d2b5f214c2beda02942fb3eff77dc0eb2c786cd64a0 languageName: node linkType: hard @@ -2814,11 +2827,11 @@ __metadata: languageName: node linkType: hard -"@mui/utils@npm:^5.15.1": - version: 5.15.1 - resolution: "@mui/utils@npm:5.15.1" +"@mui/utils@npm:^5.15.2": + version: 5.15.2 + resolution: "@mui/utils@npm:5.15.2" dependencies: - "@babel/runtime": "npm:^7.23.5" + "@babel/runtime": "npm:^7.23.6" "@types/prop-types": "npm:^15.7.11" prop-types: "npm:^15.8.1" react-is: "npm:^18.2.0" @@ -2828,7 +2841,7 @@ __metadata: peerDependenciesMeta: "@types/react": optional: true - checksum: 46a66c488ece0d5be5f179316495220ff95d5276f452ea1cf48836ed6aade63ceb5dd3cd0d3970eb958272eb4455deb657effcf52b7eb2355d9b99bef9d61909 + checksum: 4268b2685eb602024c0c21a43bc7b0fafa417a0b936750899988076d7cc582acc38568ddf65d50e76b02a136f7c69fa782ccd1d22d732fdac61d7f359eb7d369 languageName: node linkType: hard @@ -3483,15 +3496,15 @@ __metadata: languageName: node linkType: hard -"@typescript-eslint/eslint-plugin@npm:^6.15.0": - version: 6.15.0 - resolution: "@typescript-eslint/eslint-plugin@npm:6.15.0" +"@typescript-eslint/eslint-plugin@npm:^6.16.0": + version: 6.16.0 + resolution: "@typescript-eslint/eslint-plugin@npm:6.16.0" dependencies: "@eslint-community/regexpp": "npm:^4.5.1" - "@typescript-eslint/scope-manager": "npm:6.15.0" - "@typescript-eslint/type-utils": "npm:6.15.0" - "@typescript-eslint/utils": "npm:6.15.0" - "@typescript-eslint/visitor-keys": "npm:6.15.0" + "@typescript-eslint/scope-manager": "npm:6.16.0" + "@typescript-eslint/type-utils": "npm:6.16.0" + "@typescript-eslint/utils": "npm:6.16.0" + "@typescript-eslint/visitor-keys": "npm:6.16.0" debug: "npm:^4.3.4" graphemer: "npm:^1.4.0" ignore: "npm:^5.2.4" @@ -3504,7 +3517,7 @@ __metadata: peerDependenciesMeta: typescript: optional: true - checksum: 78054afb0d4ab12d82db7a9cb005dfa2be42962341728abf4a81802e1f4c0f5b23de4870287f4b7e32aa4a4bc900bbc218f2d4d0c02aa77452e8e8e0b71fe3de + checksum: c8a68e0953d8b94f6b85d3a82090e61e670bcb0945cbee4d741321c56db727429ad47c48b8403ad1dab3b0842689bd2d4b85c99b76c51ac4f5be7f5f61c4c314 languageName: node linkType: hard @@ -3526,21 +3539,21 @@ __metadata: languageName: node linkType: hard -"@typescript-eslint/parser@npm:^6.15.0": - version: 6.15.0 - resolution: "@typescript-eslint/parser@npm:6.15.0" +"@typescript-eslint/parser@npm:^6.16.0": + version: 6.16.0 + resolution: "@typescript-eslint/parser@npm:6.16.0" dependencies: - "@typescript-eslint/scope-manager": "npm:6.15.0" - "@typescript-eslint/types": "npm:6.15.0" - "@typescript-eslint/typescript-estree": "npm:6.15.0" - "@typescript-eslint/visitor-keys": "npm:6.15.0" + "@typescript-eslint/scope-manager": "npm:6.16.0" + "@typescript-eslint/types": "npm:6.16.0" + "@typescript-eslint/typescript-estree": "npm:6.16.0" + "@typescript-eslint/visitor-keys": "npm:6.16.0" debug: "npm:^4.3.4" peerDependencies: eslint: ^7.0.0 || ^8.0.0 peerDependenciesMeta: typescript: optional: true - checksum: e7f265fd4abd3bc49fa5b304cd4b9c22801ac5a9da4ee342bbab0c117d629ac4aad6998555b61a8c5a0b279c443a44ae99f16669e24e3ef17ccec20c8b7019e7 + checksum: 9d573d14df4ec661dccaca785223a8a330d64f50a9279ff9170b1da22198ff91b9afa3ee7d3d7127c0cbc148c86831e76b33fc5b47d630799e98940ef666bfe0 languageName: node linkType: hard @@ -3554,22 +3567,22 @@ __metadata: languageName: node linkType: hard -"@typescript-eslint/scope-manager@npm:6.15.0": - version: 6.15.0 - resolution: "@typescript-eslint/scope-manager@npm:6.15.0" +"@typescript-eslint/scope-manager@npm:6.16.0": + version: 6.16.0 + resolution: "@typescript-eslint/scope-manager@npm:6.16.0" dependencies: - "@typescript-eslint/types": "npm:6.15.0" - "@typescript-eslint/visitor-keys": "npm:6.15.0" - checksum: 3428d99de440f227cbc2afb44cdcb25e44c4b49c5f490392f83e21d2048210a6ec2f2f68133376c842034f5b5ba4ec9721da7caa18e631e23b57e20927b5b6f0 + "@typescript-eslint/types": "npm:6.16.0" + "@typescript-eslint/visitor-keys": "npm:6.16.0" + checksum: 3b275e528d19f4f36c4acd6cb872b5f004175512dce30cef0ac7a9121bb23d21e5e0f4b62658dbfea2b15851e7fa930372696f25a6c87492f863171ab56f5364 languageName: node linkType: hard -"@typescript-eslint/type-utils@npm:6.15.0": - version: 6.15.0 - resolution: "@typescript-eslint/type-utils@npm:6.15.0" +"@typescript-eslint/type-utils@npm:6.16.0": + version: 6.16.0 + resolution: "@typescript-eslint/type-utils@npm:6.16.0" dependencies: - "@typescript-eslint/typescript-estree": "npm:6.15.0" - "@typescript-eslint/utils": "npm:6.15.0" + "@typescript-eslint/typescript-estree": "npm:6.16.0" + "@typescript-eslint/utils": "npm:6.16.0" debug: "npm:^4.3.4" ts-api-utils: "npm:^1.0.1" peerDependencies: @@ -3577,7 +3590,7 @@ __metadata: peerDependenciesMeta: typescript: optional: true - checksum: 32cb531a4b5e0ccd431cba553ec73b87d4453b48af288a33e359ba4f5278126390d82799b61d3f0fbf135cfde1ac6c2275c2cf37a676e8a2a2811e774e660f16 + checksum: a5339cc1375d12411fcb242249143b28401fb18890bb2a1cff5275ba946affb4a2066cd8203e83ac383bd9d791a79ea6ee1cbf7a30deed5c832ed002897bbf82 languageName: node linkType: hard @@ -3588,10 +3601,10 @@ __metadata: languageName: node linkType: hard -"@typescript-eslint/types@npm:6.15.0": - version: 6.15.0 - resolution: "@typescript-eslint/types@npm:6.15.0" - checksum: 6e33529ea301c8c4b8c1f589dadd5d2a66c1b24ec87a577524fbc996d4c7b65d4f4fdfa4a3937b691efee6a10a6b16f7bfcabe98a15e0fc0c0c57aa0d80dcc25 +"@typescript-eslint/types@npm:6.16.0": + version: 6.16.0 + resolution: "@typescript-eslint/types@npm:6.16.0" + checksum: 74d9a8b7fd1b85fd1824295c92bc2f506148e450c9897f65ddaa089091017df4e25676c5b098b75c8f00529b84492f303a6b1870bb0ffee83997081325891d53 languageName: node linkType: hard @@ -3613,38 +3626,39 @@ __metadata: languageName: node linkType: hard -"@typescript-eslint/typescript-estree@npm:6.15.0": - version: 6.15.0 - resolution: "@typescript-eslint/typescript-estree@npm:6.15.0" +"@typescript-eslint/typescript-estree@npm:6.16.0": + version: 6.16.0 + resolution: "@typescript-eslint/typescript-estree@npm:6.16.0" dependencies: - "@typescript-eslint/types": "npm:6.15.0" - "@typescript-eslint/visitor-keys": "npm:6.15.0" + "@typescript-eslint/types": "npm:6.16.0" + "@typescript-eslint/visitor-keys": "npm:6.16.0" debug: "npm:^4.3.4" globby: "npm:^11.1.0" is-glob: "npm:^4.0.3" + minimatch: "npm:9.0.3" semver: "npm:^7.5.4" ts-api-utils: "npm:^1.0.1" peerDependenciesMeta: typescript: optional: true - checksum: 08955f6e84b8edb855a6769671e85889e52b15b82e00a64f595da867b21ad060e5342787c436d77702b2a1f39d411ac79b81a8d2e2006e9b1886eadb08b626df + checksum: c7109e90b40b3c8f1042beb7f1a7a97eeba3b6a903acd82df4947900d68bd31d04b530a190c099666c5ca4886efc162de7b42de754a44b189e41237210797d9e languageName: node linkType: hard -"@typescript-eslint/utils@npm:6.15.0": - version: 6.15.0 - resolution: "@typescript-eslint/utils@npm:6.15.0" +"@typescript-eslint/utils@npm:6.16.0, @typescript-eslint/utils@npm:^6.13.0": + version: 6.16.0 + resolution: "@typescript-eslint/utils@npm:6.16.0" dependencies: "@eslint-community/eslint-utils": "npm:^4.4.0" "@types/json-schema": "npm:^7.0.12" "@types/semver": "npm:^7.5.0" - "@typescript-eslint/scope-manager": "npm:6.15.0" - "@typescript-eslint/types": "npm:6.15.0" - "@typescript-eslint/typescript-estree": "npm:6.15.0" + "@typescript-eslint/scope-manager": "npm:6.16.0" + "@typescript-eslint/types": "npm:6.16.0" + "@typescript-eslint/typescript-estree": "npm:6.16.0" semver: "npm:^7.5.4" peerDependencies: eslint: ^7.0.0 || ^8.0.0 - checksum: 53519a2027681bdc8f028f9421c65f193f91b5bb1659465fedb8043376c693c2391211f1c01d8ba25bfaa7f7b3a102263d7123f9dfade12032159f4b4490f0fb + checksum: 586c4c0e1ca249daf9958f0d88df3af010a7592a19db1a7dc198754542b584314896536fe56ea9c93dd0ddd531154e7697002643d46e24a8d3a459721a626e91 languageName: node linkType: hard @@ -3675,13 +3689,13 @@ __metadata: languageName: node linkType: hard -"@typescript-eslint/visitor-keys@npm:6.15.0": - version: 6.15.0 - resolution: "@typescript-eslint/visitor-keys@npm:6.15.0" +"@typescript-eslint/visitor-keys@npm:6.16.0": + version: 6.16.0 + resolution: "@typescript-eslint/visitor-keys@npm:6.16.0" dependencies: - "@typescript-eslint/types": "npm:6.15.0" + "@typescript-eslint/types": "npm:6.16.0" eslint-visitor-keys: "npm:^3.4.1" - checksum: bf9f71af60bd63d1073900e75c5a0aa6eddd672f6c3ac6092c765d67deb7a0c32d2a5f6f3aee9e95f93a93d58563a76da209bd8487aadafd4d013100ffe38520 + checksum: 13c4d90355e288eac432d2845e37bb2acc03dab6d8568564558c1914a9aa44352f2a7ff29d0f50e0b3e68d66cca5f27b2732af5ff193b82571b4366309842880 languageName: node linkType: hard @@ -4060,7 +4074,7 @@ __metadata: languageName: node linkType: hard -"axios@npm:^1.0.0, axios@npm:^1.6.2": +"axios@npm:^1.0.0": version: 1.6.2 resolution: "axios@npm:1.6.2" dependencies: @@ -4071,6 +4085,17 @@ __metadata: languageName: node linkType: hard +"axios@npm:^1.6.3": + version: 1.6.3 + resolution: "axios@npm:1.6.3" + dependencies: + follow-redirects: "npm:^1.15.0" + form-data: "npm:^4.0.0" + proxy-from-env: "npm:^1.1.0" + checksum: dcc6d982353db33e6893ef01cdf81d0a0548dbd8fba0cb046dc4aee1a6a16226721faa4c2a13b2673d47130509629cdb93bb991b3a2bd4ef17a5ac27a8bba0da + languageName: node + linkType: hard + "axobject-query@npm:^3.2.1": version: 3.2.1 resolution: "axobject-query@npm:3.2.1" @@ -4621,10 +4646,10 @@ __metadata: languageName: node linkType: hard -"commander@npm:~11.0.0": - version: 11.0.0 - resolution: "commander@npm:11.0.0" - checksum: 471c44cd2d31dee556753df6ceb5ef52ccded0ba6308d3ba7a76251aa0edeedf5ac66ca86cb6096cc8fe20997064233c476983d346265f85180e86312724de0c +"commander@npm:~11.1.0": + version: 11.1.0 + resolution: "commander@npm:11.1.0" + checksum: 13cc6ac875e48780250f723fb81c1c1178d35c5decb1abb1b628b3177af08a8554e76b2c0f29de72d69eef7c864d12613272a71fabef8047922bc622ab75a179 languageName: node linkType: hard @@ -5844,7 +5869,7 @@ __metadata: languageName: node linkType: hard -"eslint-plugin-jsx-a11y@npm:^6.7.1": +"eslint-plugin-jsx-a11y@npm:^6.7.1, eslint-plugin-jsx-a11y@npm:^6.8.0": version: 6.8.0 resolution: "eslint-plugin-jsx-a11y@npm:6.8.0" dependencies: @@ -5870,6 +5895,32 @@ __metadata: languageName: node linkType: hard +"eslint-plugin-perfectionist@npm:^2.5.0": + version: 2.5.0 + resolution: "eslint-plugin-perfectionist@npm:2.5.0" + dependencies: + "@typescript-eslint/utils": "npm:^6.13.0" + minimatch: "npm:^9.0.3" + natural-compare-lite: "npm:^1.4.0" + peerDependencies: + astro-eslint-parser: ^0.16.0 + eslint: ">=8.0.0" + svelte: ">=3.0.0" + svelte-eslint-parser: ^0.33.0 + vue-eslint-parser: ">=9.0.0" + peerDependenciesMeta: + astro-eslint-parser: + optional: true + svelte: + optional: true + svelte-eslint-parser: + optional: true + vue-eslint-parser: + optional: true + checksum: 61814512b26fd856e3f0d06ad77fe502a00e3109b33f39651fbbf5e0b233caa8f8732a8363b8948107318839083f4bf87400c90bc5d0ced475d9d56ea3bb4892 + languageName: node + linkType: hard + "eslint-plugin-playwright@npm:^0.20.0": version: 0.20.0 resolution: "eslint-plugin-playwright@npm:0.20.0" @@ -6118,12 +6169,12 @@ __metadata: languageName: node linkType: hard -"file-entry-cache@npm:^7.0.2": - version: 7.0.2 - resolution: "file-entry-cache@npm:7.0.2" +"file-entry-cache@npm:^8.0.0": + version: 8.0.0 + resolution: "file-entry-cache@npm:8.0.0" dependencies: - flat-cache: "npm:^3.2.0" - checksum: 822664e35c3e295e6a8ca7ec490d8d8077017607f41f94b29922f1f49c6dd07025048e3ed528e2909a1439eba66d60f802c0774aa612cf6ee053ee4ecc16c8c5 + flat-cache: "npm:^4.0.0" + checksum: 9e2b5938b1cd9b6d7e3612bdc533afd4ac17b2fc646569e9a8abbf2eb48e5eb8e316bc38815a3ef6a1b456f4107f0d0f055a614ca613e75db6bf9ff4d72c1638 languageName: node linkType: hard @@ -6163,7 +6214,7 @@ __metadata: languageName: node linkType: hard -"flat-cache@npm:^3.0.4, flat-cache@npm:^3.2.0": +"flat-cache@npm:^3.0.4": version: 3.2.0 resolution: "flat-cache@npm:3.2.0" dependencies: @@ -6174,6 +6225,17 @@ __metadata: languageName: node linkType: hard +"flat-cache@npm:^4.0.0": + version: 4.0.0 + resolution: "flat-cache@npm:4.0.0" + dependencies: + flatted: "npm:^3.2.9" + keyv: "npm:^4.5.4" + rimraf: "npm:^5.0.5" + checksum: 8f99e27bb3de94e91e7b4ca5120488cdc2b7f8cd952a538f1a566101963057eb42ca318e9fac0d36987dcca34316ff04b61c1dc3dcc8084f6f5e801a52a8e547 + languageName: node + linkType: hard + "flatted@npm:^3.2.9": version: 3.2.9 resolution: "flatted@npm:3.2.9" @@ -6207,12 +6269,12 @@ __metadata: "@apollo/client": "npm:^3.8.8" "@commitlint/cli": "npm:^18.4.3" "@commitlint/config-conventional": "npm:^18.4.3" - "@emotion/react": "npm:^11.11.1" + "@emotion/react": "npm:^11.11.3" "@emotion/server": "npm:^11.11.0" "@emotion/styled": "npm:^11.11.0" - "@mui/icons-material": "npm:^5.15.1" - "@mui/lab": "npm:^5.0.0-alpha.157" - "@mui/material": "npm:^5.15.1" + "@mui/icons-material": "npm:^5.15.2" + "@mui/lab": "npm:^5.0.0-alpha.158" + "@mui/material": "npm:^5.15.2" "@n8tb1t/use-scroll-position": "npm:^2.0.3" "@next/bundle-analyzer": "npm:^14.0.4" "@playwright/test": "npm:^1.40.1" @@ -6229,24 +6291,26 @@ __metadata: "@types/react-dom": "npm:^18.2.18" "@types/rss": "npm:^0.0.32" "@types/validator": "npm:^13.11.7" - "@typescript-eslint/eslint-plugin": "npm:^6.15.0" - "@typescript-eslint/parser": "npm:^6.15.0" + "@typescript-eslint/eslint-plugin": "npm:^6.16.0" + "@typescript-eslint/parser": "npm:^6.16.0" autoprefixer: "npm:^10.4.16" - axios: "npm:^1.6.2" + axios: "npm:^1.6.3" dotenv: "npm:^16.3.1" dotenv-defaults: "npm:^5.0.2" eslint: "npm:^8.56.0" eslint-config-next: "npm:^14.0.4" + eslint-plugin-jsx-a11y: "npm:^6.8.0" + eslint-plugin-perfectionist: "npm:^2.5.0" eslint-plugin-playwright: "npm:^0.20.0" framer-motion: "npm:^10.16.16" graphql: "npm:^16.8.1" husky: "npm:^8.0.3" - i18next-parser: "npm:^8.9.0" - isomorphic-dompurify: "npm:^1.13.0" + i18next-parser: "npm:^8.11.0" + isomorphic-dompurify: "npm:^2.0.0" jsdom: "npm:^23.0.1" markdown-to-jsx: "npm:^7.3.2" million: "npm:^2.6.4" - moment: "npm:^2.29.4" + moment: "npm:^2.30.1" moment-timezone: "npm:^0.5.43" next: "npm:^14.0.4" next-sitemap: "npm:^4.2.3" @@ -6262,7 +6326,7 @@ __metadata: rss: "npm:^1.2.2" sass: "npm:^1.69.5" sharp: "npm:^0.33.1" - stylelint: "npm:^16.0.2" + stylelint: "npm:^16.1.0" stylelint-config-standard-scss: "npm:^12.0.0" stylelint-order: "npm:^6.0.4" stylelint-scss: "npm:^6.0.0" @@ -6602,7 +6666,7 @@ __metadata: languageName: node linkType: hard -"glob@npm:^10.2.2, glob@npm:^10.3.10": +"glob@npm:^10.2.2, glob@npm:^10.3.10, glob@npm:^10.3.7": version: 10.3.10 resolution: "glob@npm:10.3.10" dependencies: @@ -6983,14 +7047,14 @@ __metadata: languageName: node linkType: hard -"i18next-parser@npm:^8.9.0": - version: 8.9.0 - resolution: "i18next-parser@npm:8.9.0" +"i18next-parser@npm:^8.11.0": + version: 8.11.0 + resolution: "i18next-parser@npm:8.11.0" dependencies: broccoli-plugin: "npm:^4.0.7" cheerio: "npm:^1.0.0-rc.2" colors: "npm:1.4.0" - commander: "npm:~11.0.0" + commander: "npm:~11.1.0" eol: "npm:^0.9.1" esbuild: "npm:^0.19.0" fs-extra: "npm:^11.1.0" @@ -7006,7 +7070,7 @@ __metadata: vue-template-compiler: "npm:^2.6.11" bin: i18next: bin/cli.js - checksum: c8c650cfa672afc673daed92ecf6bfb28947c5663549f3dc4aa2e1b8d7949a9c93a09b9b1f7239576656b60b6fb9f9c86076a01d8d8c6fb967fda398653ebcda + checksum: 2c4d46c34a6ac54b3067faf4c1c31d4b65a8d4ac82647875edf61099fec59bbf20c977cc559067432eacc5e961de6109caa0f83d55c3638990c0b3e2eb37d044 languageName: node linkType: hard @@ -7475,14 +7539,14 @@ __metadata: languageName: node linkType: hard -"isomorphic-dompurify@npm:^1.13.0": - version: 1.13.0 - resolution: "isomorphic-dompurify@npm:1.13.0" +"isomorphic-dompurify@npm:^2.0.0": + version: 2.0.0 + resolution: "isomorphic-dompurify@npm:2.0.0" dependencies: "@types/dompurify": "npm:^3.0.3" dompurify: "npm:^3.0.6" jsdom: "npm:^23.0.0" - checksum: 58576f22f9e2b4c3f544c155f49a7a3d5b05bc9dc3b4d7706fd9ba8e90b1169a290a0fd1cddedb5c177c8082f6b658b468d406ad90ccfa83dc707cfd99083168 + checksum: 87553de52e363509f077127651e53921a7b41bcb548fd03052277979c8686c625215e102e08cc3ac8571a65a187b649cc0c274e8aa8d369999dfb68249c046f6 languageName: node linkType: hard @@ -7743,7 +7807,7 @@ __metadata: languageName: node linkType: hard -"keyv@npm:^4.5.3": +"keyv@npm:^4.5.3, keyv@npm:^4.5.4": version: 4.5.4 resolution: "keyv@npm:4.5.4" dependencies: @@ -8103,13 +8167,20 @@ __metadata: languageName: node linkType: hard -"meow@npm:^12.0.1, meow@npm:^12.1.1": +"meow@npm:^12.0.1": version: 12.1.1 resolution: "meow@npm:12.1.1" checksum: a125ca99a32e2306e2f4cbe651a0d27f6eb67918d43a075f6e80b35e9bf372ebf0fc3a9fbc201cbbc9516444b6265fb3c9f80c5b7ebd32f548aa93eb7c28e088 languageName: node linkType: hard +"meow@npm:^13.0.0": + version: 13.0.0 + resolution: "meow@npm:13.0.0" + checksum: fab0f91578154c048e792a81704f3f28099ffff900f364df8a85f6e770a57e1c124859a25e186186e149dad30692c7893af0dfd71517bea343bfe5d749b1fa04 + languageName: node + linkType: hard + "meow@npm:^8.0.0": version: 8.1.2 resolution: "meow@npm:8.1.2" @@ -8217,6 +8288,15 @@ __metadata: languageName: node linkType: hard +"minimatch@npm:9.0.3, minimatch@npm:^9.0.1, minimatch@npm:^9.0.3": + version: 9.0.3 + resolution: "minimatch@npm:9.0.3" + dependencies: + brace-expansion: "npm:^2.0.1" + checksum: 85f407dcd38ac3e180f425e86553911d101455ca3ad5544d6a7cec16286657e4f8a9aa6695803025c55e31e35a91a2252b5dc8e7d527211278b8b65b4dbd5eac + languageName: node + linkType: hard + "minimatch@npm:^3.0.2, minimatch@npm:^3.0.4, minimatch@npm:^3.0.5, minimatch@npm:^3.1.1, minimatch@npm:^3.1.2": version: 3.1.2 resolution: "minimatch@npm:3.1.2" @@ -8226,15 +8306,6 @@ __metadata: languageName: node linkType: hard -"minimatch@npm:^9.0.1": - version: 9.0.3 - resolution: "minimatch@npm:9.0.3" - dependencies: - brace-expansion: "npm:^2.0.1" - checksum: 85f407dcd38ac3e180f425e86553911d101455ca3ad5544d6a7cec16286657e4f8a9aa6695803025c55e31e35a91a2252b5dc8e7d527211278b8b65b4dbd5eac - languageName: node - linkType: hard - "minimist-options@npm:4.1.0": version: 4.1.0 resolution: "minimist-options@npm:4.1.0" @@ -8369,6 +8440,13 @@ __metadata: languageName: node linkType: hard +"moment@npm:^2.30.1": + version: 2.30.1 + resolution: "moment@npm:2.30.1" + checksum: 865e4279418c6de666fca7786607705fd0189d8a7b7624e2e56be99290ac846f90878a6f602e34b4e0455c549b85385b1baf9966845962b313699e7cb847543a + languageName: node + linkType: hard + "mrmime@npm:^1.0.0": version: 1.0.1 resolution: "mrmime@npm:1.0.1" @@ -8416,6 +8494,13 @@ __metadata: languageName: node linkType: hard +"natural-compare-lite@npm:^1.4.0": + version: 1.4.0 + resolution: "natural-compare-lite@npm:1.4.0" + checksum: f6cef26f5044515754802c0fc475d81426f3b90fe88c20fabe08771ce1f736ce46e0397c10acb569a4dd0acb84c7f1ee70676122f95d5bfdd747af3a6c6bbaa8 + languageName: node + linkType: hard + "natural-compare@npm:^1.4.0": version: 1.4.0 resolution: "natural-compare@npm:1.4.0" @@ -9678,6 +9763,17 @@ __metadata: languageName: node linkType: hard +"rimraf@npm:^5.0.5": + version: 5.0.5 + resolution: "rimraf@npm:5.0.5" + dependencies: + glob: "npm:^10.3.7" + bin: + rimraf: dist/esm/bin.mjs + checksum: d50dbe724f33835decd88395b25ed35995077c60a50ae78ded06e0185418914e555817aad1b4243edbff2254548c2f6ad6f70cc850040bebb4da9e8cc016f586 + languageName: node + linkType: hard + "rollup@npm:^3.28.0": version: 3.29.4 resolution: "rollup@npm:3.29.4" @@ -10426,14 +10522,14 @@ __metadata: languageName: node linkType: hard -"stylelint@npm:^16.0.2": - version: 16.0.2 - resolution: "stylelint@npm:16.0.2" +"stylelint@npm:^16.1.0": + version: 16.1.0 + resolution: "stylelint@npm:16.1.0" dependencies: - "@csstools/css-parser-algorithms": "npm:^2.3.2" - "@csstools/css-tokenizer": "npm:^2.2.1" - "@csstools/media-query-list-parser": "npm:^2.1.5" - "@csstools/selector-specificity": "npm:^3.0.0" + "@csstools/css-parser-algorithms": "npm:^2.4.0" + "@csstools/css-tokenizer": "npm:^2.2.2" + "@csstools/media-query-list-parser": "npm:^2.1.6" + "@csstools/selector-specificity": "npm:^3.0.1" balanced-match: "npm:^2.0.0" colord: "npm:^2.9.3" cosmiconfig: "npm:^9.0.0" @@ -10442,7 +10538,7 @@ __metadata: debug: "npm:^4.3.4" fast-glob: "npm:^3.3.2" fastest-levenshtein: "npm:^1.0.16" - file-entry-cache: "npm:^7.0.2" + file-entry-cache: "npm:^8.0.0" global-modules: "npm:^2.0.0" globby: "npm:^11.1.0" globjoin: "npm:^0.1.4" @@ -10452,7 +10548,7 @@ __metadata: is-plain-object: "npm:^5.0.0" known-css-properties: "npm:^0.29.0" mathml-tag-names: "npm:^2.1.3" - meow: "npm:^12.1.1" + meow: "npm:^13.0.0" micromatch: "npm:^4.0.5" normalize-path: "npm:^3.0.0" picocolors: "npm:^1.0.0" @@ -10470,7 +10566,7 @@ __metadata: write-file-atomic: "npm:^5.0.1" bin: stylelint: bin/stylelint.mjs - checksum: 5ec755e209beb1877ff40d50f18c1ebb05bf251925da1f98f28fb3911e4031195eb86adaf641ac5cdb01ba973f4c999bc0c6b0270d08c1d5c070adbdd9e734cf + checksum: 765eea0b07319d1e7989502c07b8b5794938e5a8542bec00990b09ec10c3f7006891689930099e948d06c9ef9982066edb98b1ea64a435138a6b0f0905eb2b87 languageName: node linkType: hard