Merge branch 'translation/jp'

# 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
ionic-jp · Nov 29, 2023 · c25bc41 · c25bc41
2 parents 11da5da + 9e67d57
commit c25bc41
Show file tree

Hide file tree

Showing 4 changed files with 78 additions and 5 deletions.
diff --git a/src/styles/components/_doc-sidebar.scss b/src/styles/components/_doc-sidebar.scss
@@ -49,7 +49,7 @@ html[data-theme='dark'] {
         display: flex;
         align-items: center;
         height: var(--ifm-navbar-height);
-  
+
         padding-inline-start: var(--sidebar-spacing-horizontal);
         padding-inline-end: var(--sidebar-spacing-horizontal);
       }
@@ -159,7 +159,7 @@ html[data-theme='dark'] {
     align-items: center;
     flex-direction: row-reverse;
     justify-content: flex-end;
-  
+
     &::after {
       background: var(--ifm-menu-link-sublist-icon) center / var(--dropdown-icon-width) var(--dropdown-icon-height);
       background-repeat: no-repeat;
@@ -180,7 +180,7 @@ html[data-theme='dark'] {
     & > .menu__list-item-collapsible {
       .menu__link {
         color: var(--sidebar-category-c);
-  
+
         font-weight: 600;
         font-size: 0.938rem;
         line-height: 100%;

diff --git a/src/theme/NavbarItem/LocaleDropdownNavbarItem/index.js b/src/theme/NavbarItem/LocaleDropdownNavbarItem/index.js
@@ -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}
+    />
+  );
+}
diff --git a/src/translate/.detection/cli/start.readme.md b/src/translate/.detection/cli/start.readme.md
@@ -6,4 +6,4 @@ The first argument is your app's `name`. Don't worry--you can always change this
 
 The second argument is the `template` from which to generate your app. You can list all templates with the `--list` option. You can also specify a git repository URL for `template`, in which case the existing project will be cloned.
 
-Use the `--type` option to start projects using a different JavaScript Framework. Use `--list` to see all project types and templates.
+Use the `--type` option to start projects using a different JavaScript Framework. Use `--list` to see all project types and templates.
diff --git a/src/translate/cli/start.readme.md b/src/translate/cli/start.readme.md
@@ -6,4 +6,4 @@ The first argument is your app's `name`. Don't worry--you can always change this
 
 The second argument is the `template` from which to generate your app. You can list all templates with the `--list` option. You can also specify a git repository URL for `template`, in which case the existing project will be cloned.
 
-Use the `--type` option to start projects using a different JavaScript Framework. Use `--list` to see all project types and templates.
+Use the `--type` option to start projects using a different JavaScript Framework. Use `--list` to see all project types and templates.
Original file line number	Diff line number	Diff line change
Expand Up		@@ -6,4 +6,4 @@ The first argument is your app's `name`. Don't worry--you can always change this

		The second argument is the `template` from which to generate your app. You can list all templates with the `--list` option. You can also specify a git repository URL for `template`, in which case the existing project will be cloned.

		Use the `--type` option to start projects using a different JavaScript Framework. Use `--list` to see all project types and templates.
		Use the `--type` option to start projects using a different JavaScript Framework. Use `--list` to see all project types and templates.