mirror of
https://github.com/toeverything/AFFiNE.git
synced 2024-11-27 17:32:37 +03:00
fix: the exported pdf has part white background in dark mode (#3408)
This commit is contained in:
xiaodong zuo
GitHub
parent
a3d665503f
commit
af4e860176
@ -1,5 +1,4 @@
|
||||
import { Content, displayFlex } from '@affine/component';
|
||||
import { AffineWatermark } from '@affine/component/affine-watermark';
|
||||
import { appSidebarResizingAtom } from '@affine/component/app-sidebar';
|
||||
import { BlockHubWrapper } from '@affine/component/block-hub';
|
||||
import { NotificationCenter } from '@affine/component/notification-center';
|
||||
@ -260,7 +259,6 @@ export const WorkspaceLayoutInner: FC<PropsWithChildren> = ({ children }) => {
|
||||
<BlockHubWrapper blockHubAtom={rootBlockHubAtom} />
|
||||
<HelpIsland showList={pageId ? undefined : showList} />
|
||||
</ToolContainer>
|
||||
<AffineWatermark />
|
||||
</MainContainer>
|
||||
</AppContainer>
|
||||
<PageListTitleCellDragOverlay />
|
||||
|
||||
@ -40,16 +40,15 @@ export async function savePDFFileAs(
|
||||
|
||||
await BrowserWindow.getFocusedWindow()
|
||||
?.webContents.printToPDF({
|
||||
margins: {
|
||||
marginType: 'custom',
|
||||
top: 0,
|
||||
bottom: 0,
|
||||
left: 0,
|
||||
right: 0,
|
||||
},
|
||||
pageSize: 'A4',
|
||||
margins: {
|
||||
bottom: 0.5,
|
||||
},
|
||||
printBackground: true,
|
||||
landscape: false,
|
||||
displayHeaderFooter: true,
|
||||
headerTemplate: '<div></div>',
|
||||
footerTemplate: getFootTemple(),
|
||||
})
|
||||
.then(data => {
|
||||
fs.writeFile(filePath, data, error => {
|
||||
@ -65,3 +64,27 @@ export async function savePDFFileAs(
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
function getFootTemple(): string {
|
||||
const logo = `
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="53" height="12" viewBox="0 0 53 12" fill="none">
|
||||
<path d="M18.9256 0.709372C18.8749 0.504937 18.6912 0.361572 18.4807 0.361572H17.77C17.5595 0.361572 17.3758 0.504937 17.3252 0.709372L14.9153 10.4283C14.8438 10.7172 15.0621 10.9965 15.3601 10.9965H15.6052C15.8183 10.9965 16.0033 10.8497 16.0513 10.6423L16.5646 8.43721C16.6127 8.22974 16.7976 8.08291 17.0107 8.08291H19.2396C19.4527 8.08291 19.6376 8.22974 19.6857 8.43721L20.199 10.6423C20.247 10.8497 20.432 10.9965 20.6451 10.9965H20.8902C21.1878 10.9965 21.4065 10.7172 21.335 10.4283L18.9251 0.709372H18.9256ZM18.7891 7.0629H17.4616C17.1666 7.0629 16.9483 6.7883 17.0155 6.50113L17.9025 2.23181C17.9575 1.99576 18.2936 1.99576 18.3486 2.23181L19.2357 6.50113C19.3024 6.7883 19.0845 7.0629 18.7896 7.0629H18.7891Z" fill="black" fill-opacity="0.1"/>
|
||||
<path d="M36.2654 5.00861H30.766C30.5131 5.00861 30.3078 4.8033 30.3078 4.55036V2.25132C30.3078 1.77055 30.6976 1.38074 31.1783 1.38074H33.8997C34.1526 1.38074 34.3579 1.17544 34.3579 0.922494V0.818977C34.3579 0.566031 34.1526 0.36073 33.8997 0.36073H30.8539C29.8924 0.36073 29.1132 1.14036 29.1132 2.10146V5.00774H24.2171C23.9642 5.00774 23.7589 4.80244 23.7589 4.54949V2.25046C23.7589 1.76969 24.1487 1.37988 24.6295 1.37988H27.3508C27.6038 1.37988 27.8091 1.17457 27.8091 0.921628V0.818111C27.8091 0.565165 27.6038 0.359863 27.3508 0.359863H24.3051C23.3435 0.359863 22.5643 1.13949 22.5643 2.1006V10.5366C22.5643 10.7895 22.7696 10.9948 23.0226 10.9948H23.3011C23.554 10.9948 23.7593 10.7895 23.7593 10.5366V6.48513C23.7593 6.23219 23.9646 6.02689 24.2176 6.02689H29.1136V10.5366C29.1136 10.7895 29.3189 10.9948 29.5719 10.9948H29.8504C30.1033 10.9948 30.3086 10.7895 30.3086 10.5366V6.48513C30.3086 6.23219 30.5139 6.02689 30.7669 6.02689H35.9713C36.4521 6.02689 36.8419 6.4167 36.8419 6.89747V10.5418C36.8419 10.7947 37.0472 11 37.3001 11H37.5492C37.8021 11 38.0074 10.7947 38.0074 10.5418V6.74804C38.0074 5.7865 37.2278 5.00731 36.2667 5.00731L36.2654 5.00861Z" fill="black" fill-opacity="0.1"/>
|
||||
<path d="M45.2871 0.361517H45.0363C44.7838 0.361517 44.5789 0.565953 44.5781 0.818032L44.5504 9.53946L42.0512 0.695024C41.9954 0.497519 41.8156 0.361517 41.6103 0.361517H40.521C40.268 0.361517 40.0627 0.566819 40.0627 0.819765V10.5387C40.0627 10.7916 40.268 10.9969 40.521 10.9969H40.7718C41.0243 10.9969 41.2292 10.7925 41.23 10.5404L41.2577 1.81899L43.7569 10.6634C43.8128 10.8609 43.9925 10.9969 44.1978 10.9969H45.2871C45.5401 10.9969 45.7454 10.7916 45.7454 10.5387V0.819331C45.7454 0.566386 45.5401 0.361084 45.2871 0.361084V0.361517Z" fill="black" fill-opacity="0.1"/>
|
||||
<path d="M49.2307 1.3811H51.8212C52.0741 1.3811 52.2794 1.17579 52.2794 0.922849V0.819331C52.2794 0.566386 52.0741 0.361084 51.8212 0.361084H48.9214C47.9599 0.361084 47.1807 1.14071 47.1807 2.10182V9.25489C47.1807 10.2164 47.9603 10.9956 48.9214 10.9956H51.8212C52.0741 10.9956 52.2794 10.7903 52.2794 10.5374V10.4339C52.2794 10.1809 52.0741 9.97562 51.8212 9.97562H49.2307C48.7499 9.97562 48.3601 9.5858 48.3601 9.10503V6.33996C48.3601 6.08701 48.5654 5.88171 48.8183 5.88171H51.6752C51.9282 5.88171 52.1335 5.67641 52.1335 5.42346V5.31994C52.1335 5.067 51.9282 4.8617 51.6752 4.8617H48.8183C48.5654 4.8617 48.3601 4.65639 48.3601 4.40345V2.24995C48.3601 1.76918 48.7499 1.37936 49.2307 1.37936V1.3811Z" fill="black" fill-opacity="0.1"/>
|
||||
<path d="M37.3088 1.65787C37.1052 1.4543 36.7583 1.54742 36.6838 1.82549L36.3473 3.08199C36.2728 3.35962 36.527 3.61387 36.8051 3.5398L38.0616 3.20326C38.3396 3.12876 38.4323 2.7814 38.2292 2.57826L37.3097 1.65873L37.3088 1.65787Z" fill="black" fill-opacity="0.1"/>
|
||||
<path d="M11.9043 9.92891C11.8624 9.85125 11.3139 8.91339 11.2674 8.82602C9.92288 6.49855 7.98407 3.13718 6.64195 0.814557C6.37775 0.29657 5.6448 0.286862 5.36882 0.795141C3.92685 3.2932 1.71414 7.12436 0.274242 9.6193C0.214607 9.72505 0.118915 9.88037 0.0617076 9.99687C-0.035025 10.2063 -0.0163025 10.4677 0.10574 10.6608C0.238877 10.8858 0.502032 11.0165 0.759985 11.0027H0.8269C2.06986 11.0009 9.86983 11.0048 11.2844 11.0027C11.8329 11.0041 12.1779 10.4022 11.904 9.92926L11.9043 9.92891ZM6.09068 1.66053C6.91793 3.09661 7.8967 4.79099 8.85535 6.45036C8.47016 6.21355 8.05792 6.02875 7.6169 5.91711C7.49763 5.89007 7.04136 5.83529 6.94289 5.83113C6.9207 5.82939 6.89851 5.82835 6.87598 5.82835H5.12474C4.97288 5.82835 4.82622 5.86753 4.69655 5.93757C4.53325 5.14845 4.68199 4.26468 4.8914 3.51683C4.90978 3.45269 4.92954 3.38889 4.9493 3.3251C5.29636 2.7239 5.62366 2.15737 5.91073 1.65984C5.95095 1.5905 6.0508 1.59084 6.09068 1.65984V1.66053ZM6.15412 8.25707C6.15412 8.25707 6.12327 8.30492 6.09692 8.34583C6.07161 8.37079 6.03728 8.38535 5.99984 8.38535C5.94956 8.38535 5.90484 8.35935 5.87988 8.31601L5.03841 6.85809C5.03841 6.85809 5.0124 6.80747 4.98987 6.76413C4.98085 6.72946 4.98571 6.69271 5.00408 6.66046C5.02905 6.61712 5.07412 6.59112 5.12404 6.59112H6.80733C6.80733 6.59112 6.86419 6.59389 6.91308 6.59632C6.9474 6.60568 6.97722 6.62822 6.99559 6.66046C7.02056 6.7038 7.02056 6.75581 6.99559 6.79915L6.15378 8.25707H6.15412ZM1.12681 9.94521C1.30502 9.63733 1.53766 9.23653 1.5914 9.14084C2.1971 8.09169 3.04585 6.62163 3.89252 5.15539C3.88004 5.60715 3.92616 6.05684 4.04993 6.49473C4.08599 6.61158 4.26697 7.03422 4.31274 7.12159C4.32591 7.14967 4.34256 7.17914 4.35851 7.20619L5.21939 8.69739C5.29532 8.8288 5.40245 8.93628 5.52796 9.01359C4.92607 9.54961 4.08634 9.86269 3.33397 10.0551C3.27191 10.0707 3.20916 10.0849 3.14675 10.0988C2.34827 10.0988 1.66837 10.0995 1.21695 10.1009C1.13651 10.1009 1.08659 10.0142 1.12681 9.94486V9.94521ZM10.7834 10.1016C9.65661 10.1026 7.37212 10.1005 5.25475 10.0995C5.65139 9.88453 6.01683 9.62034 6.33337 9.29478C6.41624 9.20498 6.69222 8.83712 6.74492 8.75391C6.7626 8.72825 6.77994 8.69913 6.79519 8.67208L7.65608 7.18088C7.73201 7.04947 7.77153 6.90281 7.77569 6.75546C8.54089 7.00856 9.23188 7.57925 9.77449 8.13468C9.82129 8.18322 9.86706 8.23245 9.91248 8.28203C10.2464 8.86035 10.5695 9.41994 10.8729 9.9459C10.9127 10.0152 10.8632 10.1019 10.7831 10.1019L10.7834 10.1016Z" fill="black" fill-opacity="0.1"/>
|
||||
</svg>
|
||||
`;
|
||||
|
||||
const footerTemp = `
|
||||
<div style="font-size: 14px; width: 100%; display: flex; justify-content: flex-end; margin-right: 40px;">
|
||||
<a href="https://affine.pro" style="display: flex; text-decoration: none; color: rgba(0, 0, 0, 0.1);">
|
||||
<span>Created with</span>
|
||||
<div style="display: flex; align-items: center;">${logo}</div>
|
||||
</a>
|
||||
</div>
|
||||
`;
|
||||
|
||||
return footerTemp;
|
||||
}
|
||||
|
||||
@ -1,32 +0,0 @@
|
||||
import { style } from '@vanilla-extract/css';
|
||||
|
||||
export const waterMarkStyle = style({
|
||||
display: 'none',
|
||||
'@media': {
|
||||
print: {
|
||||
position: 'fixed',
|
||||
bottom: '0',
|
||||
right: '20px',
|
||||
zIndex: 100,
|
||||
display: 'block',
|
||||
width: 'auto',
|
||||
filter: 'opacity(20%)',
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
export const linkStyle = style({
|
||||
textAlign: 'left',
|
||||
color: 'black',
|
||||
display: 'flex',
|
||||
flexDirection: 'row',
|
||||
justifyContent: 'flex-end',
|
||||
alignItems: 'center',
|
||||
width: '200px',
|
||||
});
|
||||
export const linkTextStyle = style({
|
||||
whiteSpace: 'nowrap',
|
||||
});
|
||||
export const iconStyle = style({
|
||||
fontSize: '20px',
|
||||
});
|
||||
@ -1,19 +0,0 @@
|
||||
import { useAFFiNEI18N } from '@affine/i18n/hooks';
|
||||
import clsx from 'clsx';
|
||||
|
||||
import { linkStyle, linkTextStyle, waterMarkStyle } from './index.css';
|
||||
import { AffineLogoIcon } from './logo';
|
||||
|
||||
export const AffineWatermark = () => {
|
||||
const t = useAFFiNEI18N();
|
||||
return (
|
||||
<div className={clsx()}>
|
||||
<div data-testid="affine-watermark" className={clsx(waterMarkStyle)}>
|
||||
<a className={linkStyle} href="https://affine.pro">
|
||||
<div className={linkTextStyle}>{t['Created with']()}</div>
|
||||
<AffineLogoIcon />
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
@ -1,22 +0,0 @@
|
||||
export const AffineLogoIcon = () => {
|
||||
return (
|
||||
<svg
|
||||
id="Layer_2"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 1459.61 470"
|
||||
>
|
||||
<g id="_6_export">
|
||||
<path
|
||||
id="logo-black"
|
||||
d="m404.14,350.34c-5.95-10.33-15.86-27.48-25.65-44.42-2.97-5.14-5.92-10.25-8.75-15.15-5.82-10.08-11.12-19.27-14.9-25.83-26.23-45.33-77.87-135.08-103.67-179.46-7.95-12.37-26.37-11.39-33.21,1.42-7.76,13.45-16.3,28.24-25.32,43.87-2.86,4.96-5.78,10.01-8.73,15.12-37.58,65.08-81.56,141.26-112.89,195.52-1.6,2.9-4.58,7.63-6.07,10.76-2.61,5.65-2.1,12.69,1.19,17.91,3.71,6.18,10.65,9.57,17.74,9.22,8.53,0,26.62-.01,50.01,0,5.55,0,11.4,0,17.49,0,81.33,0,205.57.05,236.06,0,14.81.03,24.1-16.21,16.72-28.97Zm-175.07-57.64l-14.97-25.93c-2.63-4.56.66-10.26,5.92-10.26h29.94c5.27,0,8.56,5.7,5.92,10.26l-14.97,25.93c-2.63,4.56-9.21,4.56-11.85,0Zm-25.08-48.29c-1.24-3.16-2.31-6.37-3.19-9.63l49.53,9.63h-46.34Zm22.62,68.22c-2.11,2.66-4.36,5.19-6.74,7.59l-16.43-47.71,23.16,40.12Zm47.78-53.7c3.35.5,6.67,1.19,9.93,2.05l-33.1,38.08,23.17-40.13Zm-76.64-40.4c-.53-4.82-.76-9.69-.74-14.57l65.41,31.91-64.68-17.33Zm-7.76,47.77l17.32,64.65c-3.91,2.87-8.01,5.51-12.25,7.93l-5.08-72.58Zm109.93.17c4.44,1.95,8.77,4.19,12.99,6.65l-60.34,40.7,47.35-47.35Zm-101.41-83.09c1.2-8.86,3.05-17.59,5.29-25.96l99.37,86.38-104.65-60.42Zm-22.02,164.51c-8.27,3.39-16.75,6.15-25.12,8.39l25.12-129.23v120.84Zm153.49-63.19c7.07,5.47,13.71,11.44,19.84,17.56l-124.49,42.86,104.65-60.42Zm-90.64-175.85c18.32,31.79,44.92,77.89,70.26,121.77l-94.61-94.61c5.56-9.62,10.83-18.75,15.69-27.18,1.93-3.33,6.73-3.33,8.66,0Zm-147.77,240.92c5.21-8.99,12.37-21.32,13.96-24.16,15.08-26.12,35.39-61.29,56.37-97.63l-34.65,129.3c-12.41,0-23.11,0-31.35,0-3.85,0-6.26-4.17-4.33-7.5Zm282.54,7.53c-28.89,0-84.98,0-140.67,0l129.31-34.65c6.78,11.74,12.21,21.14,15.69,27.16,1.93,3.33-.48,7.49-4.32,7.49Z"
|
||||
/>
|
||||
<rect fill="none" width="1459.61" height="470" />
|
||||
<path d="m594.24,116.6c-1.17-4.72-5.41-8.03-10.27-8.03h-16.41c-4.86,0-9.1,3.31-10.27,8.03l-55.64,224.39c-1.65,6.67,3.39,13.12,10.27,13.12h5.66c4.92,0,9.19-3.39,10.3-8.18l11.85-50.91c1.11-4.79,5.38-8.18,10.3-8.18h51.46c4.92,0,9.19,3.39,10.3,8.18l11.85,50.91c1.11,4.79,5.38,8.18,10.3,8.18h5.66c6.87,0,11.92-6.45,10.27-13.12l-55.64-224.39Zm-3.15,146.69h-30.65c-6.81,0-11.85-6.34-10.3-12.97l20.48-98.57c1.27-5.45,9.03-5.45,10.3,0l20.48,98.57c1.54,6.63-3.49,12.97-10.3,12.97Z" />
|
||||
<path d="m994.58,215.86h-126.97c-5.84,0-10.58-4.74-10.58-10.58v-53.08c0-11.1,9-20.1,20.1-20.1h62.83c5.84,0,10.58-4.74,10.58-10.58v-2.39c0-5.84-4.74-10.58-10.58-10.58h-70.32c-22.2,0-40.19,18-40.19,40.19v67.1h-113.04c-5.84,0-10.58-4.74-10.58-10.58v-53.08c0-11.1,9-20.1,20.1-20.1h62.83c5.84,0,10.58-4.74,10.58-10.58v-2.39c0-5.84-4.74-10.58-10.58-10.58h-70.32c-22.2,0-40.19,18-40.19,40.19v194.77c0,5.84,4.74,10.58,10.58,10.58h6.43c5.84,0,10.58-4.74,10.58-10.58v-93.54c0-5.84,4.74-10.58,10.58-10.58h113.04v104.12c0,5.84,4.74,10.58,10.58,10.58h6.43c5.84,0,10.58-4.74,10.58-10.58v-93.54c0-5.84,4.74-10.58,10.58-10.58h120.16c11.1,0,20.1,9,20.1,20.1v84.14c0,5.84,4.74,10.58,10.58,10.58h5.75c5.84,0,10.58-4.74,10.58-10.58v-87.59c0-22.2-18-40.19-40.19-40.19Z" />
|
||||
<path d="m1202.87,108.57h-5.79c-5.83,0-10.56,4.72-10.58,10.54l-.64,201.36-57.7-204.2c-1.29-4.56-5.44-7.7-10.18-7.7h-25.15c-5.84,0-10.58,4.74-10.58,10.58v224.39c0,5.84,4.74,10.58,10.58,10.58h5.79c5.83,0,10.56-4.72,10.58-10.54l.64-201.36,57.7,204.2c1.29,4.56,5.44,7.7,10.18,7.7h25.15c5.84,0,10.58-4.74,10.58-10.58V119.14c0-5.84-4.74-10.58-10.58-10.58Z" />
|
||||
<path d="m1293.92,132.11h59.81c5.84,0,10.58-4.74,10.58-10.58v-2.39c0-5.84-4.74-10.58-10.58-10.58h-66.95c-22.2,0-40.19,18-40.19,40.19v165.15c0,22.2,18,40.19,40.19,40.19h66.95c5.84,0,10.58-4.74,10.58-10.58v-2.39c0-5.84-4.74-10.58-10.58-10.58h-59.81c-11.1,0-20.1-9-20.1-20.1v-63.84c0-5.84,4.74-10.58,10.58-10.58h65.96c5.84,0,10.58-4.74,10.58-10.58v-2.39c0-5.84-4.74-10.58-10.58-10.58h-65.96c-5.84,0-10.58-4.74-10.58-10.58v-49.72c0-11.1,9-20.1,20.1-20.1Z" />
|
||||
<path d="m1018.67,138.5c-4.7-4.7-12.71-2.55-14.43,3.87l-7.77,29.01c-1.72,6.41,4.15,12.28,10.57,10.57l29.01-7.77c6.42-1.72,8.56-9.74,3.87-14.43l-21.23-21.23Z" />
|
||||
</g>
|
||||
</svg>
|
||||
);
|
||||
};
|
||||
@ -1,3 +1,4 @@
|
||||
import { lightCssVariables } from '@toeverything/theme';
|
||||
import type { ComplexStyleRule } from '@vanilla-extract/css';
|
||||
import { globalStyle, style } from '@vanilla-extract/css';
|
||||
|
||||
@ -53,6 +54,12 @@ globalStyle(`html[data-theme="dark"] ${appStyle}`, {
|
||||
vars: {
|
||||
'--affine-noise-opacity': '0.1',
|
||||
},
|
||||
|
||||
'@media': {
|
||||
print: {
|
||||
vars: lightCssVariables,
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
export const mainContainerStyle = style({
|
||||
|
||||
Loading…
Reference in New Issue
Block a user