Skip to content

Translate TopNav #29

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 1 commit into from
Aug 29, 2023
Merged

Translate TopNav #29

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
44 changes: 22 additions & 22 deletions src/components/Layout/TopNav/TopNav.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,19 +2,19 @@
* Copyright (c) Facebook, Inc. and its affiliates.
*/

import {disableBodyScroll, enableBodyScroll} from 'body-scroll-lock';
import cn from 'classnames';
import NextLink from 'next/link';
import {useRouter} from 'next/router';
import * as React from 'react';
import {
useState,
useRef,
Suspense,
startTransition,
useCallback,
useEffect,
startTransition,
Suspense,
useRef,
useState,
} from 'react';
import * as React from 'react';
import cn from 'classnames';
import NextLink from 'next/link';
import {useRouter} from 'next/router';
import {disableBodyScroll, enableBodyScroll} from 'body-scroll-lock';

import {IconClose} from 'components/Icon/IconClose';
import {IconHamburger} from 'components/Icon/IconHamburger';
Expand Down Expand Up @@ -237,7 +237,7 @@ export default function TopNav({
<div className="3xl:flex-1 flex flex-row ">
<button
type="button"
aria-label="Menu"
aria-label="Valikko"
onClick={() => setIsOpen(!isOpen)}
className={cn(
'active:scale-95 transition-transform flex lg:hidden w-12 h-12 rounded-full items-center justify-center hover:bg-primary/5 hover:dark:bg-primary-dark/5 outline-link',
Expand Down Expand Up @@ -268,7 +268,7 @@ export default function TopNav({
)}
onClick={onOpenSearch}>
<IconSearch className="me-3 align-middle text-gray-30 shrink-0 group-betterhover:hover:text-gray-70" />
Search
Hae
<span className="ms-auto hidden sm:flex item-center me-1">
<Kbd data-platform="mac">⌘</Kbd>
<Kbd data-platform="win" wide>
Expand All @@ -281,25 +281,25 @@ export default function TopNav({
<div className="text-base justify-center items-center gap-1.5 flex 3xl:flex-1 flex-row 3xl:justify-end">
<div className="mx-2.5 gap-1.5 hidden lg:flex">
<NavItem isActive={section === 'learn'} url="/learn">
Learn
Opettele
</NavItem>
<NavItem
isActive={section === 'reference'}
url="/reference/react">
Reference
Viite
</NavItem>
<NavItem isActive={section === 'community'} url="/community">
Community
Yhteisö
</NavItem>
<NavItem isActive={section === 'blog'} url="/blog">
Blog
Blogi
</NavItem>
</div>
<div className="flex w-full md:hidden"></div>
<div className="flex items-center -space-x-2.5 xs:space-x-0 ">
<div className="flex md:hidden">
<button
aria-label="Search"
aria-label="Hae"
type="button"
className="active:scale-95 transition-transform flex md:hidden w-12 h-12 rounded-full items-center justify-center hover:bg-secondary-button hover:dark:bg-secondary-button-dark outline-link"
onClick={onOpenSearch}>
Expand All @@ -309,7 +309,7 @@ export default function TopNav({
<div className="flex dark:hidden">
<button
type="button"
aria-label="Use Dark Mode"
aria-label="Käytä tummaa tilaa"
onClick={() => {
window.__setPreferredTheme('dark');
}}
Expand All @@ -320,7 +320,7 @@ export default function TopNav({
<div className="hidden dark:flex">
<button
type="button"
aria-label="Use Light Mode"
aria-label="Käytä vaaleaa tilaa"
onClick={() => {
window.__setPreferredTheme('light');
}}
Expand Down Expand Up @@ -360,20 +360,20 @@ export default function TopNav({
<Suspense fallback={null}>
<div className="ps-3 xs:ps-5 xs:gap-0.5 xs:text-base overflow-x-auto flex flex-row lg:hidden text-base font-bold text-secondary dark:text-secondary-dark">
<NavItem isActive={section === 'learn'} url="/learn">
Learn
Opettele
</NavItem>
<NavItem
isActive={section === 'reference'}
url="/reference/react">
Reference
Viite
</NavItem>
<NavItem
isActive={section === 'community'}
url="/community">
Community
Yhteisö
</NavItem>
<NavItem isActive={section === 'blog'} url="/blog">
Blog
Blogi
</NavItem>
</div>
<div
Expand Down