diff --git a/README.md b/README.md index 92df965..145815e 100755 --- a/README.md +++ b/README.md @@ -136,7 +136,12 @@ The following environment variables are supported in the build process: - `DATA_FILENAME`: The CV data to use, can be a relative or absolute path. - `OUT_DIR`: The output directory for the generated HTML file. - `THEME`: The theme to use, must be one of the directory name in `src/themes/`. -- `PRIMARY_COLOR`: The primary color to use, if not passed, it will be determined by the theme.The value of this environment variable should be a CSS color value, such as `#ff0000` for red. + +To customize the primary color of the theme, modify the --primary-color CSS variable in index.scss. +Note that making this change will result in unstaged changes in Git. If you want to build the HTML yourself, +it is recommended that you create a new project instead of editing the source code in jsoncv. +For instructions on how to do this, +please refer to the [Build a static CV site](#build-a-static-cv-site) section. ### Build a static CV site @@ -162,11 +167,11 @@ you can follow these steps: - Change all instances of `./src` to `./jsoncv/src`. - Change the value of `dataFilename` to your CV data file, for example `cv.json`. - Change `renderData.theme` to the theme you want to use. - - Change `renderData.primaryColor` to the primary color you want to use. 8. Copy `./jsoncv/index.html` to `index.html` and change all instances of `./src` to `./jsoncv/src`. + Then Copy `./jsoncv/index.scss` to `index.scss`. 9. Run `npm run build` to test if everything works. -After completing these steps, you can now add your own elements and styles to `index.html` +After completing these steps, you can now add your own elements and styles to `index.html` and `index.scss` to further customize your CV website. You can use HTML, CSS, and JavaScript to add your own branding, layout, and functionality to the site. diff --git a/index.html b/index.html index 67f83e9..63bf221 100644 --- a/index.html +++ b/index.html @@ -16,14 +16,7 @@ - +
diff --git a/index.scss b/index.scss new file mode 100644 index 0000000..da3ddc3 --- /dev/null +++ b/index.scss @@ -0,0 +1,3 @@ +:root { + --color-primary: #2A3FFB; +} diff --git a/vite.config.js b/vite.config.js index 1b167ae..d83935c 100644 --- a/vite.config.js +++ b/vite.config.js @@ -12,7 +12,6 @@ const outDir = process.env.OUT_DIR || 'dist' const data = require(dataFilename) const renderData = getRenderData(data) renderData.theme = process.env.THEME || 'reorx' -renderData.primaryColor = process.env.PRIMARY_COLOR renderData.isProduction = process.env.NODE_ENV === 'production' renderData.meta = { title: data.basics.name,