diff --git a/project-words.txt b/project-words.txt index 6860a8bf88..1a9af60344 100644 --- a/project-words.txt +++ b/project-words.txt @@ -284,6 +284,7 @@ reponame requireindex retrocompatibility retrocompatible +rmiz roadmap rocketvalidator rtcts diff --git a/website/docs/advanced/architecture.md b/website/docs/advanced/architecture.md index 778b68eabd..07f5b8a646 100644 --- a/website/docs/advanced/architecture.md +++ b/website/docs/advanced/architecture.md @@ -7,7 +7,7 @@ description: How Docusaurus works to build your app ```mdx-code-block import Tabs from '@theme/Tabs'; import TabItem from '@theme/TabItem'; -import Zoom from '@site/src/components/Zoom'; +import Zoom from 'react-medium-image-zoom'; ``` diff --git a/website/package.json b/website/package.json index 61bbf69e5e..4e11dbe45b 100644 --- a/website/package.json +++ b/website/package.json @@ -59,7 +59,7 @@ "react": "^17.0.2", "react-dom": "^17.0.2", "react-lite-youtube-embed": "^2.3.1", - "react-medium-image-zoom": "^4.4.3", + "react-medium-image-zoom": "^5.0.2", "react-popper": "^2.3.0", "rehype-katex": "^6.0.2", "remark-math": "^3.0.1", diff --git a/website/src/components/Zoom/index.tsx b/website/src/components/Zoom/index.tsx deleted file mode 100644 index 165d43d16b..0000000000 --- a/website/src/components/Zoom/index.tsx +++ /dev/null @@ -1,29 +0,0 @@ -/** - * Copyright (c) Facebook, Inc. and its affiliates. - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - */ - -import React from 'react'; -import {useColorMode} from '@docusaurus/theme-common'; -import BasicZoom from 'react-medium-image-zoom'; -import 'react-medium-image-zoom/dist/styles.css'; - -export default function Zoom({ - children, -}: { - children: React.ReactNode; -}): JSX.Element { - const {colorMode} = useColorMode(); - return ( - - {children} - - ); -} diff --git a/website/src/css/custom.css b/website/src/css/custom.css index 2472601709..e6ad22bf5b 100644 --- a/website/src/css/custom.css +++ b/website/src/css/custom.css @@ -5,6 +5,8 @@ * LICENSE file in the root directory of this source tree. */ +@import 'react-medium-image-zoom/dist/styles.css'; + :root { /* See css var + hsl color palette technique: @@ -220,3 +222,11 @@ div[class^='announcementBar_'] { padding: 0 var(--ifm-pre-padding); border-left: 3px solid #ff000080; } + +[data-rmiz-modal-overlay='visible'] { + background-color: rgba(255 255 255 / 95%); +} + +[data-theme='dark'] [data-rmiz-modal-overlay='visible'] { + background-color: rgba(0 0 0 / 95%); +} diff --git a/website/testCSSOrder.mjs b/website/testCSSOrder.mjs index 62422e3d4e..aaa9b5b4bb 100644 --- a/website/testCSSOrder.mjs +++ b/website/testCSSOrder.mjs @@ -31,7 +31,6 @@ const EXPECTED_CSS_MARKERS = [ // See https://github.com/facebook/docusaurus/pull/6222 '.markdown>h2', '.button--outline.button--active', - '.DocSearch-Hit-content-wrapper', '--ifm-color-scheme:light', '.col[class*=col--]', '.padding-vert--xl', @@ -49,6 +48,7 @@ const EXPECTED_CSS_MARKERS = [ // Lazy-loaded lib '.DocSearch-Modal', + '.DocSearch-Hit-content-wrapper', ]; const cssDirName = fileURLToPath(new URL('build/assets/css', import.meta.url)); diff --git a/website/versioned_docs/version-2.0.1/advanced/architecture.md b/website/versioned_docs/version-2.0.1/advanced/architecture.md index 778b68eabd..07f5b8a646 100644 --- a/website/versioned_docs/version-2.0.1/advanced/architecture.md +++ b/website/versioned_docs/version-2.0.1/advanced/architecture.md @@ -7,7 +7,7 @@ description: How Docusaurus works to build your app ```mdx-code-block import Tabs from '@theme/Tabs'; import TabItem from '@theme/TabItem'; -import Zoom from '@site/src/components/Zoom'; +import Zoom from 'react-medium-image-zoom'; ``` diff --git a/website/versioned_docs/version-2.1.0/advanced/architecture.md b/website/versioned_docs/version-2.1.0/advanced/architecture.md index 778b68eabd..07f5b8a646 100644 --- a/website/versioned_docs/version-2.1.0/advanced/architecture.md +++ b/website/versioned_docs/version-2.1.0/advanced/architecture.md @@ -7,7 +7,7 @@ description: How Docusaurus works to build your app ```mdx-code-block import Tabs from '@theme/Tabs'; import TabItem from '@theme/TabItem'; -import Zoom from '@site/src/components/Zoom'; +import Zoom from 'react-medium-image-zoom'; ``` diff --git a/yarn.lock b/yarn.lock index c3c9b5941a..e28f3e4009 100644 --- a/yarn.lock +++ b/yarn.lock @@ -7657,11 +7657,6 @@ flux@^4.0.1: fbemitter "^3.0.0" fbjs "^3.0.1" -focus-options-polyfill@1.5.1: - version "1.5.1" - resolved "https://registry.yarnpkg.com/focus-options-polyfill/-/focus-options-polyfill-1.5.1.tgz#0f422580d9d1fb65651f2968b547032eb17dab3c" - integrity sha512-7yH20IePROHJLLbJvqqtsG420jE6DuukccapiB/WagtUpnc98r9NzHbX5rnjCDgdZqLgcqlzGjn+8l0Zb8Zf9w== - follow-redirects@^1.0.0, follow-redirects@^1.14.0, follow-redirects@^1.14.7: version "1.15.1" resolved "https://registry.yarnpkg.com/follow-redirects/-/follow-redirects-1.15.1.tgz#0ca6a452306c9b276e4d3127483e29575e207ad5" @@ -12669,13 +12664,10 @@ react-loadable-ssr-addon-v5-slorber@^1.0.1: dependencies: "@babel/runtime" "^7.10.3" -react-medium-image-zoom@^4.4.3: - version "4.4.3" - resolved "https://registry.yarnpkg.com/react-medium-image-zoom/-/react-medium-image-zoom-4.4.3.tgz#d5e3074becef7be4bfe35ebcd291eac462093bf5" - integrity sha512-I928Z6mEMRUup4CPa+XtASiSuFzdVb1ecztXpF7xAJddXv4XZSE4n5gleZNYCn5wEU1LQY5LiN4aNW4KgrOVIA== - dependencies: - focus-options-polyfill "1.5.1" - tslib "^2.4.0" +react-medium-image-zoom@^5.0.2: + version "5.0.2" + resolved "https://registry.yarnpkg.com/react-medium-image-zoom/-/react-medium-image-zoom-5.0.2.tgz#2ec051205e7bfc53759f8a3a1bfd1c594f96100c" + integrity sha512-DGdsNaixDgXnEFFpCV6YHJYG4VQOvzs3PHS3h+nfIV82GO0cWetXrBQFGA77DMGODe6DuBX2SQPqZAQVKpLdcw== react-popper@^2.3.0: version "2.3.0"