feat: 경영이념 스타일 변경

BeA-Pro · Jul 12, 2024 · c2fee6d · c2fee6d
1 parent c122fca
commit c2fee6d
Show file tree

Hide file tree

Showing 6 changed files with 22 additions and 15 deletions.
diff --git a/src/asset/images/design.png b/src/asset/images/design.png
diff --git a/src/asset/images/quality.png b/src/asset/images/quality.png
diff --git a/src/asset/images/technology.png b/src/asset/images/technology.png
diff --git a/src/asset/scss/components/management.scss b/src/asset/scss/components/management.scss
@@ -49,7 +49,11 @@
             .management-details-value{
               width: 30%;
               height: 200px;
-              background-color: rgb(166, 164, 164);
+
+              border-radius: 20px;
+              border: 1px solid black;
+              box-shadow: 0 1px 7px #555;
+
               display: flex;
               flex-direction: column;
               justify-content: center;
@@ -110,6 +114,7 @@
               width: 100%;
               align-items: center;
               text-align:center;
+
               .management-icon{
                 width: 30px;
                 height: 30px;

diff --git a/src/components/Management.js b/src/components/Management.js
@@ -1,12 +1,14 @@
 import React from 'react'
 
-//images
-import IconTech from "../asset/icons/science.svg";
-import IconDesign from "../asset/icons/apartment.svg";
-import IconHQ from "../asset/icons/high_quality.svg";
 import MissionImage from "../asset/images/imgMission.png";
+
+//images
+import Technology from "../asset/images/technology.png";
+import Design from "../asset/images/design.png";
+import Quality from "../asset/images/quality.png";
 import { management1, management2, management3, management4 } from '../data/string';
 
+
 function Management() {
   return (
     <div className="management-wrapper">
@@ -16,22 +18,22 @@ function Management() {
           <p className="management-details-title">Mission</p>
           <div className="management-details-content">
             <p className="management-details-writes">{management1}</p>
-            <img src={MissionImage} alt="MissionImage" className="management-details-image" />
+            <img src={MissionImage} alt="MissonImage" className="management-details-image" />
           </div>
         </div>
         <div className="management-details-row">
           <p className="management-details-title">Core Value</p>
           <div className="management-details-content">
             <div className="management-details-value">
-              <img src={IconTech} alt="IconTech" className="management-icon" />
+              <img src={Technology} alt="Technology" className="management-icon" />
               <p className="management-value-writes" >{management2}</p>
             </div>
             <div className="management-details-value">
-              <img src={IconDesign} alt="iconJustice" className="management-icon" />
+              <img src={Design} alt="Design" className="management-icon" />
               <p className="management-value-writes" >{management3}</p>
             </div>
             <div className="management-details-value">
-              <img src={IconHQ} alt="iconLight" className="management-icon" />
+              <img src={Quality} alt="Quality" className="management-icon" />
               <p className="management-value-writes" >{management4}</p>
             </div>
           </div>
@@ -56,19 +58,19 @@ function MobileManagement() {
           <p className="management-details-title">Core Value</p>
           <div className="management-details-content">
             <div className="management-details-value">
-              <img src={IconTech} alt="IconTech" className="management-icon" />
+              <img src={Technology} alt="Technology" className="management-icon" />
               <p className="management-value-writes" >{management2}</p>
 
 
             </div>
             <div className="management-details-value">
-              <img src={IconDesign} alt="iconJustice" className="management-icon" />
+              <img src={Design} alt="Design" className="management-icon" />
               <p className="management-value-writes" >{management3}</p>
 
 
             </div>
             <div className="management-details-value">
-              <img src={IconHQ} alt="iconLight" className="management-icon" />
+              <img src={Quality} alt="Quality" className="management-icon" />
               <p className="management-value-writes" >{management4}</p>
 
 

diff --git a/src/data/string.js b/src/data/string.js
@@ -35,6 +35,6 @@ export const greeting4 = '(주) 드림종합건설 대표이사 박용우'
 
 //경영이념
 export const management1 = '모두에게 좋은 공간을 제공하는 것';
-export const management2 = 'technology';
-export const management3 = 'design';
-export const management4 = 'quality';
+export const management2 = 'Technology';
+export const management3 = 'Design';
+export const management4 = 'Quality';