diff --git a/apps/blog/src/App.tsx b/apps/blog/src/App.tsx
index fe02c61..91666db 100644
--- a/apps/blog/src/App.tsx
+++ b/apps/blog/src/App.tsx
@@ -1,24 +1,20 @@
import darkTheme from "@developomp-site/theme/dist/dark.json"
import lightTheme from "@developomp-site/theme/dist/light.json"
-
+import { useMeta, useTitle, useTitleTemplate } from "hoofd"
import { useContext, useEffect, useState } from "react"
-import { Routes, Route } from "react-router-dom"
-import styled, { ThemeProvider } from "styled-components"
-import { useTitleTemplate, useTitle, useMeta } from "hoofd"
import { isIE } from "react-device-detect"
+import { Route, Routes } from "react-router-dom"
+import styled, { ThemeProvider } from "styled-components"
-import Loading from "./components/Loading"
-import Header from "./components/Header"
import Footer from "./components/Footer"
-
-import Home from "./pages/Home"
-import Search from "./pages/Search"
-import Page from "./pages/Page"
-import NotFound from "./pages/NotFound"
-
-import GlobalStyle from "./styles/globalStyle"
-
+import Header from "./components/Header"
+import Loading from "./components/Loading"
import { globalContext } from "./globalContext"
+import Home from "./pages/Home"
+import NotFound from "./pages/NotFound"
+import Page from "./pages/Page"
+import Search from "./pages/Search"
+import GlobalStyle from "./styles/globalStyle"
const IENotSupported = styled.p`
margin: auto;
diff --git a/apps/blog/src/components/Footer/Footer.tsx b/apps/blog/src/components/Footer/Footer.tsx
index 6b7c27e..a47261a 100644
--- a/apps/blog/src/components/Footer/Footer.tsx
+++ b/apps/blog/src/components/Footer/Footer.tsx
@@ -1,3 +1,4 @@
+import { type FC } from "react"
import styled from "styled-components"
import GithubLinkIcon from "../GithubLinkIcon"
@@ -28,7 +29,7 @@ const StyledFooterContainer = styled.div`
max-width: ${({ theme }) => theme.theme.maxDisplayWidth.desktop};
`
-export default () => {
+const Footer: FC = () => {
return (
@@ -41,3 +42,5 @@ export default () => {
)
}
+
+export default Footer
diff --git a/apps/blog/src/components/GithubLinkIcon.tsx b/apps/blog/src/components/GithubLinkIcon.tsx
index ed26773..619e692 100644
--- a/apps/blog/src/components/GithubLinkIcon.tsx
+++ b/apps/blog/src/components/GithubLinkIcon.tsx
@@ -1,8 +1,7 @@
-import { ReactNode } from "react"
-import styled from "styled-components"
-
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"
import { faGithub } from "@fortawesome/free-brands-svg-icons"
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"
+import type { FC, ReactNode } from "react"
+import styled from "styled-components"
const StyledGithubLink = styled.a<{ size?: string }>`
font-size: ${(props) => props.size || "2.5rem"};
@@ -20,7 +19,7 @@ interface Props {
children?: ReactNode
}
-export default ({ link, size, children }: Props) => {
+const GithubLinkIcon: FC = ({ link, size, children }) => {
return (
{
)
}
+
+export default GithubLinkIcon
diff --git a/apps/blog/src/components/Header/Buttons/Buttons.tsx b/apps/blog/src/components/Header/Buttons/Buttons.tsx
index 95cafe2..279a5a9 100644
--- a/apps/blog/src/components/Header/Buttons/Buttons.tsx
+++ b/apps/blog/src/components/Header/Buttons/Buttons.tsx
@@ -1,7 +1,8 @@
+import { type FC } from "react"
import styled from "styled-components"
-import ThemeToggleButton from "./ThemeToggleButton"
import SearchButton from "./SearchButton"
+import ThemeToggleButton from "./ThemeToggleButton"
const RightButtons = styled.div`
display: flex;
@@ -9,7 +10,7 @@ const RightButtons = styled.div`
margin-left: auto;
`
-export default () => {
+const Buttons: FC = () => {
return (
@@ -17,3 +18,5 @@ export default () => {
)
}
+
+export default Buttons
diff --git a/apps/blog/src/components/Header/Buttons/SearchButton.tsx b/apps/blog/src/components/Header/Buttons/SearchButton.tsx
index 4ac17b7..fe713bd 100644
--- a/apps/blog/src/components/Header/Buttons/SearchButton.tsx
+++ b/apps/blog/src/components/Header/Buttons/SearchButton.tsx
@@ -1,9 +1,9 @@
+import { faSearch } from "@fortawesome/free-solid-svg-icons"
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"
import { Link } from "react-router-dom"
import ReactTooltip from "react-tooltip"
import HeaderButton from "../HeaderButton"
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"
-import { faSearch } from "@fortawesome/free-solid-svg-icons"
const SearchButton = () => {
return (
diff --git a/apps/blog/src/components/Header/Buttons/ThemeToggleButton.tsx b/apps/blog/src/components/Header/Buttons/ThemeToggleButton.tsx
index f09fa15..d4a0506 100644
--- a/apps/blog/src/components/Header/Buttons/ThemeToggleButton.tsx
+++ b/apps/blog/src/components/Header/Buttons/ThemeToggleButton.tsx
@@ -1,10 +1,9 @@
+import { faMoon, faSun } from "@fortawesome/free-solid-svg-icons"
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"
import { useContext } from "react"
-import styled from "styled-components"
import { isMobile } from "react-device-detect"
import ReactTooltip from "react-tooltip"
-
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"
-import { faMoon, faSun } from "@fortawesome/free-solid-svg-icons"
+import styled from "styled-components"
import { ActionsEnum, globalContext } from "../../../globalContext"
import { HeaderButtonCSS } from "../HeaderButton"
diff --git a/apps/blog/src/components/Header/Header.tsx b/apps/blog/src/components/Header/Header.tsx
index 5eb1574..55df397 100644
--- a/apps/blog/src/components/Header/Header.tsx
+++ b/apps/blog/src/components/Header/Header.tsx
@@ -1,14 +1,13 @@
+import { type FC } from "react"
import { Link } from "react-router-dom"
import styled from "styled-components"
-import ReadProgress from "./ReadProgress"
-
-import Nav from "./Nav"
import Sidebar from "../Sidebar"
-
import Buttons from "./Buttons"
+import Nav from "./Nav"
+import ReadProgress from "./ReadProgress"
-const Header = styled.header`
+const StyledHeader = styled.header`
/* set z index to arbitrarily high value to prevent other components from drawing over it */
z-index: 9999;
@@ -43,18 +42,25 @@ const Icon = styled.img`
margin: 1rem;
`
-export default () => {
+const Header: FC = () => {
return (
-
+
)
}
+
+export default Header
diff --git a/apps/blog/src/components/Header/Nav.tsx b/apps/blog/src/components/Header/Nav.tsx
index 375c7d6..e93bcee 100644
--- a/apps/blog/src/components/Header/Nav.tsx
+++ b/apps/blog/src/components/Header/Nav.tsx
@@ -1,11 +1,11 @@
-import styled from "styled-components"
+import { type FC } from "react"
import { Link } from "react-router-dom"
-
-import HeaderButton from "./HeaderButton"
+import styled from "styled-components"
import NavbarData from "../../data/NavbarData"
+import HeaderButton from "./HeaderButton"
-const Nav = styled.div`
+const StyledNav = styled.div`
display: flex;
height: 100%;
@@ -15,20 +15,22 @@ const Nav = styled.div`
}
`
-export default () => {
+const Nav: FC = () => {
return (
-
+
)
}
+
+export default Nav
diff --git a/apps/blog/src/components/PostCard.tsx b/apps/blog/src/components/PostCard.tsx
index 30534ba..aaf1a82 100644
--- a/apps/blog/src/components/PostCard.tsx
+++ b/apps/blog/src/components/PostCard.tsx
@@ -1,20 +1,18 @@
-import styled from "styled-components"
-import { Link } from "react-router-dom"
-
import { PostData } from "@developomp-site/blog-content/src/types/types"
-
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"
import {
faBook,
faCalendar,
faHourglass,
} from "@fortawesome/free-solid-svg-icons"
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"
+import { Link } from "react-router-dom"
+import styled from "styled-components"
+import MainContent from "./MainContent"
import Tag from "./Tag"
import TagList from "./TagList"
-import MainContent from "./MainContent"
-const PostCard = styled(MainContent)`
+const StyledPostCard = styled(MainContent)`
box-shadow: 0 4px 10px rgb(0 0 0 / 10%);
text-align: left;
margin-bottom: 2rem;
@@ -56,12 +54,12 @@ interface Props {
postData: PostCardData
}
-export default (props: Props) => {
+const PostCard = (props: Props) => {
const { postData } = props
const { content_id, wordCount, date, readTime, title, tags } = postData
return (
-
+
{title || "No title"}
@@ -94,6 +92,7 @@ export default (props: Props) => {
: "unknown length"}
-
+
)
}
+export default PostCard
diff --git a/apps/blog/src/components/Sidebar/Sidebar.tsx b/apps/blog/src/components/Sidebar/Sidebar.tsx
index a6f9384..fff9471 100644
--- a/apps/blog/src/components/Sidebar/Sidebar.tsx
+++ b/apps/blog/src/components/Sidebar/Sidebar.tsx
@@ -1,15 +1,13 @@
-import { useCallback, useState } from "react"
-import styled from "styled-components"
-import ReactTooltip from "react-tooltip"
-import { isMobile } from "react-device-detect"
-
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"
import { faEllipsisV, faTimes } from "@fortawesome/free-solid-svg-icons"
-
-import SubMenu from "./SubMenu"
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"
+import { useCallback, useState } from "react"
+import { isMobile } from "react-device-detect"
+import ReactTooltip from "react-tooltip"
+import styled from "styled-components"
import NavbarData from "../../data/NavbarData"
import { HeaderButtonCSS } from "../Header/HeaderButton"
+import SubMenu from "./SubMenu"
const SidebarOpenButton = styled.div`
${HeaderButtonCSS}
diff --git a/apps/blog/src/components/Sidebar/SubMenu.tsx b/apps/blog/src/components/Sidebar/SubMenu.tsx
index 3d2a8b1..a5fb4b2 100644
--- a/apps/blog/src/components/Sidebar/SubMenu.tsx
+++ b/apps/blog/src/components/Sidebar/SubMenu.tsx
@@ -2,12 +2,11 @@
* @file Submenu item for sidebar
*/
-import type { Item } from "../../data/NavbarData"
-
import { useCallback, useState } from "react"
import { Link } from "react-router-dom"
import styled, { css } from "styled-components"
+import type { Item } from "../../data/NavbarData"
import button from "../../styles/button"
const sharedStyle = css`
diff --git a/apps/blog/src/components/Tag.tsx b/apps/blog/src/components/Tag.tsx
index 8ddbb24..e004035 100644
--- a/apps/blog/src/components/Tag.tsx
+++ b/apps/blog/src/components/Tag.tsx
@@ -1,10 +1,9 @@
-import { MouseEvent } from "react"
-import styled from "styled-components"
-
import { faHashtag } from "@fortawesome/free-solid-svg-icons"
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"
+import type { FC, MouseEvent } from "react"
+import styled from "styled-components"
-const Tag = styled.div`
+const StyledTag = styled.div`
text-align: center;
margin-right: 0.8rem;
@@ -18,10 +17,12 @@ interface Props {
onClick?: (event: MouseEvent) => void
}
-export default (props: Props) => {
+const Tag: FC = (props) => {
return (
-
+
{props.text}
-
+
)
}
+
+export default Tag
diff --git a/apps/blog/src/data/NavbarData.tsx b/apps/blog/src/data/NavbarData.tsx
index d517d0d..1bb0bea 100644
--- a/apps/blog/src/data/NavbarData.tsx
+++ b/apps/blog/src/data/NavbarData.tsx
@@ -1,9 +1,9 @@
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"
import {
faFileLines,
faUser,
faUserTie,
} from "@fortawesome/free-solid-svg-icons"
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"
// item from sidebar data
export type Item = {
diff --git a/apps/blog/src/globalContext.tsx b/apps/blog/src/globalContext.tsx
index 78f75eb..313d62c 100644
--- a/apps/blog/src/globalContext.tsx
+++ b/apps/blog/src/globalContext.tsx
@@ -1,10 +1,9 @@
-import type { Dispatch, ReactNode, ReactElement } from "react"
import type { Theme } from "@developomp-site/theme"
-
import darkTheme from "@developomp-site/theme/dist/dark.json"
import lightTheme from "@developomp-site/theme/dist/light.json"
-import { createContext, useEffect, useReducer } from "react"
import storage from "local-storage-fallback"
+import type { Dispatch, ReactElement, ReactNode } from "react"
+import { createContext, useEffect, useReducer } from "react"
export type SiteTheme = "dark" | "light"
diff --git a/apps/blog/src/index.tsx b/apps/blog/src/index.tsx
index ea871e9..74323a5 100644
--- a/apps/blog/src/index.tsx
+++ b/apps/blog/src/index.tsx
@@ -4,9 +4,9 @@ import "@fontsource/source-code-pro"
import { createRoot } from "react-dom/client"
import { BrowserRouter } from "react-router-dom"
-import { GlobalStore } from "./globalContext"
import App from "./App"
+import { GlobalStore } from "./globalContext"
const container = document.getElementById("root") as HTMLElement
const root = createRoot(container)
diff --git a/apps/blog/src/pages/Home/Home.tsx b/apps/blog/src/pages/Home/Home.tsx
index a6a155e..3746667 100644
--- a/apps/blog/src/pages/Home/Home.tsx
+++ b/apps/blog/src/pages/Home/Home.tsx
@@ -3,14 +3,13 @@
* show posts in recent order
*/
-import { useCallback, useEffect, useState } from "react"
-import { useTitle, useMeta } from "hoofd"
+import { useMeta, useTitle } from "hoofd"
+import { type FC, useCallback, useEffect, useState } from "react"
import styled from "styled-components"
import PostCard from "../../components/PostCard"
-import ShowMoreButton from "./ShowMoreButton"
-
import contentMap from "../../contentMap"
+import ShowMoreButton from "./ShowMoreButton"
const PostList = styled.div`
flex-direction: column;
@@ -20,7 +19,7 @@ const PostList = styled.div`
color: ${({ theme }) => theme.theme.color.text.default};
`
-export default () => {
+const Home: FC = () => {
const [howMany, setHowMany] = useState(5)
const [postsLength, setPostsLength] = useState(0)
const [postCards, setPostCards] = useState([])
@@ -81,3 +80,5 @@ export default () => {
>
)
}
+
+export default Home
diff --git a/apps/blog/src/pages/Home/ShowMoreButton.tsx b/apps/blog/src/pages/Home/ShowMoreButton.tsx
index 769c4e5..83bb15b 100644
--- a/apps/blog/src/pages/Home/ShowMoreButton.tsx
+++ b/apps/blog/src/pages/Home/ShowMoreButton.tsx
@@ -1,3 +1,4 @@
+import { type FC } from "react"
import styled from "styled-components"
import buttonStyle from "../../styles/button"
@@ -13,6 +14,8 @@ interface Props {
action(): void
}
-export default (props: Props) => {
+const ShowMoreButton: FC = (props) => {
return
}
+
+export default ShowMoreButton
diff --git a/apps/blog/src/pages/NotFound.tsx b/apps/blog/src/pages/NotFound.tsx
index 02d26aa..f0a66ba 100644
--- a/apps/blog/src/pages/NotFound.tsx
+++ b/apps/blog/src/pages/NotFound.tsx
@@ -1,5 +1,5 @@
+import { useMeta, useTitle } from "hoofd"
import styled from "styled-components"
-import { useTitle, useMeta } from "hoofd"
import MainContent from "../components/MainContent"
diff --git a/apps/blog/src/pages/Page/Meta.tsx b/apps/blog/src/pages/Page/Meta.tsx
index 1a58ab5..579a0ec 100644
--- a/apps/blog/src/pages/Page/Meta.tsx
+++ b/apps/blog/src/pages/Page/Meta.tsx
@@ -1,13 +1,12 @@
-import styled from "styled-components"
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"
+import { PageData } from "@developomp-site/blog-content/src/types/types"
import {
faBook,
faCalendar,
faFile,
faHourglass,
} from "@fortawesome/free-solid-svg-icons"
-
-import { PageData } from "@developomp-site/blog-content/src/types/types"
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"
+import styled from "styled-components"
const StyledMetaContainer = styled.div`
color: ${({ theme }) => theme.theme.color.text.gray};
diff --git a/apps/blog/src/pages/Page/Page.tsx b/apps/blog/src/pages/Page/Page.tsx
index ff10ff7..5118114 100644
--- a/apps/blog/src/pages/Page/Page.tsx
+++ b/apps/blog/src/pages/Page/Page.tsx
@@ -1,16 +1,16 @@
-import { useState, useEffect } from "react"
-import { useTitle, useMeta } from "hoofd"
+import type { PageData } from "@developomp-site/blog-content/src/types/types"
+import { useMeta, useTitle } from "hoofd"
+import { useEffect, useState } from "react"
import { useLocation } from "react-router-dom"
import styled from "styled-components"
+import Loading from "../../components/Loading"
import MainContent from "../../components/MainContent"
import PostCard from "../../components/PostCard"
-import Loading from "../../components/Loading"
-import TagList from "../../components/TagList"
import Tag from "../../components/Tag"
+import TagList from "../../components/TagList"
+import contentMap from "../../contentMap"
import NotFound from "../NotFound"
-
-import SeriesControlButtons from "./SeriesControlButtons"
import {
categorizePageType,
fetchContent,
@@ -18,12 +18,9 @@ import {
parsePageData,
} from "./helper"
import Meta from "./Meta"
+import SeriesControlButtons from "./SeriesControlButtons"
import Toc from "./Toc"
-import type { PageData } from "@developomp-site/blog-content/src/types/types"
-
-import contentMap from "../../contentMap"
-
const StyledTitle = styled.h1`
margin-bottom: 1rem;
diff --git a/apps/blog/src/pages/Page/SeriesControlButtons.tsx b/apps/blog/src/pages/Page/SeriesControlButtons.tsx
index 1e02d6e..ff31905 100644
--- a/apps/blog/src/pages/Page/SeriesControlButtons.tsx
+++ b/apps/blog/src/pages/Page/SeriesControlButtons.tsx
@@ -1,12 +1,11 @@
-import styled from "styled-components"
-import { Link } from "react-router-dom"
-
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"
import {
faArrowLeft,
faArrowRight,
faListUl,
} from "@fortawesome/free-solid-svg-icons"
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"
+import { Link } from "react-router-dom"
+import styled from "styled-components"
import buttonStyle from "../../styles/button"
diff --git a/apps/blog/src/pages/Page/Toc.tsx b/apps/blog/src/pages/Page/Toc.tsx
index ee77363..aace499 100644
--- a/apps/blog/src/pages/Page/Toc.tsx
+++ b/apps/blog/src/pages/Page/Toc.tsx
@@ -1,9 +1,8 @@
+import { faCaretDown, faCaretUp } from "@fortawesome/free-solid-svg-icons"
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"
+import storage from "local-storage-fallback"
import { useEffect, useState } from "react"
import { Collapse } from "react-collapse"
-import storage from "local-storage-fallback"
-
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"
-import { faCaretDown, faCaretUp } from "@fortawesome/free-solid-svg-icons"
import styled from "styled-components"
const StyledTocToggleButton = styled.button`
diff --git a/apps/blog/src/pages/Page/helper.ts b/apps/blog/src/pages/Page/helper.ts
index cdebdfd..777b1bf 100644
--- a/apps/blog/src/pages/Page/helper.ts
+++ b/apps/blog/src/pages/Page/helper.ts
@@ -1,5 +1,4 @@
import portfolio from "@developomp-site/blog-content/dist/portfolio.json"
-
import type { PageData } from "@developomp-site/blog-content/src/types/types"
import contentMap from "../../contentMap"
diff --git a/apps/blog/src/pages/Search/Search.tsx b/apps/blog/src/pages/Search/Search.tsx
index 79543b3..283a089 100644
--- a/apps/blog/src/pages/Search/Search.tsx
+++ b/apps/blog/src/pages/Search/Search.tsx
@@ -1,26 +1,22 @@
-import { useCallback, useEffect, useState } from "react"
-import styled from "styled-components"
-import { useSearchParams } from "react-router-dom"
-import { useTitle, useMeta } from "hoofd"
-import { Range } from "react-date-range"
-
-import elasticlunr from "elasticlunr" // search engine
-
-import searchData from "@developomp-site/blog-content/dist/search.json"
-
-import Loading from "../../components/Loading"
-import PostCard from "../../components/PostCard"
-import MainContent from "../../components/MainContent"
-
-import SearchBar from "./SearchBar"
-import TagSelect, { TagsData } from "./TagSelect"
-import { ClearDateButton, DateRangeControl, StyledDateRange } from "./DateRange"
-
-import contentMap from "../../contentMap"
-
import "react-date-range/dist/styles.css"
import "react-date-range/dist/theme/default.css"
+import searchData from "@developomp-site/blog-content/dist/search.json"
+import elasticlunr from "elasticlunr" // search engine
+import { useMeta, useTitle } from "hoofd"
+import { useCallback, useEffect, useState } from "react"
+import { Range } from "react-date-range"
+import { useSearchParams } from "react-router-dom"
+import styled from "styled-components"
+
+import Loading from "../../components/Loading"
+import MainContent from "../../components/MainContent"
+import PostCard from "../../components/PostCard"
+import contentMap from "../../contentMap"
+import { ClearDateButton, DateRangeControl, StyledDateRange } from "./DateRange"
+import SearchBar from "./SearchBar"
+import TagSelect, { TagsData } from "./TagSelect"
+
const searchIndex = elasticlunr.Index.load(searchData as never)
export interface SearchParams {
diff --git a/apps/blog/src/pages/Search/TagSelect.tsx b/apps/blog/src/pages/Search/TagSelect.tsx
index 29006ac..d4cd584 100644
--- a/apps/blog/src/pages/Search/TagSelect.tsx
+++ b/apps/blog/src/pages/Search/TagSelect.tsx
@@ -1,6 +1,6 @@
import { useContext } from "react"
-import styled from "styled-components"
import Select from "react-select"
+import styled from "styled-components"
import contentMap from "../../contentMap"
import { globalContext } from "../../globalContext"
diff --git a/apps/blog/src/styles/globalStyle.ts b/apps/blog/src/styles/globalStyle.ts
index ed48336..2265d01 100644
--- a/apps/blog/src/styles/globalStyle.ts
+++ b/apps/blog/src/styles/globalStyle.ts
@@ -1,17 +1,18 @@
-import { createGlobalStyle, css } from "styled-components"
import "katex/dist/katex.min.css"
+import { createGlobalStyle, css } from "styled-components"
+
import anchorCSS from "./anchor"
-import scrollbarCSS from "./scrollbar"
+import blockquoteCSS from "./blockQuote"
import checkbox from "./checkbox"
import codeCSS from "./code"
-import kbdCSS from "./kbd"
-import tableCSS from "./table"
-import blockquoteCSS from "./blockQuote"
-import hrCSS from "./hr"
import headerCSS from "./header"
-import markCSS from "./mark"
+import hrCSS from "./hr"
import katexCSS from "./katex"
+import kbdCSS from "./kbd"
+import markCSS from "./mark"
+import scrollbarCSS from "./scrollbar"
+import tableCSS from "./table"
const globalCSS = css`
body {
diff --git a/apps/blog/types/styled-components.ts b/apps/blog/types/styled-components.ts
index 02bae65..8e40b84 100644
--- a/apps/blog/types/styled-components.ts
+++ b/apps/blog/types/styled-components.ts
@@ -1,5 +1,7 @@
import "styled-components"
+
import type { Theme } from "@developomp-site/theme"
+
import { SiteTheme } from "../src/globalContext"
declare module "styled-components" {
diff --git a/packages/blog-content/src/index.ts b/packages/blog-content/src/index.ts
index 8799dcb..aee7d41 100644
--- a/packages/blog-content/src/index.ts
+++ b/packages/blog-content/src/index.ts
@@ -9,10 +9,9 @@
import fs from "fs"
import { mapFilePath, markdownPath, portfolioFilePath } from "./config"
+import postProcess from "./postProcess"
import { recursiveParse } from "./recursiveParse"
import { saveIndex } from "./searchIndex"
-import postProcess from "./postProcess"
-
import { ContentMap, ParseMode, PortfolioData, SeriesMap } from "./types/types"
export const contentMap: ContentMap = {
diff --git a/packages/blog-content/src/parseMarkdown.ts b/packages/blog-content/src/parseMarkdown.ts
index 3c27c3c..3f2b9a5 100644
--- a/packages/blog-content/src/parseMarkdown.ts
+++ b/packages/blog-content/src/parseMarkdown.ts
@@ -1,25 +1,23 @@
+import "katex/contrib/mhchem" // chemical formula
+
+import matter from "gray-matter"
+import hljs from "highlight.js" // code block syntax highlighting
+import { JSDOM } from "jsdom" // HTML DOM parsing
+import katex from "katex" // rendering mathematical expression
import markdownIt from "markdown-it" // rendering markdown
-import markdownItTexMath from "markdown-it-texmath" // rendering mathematical expression
import markdownItAnchor from "markdown-it-anchor" // markdown anchor
-import markdownItTaskCheckbox from "markdown-it-task-checkbox" // a TODO list checkboxes
+import markdownItFootnote from "markdown-it-footnote" // markdown footnote
+import highlightLines from "markdown-it-highlight-lines" // highlighting specific lines in code blocks
import markDownItMark from "markdown-it-mark" // text highlighting
import markdownItSub from "markdown-it-sub" // markdown subscript
import markdownItSup from "markdown-it-sup" // markdown superscript
-import markdownItFootnote from "markdown-it-footnote" // markdown footnote
-
-import highlightLines from "markdown-it-highlight-lines" // highlighting specific lines in code blocks
-
-import slugify from "slugify"
-import matter from "gray-matter"
+import markdownItTaskCheckbox from "markdown-it-task-checkbox" // a TODO list checkboxes
+import markdownItTexMath from "markdown-it-texmath" // rendering mathematical expression
import toc from "markdown-toc" // table of contents generation
-import hljs from "highlight.js" // code block syntax highlighting
-import katex from "katex" // rendering mathematical expression
-import "katex/contrib/mhchem" // chemical formula
+import slugify from "slugify"
-import { JSDOM } from "jsdom" // HTML DOM parsing
-
-import { nthIndex } from "./util"
import { MarkdownData, ParseMode } from "./types/types"
+import { nthIndex } from "./util"
const slugifyIt = (s: string) => slugify(s, { lower: true, strict: true })
diff --git a/packages/blog-content/src/postProcess.ts b/packages/blog-content/src/postProcess.ts
index 121f27c..c4a236b 100644
--- a/packages/blog-content/src/postProcess.ts
+++ b/packages/blog-content/src/postProcess.ts
@@ -1,14 +1,12 @@
import ejs from "ejs"
-import { optimize } from "svgo"
-import { readFileSync, writeFileSync } from "fs"
+import { readFileSync } from "fs"
import icons from "simple-icons/icons"
+import { optimize } from "svgo"
import tinycolor from "tinycolor2"
import { contentMap, seriesMap } from "."
-
-import { Badge } from "./types/types"
-
import skills from "./portfolio/skills.json"
+import { Badge } from "./types/types"
import { writeToFile } from "./util"
export default function postProcess() {
@@ -124,6 +122,7 @@ function parseBadge(badgeRaw: string): Badge {
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)]
diff --git a/packages/blog-content/src/recursiveParse/index.ts b/packages/blog-content/src/recursiveParse/index.ts
index 191372e..06db5bb 100644
--- a/packages/blog-content/src/recursiveParse/index.ts
+++ b/packages/blog-content/src/recursiveParse/index.ts
@@ -1,15 +1,13 @@
import fs from "fs"
import readTimeEstimate from "read-time-estimate" // post read time estimation
-import { path2FileOrFolderName, path2URL } from "../util"
import parseMarkdown from "../parseMarkdown"
-
+import { ParseMode } from "../types/types"
+import { path2FileOrFolderName, path2URL } from "../util"
import parsePost from "./parsePost"
+import parseProjects from "./parseProjects"
import parseSeries from "./parseSeries"
import parseUnsearchable from "./parseUnsearchable"
-import parseProjects from "./parseProjects"
-
-import { ParseMode } from "../types/types"
/**
* Data that's passed from {@link parseFile} to other function
diff --git a/packages/blog-content/src/recursiveParse/parsePost.ts b/packages/blog-content/src/recursiveParse/parsePost.ts
index 5e4c924..1749827 100644
--- a/packages/blog-content/src/recursiveParse/parsePost.ts
+++ b/packages/blog-content/src/recursiveParse/parsePost.ts
@@ -1,11 +1,10 @@
+import { contentMap } from ".."
import { contentDirectoryPath } from "../config"
import { generateToc } from "../parseMarkdown"
import { addDocument } from "../searchIndex"
-import { writeToFile } from "../util"
-import { contentMap } from ".."
-import { DataToPass } from "."
-
import { PostData } from "../types/types"
+import { writeToFile } from "../util"
+import { DataToPass } from "."
export default function parsePost(data: DataToPass): void {
const {
diff --git a/packages/blog-content/src/recursiveParse/parseProjects.ts b/packages/blog-content/src/recursiveParse/parseProjects.ts
index e03fb5a..cc6cd91 100644
--- a/packages/blog-content/src/recursiveParse/parseProjects.ts
+++ b/packages/blog-content/src/recursiveParse/parseProjects.ts
@@ -1,11 +1,11 @@
-import tinycolor from "tinycolor2"
-import icons from "simple-icons/icons"
import { SimpleIcon } from "simple-icons"
+import icons from "simple-icons/icons"
+import tinycolor from "tinycolor2"
+import { portfolioData } from ".."
import { contentDirectoryPath, iconsDirectoryPath } from "../config"
import { generateToc } from "../parseMarkdown"
import { writeToFile } from "../util"
-import { portfolioData } from ".."
import { DataToPass } from "."
export default function parseProjects(data: DataToPass): void {
@@ -15,6 +15,7 @@ export default function parseProjects(data: DataToPass): void {
;(markdownData.badges as string[]).forEach((slug) => {
// todo: handle cases when icon is not on simple-icons
const icon: SimpleIcon =
+ // eslint-disable-next-line @typescript-eslint/ban-ts-comment
// @ts-ignore
icons["si" + slug[0].toUpperCase() + slug.slice(1)]
diff --git a/packages/blog-content/src/recursiveParse/parseSeries.ts b/packages/blog-content/src/recursiveParse/parseSeries.ts
index 12e1ca8..16eb18a 100644
--- a/packages/blog-content/src/recursiveParse/parseSeries.ts
+++ b/packages/blog-content/src/recursiveParse/parseSeries.ts
@@ -1,11 +1,10 @@
+import { contentMap, seriesMap } from ".."
import { contentDirectoryPath } from "../config"
import { generateToc } from "../parseMarkdown"
import { addDocument } from "../searchIndex"
-import { writeToFile } from "../util"
-import { contentMap, seriesMap } from ".."
-
-import { DataToPass } from "."
import { PostData } from "../types/types"
+import { writeToFile } from "../util"
+import { DataToPass } from "."
export default function parseSeries(data: DataToPass): void {
const {
diff --git a/packages/blog-content/src/recursiveParse/parseUnsearchable.ts b/packages/blog-content/src/recursiveParse/parseUnsearchable.ts
index 2ad4c1b..8cccf8b 100644
--- a/packages/blog-content/src/recursiveParse/parseUnsearchable.ts
+++ b/packages/blog-content/src/recursiveParse/parseUnsearchable.ts
@@ -1,7 +1,7 @@
+import { contentMap } from ".."
import { contentDirectoryPath } from "../config"
import { addDocument } from "../searchIndex"
import { writeToFile } from "../util"
-import { contentMap } from ".."
import { DataToPass } from "."
export default function parseUnsearchable(data: DataToPass): void {
diff --git a/packages/blog-content/src/searchIndex.ts b/packages/blog-content/src/searchIndex.ts
index 226f22e..bcfa4bb 100644
--- a/packages/blog-content/src/searchIndex.ts
+++ b/packages/blog-content/src/searchIndex.ts
@@ -2,8 +2,8 @@
* @file generate index for searching
*/
-import fs from "fs"
import elasticlunr from "elasticlunr"
+import fs from "fs"
import { searchIndexFilePath } from "./config"
diff --git a/packages/theme/build.ts b/packages/theme/build.ts
index 87533bd..ae5d041 100644
--- a/packages/theme/build.ts
+++ b/packages/theme/build.ts
@@ -1,4 +1,4 @@
-import { writeFileSync, mkdirSync, existsSync } from "fs"
+import { existsSync, mkdirSync, writeFileSync } from "fs"
import dark from "./src/dark"
import light from "./src/light"
diff --git a/packages/theme/src/dark/index.ts b/packages/theme/src/dark/index.ts
index e0424bc..7b5811f 100644
--- a/packages/theme/src/dark/index.ts
+++ b/packages/theme/src/dark/index.ts
@@ -1,7 +1,7 @@
-import type { Theme } from "../.."
-
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
diff --git a/packages/theme/src/light/index.ts b/packages/theme/src/light/index.ts
index d52e768..2b658ce 100644
--- a/packages/theme/src/light/index.ts
+++ b/packages/theme/src/light/index.ts
@@ -1,9 +1,8 @@
-import type { Theme } from "../.."
-
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>(BaseTheme, {