gitadmin
/
jsoncv
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

preview: inject style tag for cv-base.css manually to make downloaded preview work 

vite does not inject style tag, therefore <link rel=stylesheet> does not work in the downloaded HTML
This commit is contained in:
Reorx 2023-02-14 17:03:36 +08:00
parent 1ff558826c
commit eed3ffb6a6
4 changed files with 17 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
src/lib/utils.js
View File

@ -71,3 +71,13 @@ export function downloadIframeHTML(filename, iframe) {
a.click();
document.body.removeChild(a)
}
export function upsertStyleTag(styleId, content) {
let elStyle = document.getElementById(styleId)
if (!elStyle) {
elStyle = document.createElement('style')
elStyle.id = styleId
document.head.appendChild(elStyle)
}
elStyle.innerHTML = content
}

1
src/preview/index.html
View File

@ -3,7 +3,6 @@
<head>
<meta charset="UTF-8">
<title>CV</title>
<link rel="stylesheet" href="../scss/cv-base.css">
</head>
<body>
<div class="cv-container"></div>

5
src/preview/main.js
View File

@ -3,6 +3,8 @@ import {
getCVSavedTime,
getPrimaryColor,
} from '../lib/store';
import { upsertStyleTag } from '../lib/utils';
import cvBaseStyle from '../scss/cv-base.css?inline';
import { renderThemeOn } from '../themes';
import { getCVTitle } from '../themes/data';
@ -34,7 +36,10 @@ const restoreScrollPosition = () => {
// Render CV
const data = getCVData()
if (data) {
upsertStyleTag('base-style', cvBaseStyle)
renderThemeOn(themeName, elCV, data, getPrimaryColor())
// change document title
document.title = getCVTitle(data)
// restore scroll position

8
src/themes/index.js
View File

@ -1,5 +1,6 @@
import ejs from 'ejs';
import { upsertStyleTag } from '../lib/utils';
import {
getRenderData,
varNamePrimaryColor,
@ -43,12 +44,7 @@ export function renderThemeOn(name, el, data, primaryColor) {
const theme = getTheme(name)
el.innerHTML = renderTheme(theme.template, data)
let elStyle = document.getElementById(cvStyleId)
if (!elStyle) {
elStyle = document.createElement('style')
document.head.appendChild(elStyle)
}
elStyle.innerHTML = theme.style
upsertStyleTag(cvStyleId, theme.style)
document.documentElement.style.setProperty(varNamePrimaryColor, primaryColor)
}