@apify/docs-theme 1.0.26 → 1.0.28

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@apify/docs-theme",
-  "version": "1.0.26",
+  "version": "1.0.28",
   "description": "",
   "main": "./src/index.js",
   "files": [

package/src/theme/Logo/index.js

@@ -0,0 +1,61 @@
+import React from 'react';
+import Link from '@docusaurus/Link';
+import useBaseUrl from '@docusaurus/useBaseUrl';
+import useDocusaurusContext from '@docusaurus/useDocusaurusContext';
+import { useThemeConfig } from '@docusaurus/theme-common';
+import ThemedImage from '@theme/ThemedImage';
+
+function LogoThemedImage({ logo, alt, imageClassName }) {
+    const sources = {
+        light: useBaseUrl(logo.src),
+        dark: useBaseUrl(logo.srcDark || logo.src),
+    };
+    const themedImage = (
+        <ThemedImage
+            className={logo.className}
+            sources={sources}
+            height={logo.height}
+            width={logo.width}
+            alt={alt}
+            style={logo.style}
+        />
+    );
+    // Is this extra div really necessary?
+    // introduced in https://github.com/facebook/docusaurus/pull/5666
+    return imageClassName ? (
+        <div className={imageClassName}>{themedImage}</div>
+    ) : (
+        themedImage
+    );
+}
+export default function Logo(props) {
+    const {
+        siteConfig: { title },
+    } = useDocusaurusContext();
+    const {
+        navbar: { title: navbarTitle, logo },
+    } = useThemeConfig();
+    const { imageClassName, titleClassName, ...propsRest } = props;
+    const logoLink = useBaseUrl(logo?.href || '/');
+    // If visible title is shown, fallback alt text should be
+    // an empty string to mark the logo as decorative.
+    const fallbackAlt = navbarTitle ? '' : title;
+    // Use logo alt text if provided (including empty string),
+    // and provide a sensible fallback otherwise.
+    const alt = logo?.alt ?? fallbackAlt;
+    return (
+        <Link
+            to={logoLink}
+            {...propsRest}
+            {...(logo?.target && { target: logo.target })}>
+            {logo && (
+                <LogoThemedImage
+                    logo={logo}
+                    alt={alt}
+                    imageClassName={imageClassName}
+                />
+            )}
+            {!logo ? <b className={titleClassName}>{navbarTitle}</b> : null}
+        </Link>
+    );
+}

package/src/theme/custom.css

@@ -361,6 +361,11 @@ html.plugin-docs .theme-doc-markdown {
     line-height: 32px;
 }
 
+html.plugin-docs .theme-doc-markdown img {
+    display: block;
+    margin: 0 auto;
+}
+
 html.plugin-docs .theme-doc-markdown h1 {
     font-weight: 600;
     font-size: 48px;