feat(blog): port from CRA to vite + react

This commit is contained in:
Kim, Jimin 2023-07-07 19:18:32 +09:00
parent 8243d38270
commit e48b65b14c
109 changed files with 1493 additions and 10360 deletions

View file

@ -19,7 +19,9 @@
"@types/tinycolor2": "^1.4.3",
"canvas": "^2.11.2",
"ejs": "^3.1.8",
"elasticlunr": "^0.9.5",
"gray-matter": "^4.0.3",
"jsdom": "^22.1.0",
"markdown-it": "^13.0.1",
"markdown-it-anchor": "^8.6.5",
"markdown-it-attrs": "^4.1.4",
@ -40,6 +42,9 @@
},
"devDependencies": {
"@developomp-site/eslint-config": "workspace:*",
"@types/elasticlunr": "^0.9.5",
"@types/jsdom": "^21.1.1",
"@types/node": "^20.4.0",
"eslint": "^8.44.0",
"prettier": "^2.8.8"
}

View file

@ -1,5 +0,0 @@
{
"env": {
"node": true
}
}

View file

@ -1,4 +0,0 @@
{
"tabWidth": 4,
"semi": false
}

View file

@ -1,9 +0,0 @@
import { existsSync, mkdirSync, writeFileSync } from "fs"
import dark from "./src/dark"
import light from "./src/light"
if (!existsSync("dist")) mkdirSync("dist")
writeFileSync("dist/dark.json", JSON.stringify(dark))
writeFileSync("dist/light.json", JSON.stringify(light))

View file

@ -1,143 +0,0 @@
export interface Theme {
font: {
sansSerif: string
monospace: string
}
color: {
text: {
highContrast: string
default: string
gray: string
}
background: string
}
maxDisplayWidth: {
mobile: string
desktop: string
}
component: {
anchor: {
color: {
default: string
hover: string
active: string
header: string
}
}
blockQuote: {
color: {
background: string
borderLeft: string
}
}
card: {
color: {
background: string
hoverGlow: string
}
}
code: {
inline: {
color: {
text: string
background: string
border: string
}
}
block: {
color: {
border: string
highlight: string
}
style: string
}
}
footer: {
color: {
background: string
text: string
}
}
header: {
color: {
background: string
hover: string
text: string
}
height: string
}
input: {
color: {
background: {
default: string
itemHover: string
}
border: {
default: string
hover: string
focus: string
}
placeHolder: string
}
}
kbd: {
color: {
text: string
border: string
outerShadow: string
innerShadow: string
background: string
}
}
mark: {
color: {
text: string
background: string
}
}
scrollbar: {
color: {
track: string
thumb: string
}
width: string
borderRadius: string
}
scrollProgressBar: {
color: {
background: string
foreground: string
}
}
table: {
color: {
border: string
even: string
}
}
ui: {
color: {
background: {
default: string
hover: string
}
border: string
}
}
}
}

View file

@ -1,26 +0,0 @@
{
"name": "@developomp-site/theme",
"version": "0.0.0",
"types": "./index.d.ts",
"private": true,
"license": "MIT",
"scripts": {
"dev": "nodemon --ignore dist/ --exec pnpm build",
"build": "npx ts-node ./build.ts",
"lint": "eslint .",
"clean": "rm -rf .turbo node_modules dist"
},
"devDependencies": {
"@developomp-site/eslint-config": "workspace:*",
"@types/merge-deep": "^3.0.0",
"@types/node": "^18.11.11",
"eslint": "^8.44.0",
"merge-deep": "^3.0.3",
"nodemon": "^2.0.20",
"prettier": "^2.8.8",
"tailwindcss": "^3.2.4",
"ts-node": "^10.9.1",
"tsup": "^5.12.9",
"utility-types": "^3.10.0"
}
}

View file

@ -1,96 +0,0 @@
/* from highlight.js/styles/atom-one-dark-reasonable.css */
pre code.hljs {
display: block;
overflow-x: auto;
padding: 1em;
}
code.hljs {
padding: 3px 5px;
}
.hljs {
color: #abb2bf;
background: #282c34;
}
.hljs-keyword,
.hljs-operator,
.hljs-pattern-match {
color: #f92672;
}
.hljs-function,
.hljs-pattern-match .hljs-constructor {
color: #61aeee;
}
.hljs-function .hljs-params {
color: #a6e22e;
}
.hljs-function .hljs-params .hljs-typing {
color: #fd971f;
}
.hljs-module-access .hljs-module {
color: #7e57c2;
}
.hljs-constructor {
color: #e2b93d;
}
.hljs-constructor .hljs-string {
color: #9ccc65;
}
.hljs-comment,
.hljs-quote {
color: #b18eb1;
font-style: italic;
}
.hljs-doctag,
.hljs-formula {
color: #c678dd;
}
.hljs-deletion,
.hljs-name,
.hljs-section,
.hljs-selector-tag,
.hljs-subst {
color: #e06c75;
}
.hljs-literal {
color: #56b6c2;
}
.hljs-addition,
.hljs-attribute,
.hljs-meta .hljs-string,
.hljs-regexp,
.hljs-string {
color: #98c379;
}
.hljs-built_in,
.hljs-class .hljs-title,
.hljs-title.class_ {
color: #e6c07b;
}
.hljs-attr,
.hljs-number,
.hljs-selector-attr,
.hljs-selector-class,
.hljs-selector-pseudo,
.hljs-template-variable,
.hljs-type,
.hljs-variable {
color: #d19a66;
}
.hljs-bullet,
.hljs-link,
.hljs-meta,
.hljs-selector-id,
.hljs-symbol,
.hljs-title {
color: #61aeee;
}
.hljs-emphasis {
font-style: italic;
}
.hljs-strong {
font-weight: 700;
}
.hljs-link {
text-decoration: underline;
}

View file

@ -1,147 +0,0 @@
import { readFileSync } from "fs"
import type { Theme } from "../.."
export default {
font: {
sansSerif: "'Noto Sans KR', sans-serif", // https://fonts.google.com/noto/specimen/Noto+Sans+KR
monospace: "'Source Code Pro', monospace",
},
color: {
text: {
highContrast: "#FFFFFF",
default: "#EEEEEE",
gray: "#CCC",
},
background: "#36393F",
},
maxDisplayWidth: {
mobile: "1024px", // max-w-screen-lg
desktop: "1536px", // max-w-screen-2xl
},
component: {
anchor: {
color: {
default: "#66AAFF",
hover: "#4592F7",
active: "#4592F7",
header: "#778899",
},
},
blockQuote: {
color: {
background: "#FFFFFF12",
borderLeft: "#FFFFFF4D",
},
},
card: {
color: {
background: "#2F3136",
hoverGlow: "#FFFFFF33",
},
},
code: {
inline: {
color: {
text: "#FFFFFF",
background: "#444",
border: "#666",
},
},
block: {
color: {
border: "#555",
highlight: "#14161A",
},
style: readFileSync(__dirname + "/codeblock.css", "utf-8"),
},
},
footer: {
color: {
background: "#000000",
text: "",
},
},
header: {
color: {
background: "#202225", // custom
hover: "#3F3F46", // zinc-700
text: "#D4D4D8", // zinc-300
},
height: "16px", // h-4
},
input: {
color: {
background: {
default: "#36393f",
itemHover: "#202225",
},
border: {
default: "#555555",
hover: "#808080",
focus: "#a3a3a3", // neutral-400
},
placeHolder: "#A9A9A9",
},
},
kbd: {
color: {
text: "#FFFFFF",
border: "#555555",
outerShadow: "#FFFFFF4D",
innerShadow: "#000000",
background: "#000000",
},
},
mark: {
color: {
text: "#FFFFFF",
background: "#FFFF0080",
},
},
scrollbar: {
color: {
track: "#18181B",
thumb: "#888888",
},
width: "8px", // w-2
borderRadius: "4px", // rounded
},
scrollProgressBar: {
color: {
background: "#52525B", // zinc 600
foreground: "#D4D4D8", // zinc-300
},
},
table: {
color: {
border: "#777777",
even: "#21272E",
},
},
ui: {
color: {
background: {
default: "#202225",
hover: "#3F3F46", // zinc-700
},
border: "#555",
},
},
},
} as Theme

View file

@ -1,79 +0,0 @@
/* from highlight.js/styles/default.css */
pre code.hljs {
display: block;
overflow-x: auto;
padding: 1em;
}
code.hljs {
padding: 3px 5px;
}
.hljs {
background: #f0f0f0;
color: #444;
}
.hljs-comment {
color: #888;
}
.hljs-punctuation,
.hljs-tag {
color: #444a;
}
.hljs-tag .hljs-attr,
.hljs-tag .hljs-name {
color: #444;
}
.hljs-attribute,
.hljs-doctag,
.hljs-keyword,
.hljs-meta .hljs-keyword,
.hljs-name,
.hljs-selector-tag {
font-weight: 700;
}
.hljs-deletion,
.hljs-number,
.hljs-quote,
.hljs-selector-class,
.hljs-selector-id,
.hljs-string,
.hljs-template-tag,
.hljs-type {
color: #800;
}
.hljs-section,
.hljs-title {
color: #800;
font-weight: 700;
}
.hljs-link,
.hljs-operator,
.hljs-regexp,
.hljs-selector-attr,
.hljs-selector-pseudo,
.hljs-symbol,
.hljs-template-variable,
.hljs-variable {
color: #bc6060;
}
.hljs-literal {
color: #78a960;
}
.hljs-addition,
.hljs-built_in,
.hljs-bullet,
.hljs-code {
color: #397300;
}
.hljs-meta {
color: #1f7199;
}
.hljs-meta .hljs-string {
color: #4d99bf;
}
.hljs-emphasis {
font-style: italic;
}
.hljs-strong {
font-weight: 700;
}

View file

@ -1,125 +0,0 @@
import { readFileSync } from "fs"
import merge from "merge-deep"
import { DeepPartial } from "utility-types"
import type { Theme } from "../.."
import BaseTheme from "../dark"
export default merge<Theme, DeepPartial<Theme>>(BaseTheme, {
color: {
text: {
highContrast: "#000000",
default: "#111111",
gray: "#555",
},
background: "#F7F7F7",
},
component: {
anchor: {
color: {
header: "#D3D3D3",
},
},
blockQuote: {
color: {
background: "#0000000D",
borderLeft: "#0000001A",
},
},
card: {
color: {
background: "#FFFFFF",
hoverGlow: "#00000040",
},
},
code: {
inline: {
color: {
text: "#000000",
background: "#EEE",
border: "#BBB",
},
},
block: {
color: {
border: "#BBB",
highlight: "#DDDDDD",
},
style: readFileSync(__dirname + "/codeblock.css", "utf-8"),
},
},
footer: {
color: {
background: "#FFFFFF",
text: "",
},
},
input: {
color: {
background: {
default: "#EEEEEE",
itemHover: "#FFFFFF",
},
border: {
default: "#CCCCCC",
hover: "#808080",
focus: "#000000",
},
placeHolder: "#777777",
},
},
kbd: {
color: {
text: "#333333",
border: "#CCCCCC",
outerShadow: "#00000033",
innerShadow: "#FFFFFF",
background: "#F7F7F7",
},
},
mark: {
color: {
text: "#000000",
background: "#FFFF00BF",
},
},
scrollbar: {
color: {
track: "#FFFFFF",
thumb: "#DDDDDD",
},
},
scrollProgressBar: {
color: {
background: "#d4d4d8", // zinc-300
foreground: "#52525b", // zinc-600
},
},
table: {
color: {
border: "#DDD",
even: "#F2F2F2",
},
},
ui: {
color: {
background: {
default: "#FFFFFF",
hover: "#EEEEEE",
},
border: "#CCC",
},
},
},
}) as Theme

View file

@ -1,9 +0,0 @@
{
"compilerOptions": {
"types": ["node"],
"moduleResolution": "Node",
"esModuleInterop": true
},
"include": ["src"],
"exclude": ["dist", "node_modules"]
}