Merge pull request #159 from kohta9521/feature/Issues_#144

Feature/issues #144

Author: kohta9521

frontend/src/app/about/page.tsx

@@ -13,17 +13,15 @@ const About = () => {
       id={1}
       enTitle='About'
       jaTitle='# このサイトについて'
-      desc='このサイトは、Next.jsで作成したサンプルサイトです。'
+      desc='このサイトは、kohtaのテックブログサイトです。内容はテックに留まらずフリーランス関連もございます。'
     >
       <SubPageSecTitle id={1} title='What is this site?' />
       <SubPageTitle id={1} enTitle='About' jaTitle='このサイトについて' />
-      <SubMainText id={1} text='このサイトは、Next.jsで作成したサンプルサイトです。' />
       <SubMainText
         id={2}
-        text='このブログは、私の学んだ知識と経験を共有するためのプラットフォームです。ここでは、ウェブ開発、プログラミング、テクノロジーのトレンドなど、私が情熱を持って'
+        text='このサイトはブログサイトです。
+Kohtaの日々学んでいるエンジニア関連の内容。開発関連・トレンドの技術・面白い技術などをご覧いただけます。単にエンジニア関連の内容だけとなると面白くないためフリーランスとして活動をしているというのを強みにエンジニアのフリーランス活動をするにおいて必要な情報。仕事のもらい方・節税方法・開業をするにあたっての流れなどもご覧いただけるでしょう。'
       />
-      <SubMainText id={3} text='このサイトは、Next.jsで作成したサンプルサイトです。' />
-      <SubMainText id={4} text='このサイトは、Next.jsで作成したサンプルサイトです。' />
     </SubPageLayout>
   )
 }

frontend/src/app/blog/components/BlogGet.module.scss

@@ -94,7 +94,7 @@
       display: block;
       width: 5%;
       height: 4px;
-      background-color: #000000;
+      background-color: #000dff;
       margin-bottom: 40px;
       margin-left: -30px;
     }

frontend/src/components/atoms/MenuMainList.tsx

@@ -1,4 +1,6 @@
 import React from 'react'
+
+// next
 import Link from 'next/link'
 
 // scss
@@ -19,4 +21,4 @@ const MenuMainList = ({ id, link, text }: MenuMainListProps) => {
   )
 }
 
-export default MenuMainList
+export default MenuMainList

frontend/src/components/atoms/styles/MenuMainList.module.scss

@@ -1,36 +1,22 @@
 .menu {
+  display: block;
   width: 100%;
-  height: 100px;
-  text-decoration: none;
+  height: 45px;
   .text {
-    position: relative;
-    width: auto;
-    color: rgb(255, 255, 255);
-    font-size: 60px;
-    font-weight: 700;
+    color: white;
+    font-size: 30px;
+    font-weight: bold;
     &:hover {
-      color: rgb(0, 34, 255);
-      transform: all 0.3s;
-    }
-    &::after {
-      content: '';
-      width: 100%;
-      position: absolute;
-      left: 0;
-      bottom: -10px; /*テキストからの距離*/
-      width: 0%; /*初期状態では下線非表示*/
-      height: 2px; /*下線の高さ*/
-      background: #2600ff; /*下線の色*/
-      z-index: -1;
-      transition: all 0.4s; /*アニメーション速度*/
-    }
-    &:hover::after {
-      width: 100%; /*ホバー時に下線表示*/
+      color: #cbcbcb;
+      transition: all 0.2s;
     }
   }
 }
 
 @media screen and (max-width: 1280px) {
-}
-@media screen and (max-width: 768px) {
+  .menu {
+    .text {
+      color: white;
+    }
+  }
 }

frontend/src/components/organisms/Menu.tsx

@@ -16,7 +16,7 @@ const Menu = ({ isOpen }: MenuProps) => {
       <div className={styles.container}>
         <div className={styles.leftBox}>
           <h2 className={styles.menuTitle}>MainMenu</h2>
-          <MenuMainList id={1} link='#about' text='About Me' />
+          <MenuMainList id={1} link='/about' text='About Me' />
           <MenuMainList id={1} link='#about' text='About Me' />
         </div>
         <div className={styles.centerBox}>

frontend/src/components/templates/styles/SubPageLayout.module.scss

@@ -2,7 +2,7 @@
   width: 100vw;
   height: auto;
   .hero {
-    width: 60%;
+    width: 50%;
     height: auto;
     border-radius: 20px;
     padding-top: 30px;
@@ -21,7 +21,7 @@
       .jaTitle {
         font-size: 20px;
         font-weight: 550;
-        color: rgb(247, 0, 255);
+        color: rgb(0, 42, 255);
       }
     }
     .rightBox {