-
Notifications
You must be signed in to change notification settings - Fork 3
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge branch 'develop' into feature/home
- Loading branch information
Showing
3 changed files
with
78 additions
and
1 deletion.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,25 @@ | ||
/* MissionCertification.css */ | ||
|
||
.mission-header { | ||
background-color: #007bff; /* 바의 배경색을 원하는 색상으로 설정합니다. */ | ||
color: #fff; /* 텍스트 색상을 흰색 또는 원하는 색상으로 설정합니다. */ | ||
display: flex; | ||
justify-content: space-between; | ||
align-items: center; | ||
padding: 10px; | ||
} | ||
|
||
.mission-header-content { | ||
font-size: 24px; /* 헤더 텍스트의 글자 크기를 조절합니다. */ | ||
font-weight: bold; /* 텍스트를 볼드체로 설정합니다. */ | ||
} | ||
|
||
.icon-button { | ||
background: none; | ||
border: none; | ||
color: #fff; /* 아이콘 색상을 흰색 또는 원하는 색상으로 설정합니다. */ | ||
font-size: 24px; /* 아이콘 크기를 조절합니다. */ | ||
cursor: pointer; | ||
margin-right: 10px; /* 아이콘 간의 간격을 조절합니다. */ | ||
} | ||
|
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,50 @@ | ||
import React from 'react'; | ||
import ReactDOM from 'react-dom'; | ||
// import './index.css'; | ||
import './MissionCertification.css'; | ||
// import { FaArrowLeft, FaTimes } from 'react-icons/fa'; // 아이콘 라이브러리에서 아이콘을 가져오기. | ||
|
||
function MissionCertification() { | ||
const handleGoBack = () => { | ||
// 이전 페이지로 이동하는 로직 추가하기! | ||
// 예: history.push('/previousPage'); | ||
}; | ||
|
||
const handleClose = () => { | ||
// 화면을 닫는 로직을 추가하기! | ||
}; | ||
|
||
return ( | ||
<header className="mission-header"> | ||
<div className="mission-header-content"> | ||
<button className="icon-button" onClick={handleGoBack}> | ||
{/* 이전 페이지로 가는 아이콘 */} | ||
{/* <FaArrowLeft /> */} | ||
</button> | ||
미션 인증 | ||
<button className="icon-button" onClick={handleClose}> | ||
{/* 화면을 닫는 아이콘 */} | ||
{/* <FaTimes /> */} | ||
</button> | ||
</div> | ||
</header> | ||
); | ||
} | ||
|
||
export default MissionCertification; | ||
|
||
// function App() { | ||
// return ( | ||
// <div className="app"> | ||
// <MissionCertification /> | ||
// {/* 이어서 미션 인증 페이지의 내용 추가하기. */} | ||
// </div> | ||
// ); | ||
// } | ||
|
||
// ReactDOM.render( | ||
// <React.StrictMode> | ||
// <App /> | ||
// </React.StrictMode>, | ||
// document.getElementById('root') | ||
// ); |