css-skills, projects

assets/data/projects.yaml

@@ -140,7 +140,7 @@ projects:
         links:
           youtube: "https://youtu.be/tqQg0wU-9ns?si=lssECIQScBdo7ebp"
 
-      - title: "반도체 공정장비용 Remote Plasma Source를 위한 RF 전원회로 설계"
+      - title: "RF 전원회로 설계"
         description: "반도체 공정장비용 Remote Plasma Source를 위한 RF 전원회로 설계"
         team: "신희성(총 4명)"
         image: "assets/images/sections/projects/2023/rf.jpg"

projects.html

@@ -64,7 +64,7 @@ <h2>Projects</h2>
        /* padding: 10px;*/
         flex: 0 0 auto;
         /* 카드 크기 고정 */
-        /* width: 300px;*/
+        max-width: 300px;
         width: 40%;
         min-height: 250px;
         /* 최소 높이 */
@@ -131,7 +131,7 @@ <h2>Projects</h2>
         /* 좌우 여백을 자동으로 설정해 가운데 정렬 */
         width: auto;
         /*max-width: 300px;*/
-        max-width: 100%;
+        max-width: 90%;
         /*height: 10em;*/
         border-radius: 5px;
         margin-bottom: 15px;

skills.html

@@ -5,12 +5,14 @@ <h2>Skills</h2>
         <div class="skills-card">
             <img src="assets/images/sections/skills/c++.png" alt="프로그래밍 아이콘">
             <h3>프로그래밍</h3>
-            <p>C/C++/Java/Python 등 다양한 언어에 대한 스터디/세미나가 진행되고 있습니다. 단, 신입생은 C언어 프로그래밍을 필수적으로 학습하여야 합니다.</p>
+            <p>C /C++ /Java /Python 등 다양한 언어에 대한 스터디/세미나가 진행되고 있습니다.
+                단, 신입생은 C언어 프로그래밍을 필수적으로 학습하여야 합니다.</p>
         </div>
         <div class="skills-card">
             <img src="assets/images/sections/skills/cad.png" alt="CAD/기구 설계 아이콘">
             <h3>CAD/기구 설계</h3>
-            <p>CAD를 이용한 기구 설계를 동아리 원끼리 스터디 및 세미나를 통하여 학습합니다. 또한 동아리 자체적으로 보유하고 있는 3D 프린터로 제작을 할 수 있습니다.</p>
+            <p>CAD를 이용한 기구 설계를 동아리 원끼리 스터디 및 세미나를 통하여 학습합니다.
+                또한 동아리 자체적으로 보유하고 있는 3D 프린터로 제작을 할 수 있습니다.</p>
         </div>
         <div class="skills-card">
             <img src="assets/images/sections/skills/pcb.png" alt="전자 회로/소자 아이콘">
@@ -37,6 +39,9 @@ <h3>전자 회로/소자</h3>
         box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
         padding: 10px;
         transition: transform 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
+        word-break: keep-all; /* 한글 단어 끊어짐 방지 */
+        white-space: normal; /* 기본 줄바꿈 */
+        overflow-wrap: break-word; /* 긴 단어 줄바꿈 */
     }
 
     .skills-card:hover {