Files
Emil_Shanayev_Resume/layouts/_default/baseof.html
T

113 lines
4.6 KiB
HTML

<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>{{ if .IsHome }}{{ .Site.Params.author }} — {{ .Site.Params.description }}{{ else }}{{ .Title }} | {{ .Site.Params.author }}{{ end }}</title>
{{ $css := resources.Get "css/main.css" }}
{{ if $css }}<link rel="stylesheet" href="{{ $css.RelPermalink }}">{{ end }}
</head>
<body class="bg-slate-950 text-slate-100 min-h-screen">
<div class="h-px bg-gradient-to-r from-blue-600 via-cyan-400 to-blue-600"></div>
<nav class="sticky top-0 z-10 bg-slate-950/80 backdrop-blur border-b border-slate-800/60 px-8 py-3 flex items-center justify-between">
<span class="text-sm font-mono text-slate-500 tracking-wide">{{ .Site.Params.author }}</span>
<button id="pdf-btn" onclick="downloadPDF()"
class="text-xs text-slate-500 hover:text-white transition-colors px-3 py-1.5 rounded border border-slate-700 hover:border-slate-500 cursor-pointer">
Download PDF
</button>
</nav>
<main id="resume-main" class="max-w-3xl mx-auto px-6 py-14">
{{ block "main" . }}{{ end }}
</main>
<script src="https://cdnjs.cloudflare.com/ajax/libs/html2pdf.js/0.10.1/html2pdf.bundle.min.js" defer></script>
<script>
function downloadPDF() {
const btn = document.getElementById('pdf-btn');
btn.textContent = 'Generating…';
btn.disabled = true;
html2pdf().set({
margin: [14, 18, 14, 18],
filename: 'Emil_Shanayev_Resume.pdf',
image: { type: 'png' },
html2canvas: {
scale: 2.5,
useCORS: true,
onclone: (doc) => {
// Inject a stylesheet — inline styles lose to !important in our CSS,
// but a later <style> tag wins the cascade.
const style = doc.createElement('style');
style.textContent = `
body {
background: #ffffff !important;
background-image: none !important;
color: #0f172a !important;
min-height: auto !important;
}
#resume-main {
max-width: none !important;
margin: 0 !important;
padding: 0 !important;
background: #ffffff !important;
}
h1 {
background-image: none !important;
-webkit-background-clip: unset !important;
background-clip: unset !important;
-webkit-text-fill-color: #0f172a !important;
color: #0f172a !important;
}
header { border-color: #e2e8f0 !important; }
header p { color: #475569 !important; }
header span {
background: #eff6ff !important;
border-color: #bfdbfe !important;
color: #1d4ed8 !important;
}
header a {
background: transparent !important;
border: none !important;
color: #1d4ed8 !important;
padding: 0 !important;
font-size: 0.8rem !important;
}
.resume-content h2 {
color: #1d4ed8 !important;
background: #eff6ff !important;
border-color: #1d4ed8 !important;
box-shadow: none !important;
margin-left: 0 !important;
border-radius: 0.25rem !important;
}
.resume-content h3 { color: #1e293b !important; }
.resume-content p { color: #334155 !important; }
.resume-content li { color: #334155 !important; }
.resume-content li::marker { color: #1d4ed8 !important; }
.resume-content strong { color: #0f172a !important; }
.resume-content a { color: #1d4ed8 !important; }
.resume-content code { background: #f1f5f9 !important; color: #1d4ed8 !important; }
.resume-content hr { border-color: #e2e8f0 !important; }
.skills-grid span {
background: #eff6ff !important;
border-color: #bfdbfe !important;
color: #1d4ed8 !important;
}
`;
doc.head.appendChild(style);
}
},
jsPDF: { unit: 'mm', format: 'a4', orientation: 'portrait' },
pagebreak: { mode: 'css' }
})
.from(document.getElementById('resume-main'))
.save()
.then(() => {
btn.textContent = 'Download PDF';
btn.disabled = false;
});
}
</script>
</body>
</html>