Updates and Fixes

Updated
  - ejs
  - got
  - handlebars
  - jsdom
  - snyk
  - prettier
  - stylelint
Fixed
  - Manrope font
Added
  - fs-extra

assets/index.css

@@ -1,9 +1,30 @@
+@charset "UTF-8";
+@font-face {
+  font-family: "Manrope VF";
+  src: url("/assets/fonts/variable/Manrope%5Bwght%5D.ttf")
+    format("truetype-variations");
+  font-style: normal;
+  font-weight: 200 800;
+}
+
+@font-face {
+  font-family: "Manrope";
+  src: url("/assets/fonts/web/manrope-bold.woff2") format("woff2"),
+    url("/assets/fonts/otf/manrope-bold.otf") format("opentype");
+  font-style: normal;
+  font-weight: 700;
+}
+
 body {
   align-items: center;
   background: var(--bg-color);
   color: var(--text-color);
-  font-family: "Manrope", sans-serif;
+  font-family: "Manrope VF", Manrope, sans-serif;
   font-feature-settings: "calt", "liga";
+  font-size: 64px;
+  font-variation-ligatures: normal;
+  font-variation-settings: "wght" 500;
+  font-weight: 700;
   margin: 0%;
   max-width: 100vw;
   overflow-x: hidden;
@@ -54,8 +75,11 @@ body {
 
 .footer a {
   color: var(--text-color) !important;
-  font-family: "Manrope", sans-serif;
-  font-weight: bold;
+  font-family: "Manrope VF", Manrope, sans-serif;
+  font-feature-settings: "calt", "liga";
+  font-variation-ligatures: normal;
+  font-variation-settings: "wght" 500;
+  font-weight: 700;
   text-decoration: none;
 }
 

assets/index.html

@@ -10,15 +10,11 @@
       href="https://fonts.googleapis.com/css?family=Asap|Asap+Condensed&display=swap"
       rel="stylesheet"
     />
-    <link
-      href="https://github.com/sharanda/manrope/raw/master/fonts/web/index.css"
-      rel="stylesheet"
-    />
     <script src="https://unpkg.com/magic-grid/dist/magic-grid.min.js"></script>
-    <script src="https://code.iconify.design/1/1.0.4/iconify.min.js"></script>
+    <script src="https://code.iconify.design/1/1.0.6/iconify.min.js"></script>
     <script
-      src="https://code.jquery.com/jquery-3.4.1.min.js"
-      integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo="
+      src="https://code.jquery.com/jquery-3.5.0.min.js"
+      integrity="sha256-xNzN2a4ltkB44Mc/Jz3pT4iU1cmeR0FkXs4pru/JxaQ="
       crossorigin="anonymous"
     ></script>
     <link rel="stylesheet" href="index.css" />
@@ -39,7 +35,7 @@
         <h1>Work.</h1>
         <div class="projects" id="work_section"></div>
       </div>
-      <div id="forks" style="display:none;">
+      <div id="forks" style="display: none;">
         <h1>Forks.</h1>
         <div class="projects" id="forks_section"></div>
       </div>

build.js

@@ -5,11 +5,14 @@ const bluebird = require("bluebird");
 const hbs = require("handlebars");
 //  Creates promise-returning async functions from callback-passed async functions
 const fs = bluebird.promisifyAll(require("fs"));
+const fse = require("fs-extra");
 const { updateHTML } = require("./populate");
 const { getConfig, outDir } = require("./utils");
 
 const assetDir = path.resolve(`${__dirname}/assets/`);
 const config = path.join(outDir, "config.json");
+const tempfont = path.resolve(assetDir, "fonts");
+const fonts = path.join(outDir, "assets/fonts");
 
 /**
  * Creates the stylesheet used by the site from a template stylesheet.
@@ -19,7 +22,7 @@ const config = path.join(outDir, "config.json");
  */
 async function populateCSS({
   theme = "light",
-  background = "https://source.unsplash.com/1280x720/?wallpaper"
+  background = "https://source.unsplash.com/1280x720/?wallpaper",
 } = {}) {
   // Get the theme the user requests. Defaults to 'light'
   theme = `${theme}.css`;
@@ -35,6 +38,9 @@ async function populateCSS({
   // Copy over the template CSS stylesheet
   await fs.copyFileAsync(template, stylesheet);
 
+  // Copy Fonts
+  fse.copySync(tempfont, fonts);
+
   // Get an array of every available theme
   const themes = await fs.readdirAsync(path.join(assetDir, "themes"));
 
@@ -48,7 +54,7 @@ async function populateCSS({
   themeSource = themeSource.toString("utf-8");
   const themeTemplate = hbs.compile(themeSource);
   const styles = themeTemplate({
-    background: `${background}`
+    background: `${background}`,
   });
   // Add the user-specified styles to the new stylesheet
   await fs.appendFileAsync(stylesheet, styles);
@@ -92,7 +98,7 @@ async function buildCommand(username, program) {
     steam: program.steam,
     telegram: program.telegram,
     twitter: program.twitter,
-    xda: program.xda
+    xda: program.xda,
   };
 
   await populateConfig(opts);
@@ -102,5 +108,5 @@ async function buildCommand(username, program) {
 module.exports = {
   buildCommand,
   populateCSS,
-  populateConfig
+  populateConfig,
 };

package.json

@@ -37,19 +37,20 @@
     "bluebird": "^3.5.4",
     "body-parser": "^1.19.0",
     "commander": "^2.20.0",
-    "ejs": "^3.0.1",
+    "ejs": "3.0.2",
     "express": "^4.17.0",
+    "fs-extra": "9.0.0",
     "github-emoji": "^1.1.1",
-    "got": "10.6.0",
-    "handlebars": "^4.7.3",
-    "jsdom": "^16.2.1",
+    "got": "11.0.2",
+    "handlebars": "4.7.6",
+    "jsdom": "16.2.2",
     "ncp": "^2.0.0",
-    "snyk": "1.299.0"
+    "snyk": "1.307.0"
   },
   "devDependencies": {
     "eslint": "^6.8.0",
-    "prettier": "^1.19.1",
-    "stylelint": "^13.2.1",
+    "prettier": "2.0.5",
+    "stylelint": "13.3.3",
     "stylelint-config-prettier": "^8.0.1",
     "stylelint-config-standard": "^20.0.0",
     "stylelint-prettier": "^1.1.2"