rename primary color template variables

index.html

@@ -18,8 +18,10 @@
   <link rel="stylesheet" href="/src/themes/<%= theme %>/index.scss">
   <style>
     :root {
-      /* override primary color */
-      <%= primaryColor.var %>: <%= primaryColor.value %>;
+      <% if (primaryColor) { %>
+        /* override primary color */
+        <%= varNamePrimaryColor %>: <%= primaryColor %>;
+      <% } %>
     }
   </style>
 </head>

src/themes/data.js

@@ -2,7 +2,7 @@ import { reformatDate } from '../lib/date';
 import { getIconSVG } from '../lib/icons';
 import { renderMarkdown } from '../lib/markdown';
 
-export const primaryColorVarName = '--color-primary'
+export const varNamePrimaryColor = '--color-primary'
 
 export function getRenderData(cvData) {
   return {
@@ -13,7 +13,8 @@ export function getRenderData(cvData) {
       getIconSVG,
       noSchemaURL,
       renderMarkdown,
-    }
+    },
+    varNamePrimaryColor,
   }
 }
 

src/themes/index.js

@@ -2,7 +2,7 @@ import ejs from 'ejs';
 
 import {
   getRenderData,
-  primaryColorVarName,
+  varNamePrimaryColor,
 } from './data';
 
 const themes = {}
@@ -50,5 +50,5 @@ export function renderThemeOn(name, el, data, primaryColor) {
   }
   elStyle.innerHTML = theme.style
 
-  document.documentElement.style.setProperty(primaryColorVarName, primaryColor)
+  document.documentElement.style.setProperty(varNamePrimaryColor, primaryColor)
 }

vite.config.js

@@ -4,10 +4,7 @@ import { ViteEjsPlugin } from 'vite-plugin-ejs';
 import { viteSingleFile } from 'vite-plugin-singlefile';
 
 import { TransformEjs } from './src/lib/vite-plugins';
-import {
-  getRenderData,
-  primaryColorVarName,
-} from './src/themes/data';
+import { getRenderData } from './src/themes/data';
 
 const dataFilename = process.env.DATA_FILENAME || './sample.cv.json'
 const outDir = process.env.OUT_DIR || 'dist'
@@ -15,10 +12,7 @@ const outDir = process.env.OUT_DIR || 'dist'
 const data = require(dataFilename)
 const renderData = getRenderData(data)
 renderData.theme = process.env.THEME || 'reorx'
-renderData.primaryColor = {
-  var: primaryColorVarName,
-  value: process.env.PRIMARY_COLOR || '#2A3FFB'
-}
+renderData.primaryColor = process.env.PRIMARY_COLOR
 renderData.isProduction = process.env.NODE_ENV === 'production'
 renderData.meta = {
   title: data.basics.name,