🎨 prettier: Limit print width to default (80) from 100

PresentKim · Jul 7, 2023 · bed8661 · bed8661
1 parent ade7754
commit bed8661
Show file tree

Hide file tree

Showing 22 changed files with 181 additions and 69 deletions.
diff --git a/.eslintrc.cjs b/.eslintrc.cjs
@@ -1,7 +1,11 @@
 module.exports = {
   root: true,
   parser: '@typescript-eslint/parser',
-  extends: ['eslint:recommended', 'plugin:@typescript-eslint/recommended', 'prettier'],
+  extends: [
+    'eslint:recommended',
+    'plugin:@typescript-eslint/recommended',
+    'prettier'
+  ],
   plugins: ['svelte3', '@typescript-eslint'],
   ignorePatterns: ['*.cjs'],
   overrides: [{ files: ['*.svelte'], processor: 'svelte3/svelte3' }],

diff --git a/.prettierrc b/.prettierrc
@@ -2,7 +2,6 @@
   "useTabs": false,
   "singleQuote": true,
   "trailingComma": "none",
-  "printWidth": 100,
   "plugins": ["prettier-plugin-svelte"],
   "pluginSearchDirs": ["."],
   "overrides": [{ "files": "*.svelte", "options": { "parser": "svelte" } }]

diff --git a/mdsvex.config.js b/mdsvex.config.js
@@ -22,7 +22,11 @@ const customTypes = Object.fromEntries(
 
 export default mdsvex({
   extensions: ['.md'],
-  remarkPlugins: [remarkEmoji, remarkMath, [remarkAdmonitions, { customTypes }]],
+  remarkPlugins: [
+    remarkEmoji,
+    remarkMath,
+    [remarkAdmonitions, { customTypes }]
+  ],
   rehypePlugins: [
     rehypeKatex,
     [rehypeExternalLinks, { rel: ['noopener noreferrer'], target: '_blank' }]

diff --git a/src/app.html b/src/app.html
@@ -5,32 +5,27 @@
     <meta name="viewport" content="width=device-width,initial-scale=1.0" />
     <meta name="theme-color" content="#333333" />
 
-    <link rel="manifest" href="%sveltekit.assets%/manifest.json" crossorigin="use-credentials" />
-    <link rel="icon" type="image/svg+xml" href="%sveltekit.assets%/favicon/any.svg" sizes="any" />
-    <link rel="icon" type="image/png" sizes="16x16" href="%sveltekit.assets%/favicon/16x16.png" />
-    <link rel="icon" type="image/png" sizes="32x32" href="%sveltekit.assets%/favicon/32x32.png" />
-    <link rel="icon" type="image/png" sizes="96x96" href="%sveltekit.assets%/favicon/96x96.png" />
-    <link
-      rel="icon"
-      type="image/png"
-      sizes="180x180"
-      href="%sveltekit.assets%/favicon/180x180.png"
-    />
-    <link rel="apple-touch-icon" sizes="180x180" href="%sveltekit.assets%/favicon/180x180.png" />
-    <link rel="apple-touch-icon" sizes="57x57" href="%sveltekit.assets%/favicon/57x57.png" />
-    <link rel="apple-touch-icon" sizes="60x60" href="%sveltekit.assets%/favicon/60x60.png" />
-    <link rel="apple-touch-icon" sizes="72x72" href="%sveltekit.assets%/favicon/72x72.png" />
-    <link rel="apple-touch-icon" sizes="76x76" href="%sveltekit.assets%/favicon/76x76.png" />
-    <link rel="apple-touch-icon" sizes="114x114" href="%sveltekit.assets%/favicon/114x114.png" />
-    <link rel="apple-touch-icon" sizes="120x120" href="%sveltekit.assets%/favicon/120x120.png" />
-    <link rel="apple-touch-icon" sizes="144x144" href="%sveltekit.assets%/favicon/144x144.png" />
-    <link rel="apple-touch-icon" sizes="152x152" href="%sveltekit.assets%/favicon/152x152.png" />
-    <link rel="apple-touch-icon" sizes="180x180" href="%sveltekit.assets%/favicon/180x180.png" />
-    <meta name="msapplication-square70x70logo" content="%sveltekit.assets%/favicon/70x70.png" />
-    <meta name="msapplication-TileImage" content="%sveltekit.assets%/favicon/144x144.png" />
-    <meta name="msapplication-square150x150logo" content="%sveltekit.assets%/favicon/150x150.png" />
-    <meta name="msapplication-wide310x150logo" content="%sveltekit.assets%/favicon/310x150.png" />
-    <meta name="msapplication-square310x310logo" content="%sveltekit.assets%/favicon/310x310.png" />
+    <link rel="manifest" href="/manifest.json" crossorigin="use-credentials" />
+    <link rel="icon" type="image/svg+xml" href="/favicon/any.svg" sizes="any" />
+    <link rel="icon" type="image/png" sizes="16x16" href="/favicon/16x16.png" />
+    <link rel="icon" type="image/png" sizes="32x32" href="/favicon/32x32.png" />
+    <link rel="icon" type="image/png" sizes="96x96" href="/favicon/96x96.png" />
+    <link rel="icon" type="image/png" sizes="180x180" href="/favicon/180x180.png" />
+    <link rel="apple-touch-icon" sizes="180x180" href="/favicon/180x180.png" />
+    <link rel="apple-touch-icon" sizes="57x57" href="/favicon/57x57.png" />
+    <link rel="apple-touch-icon" sizes="60x60" href="/favicon/60x60.png" />
+    <link rel="apple-touch-icon" sizes="72x72" href="/favicon/72x72.png" />
+    <link rel="apple-touch-icon" sizes="76x76" href="/favicon/76x76.png" />
+    <link rel="apple-touch-icon" sizes="114x114" href="/favicon/114x114.png" />
+    <link rel="apple-touch-icon" sizes="120x120" href="/favicon/120x120.png" />
+    <link rel="apple-touch-icon" sizes="144x144" href="/favicon/144x144.png" />
+    <link rel="apple-touch-icon" sizes="152x152" href="/favicon/152x152.png" />
+    <link rel="apple-touch-icon" sizes="180x180" href="/favicon/180x180.png" />
+    <meta name="msapplication-square70x70logo" content="/favicon/70x70.png" />
+    <meta name="msapplication-TileImage" content="/favicon/144x144.png" />
+    <meta name="msapplication-square150x150logo" content="/favicon/150x150.png" />
+    <meta name="msapplication-wide310x150logo" content="/favicon/310x150.png" />
+    <meta name="msapplication-square310x310logo" content="/favicon/310x310.png" />
 
     <!-- Font-face CSS CDN -->
     <link rel="preconnect" href="https://cdn.jsdelivr.net" />

diff --git a/src/lib/assets/styles/prism.js/index.scss b/src/lib/assets/styles/prism.js/index.scss
@@ -99,7 +99,9 @@ pre[class*='language-'] {
     color: var(--hue3);
   }
 
-  &.template-string > .token.interpolation > .token.interpolation-punctuation.punctuation {
+  &.template-string
+    > .token.interpolation
+    > .token.interpolation-punctuation.punctuation {
     color: var(--hue5_2);
   }
 }
@@ -208,7 +210,9 @@ div.code-toolbar > .toolbar.toolbar > .toolbar-item {
 }
 
 .line-highlight.line-highlight,
-pre[id].linkable-line-numbers.linkable-line-numbers span.line-numbers-rows > span:hover:before {
+pre[id].linkable-line-numbers.linkable-line-numbers
+  span.line-numbers-rows
+  > span:hover:before {
   @apply bg-neutral-500 bg-opacity-80;
 }
 

diff --git a/src/lib/assets/styles/tailwind-layers/base.scss b/src/lib/assets/styles/tailwind-layers/base.scss
@@ -1,8 +1,8 @@
 @layer base {
   * {
-    font-family: 'Pretendard Variable', Pretendard, -apple-system, BlinkMacSystemFont, system-ui,
-      Roboto, 'Helvetica Neue', 'Segoe UI', 'Apple SD Gothic Neo', 'Noto Sans KR', 'Malgun Gothic',
-      sans-serif !important;
+    font-family: 'Pretendard Variable', Pretendard, -apple-system,
+      BlinkMacSystemFont, system-ui, Roboto, 'Helvetica Neue', 'Segoe UI',
+      'Apple SD Gothic Neo', 'Noto Sans KR', 'Malgun Gothic', sans-serif !important;
   }
 
   body {

diff --git a/src/lib/components/BojProblem.svelte b/src/lib/components/BojProblem.svelte
@@ -16,7 +16,11 @@
 <details open={tier !== 0}>
   <summary>
     <div class="mb-8 text-2xl font-bold">
-      <a href={`https://www.acmicpc.net/problem/${id}`} target="_blank" rel="noopener noreferrer">
+      <a
+        href={`https://www.acmicpc.net/problem/${id}`}
+        target="_blank"
+        rel="noopener noreferrer"
+      >
         <h1>
           <img
             class="inline-flex w-9"
@@ -42,14 +46,17 @@
 
     {#if data.sample}
       {#each data.sample as io_puts, i}
-        <div id="sample-{i}" class="flex flex-wrap flex-row items-start justify-between mb-8">
+        <div
+          id="sample-{i}"
+          class="flex flex-wrap flex-row items-start justify-between mb-8"
+        >
           {#each io_puts as put, j}
             <div id="sample-{i}-{j}" class="flex-1 basis-full">
               <h3 class="mb-4 pb-1 border-b-2 border-b-neutral-500">
                 {`예제 ${['입력', '출력'][j]} ${i + 1}`}
               </h3>
-              <pre class="p-2 min-h-[2rem] bg-nestable-neutral"><code class="overflow-scroll"
-                  >{put}</code
+              <pre class="p-2 min-h-[2rem] bg-nestable-neutral"><code
+                  class="overflow-scroll">{put}</code
                 ></pre>
             </div>
           {/each}

diff --git a/src/lib/components/Footer.svelte b/src/lib/components/Footer.svelte
@@ -9,9 +9,16 @@
       aria-label="김현재의 이메일"
       class="hover:text-blue-500 dark:hover:text-blue-400"
     >
-      <svg xmlns="http://www.w3.org/2000/svg" role="link" viewBox="0 0 24 24" class="w-6">
+      <svg
+        xmlns="http://www.w3.org/2000/svg"
+        role="link"
+        viewBox="0 0 24 24"
+        class="w-6"
+      >
         <g class="fill-none stroke-current stroke-round stroke-2">
-          <path d="M3 7a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V7z" />
+          <path
+            d="M3 7a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V7z"
+          />
           <path d="m3 7 9 6 9-6" />
         </g>
       </svg>
@@ -23,7 +30,12 @@
       aria-label="김현재의 깃허브"
       class="hover:text-blue-500 dark:hover:text-blue-400"
     >
-      <svg xmlns="http://www.w3.org/2000/svg" role="link" viewBox="0 0 24 24" class="w-6">
+      <svg
+        xmlns="http://www.w3.org/2000/svg"
+        role="link"
+        viewBox="0 0 24 24"
+        class="w-6"
+      >
         <g class="fill-none stroke-current stroke-round stroke-2">
           <path
             d="M9 19c-4.3 1.4-4.3-2.5-6-3m12 5v-3.5c0-1 .1-1.4-.5-2 2.8-.3 5.5-1.4 5.5-6a4.6 4.6 0 0 0-1.3-3.2 4.2 4.2 0 0 0-.1-3.2s-1.1-.3-3.5 1.3a12.3 12.3 0 0 0-6.2 0C6.5 2.8 5.4 3.1 5.4 3.1a4.2 4.2 0 0 0-.1 3.2A4.6 4.6 0 0 0 4 9.5c0 4.6 2.7 5.7 5.5 6-.6.6-.6 1.2-.5 2V21"
@@ -38,9 +50,16 @@
       aria-label="블로그 RSS XML"
       class="hover:text-blue-500 dark:hover:text-blue-400"
     >
-      <svg xmlns="http://www.w3.org/2000/svg" role="link" viewBox="0 0 24 24" class="w-6">
+      <svg
+        xmlns="http://www.w3.org/2000/svg"
+        role="link"
+        viewBox="0 0 24 24"
+        class="w-6"
+      >
         <g class="fill-none stroke-current stroke-round stroke-2">
-          <path d="M4 19a1 1 0 1 0 2 0 1 1 0 1 0-2 0M4 4a16 16 0 0 1 16 16M4 11a9 9 0 0 1 9 9" />
+          <path
+            d="M4 19a1 1 0 1 0 2 0 1 1 0 1 0-2 0M4 4a16 16 0 0 1 16 16M4 11a9 9 0 0 1 9 9"
+          />
         </g>
       </svg>
     </a>

diff --git a/src/lib/components/Nav.svelte b/src/lib/components/Nav.svelte
@@ -20,7 +20,10 @@
   onMount(() => {
     function updateReadProgress() {
       readProgress =
-        Math.min(1, window.pageYOffset / (document.body.scrollHeight - window.innerHeight)) * 100;
+        Math.min(
+          1,
+          window.pageYOffset / (document.body.scrollHeight - window.innerHeight)
+        ) * 100;
       requestAnimationFrame(() => updateReadProgress());
     }
 

diff --git a/src/lib/components/PostList.svelte b/src/lib/components/PostList.svelte
@@ -17,7 +17,9 @@
           {post.summary}
         </p>
 
-        <p class="flex text-sm text-right text-neutral-550 dark:text-neutral-350">
+        <p
+          class="flex text-sm text-right text-neutral-550 dark:text-neutral-350"
+        >
           {post.formattedDate}
         </p>
       </a>

diff --git a/src/lib/components/nav/LogoButton.svelte b/src/lib/components/nav/LogoButton.svelte
@@ -7,7 +7,11 @@
          transition-shape duration-500 ease-spring
          {shorten ? 'shorten w-8 max-xs:w-6' : ''}"
 >
-  <a href="/" data-sveltekit-preload-data="hover" aria-label="메인페이지로 이동">
+  <a
+    href="/"
+    data-sveltekit-preload-data="hover"
+    aria-label="메인페이지로 이동"
+  >
     <svg
       xmlns="http://www.w3.org/2000/svg"
       role="link"
@@ -16,7 +20,10 @@
     >
       <g class="fill-none stroke-round stroke-[6px]">
         <g id="pr">
-          <path class="stroke-emerald-900" d="M04,37 V9 l14,-4 v12 l-14,4 m11,-2 4,17" />
+          <path
+            class="stroke-emerald-900"
+            d="M04,37 V9 l14,-4 v12 l-14,4 m11,-2 4,17"
+          />
           <path class="stroke-emerald-500" d="M03,36 V8 l14,-4 v12 l-14,4" />
         </g>
         <g id="name" class="stroke-current stroke-[5px]">
@@ -42,7 +49,10 @@
           <g id="bal" class="[&>*]:translate-x-[170px]">
             <path d="M03,06 03,19 14,19 14,06 14,11 03,11" />
             <path d="M22,06 22,20 22,11 27,11" />
-            <path class="stroke-[4px]" d="M04,26 23,26 23,31 04,31 04,36 23,36" />
+            <path
+              class="stroke-[4px]"
+              d="M04,26 23,26 23,31 04,31 04,36 23,36"
+            />
           </g>
           <g id="jung" class="[&>*]:translate-x-[210px]">
             <path d="M05,07 23,07 14,07 14,12M05,17 14,12 23,17" />

diff --git a/src/lib/components/nav/ThemeButton.svelte b/src/lib/components/nav/ThemeButton.svelte
@@ -12,13 +12,25 @@
 >
   <mask id="moonMask">
     <rect class="fill-white" width="50" height="50" />
-    <circle class="fill-black origin-top-right scale-0 dark:scale-100" cx="34" cy="14" r="16" />
+    <circle
+      class="fill-black origin-top-right scale-0 dark:scale-100"
+      cx="34"
+      cy="14"
+      r="16"
+    />
   </mask>
 
   <g mask="url(#moonMask)">
-    <circle class="fill-current scale-50 dark:scale-125" cx="25" cy="25" r="16" />
+    <circle
+      class="fill-current scale-50 dark:scale-125"
+      cx="25"
+      cy="25"
+      r="16"
+    />
 
-    <g class="fill-none stroke-current stroke-round stroke-[5px] scale-100 dark:scale-0">
+    <g
+      class="fill-none stroke-current stroke-round stroke-[5px] scale-100 dark:scale-0"
+    >
       <line x1="4" y1="25" x2="12" y2="25" />
       <line x1="46" y1="25" x2="38" y2="25" />
       <line x1="25" y1="4" x2="25" y2="12" />

diff --git a/src/lib/utils/blog.ts b/src/lib/utils/blog.ts
@@ -36,15 +36,20 @@ const modules = Object.fromEntries(
   ).map(([path, b]) => [(/\/posts\/(.+?)\.md/i.exec(path) || [])[1], b])
 );
 
-const transformMetadata = (metadata: MdMetadata, permalink: string): PostMetadata => {
+const transformMetadata = (
+  metadata: MdMetadata,
+  permalink: string
+): PostMetadata => {
   return {
     ...metadata,
     formattedDate: dayjs(metadata.date).format('YYYY-MM-DD'),
     permalink
   };
 };
 
-const transformRenderResult = (renderResult: MdRenderResult): MdRenderResult => {
+const transformRenderResult = (
+  renderResult: MdRenderResult
+): MdRenderResult => {
   return {
     ...renderResult,
     html: renderResult.html.replaceAll('〈', '&lt;').replaceAll('〉', '&gt;')

diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte
@@ -25,13 +25,18 @@
   <script>
     document.documentElement.classList.add(
       localStorage.getItem('color-scheme') ||
-        (window && window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches
+        (window &&
+        window.matchMedia &&
+        window.matchMedia('(prefers-color-scheme: dark)').matches
           ? 'dark'
           : 'light')
     );
   </script>
 
-  <script async src="https://www.googletagmanager.com/gtag/js?id=G-NNGC41131C"></script>
+  <script
+    async
+    src="https://www.googletagmanager.com/gtag/js?id=G-NNGC41131C"
+  ></script>
   <script>
     window.dataLayer = window.dataLayer || [];
     function gtag() {

diff --git a/src/routes/404/+page.svelte b/src/routes/404/+page.svelte
@@ -19,13 +19,33 @@
   <defs>
     <g id="paper-file">
       <rect rx="1" class="fill-neutral-100" y="6" width="34" height="42" />
-      <rect rx="1" class="fill-none stroke-black stroke-[0.3]" y="6" width="34" height="42" />
-      <rect rx="1" class="fill-neutral-200" x="3" y="8" width="28" height="38" />
+      <rect
+        rx="1"
+        class="fill-none stroke-black stroke-[0.3]"
+        y="6"
+        width="34"
+        height="42"
+      />
+      <rect
+        rx="1"
+        class="fill-neutral-200"
+        x="3"
+        y="8"
+        width="28"
+        height="38"
+      />
       <rect rx="1" class="fill-emerald-600" x="6" y="4" width="20" height="6" />
-      <circle r="2" class="fill-none stroke-emerald-600 stroke-[1.5]" cx="16" cy="2" />
+      <circle
+        r="2"
+        class="fill-none stroke-emerald-600 stroke-[1.5]"
+        cx="16"
+        cy="2"
+      />
     </g>
   </defs>
   <use href="#paper-file" class="-rotate-12" x="-2" y="6" />
   <use href="#paper-file" x="25" y="9" />
 </svg>
-<div class="justify-center text-center text-4xl">페이지를 찾을 수 없습니다.</div>
+<div class="justify-center text-center text-4xl">
+  페이지를 찾을 수 없습니다.
+</div>
diff --git a/src/routes/boj/[id]/+page.server.ts b/src/routes/boj/[id]/+page.server.ts
@@ -1,3 +1,4 @@
 import { getBojInfoById } from '$lib/utils/boj';
 
-export const load = async ({ params }: LoadArguments) => getBojInfoById(params.id);
+export const load = async ({ params }: LoadArguments) =>
+  getBojInfoById(params.id);
diff --git a/src/routes/posts/+page.svelte b/src/routes/posts/+page.svelte
@@ -11,7 +11,10 @@
   <meta property="og:title" content="Posts - {title}" />
 
   <meta name="description" content="{title} 블로그의 포스트들을 확인해보세요" />
-  <meta property="og:description" content="{title} 블로그의 포스트들을 확인해보세요" />
+  <meta
+    property="og:description"
+    content="{title} 블로그의 포스트들을 확인해보세요"
+  />
 </svelte:head>
 
 <PostList posts={data.posts} />