fix(pdf): dynamic mark scaling #165
@ -6,10 +6,26 @@ const noScaleInit = {
|
|||||||
from: (_: number, v: number) => v
|
from: (_: number, v: number) => v
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const getInnerContentWidth = () => {
|
||||||
|
// Fetch the first container element we find
|
||||||
|
const element = document.querySelector('#content-preview')
|
||||||
|
|
||||||
|
if (element) {
|
||||||
|
const style = getComputedStyle(element)
|
||||||
|
|
||||||
|
// Calculate width without padding
|
||||||
|
const widthWithoutPadding =
|
||||||
|
element.clientWidth - parseFloat(style.padding) * 2
|
||||||
|
|
||||||
|
return widthWithoutPadding
|
||||||
|
}
|
||||||
|
|
||||||
|
// Default value
|
||||||
|
return 620
|
||||||
|
}
|
||||||
|
|
||||||
const useScaleImpl = () => {
|
const useScaleImpl = () => {
|
||||||
const [width, setWidth] = useState(
|
const [width, setWidth] = useState(getInnerContentWidth())
|
||||||
document.querySelector('#content-preview > *')?.clientWidth || 1
|
|
||||||
)
|
|
||||||
|
|
||||||
// Get the scale based on the original width
|
// Get the scale based on the original width
|
||||||
const scale = (originalWidth: number) => {
|
const scale = (originalWidth: number) => {
|
||||||
@ -26,16 +42,11 @@ const useScaleImpl = () => {
|
|||||||
return value * scale(originalWidth)
|
return value * scale(originalWidth)
|
||||||
}
|
}
|
||||||
|
|
||||||
useEffect(() => {
|
const resize = () => {
|
||||||
const resize = () => {
|
setWidth(getInnerContentWidth())
|
||||||
// Fetch the first container element we find
|
}
|
||||||
const element = document.querySelector('#content-preview > *')
|
|
||||||
|
|
||||||
// Set the width state
|
useEffect(() => {
|
||||||
if (element) {
|
|
||||||
setWidth(element.clientWidth)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
resize()
|
resize()
|
||||||
|
|
||||||
window.addEventListener('resize', resize)
|
window.addEventListener('resize', resize)
|
||||||
|
Loading…
Reference in New Issue
Block a user