mirror of
https://github.com/AmruthPillai/Reactive-Resume.git
synced 2025-11-13 00:03:27 +10:00
fix issues with scrolling
This commit is contained in:
6
package-lock.json
generated
6
package-lock.json
generated
@ -16844,9 +16844,9 @@
|
||||
"integrity": "sha1-n5VxD1CiZ5R7LMwSR0HBAoQn5xM="
|
||||
},
|
||||
"uuid": {
|
||||
"version": "7.0.2",
|
||||
"resolved": "https://registry.npmjs.org/uuid/-/uuid-7.0.2.tgz",
|
||||
"integrity": "sha512-vy9V/+pKG+5ZTYKf+VcphF5Oc6EFiu3W8Nv3P3zIh0EqVI80ZxOzuPfe9EHjkFNvf8+xuTHVeei4Drydlx4zjw=="
|
||||
"version": "7.0.3",
|
||||
"resolved": "https://registry.npmjs.org/uuid/-/uuid-7.0.3.tgz",
|
||||
"integrity": "sha512-DPSke0pXhTZgoF/d+WSt2QaKMCFSfx7QegxEWT+JOuHF5aWrKEn0G+ztjuJg/gG8/ItK+rbPCD/yNv8yyih6Cg=="
|
||||
},
|
||||
"v8-compile-cache": {
|
||||
"version": "2.1.0",
|
||||
|
||||
@ -27,7 +27,7 @@
|
||||
"react-scripts": "3.4.1",
|
||||
"react-toastify": "^5.5.0",
|
||||
"tailwindcss": "^1.2.0",
|
||||
"uuid": "^7.0.2",
|
||||
"uuid": "^7.0.3",
|
||||
"vuepress": "^1.4.0"
|
||||
},
|
||||
"scripts": {
|
||||
|
||||
@ -4,7 +4,7 @@ const TabBar = ({ tabs, currentTab, setCurrentTab }) => {
|
||||
const tabsRef = useRef(null);
|
||||
|
||||
const scrollBy = x => {
|
||||
const index = tabs.find(tab => tab.key === currentTab);
|
||||
const index = tabs.findIndex(tab => tab.key === currentTab);
|
||||
tabsRef.current.scrollLeft += x;
|
||||
|
||||
if (x < 0 && index > 0) {
|
||||
@ -16,8 +16,6 @@ const TabBar = ({ tabs, currentTab, setCurrentTab }) => {
|
||||
}
|
||||
};
|
||||
|
||||
const wheelScrollBy = e => scrollBy(e.deltaY);
|
||||
|
||||
return (
|
||||
<div className="mx-4 mb-6 flex items-center">
|
||||
<div
|
||||
@ -27,7 +25,7 @@ const TabBar = ({ tabs, currentTab, setCurrentTab }) => {
|
||||
<i className="material-icons">chevron_left</i>
|
||||
</div>
|
||||
|
||||
<ul id="tabs" ref={tabsRef} className="flex overflow-x-scroll" onWheel={wheelScrollBy}>
|
||||
<ul id="tabs" ref={tabsRef} className="flex overflow-x-scroll">
|
||||
{tabs.map(tab =>
|
||||
currentTab === tab.key ? (
|
||||
<li key={tab.key} className="mx-1 list-none">
|
||||
|
||||
@ -110,12 +110,17 @@ const saveAsPdf = (pageRef, panZoomRef) => {
|
||||
|
||||
setTimeout(() => {
|
||||
html2canvas(pageRef.current, {
|
||||
scale: 5,
|
||||
scale: 6,
|
||||
useCORS: true,
|
||||
allowTaint: true,
|
||||
}).then(canvas => {
|
||||
const image = canvas.toDataURL('image/jpeg', 1.0);
|
||||
const doc = new jsPDF('p', 'mm', 'a4');
|
||||
const doc = new jsPDF({
|
||||
orientation: 'portrait',
|
||||
unit: 'px',
|
||||
format: [canvas.width, canvas.height],
|
||||
});
|
||||
|
||||
const pageWidth = doc.internal.pageSize.getWidth();
|
||||
const pageHeight = doc.internal.pageSize.getHeight();
|
||||
|
||||
@ -125,16 +130,15 @@ const saveAsPdf = (pageRef, panZoomRef) => {
|
||||
|
||||
const canvasWidth = canvas.width * ratio;
|
||||
const canvasHeight = canvas.height * ratio;
|
||||
|
||||
const marginX = (pageWidth - canvasWidth) / 2;
|
||||
const marginY = (pageHeight - canvasHeight) / 2;
|
||||
// const marginX = (pageWidth - canvasWidth) / 2;
|
||||
// const marginY = (pageHeight - canvasHeight) / 2;
|
||||
|
||||
panZoomRef.current.autoCenter(0.7);
|
||||
|
||||
doc.addImage(image, 'JPEG', marginX, marginY, canvasWidth, canvasHeight, null, 'SLOW');
|
||||
doc.addImage(image, 'JPEG', 0, 0, canvasWidth, canvasHeight, null, 'SLOW');
|
||||
doc.save(`RxResume_${Date.now()}.pdf`);
|
||||
});
|
||||
}, 250);
|
||||
}, 200);
|
||||
};
|
||||
|
||||
export {
|
||||
|
||||
Reference in New Issue
Block a user