forked from ionic-team/ionic-docs
-
Notifications
You must be signed in to change notification settings - Fork 22
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
# Conflicts: # .github/CODEOWNERS # .github/workflows/CI.yml # docs/angular/build-options.md # docs/react/testing/introduction.md # package-lock.json # renovate.json # scripts/data/translated-api.json # scripts/data/translated-cache.json # scripts/data/translated-cli.json # src/components/page/reference/ReleaseNotes/release-notes.json # src/styles/components/_doc-sidebar.scss # src/theme/DocItem/Layout/index.tsx # src/theme/NavbarItem/LocaleDropdownNavbarItem/styles.module.css # src/translate/.detection/cli/start.readme.md # src/translate/cli/start.readme.md # static/code/stackblitz/v6/react/index.html # static/code/stackblitz/v6/react/package-lock.json # static/code/stackblitz/v6/react/package.json # static/code/stackblitz/v6/vue/package-lock.json # static/code/stackblitz/v7/react/index.html # static/code/stackblitz/v7/react/package-lock.json # static/code/stackblitz/v7/react/package.json # static/code/stackblitz/v7/vue/package-lock.json # static/icons/arrow-forward-outline.svg
- Loading branch information
Showing
4 changed files
with
78 additions
and
5 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,73 @@ | ||
| /** | ||
| * Original source: | ||
| * @link https://github.com/facebook/docusaurus/blob/main/packages/docusaurus-theme-classic/src/theme/NavbarItem/LocaleDropdownNavbarItem/index.tsx | ||
| * | ||
| * Reasons for overriding: | ||
| * - Add a span with a visually hidden class in order to hide the text. We only want to show the language icon. | ||
| * - Removed the original styles that were applied to the language icon. We want to use our own styles. | ||
| */ | ||
|
|
||
| import React from 'react'; | ||
| import useDocusaurusContext from '@docusaurus/useDocusaurusContext'; | ||
| import { useAlternatePageUtils } from '@docusaurus/theme-common/internal'; | ||
| import { translate } from '@docusaurus/Translate'; | ||
| import { useLocation } from '@docusaurus/router'; | ||
| import DropdownNavbarItem from '@theme/NavbarItem/DropdownNavbarItem'; | ||
| import IconLanguage from '@theme/Icon/Language'; | ||
| import styles from './styles.module.css'; | ||
| export default function LocaleDropdownNavbarItem({ mobile, dropdownItemsBefore, dropdownItemsAfter, ...props }) { | ||
| const { | ||
| i18n: { currentLocale, locales, localeConfigs }, | ||
| } = useDocusaurusContext(); | ||
| const alternatePageUtils = useAlternatePageUtils(); | ||
| const { search, hash } = useLocation(); | ||
| const localeItems = locales.map((locale) => { | ||
| const baseTo = `pathname://${alternatePageUtils.createUrl({ | ||
| locale, | ||
| fullyQualified: false, | ||
| })}`; | ||
| // preserve ?search#hash suffix on locale switches | ||
| const to = `${baseTo}${search}${hash}`; | ||
| return { | ||
| label: localeConfigs[locale].label, | ||
| lang: localeConfigs[locale].htmlLang, | ||
| to, | ||
| target: '_self', | ||
| autoAddBaseUrl: false, | ||
| className: | ||
| // eslint-disable-next-line no-nested-ternary | ||
| locale === currentLocale | ||
| ? // Similar idea as DefaultNavbarItem: select the right Infima active | ||
| // class name. This cannot be substituted with isActive, because the | ||
| // target URLs contain `pathname://` and therefore are not NavLinks! | ||
| mobile | ||
| ? 'menu__link--active' | ||
| : 'dropdown__link--active' | ||
| : '', | ||
| }; | ||
| }); | ||
| const items = [...dropdownItemsBefore, ...localeItems, ...dropdownItemsAfter]; | ||
| // Mobile is handled a bit differently | ||
| const dropdownLabel = mobile | ||
| ? translate({ | ||
| message: 'Languages', | ||
| id: 'theme.navbar.mobileLanguageDropdown.label', | ||
| description: 'The label for the mobile language switcher dropdown', | ||
| }) | ||
| : localeConfigs[currentLocale].label; | ||
|
|
||
| return ( | ||
| <DropdownNavbarItem | ||
| {...props} | ||
| mobile={mobile} | ||
| label={ | ||
| <> | ||
| <IconLanguage /> | ||
| {/* CUSTOM CODE - added span in order to hide the text */} | ||
| <span className={styles.localeVisuallyHidden}>{dropdownLabel}</span> | ||
| </> | ||
| } | ||
| items={items} | ||
| /> | ||
| ); | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters