diff --git a/src/assets/icons/tools/btn-vg.svg b/src/assets/icons/tools/btn-vg.svg index e648583..9853809 100644 --- a/src/assets/icons/tools/btn-vg.svg +++ b/src/assets/icons/tools/btn-vg.svg @@ -1,11 +1,11 @@ - - - - - - - - - - + + + + + + + + + + \ No newline at end of file diff --git a/src/assets/icons/tools/company-management.svg b/src/assets/icons/tools/company-management.svg index ae682c4..6c451a1 100644 --- a/src/assets/icons/tools/company-management.svg +++ b/src/assets/icons/tools/company-management.svg @@ -1,14 +1,13 @@ - - - - - - - - - - - - - + + + + + + + + + + + + \ No newline at end of file diff --git a/src/assets/icons/tools/tool-icons/bob.svg b/src/assets/icons/tools/tool-icons/bob.svg index 50c3beb..9913151 100644 --- a/src/assets/icons/tools/tool-icons/bob.svg +++ b/src/assets/icons/tools/tool-icons/bob.svg @@ -1,40 +1,39 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/src/assets/icons/tools/tool-icons/claude-bob.svg b/src/assets/icons/tools/tool-icons/claude-bob.svg index a535d3d..5dba1e9 100644 --- a/src/assets/icons/tools/tool-icons/claude-bob.svg +++ b/src/assets/icons/tools/tool-icons/claude-bob.svg @@ -1,205 +1,204 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/src/assets/icons/tools/tool-icons/ema.svg b/src/assets/icons/tools/tool-icons/ema.svg index c974e08..8819a1c 100644 --- a/src/assets/icons/tools/tool-icons/ema.svg +++ b/src/assets/icons/tools/tool-icons/ema.svg @@ -1,33 +1,32 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/src/assets/icons/tools/tool-icons/github.svg b/src/assets/icons/tools/tool-icons/github.svg index 0f2e9f8..bc93bad 100644 --- a/src/assets/icons/tools/tool-icons/github.svg +++ b/src/assets/icons/tools/tool-icons/github.svg @@ -1,72 +1,71 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/src/assets/icons/tools/tool-icons/mosaic.svg b/src/assets/icons/tools/tool-icons/mosaic.svg index 7f3806d..8811596 100644 --- a/src/assets/icons/tools/tool-icons/mosaic.svg +++ b/src/assets/icons/tools/tool-icons/mosaic.svg @@ -1,24 +1,23 @@ - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/src/assets/icons/tools/tool-icons/tom.svg b/src/assets/icons/tools/tool-icons/tom.svg index e3a5ae1..9b1a44e 100644 --- a/src/assets/icons/tools/tool-icons/tom.svg +++ b/src/assets/icons/tools/tool-icons/tom.svg @@ -1,26 +1,27 @@ - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/src/components/articles/ArticleTag/ArticleTag.module.scss b/src/components/articles/ArticleTag/ArticleTag.module.scss index 3165ed1..557de9d 100644 --- a/src/components/articles/ArticleTag/ArticleTag.module.scss +++ b/src/components/articles/ArticleTag/ArticleTag.module.scss @@ -32,6 +32,7 @@ font-family: 'Source-Serif-Regular', sans-serif; padding: 5px 0 27px 0; letter-spacing: -0.15em; + z-index: 55; } .titleOxford { diff --git a/src/components/tools/BobAchievements/BobAchievements.tsx b/src/components/tools/BobAchievements/BobAchievements.tsx index 1bfc2a4..4ffe5c2 100644 --- a/src/components/tools/BobAchievements/BobAchievements.tsx +++ b/src/components/tools/BobAchievements/BobAchievements.tsx @@ -1,6 +1,9 @@ import cn from 'classnames'; +import { useRouter } from 'next/router'; import { FC } from 'react'; +import toolsData from '@data/tools'; + import BobMedal from '@icons/tools/bob-medal.svg'; import Star from '@icons/tools/star.svg'; import StarDark from '@icons/tools/star-dark.svg'; @@ -13,12 +16,15 @@ const BobAchievements: FC = ({ className, darkTheme, }) => { + const { locale } = useRouter(); + const t = toolsData[locale as keyof typeof toolsData] ?? toolsData.en; + return (
- First Behavior + UX Agent on OpenAI + {t.firstBehaviorAgent}
@@ -26,15 +32,15 @@ const BobAchievements: FC = ({ {' '} {darkTheme ? : } 4.7 - Ratings (40+) + {t.ratings} (40+)
- Productivity - Category + {t.productivity} + {t.category}
3906 - Conversations + {t.conversations}
diff --git a/src/components/tools/ToolContainer/ToolContainer.module.scss b/src/components/tools/ToolContainer/ToolContainer.module.scss index 257328d..d14e9b1 100644 --- a/src/components/tools/ToolContainer/ToolContainer.module.scss +++ b/src/components/tools/ToolContainer/ToolContainer.module.scss @@ -8,7 +8,6 @@ position: relative; width: 100%; max-width: 359px; - min-height: 390px; border: 1px solid #dad6d4; overflow: hidden; transition: border-color 240ms ease; @@ -23,6 +22,7 @@ .backgroundSvg path { fill: var(--dark-icon-fill) !important; + opacity: 20%; } .content { @@ -88,15 +88,19 @@ background-size: contain; } +.contentRu { + height: 430px; +} + .backgroundSvg { position: absolute; - inset: 0; width: 100%; height: 100%; pointer-events: none; - z-index: 8; + z-index: 1; left: 48px; top: 32px; + opacity: 50%; } .title { @@ -197,7 +201,7 @@ justify-content: center; gap: 8px; font-family: 'Source Serif 4', 'Source-Serif-Regular', serif; - font-weight: 600; + font-weight: 500; font-size: 16px; line-height: 1; } diff --git a/src/components/tools/ToolContainer/ToolContainer.tsx b/src/components/tools/ToolContainer/ToolContainer.tsx index b26f411..293e15f 100644 --- a/src/components/tools/ToolContainer/ToolContainer.tsx +++ b/src/components/tools/ToolContainer/ToolContainer.tsx @@ -1,12 +1,15 @@ import cn from 'classnames'; import Link from 'next/link'; +import { useRouter } from 'next/router'; import { FC } from 'react'; -import { DEFAULT_CONFIG, TOOL_CONFIG } from '@constants/tools'; +import { TOOL_CONFIG } from '@constants/tools'; import { useEffectiveDarkTheme } from '@hooks/useEffectiveDarkTheme'; import useGlobals from '@hooks/useGlobals'; +import toolsData from '@data/tools'; + import BtnBg from '@icons/tools/btn-vg.svg'; import ClaudeIcon from '@icons/tools/claude.svg'; import GptIcon from '@icons/tools/gpt.svg'; @@ -29,11 +32,13 @@ const ToolContainer: FC = ({ isDarkTheme = false, isInDevelopment = false, }) => { + const { locale } = useRouter(); const { isDarkTheme: globalDarkTheme } = useGlobals()[1]; const darkTheme = useEffectiveDarkTheme(isDarkTheme || globalDarkTheme); + const t = toolsData[locale as keyof typeof toolsData] ?? toolsData.en; - const config = (id != null && TOOL_CONFIG[id]) || DEFAULT_CONFIG; - const { Icon, hoverColor, darkHoverColor, darkIconFill } = config; + const config = id ? TOOL_CONFIG[id] : undefined; + const { Icon, hoverColor, darkHoverColor, darkIconFill } = config ?? {}; const isClaude = poweredBy === 'Claude'; const isChatGPT = poweredBy === 'ChatGPT'; @@ -54,8 +59,12 @@ const ToolContainer: FC = ({ } as React.CSSProperties } > - -
+ {Icon && } +

{title}

{description}

@@ -66,11 +75,12 @@ const ToolContainer: FC = ({ - Download + {t.download} ) : ( = ({ {isBlank && } - {isInDevelopment ? 'In Development' : 'Open'} + {isInDevelopment ? t.inDevelopment : t.open} )} @@ -108,12 +118,12 @@ const ToolContainer: FC = ({ {isClaude ? ( <> - Powered by Claude + {t.poweredBy} Claude ) : ( <> - Powered by ChatGPT + {t.poweredBy} ChatGPT )} diff --git a/src/constants/tools.ts b/src/constants/tools.ts index dd8b736..9cf5a23 100644 --- a/src/constants/tools.ts +++ b/src/constants/tools.ts @@ -1,5 +1,6 @@ import { FC, SVGProps } from 'react'; +import CompanyManagementIcon from '@icons/tools/company-management.svg'; import BobIcon from '@icons/tools/tool-icons/bob.svg'; import ClaudeBobIcon from '@icons/tools/tool-icons/claude-bob.svg'; import EmaIcon from '@icons/tools/tool-icons/ema.svg'; @@ -16,10 +17,10 @@ export type ToolConfig = { export const TOOL_CONFIG: Record = { 1: { - Icon: MosaicIcon, + Icon: CompanyManagementIcon, hoverColor: '#3F4A7A', darkHoverColor: '#C1D6FF', - darkIconFill: '#E08080', + darkIconFill: '#C1D6FF', }, 2: { Icon: EmaIcon, @@ -27,6 +28,12 @@ export const TOOL_CONFIG: Record = { darkHoverColor: '#95CCCC', darkIconFill: '#95CCCC', }, + 3: { + Icon: MosaicIcon, + hoverColor: '#3F4A7A', + darkHoverColor: '#C1D6FF', + darkIconFill: '#E08080', + }, 4: { Icon: GithubIcon, hoverColor: '#4A2F63', @@ -54,8 +61,8 @@ export const TOOL_CONFIG: Record = { }; export const DEFAULT_CONFIG: ToolConfig = { - Icon: MosaicIcon, + Icon: CompanyManagementIcon, hoverColor: '#3F4A7A', darkHoverColor: '#C1D6FF', - darkIconFill: '#E08080', + darkIconFill: '#C1D6FF', }; diff --git a/src/data/tools/en.ts b/src/data/tools/en.ts new file mode 100644 index 0000000..c8627d9 --- /dev/null +++ b/src/data/tools/en.ts @@ -0,0 +1,13 @@ +const en = { + poweredBy: 'Powered by', + firstBehaviorAgent: 'First Behavior + UX Agent on OpenAI', + ratings: 'Ratings', + productivity: 'Productivity', + category: 'Category', + conversations: 'Conversations', + download: 'Download', + inDevelopment: 'In Development', + open: 'Open', +}; + +export default en; diff --git a/src/data/tools/hy.ts b/src/data/tools/hy.ts new file mode 100644 index 0000000..ddc966d --- /dev/null +++ b/src/data/tools/hy.ts @@ -0,0 +1,13 @@ +const hy = { + poweredBy: 'Powered by', + firstBehaviorAgent: 'First Behavior + UX Agent on OpenAI', + ratings: 'Ratings', + productivity: 'Productivity', + category: 'Category', + conversations: 'Conversations', + download: 'Download', + inDevelopment: 'In Development', + open: 'Open', +}; + +export default hy; diff --git a/src/data/tools/index.ts b/src/data/tools/index.ts new file mode 100644 index 0000000..f4c2aa3 --- /dev/null +++ b/src/data/tools/index.ts @@ -0,0 +1,5 @@ +import en from './en'; +import hy from './hy'; +import ru from './ru'; + +export default { en, ru, hy }; diff --git a/src/data/tools/ru.ts b/src/data/tools/ru.ts new file mode 100644 index 0000000..337b89b --- /dev/null +++ b/src/data/tools/ru.ts @@ -0,0 +1,13 @@ +const ru = { + poweredBy: 'Работает на', + firstBehaviorAgent: 'Первый агент по поведению и UX на OpenAI', + ratings: 'Оценки', + productivity: 'Продуктивность', + category: 'Категория', + conversations: 'Разговоры', + download: 'Скачать', + inDevelopment: 'В разработке', + open: 'Открыть', +}; + +export default ru; diff --git a/src/pages/tools/index.tsx b/src/pages/tools/index.tsx index a03a7a7..85d78e6 100644 --- a/src/pages/tools/index.tsx +++ b/src/pages/tools/index.tsx @@ -70,7 +70,7 @@ const ToolsPage: FC = ({ tools }) => { return (