feat: use docusaurus-plugin-image-zoom to add zoomable images (#1689)

Utilizes `docusaurus-plugin-image-zoom` to add a simple zoom feature on
all post images.

Author: barjin

apify-docs-theme/src/theme/custom.css

@@ -957,7 +957,7 @@ div[class*="searchBox"] {
     .menu__link.icon::before {
         display: none;
     }
-    
+
     .navbar__inner .navbar__item.navbar__link.icon {
         display: none;
     }
@@ -1980,3 +1980,7 @@ div[class^="navbarSearchContainer"] {
         position: static;
     }
 }
+
+.medium-zoom-image--opened {
+    z-index: 999;
+}

docusaurus.config.js

@@ -127,6 +127,7 @@ module.exports = {
         ],
     ]),
     plugins: [
+        'docusaurus-plugin-image-zoom',
         [
             '@docusaurus/plugin-content-docs',
             {
@@ -307,6 +308,9 @@ module.exports = {
                 'http', 'bash', 'ruby', 'java', 'scala', 'go', 'csharp', 'powershell', 'dart', 'objectivec', 'ocaml', 'r',
             ],
         },
+        zoom: {
+            selector: '.markdown img:not(a img)',
+        },
         languageTabs: [
             {
                 highlight: 'bash',

package-lock.json

@@ -59,8 +59,8 @@
         "globby": "^14.0.0",
         "markdownlint": "^0.38.0",
         "markdownlint-cli": "^0.45.0",
-        "path-browserify": "^1.0.1",
         "patch-package": "^8.0.0",
+        "path-browserify": "^1.0.1",
         "rimraf": "^6.0.0",
         "typescript": "5.8.3",
         "typescript-eslint": "^8.29.1"
@@ -80,6 +80,7 @@
         "@redocly/cli": "^1.27.1",
         "ajv": "^8.17.1",
         "clsx": "^2.0.0",
+        "docusaurus-plugin-image-zoom": "^3.0.1",
         "docusaurus-plugin-openapi-docs": "^4.3.7",
         "docusaurus-theme-openapi-docs": "^4.3.7",
         "form-data": "^4.0.0",