Merge pull request #14 from TeamBNBN/FE/articlePreview

[Front-End] feat: ArticlePreview 추가
This commit is contained in:
Jo Hyeonsoo 2024-07-16 09:39:51 +09:00 committed by GitHub
commit 6a5204eaf2
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
8 changed files with 59 additions and 7 deletions

View File

@ -8,7 +8,6 @@ export default function ArticleDetail() {
const author = '이재용';
const content = 'Lorem ipsum dolor, sit amet consectetur adipisicing elit. Perferendis sed dolorem vitae?';
return (
<>
<div className={styles.articleDetail}>
<header>
<div>
@ -27,6 +26,5 @@ export default function ArticleDetail() {
</div>
<ArticleDetailAnswer />
</div>
</>
)
}

View File

@ -3,7 +3,6 @@ import styles from './ArticleDetailAnswer.module.css'
export default function ArticleDetailAnswer () {
return (
<>
<div className={styles.answer}>
<div className={styles.answerHeader}>
<div>--</div>
@ -11,6 +10,5 @@ export default function ArticleDetailAnswer () {
</div>
<div className={styles.content}>Lorem ipsum dolor sit amet.</div>
</div>
</>
)
}

View File

@ -1,4 +1,5 @@
.answer {
width: 100%;
border: 1px solid var(--border-color);
border-radius: 16px;
padding: 12px 16px;

View File

@ -0,0 +1,19 @@
import { Link } from "react-router-dom"
import styles from "./ArticlePreview.module.css"
export default function ArticlePreview () {
// TODO:
return (
<div className={styles.wrapper}>
<div className={styles.header}>
<div className={styles.title}>공지사항</div>
<Link to="/">ICON</Link>
</div>
<div className={styles.main}>
<div className={styles.content}>3주차 수업 휴강 공지</div>
<div className={styles.content}>정보처리기사 어쩌구</div>
<div className={styles.content}> 수업 준비사항</div>
</div>
</div>
)
}

View File

@ -0,0 +1,32 @@
.wrapper {
width: 100%;
padding: 20px;
box-sizing: border-box;
border-radius: 20px;
background-color: var(--background-default);
}
.header {
display: flex;
justify-content: space-between;
margin-bottom: 24px;
}
.title {
font-size: 24px;
line-height: 1.2;
font-weight: 700;
}
.main {
display: flex;
flex-direction: column;
flex-wrap: nowrap;
gap: 12px 0;
}
.content {
font-size: 16px;
line-height: 1.4;
font-weight: 400;
}

View File

@ -5,8 +5,7 @@ import styles from "./CreateArticle.module.css"
export default function CreateArticle() {
// TODO: textarea
return (
<>
<div>
<div className={styles.createArticle}>
<header className={styles.header}>
<div>
<Link to={'/'} className={styles.backButton}>
@ -35,6 +34,5 @@ export default function CreateArticle() {
</form>
</div>
</div>
</>
)
}

View File

@ -1,3 +1,8 @@
.createArticle {
width: 100%;
}
.header {
padding-left: 20px;
width: 100%;

View File

@ -1,3 +1,4 @@
export { default as ArticleDetail } from './ArticleDetail/ArticleDetail.jsx';
export { default as ArticleDetailAnswer } from './ArticleDetail/ArticleDetailAnswer/ArticleDetailAnswer.jsx';
export { default as CreateArticle } from './CreateArticle/CreateArticle.jsx';
export { default as ArticlePreview } from './ArticlePreview/ArticlePreview.jsx';