From 89d00cfca6cb06754908cc17af287d7060a27560 Mon Sep 17 00:00:00 2001
From: Simo-C3 <shimomae.hitoshi210@mail.kyutech.jp>
Date: Mon, 27 Feb 2023 01:28:44 +0900
Subject: [PATCH 1/8] =?UTF-8?q?[change]=20=E4=BD=9C=E5=93=81=E4=B8=80?=
 =?UTF-8?q?=E8=A6=A7=E5=8F=96=E5=BE=97=E3=83=AC=E3=82=B9=E3=83=9D=E3=83=B3?=
 =?UTF-8?q?=E3=82=B9=E3=81=AB=E4=BD=9C=E5=93=81=E7=B7=8F=E6=95=B0=E3=81=AE?=
 =?UTF-8?q?=E3=83=87=E3=83=BC=E3=82=BF=E3=82=92=E8=BF=BD=E5=8A=A0=E3=81=A8?=
 =?UTF-8?q?=E3=83=87=E3=82=B6=E3=82=A4=E3=83=B3=E4=BF=AE=E6=AD=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 components/users/UsersProfile.vue |  2 +-
 components/works/WorksFilter.vue  |  5 ++--
 components/works/WorksList.vue    | 12 +--------
 pages/index.vue                   | 42 ++++++++++++++++++-------------
 pages/users/_id.vue               | 19 +++++++++++---
 types/index.d.ts                  |  5 ++++
 6 files changed, 50 insertions(+), 35 deletions(-)

diff --git a/components/users/UsersProfile.vue b/components/users/UsersProfile.vue
index 3268894..0d7b22d 100644
--- a/components/users/UsersProfile.vue
+++ b/components/users/UsersProfile.vue
@@ -2,7 +2,7 @@
   <div
     v-if="user !== undefined"
     class="
-      max-w-[900px]
+      max-w-full
       w-[95vw]
       flex flex-col
       content-center
diff --git a/components/works/WorksFilter.vue b/components/works/WorksFilter.vue
index 19afe55..cd2501a 100644
--- a/components/works/WorksFilter.vue
+++ b/components/works/WorksFilter.vue
@@ -6,12 +6,11 @@
       px-10
       py-5
       w-[95vw]
-      max-w-[45rem]
+      max-w-full
       mx-auto
       relative
       bg-white
     "
-    :class="getNowLogin ? 'py-5' : 'pt-5 pb-12'"
   >
     <p>絞り込み</p>
     <div class="flex items-center my-3 w-full mb-6">
@@ -33,7 +32,7 @@
         @click="onClickFilterVisibilities(visibility)"
       />
     </div>
-    <div class="absolute bottom-7 right-10 flex items-center">
+    <div class="flex items-center justify-end">
       <div
         class="cursor-pointer"
         :class="{
diff --git a/components/works/WorksList.vue b/components/works/WorksList.vue
index e11b906..01359a2 100644
--- a/components/works/WorksList.vue
+++ b/components/works/WorksList.vue
@@ -1,15 +1,5 @@
 <template>
-  <div
-    class="
-      c-grid
-      py-5
-      px-2
-      [--card-w:18rem] [--card-h:22rem]
-      z-0
-      max-w-[980px]
-      mx-auto
-    "
-  >
+  <div class="c-grid py-5 px-2 [--card-w:18rem] [--card-h:22rem] z-0 mx-auto">
     <works-card v-for="(work, index) in works" :key="index" :work-data="work" />
   </div>
 </template>
diff --git a/pages/index.vue b/pages/index.vue
index ce6acb2..5ccdbfe 100644
--- a/pages/index.vue
+++ b/pages/index.vue
@@ -1,16 +1,14 @@
 <template>
-  <div>
-    <works-filter
-      :include-draft="false"
-      class="mb-10"
-      @search="searchWorks"
-      @clear="clear"
-    />
+  <div class="!max-w-[1220px]">
+    <works-filter :include-draft="false" @search="searchWorks" @clear="clear" />
+    <div class="px-10 text-end my-3 text-gray-600">
+      {{ getWorksLength }} / {{ works_total_count }}
+    </div>
     <div class="relative w-full min-h-[50vh]" ref="workList">
       <works-list v-if="!processing" :works="works" />
       <loading v-else />
     </div>
-    <div v-if="nextContentLoadProcessing" class="relative w-full h-28">
+    <div v-if="nextContentLoadProcessing" class="relative w-full">
       <loading />
     </div>
     <div
@@ -29,7 +27,7 @@ import WorksFilter from '@/components/works/WorksFilter.vue'
 import WorksList from '@/components/works/WorksList.vue'
 import Loading from '@/components/commons/Loading.vue'
 
-import { Work } from '@/types'
+import { Work, Works } from '@/types'
 import { authStore, tagSelectorStore, workFilterStore } from '@/store'
 import { AxiosClient } from '@/utils/axios'
 import { Query } from '@/utils/query'
@@ -65,11 +63,15 @@ import { Query } from '@/utils/query'
       alert('作品一覧の取得に失敗しました')
     }
 
-    return { works: resWorks.data }
+    return {
+      works: resWorks.data.works,
+      works_total_count: resWorks.data.works_total_count
+    }
   }
 })
 export default class Index extends Vue {
   works: Array<Work> = []
+  works_total_count: number = 0
   query: Query = new Query()
   processing: boolean = false
   scrollY: number = 0
@@ -96,6 +98,10 @@ export default class Index extends Vue {
     return workFilterStore.getOnPageName
   }
 
+  get getWorksLength() {
+    return this.works.length
+  }
+
   @Watch('scrollY')
   handleBottom() {
     if (this.workList) {
@@ -139,19 +145,20 @@ export default class Index extends Vue {
       undefined,
       this.limit
     )
-    const resWorks = await AxiosClient.client(
+    const res = await AxiosClient.client(
       'GET',
       `/works${this.query.getQuery()}`,
       true
     )
-    if (resWorks.status !== 200) {
+    if (res.status !== 200) {
       alert('作品一覧の取得に失敗しました')
     }
+    const resWorks: Works = res.data.works
     setTimeout(() => {
-      if (resWorks.data.length === 0) {
+      if (resWorks.works.length === 0) {
         this.isWorksEmpty = true
       } else {
-        resWorks.data.map((item: Work) => {
+        resWorks.works.map((item: Work) => {
           this.works.push(item)
         })
       }
@@ -173,19 +180,20 @@ export default class Index extends Vue {
       undefined,
       this.limit
     )
-    const resWorks = await AxiosClient.client(
+    const res = await AxiosClient.client(
       'GET',
       `/works${this.query.getQuery()}`,
       this.getNowLogin ? true : false
     )
-    if (resWorks.status !== 200) {
+    if (res.status !== 200) {
       alert('作品一覧の取得に失敗しました')
     }
     if (this.works.length < this.limit) {
       this.isWorksEmpty = true
     }
     this.works.splice(0)
-    this.works = resWorks.data
+    this.works = res.data.works
+    this.works_total_count = res.data.works_total_count
     this.processing = false
   }
 
diff --git a/pages/users/_id.vue b/pages/users/_id.vue
index 673fd65..469aa30 100644
--- a/pages/users/_id.vue
+++ b/pages/users/_id.vue
@@ -1,5 +1,5 @@
 <template>
-  <div>
+  <div class="!max-w-[1220px]">
     <users-profile :user="user" />
     <works-filter
       :include-draft="getUser.id === $route.params.id"
@@ -7,6 +7,9 @@
       @clear="clear"
       id="user_work"
     />
+    <div class="px-10 text-end my-3 text-gray-600">
+      {{ getWorksLength }} / {{ works_total_count }}
+    </div>
     <div class="relative w-full min-h-[50vh]">
       <works-list v-if="!processing" :works="works" />
       <loading v-else />
@@ -81,11 +84,16 @@ import { Query } from '@/utils/query'
     if (!resWorks.data) {
       alert('ユーザーの作品情報の取得に失敗しました')
     }
-    return { works: resWorks.data, user: resUser.data }
+    return {
+      works: resWorks.data.works,
+      works_total_count: resWorks.data.works_total_count,
+      user: resUser.data
+    }
   }
 })
 export default class Users extends Vue {
   works!: Work[]
+  works_total_count: number = 0
   user!: User
   userWorksCount: number = 6
   userWorks: string[] = Array(this.userWorksCount)
@@ -108,6 +116,10 @@ export default class Users extends Vue {
     return workFilterStore.getFilterVisibility
   }
 
+  get getWorksLength() {
+    return this.works.length
+  }
+
   head() {
     const title: string = `ToyBox ユーザー - ${this.user.display_name}`
     const url: string = `${process.env.BASE_URL}users/${this.user.id}`
@@ -186,7 +198,8 @@ export default class Users extends Vue {
         alert('作品一覧の取得に失敗しました')
       }
       this.works.splice(0)
-      this.works = resWorks.data
+      this.works = resWorks.data.works
+      this.works_total_count = resWorks.data.works_total_count
       this.processing = false
     }
   }
diff --git a/types/index.d.ts b/types/index.d.ts
index abe8156..3fe75fc 100644
--- a/types/index.d.ts
+++ b/types/index.d.ts
@@ -173,3 +173,8 @@ export type Work = {
   created_at: string
   updated_at: string
 }
+
+export type Works = {
+  works: Work[]
+  works_total_count: number
+}

From 758a8835d9104e42a47c365b0d8467f805ec0d7a Mon Sep 17 00:00:00 2001
From: Simo-C3 <shimomae.hitoshi210@mail.kyutech.jp>
Date: Thu, 16 Mar 2023 11:31:46 +0900
Subject: [PATCH 2/8] =?UTF-8?q?[change]=20=E3=83=98=E3=83=83=E3=83=80?=
 =?UTF-8?q?=E3=83=BC=E3=81=AE=E3=83=AC=E3=82=B9=E3=83=9D=E3=83=B3=E3=82=B7?=
 =?UTF-8?q?=E3=83=96=E5=AF=BE=E5=BF=9C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 components/Header.vue | 389 ++++++++++++++++++++++++++----------------
 1 file changed, 239 insertions(+), 150 deletions(-)

diff --git a/components/Header.vue b/components/Header.vue
index 4ceb5bc..0fed6ad 100644
--- a/components/Header.vue
+++ b/components/Header.vue
@@ -1,11 +1,25 @@
 <template>
-  <header class="py-3 text-center justify-around flex w-full h-24 relative">
-    <div
-      v-if="!nowLogin"
-      class="triangle absolute -top-5 -right-10"
-      @click="$router.push('/login')"
-    ></div>
-    <div class="h-24 absolute top-0 left-1/2 -translate-x-1/2">
+  <div>
+    <header
+      class="
+        py-3
+        px-10
+        mx-auto
+        text-center
+        flex
+        w-full
+        max-w-[1000px]
+        h-[20vw]
+        min-h-[4rem]
+        max-h-24
+        relative
+      "
+    >
+      <div
+        v-if="!nowLogin"
+        class="triangle absolute -top-5 -right-10"
+        @click="$router.push('/login')"
+      />
       <nuxt-link to="/" class="hover:opacity-50 h-full">
         <img
           src="@/assets/image/ToyBoxlogo.png"
@@ -13,174 +27,236 @@
           alt="ToyBox logo"
         />
       </nuxt-link>
-    </div>
-    <div
-      class="flex justify-start items-center absolute right-10 top-0 bottom-0"
-    >
-      <!-- バグ・要望フォーム -->
-      <a
-        v-if="nowLogin"
-        href="https://forms.gle/ndPfoZNgUFqrJHQj8"
-        target="_blank"
-        title="バグ・要望フォーム"
-        name="バグ・要望フォーム"
-        charset="UTF-8"
-        type="text/html"
-        class="
-          mr-5
-          text-base-light-text-color
-          hover:text-hover-base-text-color
-          flex
-          justify-center
-        "
-      >
-        <span class="text-xs mr-2">バグ・要望フォーム</span>
-        <font-awesome-icon :icon="['fas', 'vote-yea']" class="w-5 m-0" />
-      </a>
-      <!-- ヘルプ -->
-      <a
-        :href="
-          nowLogin
-            ? 'https://chivalrous-botany-faf.notion.site/ToyBox-876fd578573a418b99bbfe6d3973aa91'
-            : 'https://chivalrous-botany-faf.notion.site/ToyBox-8ee26f10ff4e45d9aa19a69850b7e68d'
-        "
-        target="_blank"
-        title="ヘルプ"
-        name="ヘルプ"
-        charset="UTF-8"
-        type="text/html"
-        class="mr-5"
+      <div
+        class="flex justify-start items-center absolute right-10 top-0 bottom-0"
       >
-        <font-awesome-icon
-          :icon="['far', 'question-circle']"
+        <!-- バグ・要望フォーム -->
+        <a
+          v-if="nowLogin && windowWidth >= 650"
+          href="https://forms.gle/ndPfoZNgUFqrJHQj8"
+          target="_blank"
+          title="バグ・要望フォーム"
+          name="バグ・要望フォーム"
+          charset="UTF-8"
+          type="text/html"
           class="
-            w-5
+            mr-5
             text-base-light-text-color
             hover:text-hover-base-text-color
+            flex
+            justify-center
           "
-        />
-      </a>
-      <!-- not logged in  -->
-      <div v-if="$route.path !== '/works/create'">
-        <base-text-button
-          v-if="nowLogin"
+        >
+          <span class="text-xs mr-2">バグ・要望フォーム</span>
+          <font-awesome-icon :icon="['fas', 'vote-yea']" class="w-5 m-0" />
+        </a>
+        <!-- ヘルプ -->
+        <a
+          v-if="!nowLogin || windowWidth >= 650"
+          :href="
+            nowLogin
+              ? 'https://chivalrous-botany-faf.notion.site/ToyBox-876fd578573a418b99bbfe6d3973aa91'
+              : 'https://chivalrous-botany-faf.notion.site/ToyBox-8ee26f10ff4e45d9aa19a69850b7e68d'
+          "
+          target="_blank"
+          title="ヘルプ"
+          name="ヘルプ"
+          charset="UTF-8"
+          type="text/html"
           class="mr-5"
-          title="投稿"
-          @click="$router.push('/works/create')"
-        />
+        >
+          <font-awesome-icon
+            :icon="['far', 'question-circle']"
+            class="
+              w-5
+              text-base-light-text-color
+              hover:text-hover-base-text-color
+            "
+          />
+        </a>
+        <!-- not logged in  -->
+        <div v-if="$route.path !== '/works/create'">
+          <base-text-button
+            v-if="nowLogin"
+            class="mr-5"
+            title="投稿"
+            @click="$router.push('/works/create')"
+          />
+        </div>
+        <!-- logged in -->
+        <button class="hover:opacity-60 transition" @click="activeNav = true">
+          <img
+            v-if="nowLogin"
+            :src="getIcon"
+            class="
+              rounded-full
+              w-12
+              h-12
+              cursor-pointer
+              pointer-events-none
+              shadow-md
+              bg-white
+            "
+            alt="user icon"
+          />
+        </button>
       </div>
-      <!-- logged in -->
-      <button class="hover:opacity-60 transition" @click="activeNav = true">
+      <!-- navigation -->
+      <div
+        v-if="activeNav"
+        class="
+          shadow-2xl
+          rounded-xl
+          absolute
+          top-24
+          right-6
+          w-72
+          py-5
+          px-8
+          bg-gray-700
+          opacity-90
+          z-50
+          menu
+        "
+      >
+        <!-- icon -->
         <img
-          v-if="nowLogin"
           :src="getIcon"
-          class="
-            rounded-full
-            w-12
-            h-12
-            cursor-pointer
-            pointer-events-none
-            shadow-md
-            bg-white
-          "
+          class="rounded-full w-16 h-16 mx-auto my-1 pointer-events-none"
           alt="user icon"
         />
-      </button>
-    </div>
-    <!-- navigation -->
-    <div
-      v-if="activeNav"
-      class="
-        shadow-2xl
-        rounded-xl
-        absolute
-        top-24
-        right-6
-        w-60
-        py-5
-        px-8
-        bg-gray-700
-        opacity-90
-        z-50
-        menu
-      "
-    >
-      <!-- icon -->
-      <img
-        :src="getIcon"
-        class="rounded-full w-16 h-16 mx-auto my-1 pointer-events-none"
-        alt="user icon"
-      />
-      <!-- name -->
-      <div class="text-gray-200 mb-6">
-        {{ getDisplayName }}
-      </div>
-      <div class="border-solid border-b border-gray-200 w-10/12 my-1 mx-auto" />
-      <div @click="activeNav = !activeNav">
-        <!-- my profile link -->
+        <!-- name -->
+        <div class="text-gray-200 mb-6">
+          {{ getDisplayName }}
+        </div>
         <div
-          class="
-            grid
-            py-1
-            px-2
-            my-3
-            mx-auto
-            rounded
-            hover:text-white
-            hover:underline
-            text-gray-200
-          "
-          @click="toDraftPage"
-        >
-          下書き
+          class="border-solid border-b border-gray-200 w-10/12 my-1 mx-auto"
+        />
+        <div @click="activeNav = !activeNav">
+          <!-- my profile link -->
+          <div
+            class="
+              grid
+              py-1
+              px-2
+              my-3
+              mx-auto
+              hover:text-white
+              hover:underline
+              text-gray-200
+            "
+            @click="toDraftPage"
+          >
+            下書き
+          </div>
         </div>
-      </div>
-      <div @click="activeNav = !activeNav">
-        <!-- my profile link -->
-        <nuxt-link
+        <div @click="activeNav = !activeNav">
+          <!-- my profile link -->
+          <nuxt-link
+            class="
+              grid
+              py-1
+              px-2
+              my-3
+              mx-auto
+              hover:text-white
+              hover:underline
+              text-gray-200
+            "
+            :to="`/users/${getUserId}`"
+          >
+            マイページ
+          </nuxt-link>
+        </div>
+        <div
+          v-if="windowWidth < 650"
+          class="border-solid border-b border-gray-200 w-10/12 my-1 mx-auto"
+        />
+        <div v-if="windowWidth < 650" @click="activeNav = !activeNav">
+          <!-- バグ・要望フォーム -->
+          <a
+            href="https://forms.gle/ndPfoZNgUFqrJHQj8"
+            target="_blank"
+            title="バグ・要望フォーム"
+            name="バグ・要望フォーム"
+            charset="UTF-8"
+            type="text/html"
+            class="
+              py-1
+              px-2
+              my-3
+              mx-auto
+              flex
+              justify-center
+              hover:text-white
+              text-gray-200
+              hover:underline
+            "
+          >
+            <font-awesome-icon :icon="['fas', 'vote-yea']" class="w-5 m-0" />
+            <span class="ml-2">バグ・要望フォーム</span>
+          </a>
+          <!-- ヘルプ -->
+          <a
+            :href="
+              nowLogin
+                ? 'https://chivalrous-botany-faf.notion.site/ToyBox-876fd578573a418b99bbfe6d3973aa91'
+                : 'https://chivalrous-botany-faf.notion.site/ToyBox-8ee26f10ff4e45d9aa19a69850b7e68d'
+            "
+            target="_blank"
+            title="ヘルプ"
+            name="ヘルプ"
+            charset="UTF-8"
+            type="text/html"
+            class="
+              py-1
+              px-2
+              my-3
+              mx-auto
+              flex
+              justify-center
+              hover:text-white
+              text-gray-200
+              hover:underline
+            "
+          >
+            <font-awesome-icon
+              :icon="['far', 'question-circle']"
+              class="w-5 m-0"
+            />
+            <span class="ml-2">ヘルプ</span>
+          </a>
+        </div>
+        <div
+          class="border-solid border-b border-gray-200 w-10/12 my-1 mx-auto"
+        />
+        <!-- logout button -->
+        <button
           class="
-            grid
             py-1
-            px-2
-            my-3
-            mx-auto
+            px-5
+            mt-5
+            mb-2
             rounded
+            bg-transparent
             hover:text-white
-            hover:underline
+            hover:border-2
+            transition
+            border-solid border border-gray-200
             text-gray-200
           "
-          :to="`/users/${getUserId}`"
+          @click="clickLogout"
         >
-          マイページ
-        </nuxt-link>
+          ログアウト
+        </button>
       </div>
-      <div class="border-solid border-b border-gray-200 w-10/12 my-1 mx-auto" />
-      <!-- logout button -->
-      <button
-        class="
-          py-1
-          px-5
-          mt-5
-          mb-2
-          rounded
-          bg-transparent
-          hover:text-white
-          hover:border-2
-          transition
-          border-solid border border-gray-200
-          text-gray-200
-        "
-        @click="clickLogout"
-      >
-        ログアウト
-      </button>
-    </div>
+    </header>
     <div
       v-if="activeNav"
-      class="fixed w-full h-full z-40"
+      class="fixed top-0 left-0 w-full h-full z-40"
       @click="activeNav = !activeNav"
     />
-  </header>
+  </div>
 </template>
 
 <script lang="ts">
@@ -195,6 +271,7 @@ import { authStore, workFilterStore } from '@/store'
 })
 export default class Header extends Vue {
   activeNav: Boolean = false
+  windowWidth: number = window.innerWidth
 
   get nowLogin() {
     return authStore.nowLogin
@@ -212,6 +289,18 @@ export default class Header extends Vue {
     return authStore.getUser.id
   }
 
+  mounted() {
+    addEventListener('resize', this.handleChangeWindowWidth)
+  }
+
+  destroyed() {
+    removeEventListener('resize', this.handleChangeWindowWidth)
+  }
+
+  handleChangeWindowWidth() {
+    this.windowWidth = window.innerWidth
+  }
+
   toDraftPage() {
     workFilterStore.setOnPageName('menu')
     workFilterStore.setFilterVisibility('draft')

From 4ddb048ce5bd2a5baf67e1f3fbbbcf1843dc6b20 Mon Sep 17 00:00:00 2001
From: Simo-C3 <shimomae.hitoshi210@mail.kyutech.jp>
Date: Sat, 15 Apr 2023 16:14:24 +0900
Subject: [PATCH 3/8] =?UTF-8?q?[change]=20=E3=83=9E=E3=83=BC=E3=82=AF?=
 =?UTF-8?q?=E3=83=80=E3=82=A6=E3=83=B3=E3=83=93=E3=83=A5=E3=83=BC=E3=81=AE?=
 =?UTF-8?q?=E3=82=B3=E3=83=BC=E3=83=89=E3=83=96=E3=83=AD=E3=83=83=E3=82=AF?=
 =?UTF-8?q?=E5=AF=BE=E5=BF=9C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 components/commons/MarkdownView.vue | 202 +++++++++++++++++-----------
 nuxt.config.js                      |   3 +-
 package.json                        |   2 +
 plugins/prism.ts                    |  53 ++++++++
 yarn.lock                           |  10 ++
 5 files changed, 187 insertions(+), 83 deletions(-)
 create mode 100644 plugins/prism.ts

diff --git a/components/commons/MarkdownView.vue b/components/commons/MarkdownView.vue
index e0f67bd..4f480cb 100644
--- a/components/commons/MarkdownView.vue
+++ b/components/commons/MarkdownView.vue
@@ -49,6 +49,8 @@
 <script lang="ts">
 import { Vue, Component, Prop, Ref } from 'nuxt-property-decorator'
 
+import Prism from '@/plugins/prism'
+
 @Component
 export default class MarkdownView extends Vue {
   showAll: boolean = false
@@ -61,13 +63,14 @@ export default class MarkdownView extends Vue {
 
   mounted() {
     this.markdownViewHeiht = this.markdownView.getBoundingClientRect().height
+    Prism.highlightAll()
   }
 }
 </script>
 
 <style lang="scss">
 .hidden-blur::before {
-  background: linear-gradient(to top, #ffffff 30%, #ffffff51 100%);
+  background: linear-gradient(to top, #ffffff 20%, #ffffff00 100%);
   position: absolute;
   bottom: 0;
   left: 0;
@@ -76,108 +79,143 @@ export default class MarkdownView extends Vue {
   width: 100%;
 }
 
-.markdown-view ol {
-  @apply list-decimal;
-  @apply pl-10;
-}
+.markdown-view {
+  @apply text-xl;
+  @apply break-words;
 
-.markdown-view ul {
-  @apply list-disc;
-  @apply pl-10;
-}
+  ol {
+    @apply list-decimal;
+    @apply pl-10;
+  }
 
-.markdown-view h1 {
-  @apply text-4xl;
-  @apply font-semibold;
-}
+  ul {
+    @apply list-disc;
+    @apply pl-10;
+  }
 
-.markdown-view h2 {
-  @apply text-3xl;
-  @apply font-semibold;
-}
+  h1 {
+    @apply text-6xl;
+  }
 
-.markdown-view h3 {
-  @apply text-2xl;
-  @apply font-semibold;
-}
+  h2 {
+    @apply text-5xl;
+  }
 
-.markdown-view {
-  @apply text-xl;
-}
-.markdown-view {
-  overflow-wrap: break-word;
-}
-.markdown-view h1,
-h2,
-h3 {
-  border-bottom: dotted 3px rgb(96, 170, 255);
-  margin-bottom: 10px;
-  padding-bottom: 5px;
-  padding-top: 10px;
-}
+  h3 {
+    @apply text-4xl;
+  }
 
-.markdown-view p {
-  margin-bottom: 20px;
-  margin-top: 5px;
-  font-size: medium;
-}
+  h1,
+  h2,
+  h3 {
+    --bg-color: rgb(96, 170, 255);
+    @apply font-semibold;
+    @apply border-b-[3px];
+    @apply border-b-bg-color;
+    @apply border-dotted;
+    @apply mb-6;
+    @apply pb-[5px];
+    @apply pt-[10px];
+  }
+
+  p {
+    @apply mb-5;
+    @apply mt-[5px];
+
+    code {
+      @apply bg-[#f0f0f0];
+      @apply py-[1px];
+      @apply px-[5px];
+      @apply rounded-[5px];
+      @apply text-[#905];
+    }
+  }
+
+  pre {
+    @apply rounded-2xl;
+    code {
+      @apply text-base;
+    }
+  }
 
-.markdown-view hr {
-  border-bottom: dotted 3px rgb(96, 170, 255);
-  border-right: none;
-  border-top: none;
-  border-left: none;
+  hr {
+    --bg-color: rgb(96, 170, 255);
+    @apply border-b-[3px];
+    @apply border-b-bg-color;
+    @apply border-dotted;
+    @apply my-8;
+    @apply mx-0;
+  }
 }
-.markdown-view p img {
-  display: block;
-  width: 80%;
-  height: auto;
-  margin: 0 auto;
-  border-radius: 20px;
-  pointer-events: none;
+
+.markdown-view img {
+  @apply block;
+  @apply w-4/5;
+  @apply h-auto;
+  @apply my-0;
+  @apply mx-auto;
+  @apply rounded-[20px];
+  @apply pointer-events-none;
 }
+
 table {
-  border-collapse: collapse;
-  border: 1px solid rgb(198, 198, 198);
-  margin: 0 auto;
-  border-radius: 10px;
-  overflow: hidden;
+  --bg-color: rgb(198, 198, 198);
+  @apply border-collapse;
+  @apply border;
+  @apply border-bg-color;
+  @apply my-6;
+  @apply mx-auto;
+  @apply rounded-[10px];
+  @apply overflow-hidden;
   box-shadow: 0 0 0 1px rgb(198, 198, 198);
 }
 
 th,
 td {
-  padding: 5px 10px;
-  border: 1px solid rgb(198, 198, 198);
+  --bg-color: rgb(198, 198, 198);
+  @apply py-[5px];
+  @apply px-[10px];
+  @apply border;
+  @apply border-bg-color;
 }
 
 th {
-  background: #ebf8ff;
+  @apply bg-[#ebf8ff];
 }
+
 @media screen and (max-width: 600px) {
-  .markdown-view h1,
-  h2,
-  h3 {
-    padding: 0 5px;
-  }
-  .markdown-view p img {
-    width: 90%;
-    border-radius: 10px;
+  .markdown-view {
+    h1,
+    h2,
+    h3 {
+      @apply py-0;
+      @apply px-[5px];
+    }
+
+    p {
+      @apply my-0;
+      @apply mx-auto;
+    }
+
+    blockquote {
+      p {
+        @apply w-full;
+        @apply my-4;
+        @apply mx-0;
+      }
+    }
+
+    p,
+    blockquote {
+      @apply w-[95%];
+      @apply my-8;
+      @apply mx-auto;
+    }
   }
-  .markdown-view p,
-  blockquote {
-    width: 95%;
-  }
-  .markdown-view p {
-    margin: 0 auto;
-  }
-  .markdown-view p,
-  blockquote {
-    margin: 2rem auto;
-  }
-  .markdown-view blockquote p {
-    width: 100%;
-    margin: 1rem 0;
+
+  .markdown-view img {
+    @apply w-[90%];
+    @apply rounded-[10px];
   }
 }
 </style>
diff --git a/nuxt.config.js b/nuxt.config.js
index 1ec656f..74d2e3f 100644
--- a/nuxt.config.js
+++ b/nuxt.config.js
@@ -75,7 +75,8 @@ export default {
     { src: '~/plugins/mavonEditor.ts', mode: 'client' },
     { src: '~/plugins/localStorage.ts', mode: 'client' },
     { src: '~/plugins/three.ts', mode: 'client' },
-    { src: '~/plugins/dayjs.ts', mode: 'client' }
+    { src: '~/plugins/dayjs.ts', mode: 'client' },
+    { src: '~/plugins/prism.ts', mode: 'client' }
   ],
 
   // Auto import components: https://go.nuxtjs.dev/config-components
diff --git a/package.json b/package.json
index ef67a31..f25834d 100644
--- a/package.json
+++ b/package.json
@@ -32,6 +32,7 @@
     "@nuxtjs/google-gtag": "^1.0.4",
     "@nuxtjs/markdownit": "^2.0.0",
     "@types/file-saver": "^2.0.5",
+    "@types/prismjs": "^1.26.0",
     "@types/three": "^0.146.0",
     "core-js": "^3.26.1",
     "dayjs": "^1.11.6",
@@ -42,6 +43,7 @@
     "nuxt": "^2.15.8",
     "nuxt-fontawesome": "^0.4.0",
     "nuxt-property-decorator": "^2.9.1",
+    "prismjs": "^1.29.0",
     "swiper": "^8.4.5",
     "three": "^0.146.0",
     "tsparticles": "^2.5.3",
diff --git a/plugins/prism.ts b/plugins/prism.ts
new file mode 100644
index 0000000..56c6a16
--- /dev/null
+++ b/plugins/prism.ts
@@ -0,0 +1,53 @@
+import Prism from 'prismjs'
+// テーマ
+import 'prismjs/themes/prism.css'
+
+// 言語ハイライト
+import 'prismjs/components/prism-bash'
+import 'prismjs/components/prism-docker'
+import 'prismjs/components/prism-kotlin'
+import 'prismjs/components/prism-python'
+import 'prismjs/components/prism-sql'
+import 'prismjs/components/prism-swift'
+import 'prismjs/components/prism-yaml'
+import 'prismjs/components/prism-rust'
+import 'prismjs/components/prism-c'
+import 'prismjs/components/prism-nasm'
+import 'prismjs/components/prism-ruby'
+import 'prismjs/components/prism-go'
+import 'prismjs/components/prism-markup'
+import 'prismjs/components/prism-css'
+import 'prismjs/components/prism-csharp'
+import 'prismjs/components/prism-cpp'
+import 'prismjs/components/prism-java'
+import 'prismjs/components/prism-javascript'
+import 'prismjs/components/prism-typescript'
+import 'prismjs/components/prism-jsx'
+import 'prismjs/components/prism-sass'
+import 'prismjs/components/prism-json'
+import 'prismjs/components/prism-scss'
+import 'prismjs/components/prism-vim'
+import 'prismjs/components/prism-toml'
+import 'prismjs/components/prism-haml'
+import 'prismjs/components/prism-markdown'
+import 'prismjs/components/prism-cobol'
+import 'prismjs/components/prism-lua'
+import 'prismjs/components/prism-brainfuck'
+import 'prismjs/components/prism-scala'
+import 'prismjs/components/prism-uri'
+import 'prismjs/components/prism-csv'
+import 'prismjs/components/prism-dart'
+import 'prismjs/components/prism-graphql'
+import 'prismjs/components/prism-go-module'
+import 'prismjs/components/prism-ignore'
+import 'prismjs/components/prism-ini'
+import 'prismjs/components/prism-perl'
+import 'prismjs/components/prism-visual-basic'
+import 'prismjs/components/prism-matlab'
+import 'prismjs/components/prism-tsx'
+import 'prismjs/components/prism-markup-templating'
+import 'prismjs/components/prism-php'
+
+// 機能拡張
+
+export default Prism
diff --git a/yarn.lock b/yarn.lock
index 819ae33..b53473b 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -3665,6 +3665,11 @@
   resolved "https://registry.yarnpkg.com/@types/pretty-hrtime/-/pretty-hrtime-1.0.1.tgz#72a26101dc567b0d68fd956cf42314556e42d601"
   integrity sha512-VjID5MJb1eGKthz2qUerWT8+R4b9N+CHvGCzg9fn4kWZgaF9AhdYikQio3R7wV8YY1NsQKPaCwKz1Yff+aHNUQ==
 
+"@types/prismjs@^1.26.0":
+  version "1.26.0"
+  resolved "https://registry.yarnpkg.com/@types/prismjs/-/prismjs-1.26.0.tgz#a1c3809b0ad61c62cac6d4e0c56d610c910b7654"
+  integrity sha512-ZTaqn/qSqUuAq1YwvOFQfVW1AR/oQJlLSZVustdjwI+GZ8kr0MSHBj0tsXPW1EqHubx50gtBEjbPGsdZwQwCjQ==
+
 "@types/pug@2.0.4":
   version "2.0.4"
   resolved "https://registry.yarnpkg.com/@types/pug/-/pug-2.0.4.tgz#8772fcd0418e3cd2cc171555d73007415051f4b2"
@@ -13080,6 +13085,11 @@ pretty-time@^1.1.0:
   resolved "https://registry.yarnpkg.com/pretty-time/-/pretty-time-1.1.0.tgz#ffb7429afabb8535c346a34e41873adf3d74dd0e"
   integrity sha512-28iF6xPQrP8Oa6uxE6a1biz+lWeTOAPKggvjB8HAs6nVMKZwf5bG++632Dx614hIWgUPkgivRfG+a8uAXGTIbA==
 
+prismjs@^1.29.0:
+  version "1.29.0"
+  resolved "https://registry.yarnpkg.com/prismjs/-/prismjs-1.29.0.tgz#f113555a8fa9b57c35e637bba27509dcf802dd12"
+  integrity sha512-Kx/1w86q/epKcmte75LNrEoT+lX8pBpavuAbvJWRXar7Hz8jrtF+e3vY751p0R8H9HdArwaCTNDDzHg/ScJK1Q==
+
 private@^0.1.8:
   version "0.1.8"
   resolved "https://registry.yarnpkg.com/private/-/private-0.1.8.tgz#2381edb3689f7a53d653190060fcf822d2f368ff"

From d23a5f7c045489b7f71104465bcbf27d40dd8790 Mon Sep 17 00:00:00 2001
From: Simo-C3 <shimomae.hitoshi210@mail.kyutech.jp>
Date: Sat, 15 Apr 2023 16:15:04 +0900
Subject: [PATCH 4/8] =?UTF-8?q?[change]=20=E3=83=90=E3=83=83=E3=82=AF?=
 =?UTF-8?q?=E3=82=A8=E3=83=B3=E3=83=89=E3=81=AE=E4=BF=AE=E6=AD=A3=E3=81=AB?=
 =?UTF-8?q?=E4=BC=B4=E3=81=86=E4=BF=AE=E6=AD=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 pages/index.vue  | 22 +++++++++++-----------
 types/index.d.ts |  5 +++++
 2 files changed, 16 insertions(+), 11 deletions(-)

diff --git a/pages/index.vue b/pages/index.vue
index ce6acb2..9218f91 100644
--- a/pages/index.vue
+++ b/pages/index.vue
@@ -7,7 +7,7 @@
       @clear="clear"
     />
     <div class="relative w-full min-h-[50vh]" ref="workList">
-      <works-list v-if="!processing" :works="works" />
+      <works-list v-if="!processing" :works="resWorks.works" />
       <loading v-else />
     </div>
     <div v-if="nextContentLoadProcessing" class="relative w-full h-28">
@@ -29,7 +29,7 @@ import WorksFilter from '@/components/works/WorksFilter.vue'
 import WorksList from '@/components/works/WorksList.vue'
 import Loading from '@/components/commons/Loading.vue'
 
-import { Work } from '@/types'
+import { Work, ResWorks } from '@/types'
 import { authStore, tagSelectorStore, workFilterStore } from '@/store'
 import { AxiosClient } from '@/utils/axios'
 import { Query } from '@/utils/query'
@@ -65,11 +65,11 @@ import { Query } from '@/utils/query'
       alert('作品一覧の取得に失敗しました')
     }
 
-    return { works: resWorks.data }
+    return { resWorks: resWorks.data }
   }
 })
 export default class Index extends Vue {
-  works: Array<Work> = []
+  resWorks!: ResWorks
   query: Query = new Query()
   processing: boolean = false
   scrollY: number = 0
@@ -110,7 +110,7 @@ export default class Index extends Vue {
   }
 
   created() {
-    if (this.works.length < this.limit) {
+    if (this.resWorks.works.length < this.limit) {
       this.isWorksEmpty = true
     }
     workFilterStore.setSearched(true)
@@ -118,7 +118,7 @@ export default class Index extends Vue {
 
   mounted() {
     window.addEventListener('scroll', this.handleScroll)
-    if (this.works.length < this.limit) {
+    if (this.resWorks.works.length < this.limit) {
       this.isWorksEmpty = true
     }
   }
@@ -133,7 +133,7 @@ export default class Index extends Vue {
     this.query.create(
       this.getSelectedTags,
       this.getFilterVisibility,
-      this.works[this.works.length - 1].id,
+      this.resWorks.works[this.resWorks.works.length - 1].id,
       undefined,
       undefined,
       undefined,
@@ -152,7 +152,7 @@ export default class Index extends Vue {
         this.isWorksEmpty = true
       } else {
         resWorks.data.map((item: Work) => {
-          this.works.push(item)
+          this.resWorks.works.push(item)
         })
       }
       this.nextContentLoadProcessing = false
@@ -181,11 +181,11 @@ export default class Index extends Vue {
     if (resWorks.status !== 200) {
       alert('作品一覧の取得に失敗しました')
     }
-    if (this.works.length < this.limit) {
+    if (this.resWorks.works.length < this.limit) {
       this.isWorksEmpty = true
     }
-    this.works.splice(0)
-    this.works = resWorks.data
+    this.resWorks.works.splice(0)
+    this.resWorks.works = resWorks.data
     this.processing = false
   }
 
diff --git a/types/index.d.ts b/types/index.d.ts
index abe8156..43b47e4 100644
--- a/types/index.d.ts
+++ b/types/index.d.ts
@@ -173,3 +173,8 @@ export type Work = {
   created_at: string
   updated_at: string
 }
+
+export type ResWorks = {
+  works: Work[]
+  works_total_count: number
+}

From 50dadcf752af1283f471b201f165102bbcf9c297 Mon Sep 17 00:00:00 2001
From: Simo-C3 <shimomae.hitoshi210@mail.kyutech.jp>
Date: Sat, 15 Apr 2023 19:09:35 +0900
Subject: [PATCH 5/8] =?UTF-8?q?[change]=20=E3=82=B3=E3=83=BC=E3=83=89?=
 =?UTF-8?q?=E3=83=96=E3=83=AD=E3=83=83=E3=82=AF=E3=81=AE=E3=82=B3=E3=83=94?=
 =?UTF-8?q?=E3=83=BC=E3=83=9C=E3=82=BF=E3=83=B3=E8=BF=BD=E5=8A=A0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 nuxt.config.js        |   4 +-
 package.json          |   6 ++-
 plugins/markdownit.ts |  36 ++++++++++++++
 plugins/prism.ts      |   6 +++
 types/module.d.ts     |   2 +
 utils/postAsset.ts    |  72 ++++++++++++++++++++++++++++
 yarn.lock             | 106 +++++++++++++++++++++++++++---------------
 7 files changed, 191 insertions(+), 41 deletions(-)
 create mode 100644 plugins/markdownit.ts
 create mode 100644 utils/postAsset.ts

diff --git a/nuxt.config.js b/nuxt.config.js
index 74d2e3f..4f61f58 100644
--- a/nuxt.config.js
+++ b/nuxt.config.js
@@ -76,7 +76,8 @@ export default {
     { src: '~/plugins/localStorage.ts', mode: 'client' },
     { src: '~/plugins/three.ts', mode: 'client' },
     { src: '~/plugins/dayjs.ts', mode: 'client' },
-    { src: '~/plugins/prism.ts', mode: 'client' }
+    { src: '~/plugins/prism.ts', mode: 'client' },
+    { src: '~/plugins/markdownit.ts', mode: 'client' }
   ],
 
   // Auto import components: https://go.nuxtjs.dev/config-components
@@ -89,7 +90,6 @@ export default {
     '@nuxtjs/style-resources',
     '@nuxtjs/tailwindcss',
     '@nuxt/postcss8',
-    '@nuxtjs/markdownit',
     '@nuxtjs/composition-api/module',
     [
       '@nuxtjs/google-gtag',
diff --git a/package.json b/package.json
index f25834d..a33ce90 100644
--- a/package.json
+++ b/package.json
@@ -30,15 +30,18 @@
     "@nuxtjs/axios": "^5.13.6",
     "@nuxtjs/composition-api": "^0.33.1",
     "@nuxtjs/google-gtag": "^1.0.4",
-    "@nuxtjs/markdownit": "^2.0.0",
     "@types/file-saver": "^2.0.5",
     "@types/prismjs": "^1.26.0",
     "@types/three": "^0.146.0",
+    "clipboard": "^2.0.11",
     "core-js": "^3.26.1",
     "dayjs": "^1.11.6",
     "file-saver": "^2.0.5",
     "github-markdown-css": "^5.1.0",
     "hooper": "^0.3.4",
+    "katex": "^0.16.4",
+    "markdown-it": "^13.0.1",
+    "markdown-it-texmath": "^1.0.0",
     "mavon-editor": "^2.10.4",
     "nuxt": "^2.15.8",
     "nuxt-fontawesome": "^0.4.0",
@@ -63,6 +66,7 @@
     "@storybook/addon-actions": "^6.5.13",
     "@storybook/addon-viewport": "^6.5.13",
     "@storybook/addons": "^6.5.13",
+    "@types/katex": "^0.16.0",
     "@types/markdown-it": "^12.2.3",
     "@vue/test-utils": "^2.2.4",
     "autoprefixer": "^10.4.13",
diff --git a/plugins/markdownit.ts b/plugins/markdownit.ts
new file mode 100644
index 0000000..303f5dc
--- /dev/null
+++ b/plugins/markdownit.ts
@@ -0,0 +1,36 @@
+import MarkdownIt from 'markdown-it'
+import 'katex/dist/katex.min.css'
+import katex from 'katex'
+// @ts-ignore
+import tm from 'markdown-it-texmath'
+import { Context } from '@nuxt/types'
+import { Inject } from '@nuxt/types/app'
+
+export default ({ app }: Context, inject: Inject) => {
+  const md = new MarkdownIt('default', {
+    // Your Basic Settings
+    linkify: true,
+    html: true,
+    breaks: true,
+    typographer: true
+  })
+
+  const defaultRender =
+    md.renderer.rules.image ||
+    function (tokens, idx, options, env, self) {
+      return self.renderToken(tokens, idx, options)
+    }
+
+  md.renderer.rules.image = function (tokens, idx, options, env, self) {
+    tokens[idx].attrPush(['loading', 'lazy'])
+    return defaultRender(tokens, idx, options, env, self)
+  }
+
+  md.use(tm, {
+    engine: katex,
+    delimiters: 'dollars',
+    katexOptions: { macros: { '\\RR': '\\mathbb{R}' } }
+  })
+
+  inject('md', md)
+}
diff --git a/plugins/prism.ts b/plugins/prism.ts
index 56c6a16..1eafe79 100644
--- a/plugins/prism.ts
+++ b/plugins/prism.ts
@@ -1,6 +1,12 @@
+import 'clipboard'
+
 import Prism from 'prismjs'
+
 // テーマ
 import 'prismjs/themes/prism.css'
+import 'prismjs/plugins/toolbar/prism-toolbar'
+import 'prismjs/plugins/toolbar/prism-toolbar.css'
+import 'prismjs/plugins/copy-to-clipboard/prism-copy-to-clipboard'
 
 // 言語ハイライト
 import 'prismjs/components/prism-bash'
diff --git a/types/module.d.ts b/types/module.d.ts
index a25d9ae..c94dc95 100644
--- a/types/module.d.ts
+++ b/types/module.d.ts
@@ -1,5 +1,7 @@
 import MarkdownIt from 'markdown-it'
 
+declare module 'katex'
+
 declare module 'vue/types/vue' {
   // Vueインスタンス(this)の型追加
   interface Vue {
diff --git a/utils/postAsset.ts b/utils/postAsset.ts
new file mode 100644
index 0000000..0fec147
--- /dev/null
+++ b/utils/postAsset.ts
@@ -0,0 +1,72 @@
+import { AxiosClient } from '@/utils/axios'
+
+type baseAssetExtensionType = {
+  image: string[]
+  video: string[]
+  music: string[]
+  zip: string[]
+  model: string[]
+}
+
+export class PostAssetClient {
+  constructor(extensions: Array<string>) {
+    extensions.forEach((extension) => {
+      this.assetExtension.push(extension)
+    })
+    console.log(this.assetExtension)
+  }
+
+  private assetExtension: Array<string> = []
+
+  private baseAssetExtension: baseAssetExtensionType = {
+    image: ['png', 'jpg', 'jpeg', 'bmp', 'gif'],
+    video: ['mp4', 'mov'],
+    music: ['mp3', 'wav', 'm4a'],
+    zip: ['zip'],
+    model: ['gltf', 'fbx']
+  }
+
+  private getAssetType(assetName: string) {
+    let index: number = 0
+    let response: string = ''
+    const assetTypeList: string[][] = Object.values(this.baseAssetExtension)
+    assetTypeList.forEach((assetType) => {
+      for (let i = 0; i < assetType.length; i++) {
+        if (assetType[i] === assetName.split('.').pop()?.toLowerCase()) {
+          // eslint-disable-next-line no-console
+          // console.log(Object.keys(baseAssetExtension)[index])
+          response = Object.keys(this.baseAssetExtension)[index]
+        }
+      }
+      index++
+    })
+    return response
+  }
+  public async postAsset(files: Array<File>) {
+    for (let i = 0; i < files.length; i++) {
+      // 本番環境では何らかのサービスに画像を保存する
+      const params = new FormData()
+      params.append('file', files[i])
+      const assetType = this.getAssetType(files[i].name as string)
+      if (this.assetExtension.includes(assetType)) {
+        params.append('asset_type', assetType)
+        try {
+          const result = await AxiosClient.client(
+            'POST',
+            '/assets',
+            true,
+            params,
+            'multipart/form-data'
+          )
+          return result.data
+        } catch {
+          ;(error: Error) => {
+            throw error
+          }
+        }
+      } else {
+        return null
+      }
+    }
+  }
+}
diff --git a/yarn.lock b/yarn.lock
index b53473b..8ea23cc 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -2365,24 +2365,6 @@
   resolved "https://registry.yarnpkg.com/@nuxtjs/google-gtag/-/google-gtag-1.0.4.tgz#57562d8ec4c7694573e77edf72097da4a34b0d68"
   integrity sha512-0Xgbx1uQ9pKeV2QdU9xoxJVdgH66qyGQJ0l8pzVxz5X476qvJunj6fbcjWk0gT+MEX/VOAhfT/zw0Z1z9q9oNg==
 
-"@nuxtjs/markdownit-loader@^1.1.1":
-  version "1.2.0"
-  resolved "https://registry.yarnpkg.com/@nuxtjs/markdownit-loader/-/markdownit-loader-1.2.0.tgz#02e31b778bdbb61c13a5991021d660a21393b2c2"
-  integrity sha512-D6m4578NavamwD03nOU3H3NkS2zYfFJSMChUczlCGDx05DgAoenY4GdCmML1CnAEH/Cv6Bf230RIwDnD926oyQ==
-  dependencies:
-    highlight.js "^10.5.0"
-    loader-utils "^1.1.0"
-    markdown-it "^8.3.1"
-
-"@nuxtjs/markdownit@^2.0.0":
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/@nuxtjs/markdownit/-/markdownit-2.0.0.tgz#5fcd35afdb78f328ba2dbc1f678f0c0bb9ea85f9"
-  integrity sha512-YAEK/s0IzdWK1L74WKTQSMcvNhGgOW0xIWdu5VMxDo1NkNpm/0CbJZgSPt1JYAnT8r8r6wVQ5SY1v/1MZanPlQ==
-  dependencies:
-    "@nuxtjs/markdownit-loader" "^1.1.1"
-    defu "^3.2.2"
-    raw-loader "^4.0.2"
-
 "@nuxtjs/proxy@^2.1.0":
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/@nuxtjs/proxy/-/proxy-2.1.0.tgz#fa7715a11d237fa1273503c4e9e137dd1bf5575b"
@@ -3553,6 +3535,11 @@
   resolved "https://registry.yarnpkg.com/@types/json5/-/json5-0.0.29.tgz#ee28707ae94e11d2b827bcbe5270bcea7f3e71ee"
   integrity sha512-dRLjCWHYg4oaA77cxO64oO+7JwCwnIzkZPdrrC71jQmQtlhM556pwKo5bUzqvZndkVbeFLIIi+9TC40JNF5hNQ==
 
+"@types/katex@^0.16.0":
+  version "0.16.0"
+  resolved "https://registry.yarnpkg.com/@types/katex/-/katex-0.16.0.tgz#0e640df3647fe237212be863e1f5111eb9754f93"
+  integrity sha512-hz+S3nV6Mym5xPbT9fnO8dDhBFQguMYpY0Ipxv06JMi1ORgnEM4M1ymWDUhUNer3ElLmT583opRo4RzxKmh9jw==
+
 "@types/less@3.0.2":
   version "3.0.2"
   resolved "https://registry.yarnpkg.com/@types/less/-/less-3.0.2.tgz#2761d477678c8374cb9897666871662eb1d1115e"
@@ -5930,6 +5917,15 @@ cli-width@^3.0.0:
   resolved "https://registry.yarnpkg.com/cli-width/-/cli-width-3.0.0.tgz#a2f48437a2caa9a22436e794bf071ec9e61cedf6"
   integrity sha512-FxqpkPPwu1HjuN93Omfm4h8uIanXofW0RxVEW3k5RKx+mJJYSthzNhp32Kzxxy3YAEZ/Dc/EWN1vZRY0+kOhbw==
 
+clipboard@^2.0.11:
+  version "2.0.11"
+  resolved "https://registry.yarnpkg.com/clipboard/-/clipboard-2.0.11.tgz#62180360b97dd668b6b3a84ec226975762a70be5"
+  integrity sha512-C+0bbOqkezLIsmWSvlsXS0Q0bmkugu7jcfMIACB+RDEntIzQIkdr148we28AfSloQLRdZlYL/QYyrq05j/3Faw==
+  dependencies:
+    good-listener "^1.2.2"
+    select "^1.1.2"
+    tiny-emitter "^2.0.0"
+
 cliui@^2.1.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/cliui/-/cliui-2.1.0.tgz#4b475760ff80264c762c3a1719032e91c7fea0d1"
@@ -6085,6 +6081,11 @@ commander@^7.2.0:
   resolved "https://registry.yarnpkg.com/commander/-/commander-7.2.0.tgz#a36cb57d0b501ce108e4d20559a150a391d97ab7"
   integrity sha512-QrWXB+ZQSVPmIWIhtEO9H+gwHaMGYiF5ChvoJ+K9ZGHG/sVsa6yiesAD1GC/x46sET00Xlwo1u49RVVVzvcSkw==
 
+commander@^8.0.0:
+  version "8.3.0"
+  resolved "https://registry.yarnpkg.com/commander/-/commander-8.3.0.tgz#4837ea1b2da67b9c616a67afbb0fafee567bca66"
+  integrity sha512-OkTL9umf+He2DZkUq8f8J9of7yL6RJKI24dVITBmNfZBmri9zYZQrKkuXiKhyfPSu8tUhnVBB1iKXevvnlR4Ww==
+
 commondir@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/commondir/-/commondir-1.0.1.tgz#ddd800da0c66127393cca5950ea968a3aaf1253b"
@@ -6851,6 +6852,11 @@ delayed-stream@~1.0.0:
   resolved "https://registry.yarnpkg.com/delayed-stream/-/delayed-stream-1.0.0.tgz#df3ae199acadfb7d440aaae0b29e2272b24ec619"
   integrity sha1-3zrhmayt+31ECqrgsp4icrJOxhk=
 
+delegate@^3.1.2:
+  version "3.2.0"
+  resolved "https://registry.yarnpkg.com/delegate/-/delegate-3.2.0.tgz#b66b71c3158522e8ab5744f720d8ca0c2af59166"
+  integrity sha512-IofjkYBZaZivn0V8nnsMJGBr4jVLxHDheKSW88PyxS5QC4Vo9ZbZVvhzlSxY87fVq3STR6r+4cGepyHkcWOQSw==
+
 delegates@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/delegates/-/delegates-1.0.0.tgz#84c6e159b81904fdca59a0ef44cd870d31250f9a"
@@ -7223,10 +7229,10 @@ entities@^2.0.0:
   resolved "https://registry.yarnpkg.com/entities/-/entities-2.2.0.tgz#098dc90ebb83d8dffa089d55256b351d34c4da55"
   integrity sha512-p92if5Nz619I0w+akJrLZH0MX0Pb5DX39XOwQTtXSdQQOaYH03S1uIQp4mhOZtAXrxq4ViO67YTiLBo2638o9A==
 
-entities@~1.1.1:
-  version "1.1.2"
-  resolved "https://registry.yarnpkg.com/entities/-/entities-1.1.2.tgz#bdfa735299664dfafd34529ed4f8522a275fea56"
-  integrity sha512-f2LZMYl1Fzu7YSBKg+RoROelpOaNrcGmE9AZubeDfrCEia483oW4MI4VyFd5VNHIgQ/7qm1I0wUHK1eJnn2y2w==
+entities@~3.0.1:
+  version "3.0.1"
+  resolved "https://registry.yarnpkg.com/entities/-/entities-3.0.1.tgz#2b887ca62585e96db3903482d336c1006c3001d4"
+  integrity sha512-WiyBqoomrwMdFG1e0kqvASYfnlb0lp8M5o5Fw2OFq1hNZxxcNk8Ik0Xm7LxzBhuidnZB/UtBqVCgUz3kBOP51Q==
 
 errno@^0.1.3, errno@~0.1.7:
   version "0.1.8"
@@ -8573,6 +8579,13 @@ globrex@^0.1.2:
   resolved "https://registry.yarnpkg.com/globrex/-/globrex-0.1.2.tgz#dd5d9ec826232730cd6793a5e33a9302985e6098"
   integrity sha512-uHJgbwAMwNFf5mLst7IWLNg14x1CkeqglJb/K3doi4dw6q2IvAAmM/Y81kevy83wP+Sst+nutFTYOGg3d1lsxg==
 
+good-listener@^1.2.2:
+  version "1.2.2"
+  resolved "https://registry.yarnpkg.com/good-listener/-/good-listener-1.2.2.tgz#d53b30cdf9313dffb7dc9a0d477096aa6d145c50"
+  integrity sha512-goW1b+d9q/HIwbVYZzZ6SsTr4IgE+WA44A0GmPIQstuOrgsFcT7VEJ48nmr9GaRtNu0XTKacFLGnBPAM6Afouw==
+  dependencies:
+    delegate "^3.1.2"
+
 graceful-fs@^4.1.11, graceful-fs@^4.1.15, graceful-fs@^4.1.2, graceful-fs@^4.1.6, graceful-fs@^4.1.9, graceful-fs@^4.2.0, graceful-fs@^4.2.4, graceful-fs@^4.2.9:
   version "4.2.10"
   resolved "https://registry.yarnpkg.com/graceful-fs/-/graceful-fs-4.2.10.tgz#147d3a006da4ca3ce14728c7aefc287c367d7a6c"
@@ -8840,11 +8853,6 @@ hex-color-regex@^1.1.0:
   resolved "https://registry.yarnpkg.com/hex-color-regex/-/hex-color-regex-1.1.0.tgz#4c06fccb4602fe2602b3c93df82d7e7dbf1a8a8e"
   integrity sha512-l9sfDFsuqtOqKDsQdqrMRk0U85RZc0RtOR9yPI7mRVOa4FsR/BVnZ0shmQRM96Ji99kYZP/7hn1cedc1+ApsTQ==
 
-highlight.js@^10.5.0:
-  version "10.7.3"
-  resolved "https://registry.yarnpkg.com/highlight.js/-/highlight.js-10.7.3.tgz#697272e3991356e40c3cac566a74eef681756531"
-  integrity sha512-tzcUFauisWKNHaRkN4Wjl/ZA07gENAjFl3J/c480dprkGTg5EQstgaNFqBfUqCq54kZRIEcreTsAgF/m2quD7A==
-
 highlight.js@^9.12.0:
   version "9.18.5"
   resolved "https://registry.yarnpkg.com/highlight.js/-/highlight.js-9.18.5.tgz#d18a359867f378c138d6819edfc2a8acd5f29825"
@@ -10381,6 +10389,13 @@ junk@^3.1.0:
   resolved "https://registry.yarnpkg.com/junk/-/junk-3.1.0.tgz#31499098d902b7e98c5d9b9c80f43457a88abfa1"
   integrity sha512-pBxcB3LFc8QVgdggvZWyeys+hnrNWg4OcZIU/1X59k5jQdLBlCsYGRQaz234SqoRLTCgMH00fY0xRJH+F9METQ==
 
+katex@^0.16.4:
+  version "0.16.4"
+  resolved "https://registry.yarnpkg.com/katex/-/katex-0.16.4.tgz#87021bc3bbd80586ef715aeb476794cba6a49ad4"
+  integrity sha512-WudRKUj8yyBeVDI4aYMNxhx5Vhh2PjpzQw1GRu/LVGqL4m1AxwD1GcUp0IMbdJaf5zsjtj8ghP0DOQRYhroNkw==
+  dependencies:
+    commander "^8.0.0"
+
 keygrip@~1.1.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/keygrip/-/keygrip-1.1.0.tgz#871b1681d5e159c62a445b0c74b615e0917e7226"
@@ -10560,10 +10575,10 @@ lines-and-columns@^1.1.6:
   resolved "https://registry.yarnpkg.com/lines-and-columns/-/lines-and-columns-1.2.4.tgz#eca284f75d2965079309dc0ad9255abb2ebc1632"
   integrity sha512-7ylylesZQ/PV29jhEDl3Ufjo6ZX7gCqJr5F7PKrqc93v7fzSymt1BpwEU8nAUXs8qzzvqhbjhK5QZg6Mt/HkBg==
 
-linkify-it@^2.0.0:
-  version "2.2.0"
-  resolved "https://registry.yarnpkg.com/linkify-it/-/linkify-it-2.2.0.tgz#e3b54697e78bf915c70a38acd78fd09e0058b1cf"
-  integrity sha512-GnAl/knGn+i1U/wjBz3akz2stz+HrHLsxMwHQGofCDfPvlf+gDKN58UtfmUquTY4/MXeE2x7k19KQmeoZi94Iw==
+linkify-it@^4.0.1:
+  version "4.0.1"
+  resolved "https://registry.yarnpkg.com/linkify-it/-/linkify-it-4.0.1.tgz#01f1d5e508190d06669982ba31a7d9f56a5751ec"
+  integrity sha512-C7bfi1UZmoj8+PQx22XyeXCuBlokoyWQL5pWSP+EI6nzRylyThouddufc2c1NDIcP9k5agmN9fLpA7VNJfIiqw==
   dependencies:
     uc.micro "^1.0.1"
 
@@ -10826,14 +10841,19 @@ markdown-escapes@^1.0.0:
   resolved "https://registry.yarnpkg.com/markdown-escapes/-/markdown-escapes-1.0.4.tgz#c95415ef451499d7602b91095f3c8e8975f78535"
   integrity sha512-8z4efJYk43E0upd0NbVXwgSTQs6cT3T06etieCMEg7dRbzCbxUCK/GHlX8mhHRDcp+OLlHkPKsvqQTCvsRl2cg==
 
-markdown-it@^8.3.1:
-  version "8.4.2"
-  resolved "https://registry.yarnpkg.com/markdown-it/-/markdown-it-8.4.2.tgz#386f98998dc15a37722aa7722084f4020bdd9b54"
-  integrity sha512-GcRz3AWTqSUphY3vsUqQSFMbgR38a4Lh3GWlHRh/7MRwz8mcu9n2IO7HOh+bXHrR9kOPDl5RNCaEsrneb+xhHQ==
+markdown-it-texmath@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/markdown-it-texmath/-/markdown-it-texmath-1.0.0.tgz#65703b235d07a8f96bc58cbf9d478af57154e5f0"
+  integrity sha512-4hhkiX8/gus+6e53PLCUmUrsa6ZWGgJW2XCW6O0ASvZUiezIK900ZicinTDtG3kAO2kon7oUA/ReWmpW2FByxg==
+
+markdown-it@^13.0.1:
+  version "13.0.1"
+  resolved "https://registry.yarnpkg.com/markdown-it/-/markdown-it-13.0.1.tgz#c6ecc431cacf1a5da531423fc6a42807814af430"
+  integrity sha512-lTlxriVoy2criHP0JKRhO2VDG9c2ypWCsT237eDiLqi09rmbKoUetyGHq2uOIRoRS//kfoJckS0eUzzkDR+k2Q==
   dependencies:
-    argparse "^1.0.7"
-    entities "~1.1.1"
-    linkify-it "^2.0.0"
+    argparse "^2.0.1"
+    entities "~3.0.1"
+    linkify-it "^4.0.1"
     mdurl "^1.0.1"
     uc.micro "^1.0.5"
 
@@ -14253,6 +14273,11 @@ scule@^0.3.2:
   resolved "https://registry.yarnpkg.com/scule/-/scule-0.3.2.tgz#472445cecd8357165a94a067f78cee40e700b596"
   integrity sha512-zIvPdjOH8fv8CgrPT5eqtxHQXmPNnV/vHJYffZhE43KZkvULvpCTvOt1HPlFaCZx287INL9qaqrZg34e8NgI4g==
 
+select@^1.1.2:
+  version "1.1.2"
+  resolved "https://registry.yarnpkg.com/select/-/select-1.1.2.tgz#0e7350acdec80b1108528786ec1d4418d11b396d"
+  integrity sha512-OwpTSOfy6xSs1+pwcNrv0RBMOzI39Lp3qQKUTPVVPRjCdNa5JH/oPRiqsesIskK8TVgmRiHwO4KXlV2Li9dANA==
+
 "semver@2 || 3 || 4 || 5", semver@^5.4.1, semver@^5.5.0, semver@^5.6.0:
   version "5.7.1"
   resolved "https://registry.yarnpkg.com/semver/-/semver-5.7.1.tgz#a954f931aeba508d307bbf069eff0c01c96116f7"
@@ -15371,6 +15396,11 @@ timsort@^0.3.0:
   resolved "https://registry.yarnpkg.com/timsort/-/timsort-0.3.0.tgz#405411a8e7e6339fe64db9a234de11dc31e02bd4"
   integrity sha1-QFQRqOfmM5/mTbmiNN4R3DHgK9Q=
 
+tiny-emitter@^2.0.0:
+  version "2.1.0"
+  resolved "https://registry.yarnpkg.com/tiny-emitter/-/tiny-emitter-2.1.0.tgz#1d1a56edfc51c43e863cbb5382a72330e3555423"
+  integrity sha512-NB6Dk1A9xgQPMoGqC5CVXn123gWyte215ONT5Pp5a0yt4nlEoO1ZWeCwpncaekPHXO60i47ihFnZPiRPjRMq4Q==
+
 tiny-glob@^0.2.9:
   version "0.2.9"
   resolved "https://registry.yarnpkg.com/tiny-glob/-/tiny-glob-0.2.9.tgz#2212d441ac17928033b110f8b3640683129d31e2"

From d973a35d02afda7a4c9b364e85653ee55effbd7c Mon Sep 17 00:00:00 2001
From: Simo-C3 <shimomae.hitoshi210@mail.kyutech.jp>
Date: Sat, 15 Apr 2023 19:56:53 +0900
Subject: [PATCH 6/8] =?UTF-8?q?[change]=20=E3=83=87=E3=82=B6=E3=82=A4?=
 =?UTF-8?q?=E3=83=B3=E4=BF=AE=E6=AD=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 components/commons/MarkdownView.vue | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/components/commons/MarkdownView.vue b/components/commons/MarkdownView.vue
index 4f480cb..9509184 100644
--- a/components/commons/MarkdownView.vue
+++ b/components/commons/MarkdownView.vue
@@ -34,6 +34,7 @@
         absolute
         w-full
         text-center
+        z-50
       "
       :class="[
         { 'hover:translate-y-1 -bottom-1': !showAll },
@@ -77,6 +78,7 @@ export default class MarkdownView extends Vue {
   content: '';
   height: 20%;
   width: 100%;
+  z-index: 20;
 }
 
 .markdown-view {

From e401abccead474e07464526fd209f2403486717d Mon Sep 17 00:00:00 2001
From: Simo-C3 <shimomae.hitoshi210@mail.kyutech.jp>
Date: Sat, 15 Apr 2023 20:54:00 +0900
Subject: [PATCH 7/8] =?UTF-8?q?[fix]=20=E3=83=88=E3=83=83=E3=83=97?=
 =?UTF-8?q?=E3=83=9A=E3=83=BC=E3=82=B8=E3=81=AE=E6=8C=99=E5=8B=95=E4=BF=AE?=
 =?UTF-8?q?=E6=AD=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 pages/index.vue | 23 ++++++++++++++++++++---
 1 file changed, 20 insertions(+), 3 deletions(-)

diff --git a/pages/index.vue b/pages/index.vue
index 6eb6592..4d9539a 100644
--- a/pages/index.vue
+++ b/pages/index.vue
@@ -8,7 +8,10 @@
       <works-list v-if="!processing" :works="resWorks.works" />
       <loading v-else />
     </div>
-    <div v-if="nextContentLoadProcessing" class="relative w-full">
+    <div
+      v-if="nextContentLoadProcessing"
+      class="relative w-full h-[var(--loading-h)] [--loading-h:120px]"
+    >
       <loading />
     </div>
     <div
@@ -45,6 +48,15 @@ import { Query } from '@/utils/query'
       workFilterStore.setOnPageName('top')
     }
     const query = new Query()
+    query.create(
+      undefined,
+      undefined,
+      undefined,
+      undefined,
+      undefined,
+      undefined,
+      5
+    )
     if (
       workFilterStore.getUseConditionsWhenAsyncData &&
       workFilterStore.getOnPageName === 'top'
@@ -74,7 +86,7 @@ export default class Index extends Vue {
   isWorksEmpty: boolean = false
   nextContentLoadProcessing: boolean = false
   bottom: number = 0
-  limit: number = 30
+  limit: number = 5
 
   @Ref() workList!: HTMLDivElement
 
@@ -149,7 +161,7 @@ export default class Index extends Vue {
     if (res.status !== 200) {
       alert('作品一覧の取得に失敗しました')
     }
-    const resWorks: ResWorks = res.data.works
+    const resWorks: ResWorks = res.data
     setTimeout(() => {
       if (resWorks.works.length === 0) {
         this.isWorksEmpty = true
@@ -157,6 +169,11 @@ export default class Index extends Vue {
         resWorks.works.map((item: Work) => {
           this.resWorks.works.push(item)
         })
+        this.resWorks.works_total_count = resWorks.works_total_count
+
+        if (resWorks.works.length < this.limit) {
+          this.isWorksEmpty = true
+        }
       }
       this.nextContentLoadProcessing = false
     }, 1000)

From 125127e86821a6c341c20585fae70a62f5ad3811 Mon Sep 17 00:00:00 2001
From: Simo-C3 <shimomae.hitoshi210@mail.kyutech.jp>
Date: Sat, 15 Apr 2023 20:57:14 +0900
Subject: [PATCH 8/8] =?UTF-8?q?[fix]=20=E3=83=87=E3=83=90=E3=83=83?=
 =?UTF-8?q?=E3=82=B0=E7=94=A8=E3=81=AE=E8=A8=98=E8=BF=B0=E3=82=92=E5=85=83?=
 =?UTF-8?q?=E3=81=AB=E6=88=BB=E3=81=99?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 pages/index.vue | 11 +----------
 1 file changed, 1 insertion(+), 10 deletions(-)

diff --git a/pages/index.vue b/pages/index.vue
index 4d9539a..5368b5b 100644
--- a/pages/index.vue
+++ b/pages/index.vue
@@ -48,15 +48,6 @@ import { Query } from '@/utils/query'
       workFilterStore.setOnPageName('top')
     }
     const query = new Query()
-    query.create(
-      undefined,
-      undefined,
-      undefined,
-      undefined,
-      undefined,
-      undefined,
-      5
-    )
     if (
       workFilterStore.getUseConditionsWhenAsyncData &&
       workFilterStore.getOnPageName === 'top'
@@ -86,7 +77,7 @@ export default class Index extends Vue {
   isWorksEmpty: boolean = false
   nextContentLoadProcessing: boolean = false
   bottom: number = 0
-  limit: number = 5
+  limit: number = 30
 
   @Ref() workList!: HTMLDivElement