Refactor Profile section to About, adjust styles

kigawa01 · May 1, 2024 · 8066d02 · 8066d02
1 parent cb6700c
commit 8066d02
Show file tree

Hide file tree

Showing 7 changed files with 28 additions and 16 deletions.
diff --git a/src/components/GlobalStyle.astro b/src/components/GlobalStyle.astro
@@ -5,7 +5,7 @@ import Theme from "./Theme.astro";
 
 <style is:global lang="scss">
   @font-face {
-    font-family  : "DistantGalaxy";
+    font-family  : "UDEVGothicJPDOC";
     src          : url("/font/UDEVGothic_v1-3-1/UDEVGothicJPDOC-Bold.ttf") format("truetype");
     font-weight  : normal;
     font-style   : normal;
@@ -32,8 +32,8 @@ import Theme from "./Theme.astro";
   body {
     background-color : var(--mcolor-surface);
     padding          : 0;
-    font-family      : "DistantGalaxy", sans-serif;
-    line-height      : 1.2;
+    font-family      : "UDEVGothicJPDOC", sans-serif;
+    line-height      : 1.8;
     min-height       : 100vh;
     color            : var(--mcolor-on-surface);
     font-size: 1.2rem;

diff --git a/src/components/LabeledItem.astro b/src/components/LabeledItem.astro
@@ -13,20 +13,20 @@ const {text} = Astro.props
 <style>
   div.wrapper {
     padding: 0;
-    margin: 15px 0;
+    margin: 7px 0;
     display: flex;
     flex-direction: row;
     flex-wrap: wrap;
 
     p {
       display: block;
       font-size: 1.3rem;
-      margin: 5px 0;
+      margin: 3px 0;
       width: 120px;
     }
     div {
       padding: 0 0 0 30px;
-      margin: 5px 0;
+      margin: 3px 0;
     }
   }
 </style>
diff --git a/src/components/main/About.astro b/src/components/main/About.astro
@@ -0,0 +1,19 @@
+---
+import Section from "./Section.astro";
+---
+<Section title="about">
+  <h3>バックエンド・ライブラリ開発・インフラ構築を得意とするITエンジニアです。</h3>
+  <p>
+    webバックエンドの開発だけでなく、連携したChrome拡張機能やWindowsサービス、リアクトを用いたフロントエンド開発や、webサーバーへのCDの構築などの経験があります。
+    プライベートでは、webアプリケーションよりもライブラリ開発や、ゲームのmod開発などが多くなっています。
+  </p>
+  <p>コミュニティ運営も行っており、クローズドな30人規模のコミュニティで副代表を務め、開発者を兼任してMinecraftを利用したRPG開発を行っています。</p>
+</Section>
+
+<style>
+  h3{
+    display: block;
+    border-radius: 5px;
+    margin: 20px 10px;
+  }
+</style>
diff --git a/src/components/main/MainScroll.astro b/src/components/main/MainScroll.astro
@@ -1,5 +1,5 @@
 ---
-import Profile from "./Profile.astro";
+import Profile from "./About.astro";
 ---
 <div class="scroll">
   <Profile/>

diff --git a/src/components/main/Profile.astro b/src/components/main/Profile.astro
diff --git a/src/components/main/Section.astro b/src/components/main/Section.astro
@@ -10,7 +10,6 @@ const {title} = Astro.props
 </section>
 <style>
   section {
-    height: 800px;
     border-radius: 5px;
     border: 2px solid var(--mcolor-outline);
     background-color: var(--mcolor-secondary-container);
@@ -25,7 +24,7 @@ const {title} = Astro.props
     max-width: 500px;
     border-bottom: 2px solid var(--mcolor-outline);
     position: relative;
-    margin: 0 0 0 20px;
+    margin: 0 0 60px 20px;
     padding: 0 10px;
     &::before {
       border-bottom: 2px solid var(--mcolor-outline);

diff --git a/src/components/nav/Nav.astro b/src/components/nav/Nav.astro
@@ -6,7 +6,7 @@ import LabeledItem from "../LabeledItem.astro";
   <nav>
     <a href="/"><h1>kigawa's portfolio</h1></a>
     <ul>
-      <NavButton title="profile"/>
+      <NavButton title="about"/>
       <NavButton title="skill"/>
       <NavButton title="experience"/>
       <NavButton title="products"/>