pomp/pompy.dev
1
0
Fork 0
Code Issues 8 Pull requests Activity Actions

improve skill svg generation

Browse source
This commit is contained in:
Kim, Jimin 2022-11-21 02:47:28 +09:00
parent 593dc83760
commit c338b0c9c3
3 changed files with 61 additions and 31 deletions
Download patch file Download diff file Expand all files Collapse all files

28
generate/portfolio/skills.ejs
View file

@ -8,23 +8,17 @@
xmlns="http://www.w3.org/1999/xhtml" xmlns="http://www.w3.org/1999/xhtml"
xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:xlink="http://www.w3.org/1999/xlink"
> >
<h2>Programming Languages</h2> <% for (let key in data) { %>
<% if(data[key] instanceof Array){ %>
<%- include("badges.ejs", { badges: data.programmingLanguage }) %> <h2><%- key %></h2>
<%- include("badges.ejs", { badges: data[key] }) %>
<h2>Front End</h2> <% } else{ %>
<% for (let subKey in data[key]) { %>
<h3>Web</h3> <h3><%- subKey %></h3>
<%- include("badges.ejs", { badges: data[key][subKey] }) %>
<%- include("badges.ejs", { badges: data.frontEndWeb }) %> <% } %>
<% } %>
<h3>Desktop</h3> <% } %>
<%- include("badges.ejs", { badges: data.frontEndDesktop }) %>
<h3>Game development</h3>
<%- include("badges.ejs", { badges: data.gameDev }) %>
</div> </div>
</foreignObject> </foreignObject>
</svg> </svg>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 673 B

After

Width:  |  Height:  |  Size: 639 B

Before After
Before After

11
generate/portfolio/skills.json
View file

@ -1,12 +1,15 @@
{ {
"programmingLanguage": [ "Programming Languages": [
"javascript", "javascript",
"typescript", "typescript",
"python", "python",
"rust", "rust",
"csharp" "csharp"
], ],
"frontEndWeb": ["react", "svelte", "tailwindcss"], "Front End": {
"frontEndDesktop": ["gtk", "electron", "tauri"], "Web": ["react", "svelte", "tailwindcss"],
"gameDev": ["unity", "godotengine Godot"] "Desktop": ["gtk", "electron", "tauri"]
},
"Game Development": ["unity", "godotengine Godot"],
"Etc": ["figma", "markdown"]
} }

51
generate/postProcess.ts
View file

@ -57,17 +57,50 @@ function generatePortfolioSVGs() {
const style = readFileSync("./generate/portfolio/style.css", "utf-8") const style = readFileSync("./generate/portfolio/style.css", "utf-8")
const data: { [key in keyof typeof skills]: Badge[] } = { const data: {
programmingLanguage: [], [key: string]: Badge[] | { [key: string]: Badge[] }
frontEndWeb: [], } = {}
frontEndDesktop: [],
gameDev: [], // 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] = []
} }
for (const skillCategory in skills) { // eslint-disable-next-line @typescript-eslint/ban-ts-comment
skills[skillCategory as keyof typeof skills].forEach((badge: string) => { // @ts-ignore
data[skillCategory as keyof typeof skills].push(parseBadge(badge)) ;(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( const renderedSVG = ejs.render(