d0zingcat/NotionNext
1
0
Fork 0
mirror of https://github.com/d0zingcat/NotionNext.git synced 2026-05-14 07:26:52 +00:00
Code Issues Packages Projects Releases Wiki Activity

theme heo wowjs

Browse Source
This commit is contained in:
tangly1024
2024-02-24 11:47:59 +08:00
parent a87446747b
commit 5b52bc2d7f
6 changed files with 56 additions and 50 deletions
Download Patch File Download Diff File Expand all files Collapse all files

49
hooks/useAdjustStyle.js
View File

@@ -1,33 +1,36 @@
import { isBrowser } from '@/lib/utils';
import { useEffect } from 'react';
/**
* 样式调整的补丁
*/
const useAdjustStyle = () => {
/**
/**
* 避免 callout 含有图片时溢出撑开父容器
*/
const adjustCalloutImg = () => {
const callOuts = document.querySelectorAll('.notion-callout-text');
callOuts.forEach((callout) => {
const images = callout.querySelectorAll('figure.notion-asset-wrapper.notion-asset-wrapper-image > div');
const calloutWidth = callout.offsetWidth;
images.forEach((container) => {
const imageWidth = container.offsetWidth;
if (imageWidth + 50 > calloutWidth) {
container.style.setProperty('width', '100%');
}
});
});
};
useEffect(() => {
if (isBrowser) {
adjustCalloutImg();
window.addEventListener('resize', adjustCalloutImg);
return () => {
window.removeEventListener('resize', adjustCalloutImg);
};
const adjustCalloutImg = () => {
const callOuts = document.querySelectorAll('.notion-callout-text');
callOuts.forEach((callout) => {
const images = callout.querySelectorAll('figure.notion-asset-wrapper.notion-asset-wrapper-image > div');
const calloutWidth = callout.offsetWidth;
images.forEach((container) => {
const imageWidth = container.offsetWidth;
if (imageWidth + 50 > calloutWidth) {
container.style.setProperty('width', '100%');
}
}, []);
});
});
};
useEffect(() => {
if (isBrowser) {
adjustCalloutImg();
window.addEventListener('resize', adjustCalloutImg);
return () => {
window.removeEventListener('resize', adjustCalloutImg);
};
}
}, []);
};
export default useAdjustStyle;