채지성

writing-complete

...@@ -63,7 +63,7 @@ const scrollChat = () => { ...@@ -63,7 +63,7 @@ const scrollChat = () => {
63 sideChat.style.top = scrollY + "px"; 63 sideChat.style.top = scrollY + "px";
64 64
65 const reposition = () => { // 화면 크기 바뀔때도 이래야함--> 추후수정 65 const reposition = () => { // 화면 크기 바뀔때도 이래야함--> 추후수정
66 - sideChat.style.transition = '800ms'; 66 + sideChat.style.transition = '500ms';
67 scrollY = window.scrollY + document.body.scrollHeight / 5 - 50; 67 scrollY = window.scrollY + document.body.scrollHeight / 5 - 50;
68 sideChat.style.top = scrollY + "px"; 68 sideChat.style.top = scrollY + "px";
69 } 69 }
......
...@@ -73,3 +73,9 @@ ...@@ -73,3 +73,9 @@
73 .mainpage :nth-child(2) :nth-child(1){ 73 .mainpage :nth-child(2) :nth-child(1){
74 background-color: #FFE4b1; 74 background-color: #FFE4b1;
75 } 75 }
76 +
77 +.mainpage :nth-child(2) :nth-child(2) {
78 + display:flex;
79 + flex-direction: column;
80 + background-color: #FDF5E6;
81 +}
...\ No newline at end of file ...\ No newline at end of file
......
...@@ -3,15 +3,23 @@ import axios from "axios"; ...@@ -3,15 +3,23 @@ import axios from "axios";
3 import { useEffect, useState } from 'react'; 3 import { useEffect, useState } from 'react';
4 import './MainPage.css' 4 import './MainPage.css'
5 5
6 +function InnerContent(props){
7 + return (
8 + <div>
9 + <div style={{fontSize:'15px', height: '10px', width:'100%', backgroundColor:'#FDF5E6'}}>{props.title} {props.content}</div>
10 + </div>
11 + );
12 +}
6 13
7 14
8 function MainPage() { 15 function MainPage() {
9 - const [list, setList] = useState([]); 16 + const [list, setList] = useState([{title: '하이', content: '바보'},{title: '하이2', content: '바보2'},{title: '하이3', content: '바보3'}]);
10 let currentYear = new Date().getFullYear(); 17 let currentYear = new Date().getFullYear();
11 let currentMonth = new Date().getMonth(); 18 let currentMonth = new Date().getMonth();
12 let currentDate = new Date().getDate(); 19 let currentDate = new Date().getDate();
13 let today = currentYear+'/'+currentMonth+'/'+currentDate; 20 let today = currentYear+'/'+currentMonth+'/'+currentDate;
14 21
22 +
15 const todayMealTable = async()=>{ 23 const todayMealTable = async()=>{
16 axios.get("/api/todayMenu").then( 24 axios.get("/api/todayMenu").then(
17 (res) => { 25 (res) => {
...@@ -46,8 +54,16 @@ function MainPage() { ...@@ -46,8 +54,16 @@ function MainPage() {
46 ) 54 )
47 }; 55 };
48 56
57 + const todayInnerContent = async()=>{ // 게시글 목록 가져오기
58 + axios.get('/api/get').then((res) => {
59 + console.log(res.data);
60 + }
61 + );
62 + }
63 +
49 useEffect(()=>{ 64 useEffect(()=>{
50 todayMealTable(); 65 todayMealTable();
66 + todayInnerContent();
51 }, []); 67 }, []);
52 68
53 return ( 69 return (
...@@ -68,6 +84,11 @@ function MainPage() { ...@@ -68,6 +84,11 @@ function MainPage() {
68 <div className='mainpageUnder'> 84 <div className='mainpageUnder'>
69 <div>메뉴에 대한 이야기</div> 85 <div>메뉴에 대한 이야기</div>
70 <div> 86 <div>
87 + {list.map((item,index)=>{
88 + return(
89 + <InnerContent key={index} title={item.title} content={item.content}/>
90 + )
91 + })}
71 </div> 92 </div>
72 </div> 93 </div>
73 </div> 94 </div>
......
...@@ -15,9 +15,9 @@ code { ...@@ -15,9 +15,9 @@ code {
15 *{ 15 *{
16 margin:0px; 16 margin:0px;
17 padding:0px; 17 padding:0px;
18 - 18 + /*
19 border-style: solid; 19 border-style: solid;
20 border-color: black; 20 border-color: black;
21 border-width: 5px; 21 border-width: 5px;
22 - 22 + */
23 } 23 }
......