refactor: remove unused skills svg
This commit is contained in:
parent
a7f6794ac8
commit
61efbff9cc
GPG key ID:
CE1DDB8A4A765403
12 changed files with 21 additions and 612 deletions
|
|
@ -12,17 +12,13 @@
|
|||
"@developomp-site/prettier-config": "workspace:^",
|
||||
"@microflash/remark-callout-directives": "^1.6.0",
|
||||
"@types/dompurify": "^3.0.2",
|
||||
"@types/ejs": "^3.1.2",
|
||||
"@types/elasticlunr": "^0.9.5",
|
||||
"@types/jsdom": "^21.1.1",
|
||||
"@types/katex": "^0.16.0",
|
||||
"@types/markdown-it": "^12.2.3",
|
||||
"@types/node": "^20.4.1",
|
||||
"@types/read-time-estimate": "^0.0.0",
|
||||
"@types/svgo": "^3.0.0",
|
||||
"@types/tinycolor2": "^1.4.3",
|
||||
"canvas": "^2.11.2",
|
||||
"ejs": "^3.1.9",
|
||||
"elasticlunr": "^0.9.5",
|
||||
"eslint": "^8.44.0",
|
||||
"gray-matter": "^4.0.3",
|
||||
|
|
@ -46,7 +42,6 @@
|
|||
"remark-rehype": "^10.1.0",
|
||||
"remark-supersub": "^1.0.0",
|
||||
"simple-icons": "^9.4.0",
|
||||
"svgo": "^3.0.2",
|
||||
"tinycolor2": "^1.6.0",
|
||||
"typescript": "^5.1.6",
|
||||
"unified": "^10.1.2"
|
||||
|
|
|
|||
|
|
@ -14,12 +14,7 @@ import {
|
|||
portfolioFilePath,
|
||||
resumeFilePath,
|
||||
} from "./config"
|
||||
import {
|
||||
fillTags,
|
||||
generatePortfolioSVGs,
|
||||
parseSeries,
|
||||
sortDates,
|
||||
} from "./postProcess"
|
||||
import { fillTags, parseSeries, sortDates } from "./postProcess"
|
||||
import { recursiveParse } from "./recursiveParse"
|
||||
import { saveIndex } from "./searchIndex"
|
||||
import { ContentMap, ParseMode, PortfolioData, SeriesMap } from "./types/types"
|
||||
|
|
@ -74,7 +69,6 @@ async function main() {
|
|||
sortDates()
|
||||
fillTags()
|
||||
parseSeries()
|
||||
generatePortfolioSVGs()
|
||||
|
||||
/**
|
||||
* Save results
|
||||
|
|
|
|||
|
|
@ -1,8 +0,0 @@
|
|||
<div class="badge">
|
||||
<div class="badge-box" style="background-color: <%= badge.hex %>">
|
||||
<div class="icon-container <%= badge.isDark ? 'white' : 'black' %>">
|
||||
<%- badge.svg %>
|
||||
</div>
|
||||
</div>
|
||||
<%= badge.title %>
|
||||
</div>
|
||||
|
|
@ -1,5 +0,0 @@
|
|||
<div class="items-wrapper">
|
||||
<% badges.forEach((badge) => { %>
|
||||
<%- include("badge.ejs", { badge }) %>
|
||||
<% }) %>
|
||||
</div>
|
||||
|
|
@ -1,24 +0,0 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="480" height="900">
|
||||
<style>
|
||||
<%= style %>
|
||||
</style>
|
||||
|
||||
<foreignObject x="0" y="0" width="100%" height="100%">
|
||||
<div
|
||||
xmlns="http://www.w3.org/1999/xhtml"
|
||||
xmlns:xlink="http://www.w3.org/1999/xlink"
|
||||
>
|
||||
<% for (let key in data) { %>
|
||||
<h2><%- key %></h2>
|
||||
<% if(data[key] instanceof Array){ %>
|
||||
<%- include("badges.ejs", { badges: data[key] }) %>
|
||||
<% } else{ %>
|
||||
<% for (let subKey in data[key]) { %>
|
||||
<h3><%- subKey %></h3>
|
||||
<%- include("badges.ejs", { badges: data[key][subKey] }) %>
|
||||
<% } %>
|
||||
<% } %>
|
||||
<% } %>
|
||||
</div>
|
||||
</foreignObject>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 638 B |
|
|
@ -1,14 +0,0 @@
|
|||
{
|
||||
"Programming Languages": [
|
||||
"javascript",
|
||||
"typescript",
|
||||
"python",
|
||||
"rust",
|
||||
"csharp C#"
|
||||
],
|
||||
"Web Front End": ["react", "svelte", "tailwindcss"],
|
||||
"Back End": ["firebase"],
|
||||
"DevOps": ["docker", "githubactions GH Actions"],
|
||||
"Game Development": ["unity"],
|
||||
"Etc": ["google Google-Fu"]
|
||||
}
|
||||
|
|
@ -1,61 +0,0 @@
|
|||
svg {
|
||||
/* from github */
|
||||
font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial,
|
||||
sans-serif, Apple Color Emoji, Segoe UI Emoji;
|
||||
font-size: 14px;
|
||||
color: #777777;
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.items-wrapper {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(5, 1fr);
|
||||
|
||||
column-gap: 10px;
|
||||
row-gap: 15px;
|
||||
}
|
||||
|
||||
.badge {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
|
||||
gap: 5px;
|
||||
}
|
||||
|
||||
.badge-box {
|
||||
display: flex;
|
||||
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
border-radius: 7px;
|
||||
|
||||
width: 70px;
|
||||
height: 70px;
|
||||
}
|
||||
|
||||
.icon-container > svg {
|
||||
height: 40px !important;
|
||||
}
|
||||
|
||||
.white {
|
||||
color: white;
|
||||
fill: white;
|
||||
}
|
||||
|
||||
.black {
|
||||
color: black;
|
||||
fill: black;
|
||||
}
|
||||
|
|
@ -1,13 +1,4 @@
|
|||
import ejs from "ejs"
|
||||
import { readFileSync } from "fs"
|
||||
import * as icons from "simple-icons"
|
||||
import { optimize } from "svgo"
|
||||
import tinycolor from "tinycolor2"
|
||||
|
||||
import { contentMap, seriesMap } from "."
|
||||
import skills from "./portfolio/skills.json" assert { type: "json" }
|
||||
import { Badge } from "./types/types"
|
||||
import { writeToFile } from "./util"
|
||||
|
||||
export function sortDates() {
|
||||
const TmpDate = contentMap.date
|
||||
|
|
@ -42,89 +33,3 @@ export function parseSeries() {
|
|||
)
|
||||
}
|
||||
}
|
||||
|
||||
export function generatePortfolioSVGs() {
|
||||
/**
|
||||
* render skills.svg
|
||||
*/
|
||||
|
||||
// todo: wait add ejs once it's available
|
||||
|
||||
const style = readFileSync("./src/portfolio/style.css", "utf-8")
|
||||
|
||||
const data: {
|
||||
[key: string]: Badge[] | { [key: string]: Badge[] }
|
||||
} = {}
|
||||
|
||||
// C O G N I T O - H A Z A R D
|
||||
// THIS PART OF THE CODE WAS WRITTEN IN 3 AM
|
||||
// C O G N I T O - H A Z A R D
|
||||
|
||||
for (const key in skills) {
|
||||
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
||||
// @ts-ignore
|
||||
if (skills[key] instanceof Array) {
|
||||
if (!data[key]) {
|
||||
data[key] = []
|
||||
}
|
||||
|
||||
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
||||
// @ts-ignore
|
||||
;(skills[key] as string[]).forEach((badge) =>
|
||||
(data[key] as Badge[]).push(parseBadge(badge))
|
||||
)
|
||||
} else {
|
||||
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
||||
// @ts-ignore
|
||||
for (const subKey in skills[key]) {
|
||||
if (!data[key]) data[key] = {}
|
||||
|
||||
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
||||
// @ts-ignore
|
||||
if (!data[key][subKey]) {
|
||||
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
||||
// @ts-ignore
|
||||
data[key][subKey] = []
|
||||
}
|
||||
|
||||
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
||||
// @ts-ignore
|
||||
skills[key][subKey].forEach((badge: string) =>
|
||||
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
||||
// @ts-ignore
|
||||
(data[key][subKey] as Badge[]).push(parseBadge(badge))
|
||||
)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
const renderedSVG = ejs.render(
|
||||
readFileSync("./src/portfolio/skills.ejs", "utf-8"),
|
||||
{ style, data },
|
||||
{ views: ["./src/portfolio"] }
|
||||
)
|
||||
|
||||
writeToFile(
|
||||
"./dist/skills.svg",
|
||||
optimize(renderedSVG, { multipass: true }).data
|
||||
)
|
||||
}
|
||||
|
||||
function parseBadge(badgeRaw: string): Badge {
|
||||
const isMultiWord = badgeRaw.includes(" ")
|
||||
const words = badgeRaw.split(" ")
|
||||
const slug = words[0]
|
||||
|
||||
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
||||
// @ts-ignore
|
||||
const icon = icons["si" + slug[0].toUpperCase() + slug.slice(1)]
|
||||
|
||||
const color = tinycolor(icon.hex).lighten(5).desaturate(5)
|
||||
|
||||
return {
|
||||
svg: icon.svg,
|
||||
hex: color.toHexString(),
|
||||
isDark: color.isDark(),
|
||||
title: isMultiWord ? words.slice(1).join(" ") : icon.title,
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue