Added guide for saving as pdf
This commit is contained in:
parent
d6de99486c
commit
952cfa28bf
|
@ -1,4 +1,4 @@
|
||||||
<script>
|
<script lang="ts">
|
||||||
// Left side
|
// Left side
|
||||||
import NameAndImage from "../Comps/NameAndImage.svelte";
|
import NameAndImage from "../Comps/NameAndImage.svelte";
|
||||||
import ShortProfile from "../Comps/ShortProfile.svelte"
|
import ShortProfile from "../Comps/ShortProfile.svelte"
|
||||||
|
@ -18,8 +18,32 @@
|
||||||
|
|
||||||
// Cedit
|
// Cedit
|
||||||
import LinkToSource from "../Comps/LinkToSource.svelte";
|
import LinkToSource from "../Comps/LinkToSource.svelte";
|
||||||
|
|
||||||
|
// Print detection setup
|
||||||
|
import { onMount } from "svelte";
|
||||||
|
onMount(() => {
|
||||||
|
// Check if the query parameter exists in the URL
|
||||||
|
const urlParams = new URLSearchParams(window.location.search);
|
||||||
|
const hideOnPrintParam = urlParams.get('hideOnPrint');
|
||||||
|
|
||||||
|
// If the query parameter is not detected, reload the page with the parameter added
|
||||||
|
if (!hideOnPrintParam) {
|
||||||
|
window.location.href = `${window.location.href}?hideOnPrint=1`;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
<div class="cv-info-container hide-on-print">
|
||||||
|
<div>
|
||||||
|
Under here is my CV for an Epos application. This page has been able to be saved as PDF.
|
||||||
|
This can be done by pressing <div class="keyboard-key">P</div> + <div class="keyboard-key">CTRL</div>, then set scaling to 100% and no margins. Lastly, select save to PDF or print.
|
||||||
|
<br/>
|
||||||
|
<br/>
|
||||||
|
I have to sadly recommend chrome for this process. Firefox somehow messes with the quality of the PDF :(
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div class="cv-container-container include-in-print">
|
<div class="cv-container-container include-in-print">
|
||||||
<div class="cv-container sections decorations">
|
<div class="cv-container sections decorations">
|
||||||
<div id="left-section">
|
<div id="left-section">
|
||||||
|
@ -50,6 +74,35 @@
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<style lang="scss">
|
<style lang="scss">
|
||||||
|
.cv-info-container {
|
||||||
|
height: 40mm;
|
||||||
|
background-color: #2b2a2a;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.keyboard-key {
|
||||||
|
display: inline;
|
||||||
|
padding-left: 1mm;
|
||||||
|
padding-right: 1mm;
|
||||||
|
|
||||||
|
border-radius: 2mm;
|
||||||
|
|
||||||
|
background-color: #3e3d3d;
|
||||||
|
}
|
||||||
|
|
||||||
|
> div {
|
||||||
|
width: 80%;
|
||||||
|
height: 60%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media print {
|
||||||
|
.hide-on-print {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.cv-container-container{
|
.cv-container-container{
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
|
@ -127,9 +180,6 @@
|
||||||
|
|
||||||
// Disable interactivity for padding
|
// Disable interactivity for padding
|
||||||
pointer-events:none;
|
pointer-events:none;
|
||||||
> * {
|
|
||||||
pointer-events:all;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue