feat(blog): port from CRA to vite + react
This commit is contained in:
parent
8243d38270
commit
e48b65b14c
109 changed files with 1493 additions and 10360 deletions
|
@ -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"
|
||||
}
|
||||
|
|
|
@ -1,5 +0,0 @@
|
|||
{
|
||||
"env": {
|
||||
"node": true
|
||||
}
|
||||
}
|
|
@ -1,4 +0,0 @@
|
|||
{
|
||||
"tabWidth": 4,
|
||||
"semi": false
|
||||
}
|
|
@ -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))
|
143
packages/theme/index.d.ts
vendored
143
packages/theme/index.d.ts
vendored
|
@ -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
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
|
@ -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"
|
||||
}
|
||||
}
|
|
@ -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;
|
||||
}
|
|
@ -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
|
|
@ -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;
|
||||
}
|
|
@ -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
|
|
@ -1,9 +0,0 @@
|
|||
{
|
||||
"compilerOptions": {
|
||||
"types": ["node"],
|
||||
"moduleResolution": "Node",
|
||||
"esModuleInterop": true
|
||||
},
|
||||
"include": ["src"],
|
||||
"exclude": ["dist", "node_modules"]
|
||||
}
|
Loading…
Add table
Add a link
Reference in a new issue