优化照片集缩放

components/NotionPage.js

@@ -33,6 +33,7 @@ const NotionPage = ({ post }) => {
   const zoom = isBrowser() && mediumZoom({
     container: '.notion-viewport',
     background: 'rgba(0, 0, 0, 0.2)',
+    scrollOffset: 200,
     margin: getMediumZoomMargin()
   })
 

styles/notion.css

@@ -207,6 +207,20 @@
 
 .medium-zoom-image--opened {
   z-index: 301;
+  /* width: auto !important; */
+}
+
+@media (max-width: 768px){
+    .medium-zoom-image--opened {
+        object-fit: fill !important;
+        height: auto !important;
+    }
+}
+
+@media (min-width: 768px){
+    .medium-zoom-image--opened {
+        object-fit: scale-down !important;
+    }
 }
 
 .notion-frame {