Commit 3a341f06 authored by KangMin An's avatar KangMin An
Browse files

Merge branch 'who' into premaster

parents 7b6f5abb d6e24f8b
...@@ -2,12 +2,32 @@ ...@@ -2,12 +2,32 @@
body { body {
font-family: "Noto Sans KR", sans-serif !important; font-family: "Noto Sans KR", sans-serif !important;
width: 100%;
min-height: 100vh;
margin: 0;
display: flex;
}
#root {
width: 100%;
min-height: 100%;
}
#footer{
position: relative;
bottom: 1em;
padding-top: 2em;
}
.form-check-input{
cursor: pointer;
box-shadow: none !important;
} }
.form-check-input:checked { .form-check-input:checked {
background-color: #04AB70 !important; background-color: #04AB70 !important;
} border: none;
}
#btnlink { #btnlink {
color: white !important; color: white !important;
...@@ -56,7 +76,6 @@ body { ...@@ -56,7 +76,6 @@ body {
width: 50%; width: 50%;
height: 6em; height: 6em;
object-fit: cover; object-fit: cover;
} }
#socialLink { #socialLink {
...@@ -70,6 +89,7 @@ body { ...@@ -70,6 +89,7 @@ body {
width: fit-content; width: fit-content;
} }
@media (max-width: 767.98px) { @media (max-width: 767.98px) {
body { body {
padding: 30px; padding: 30px;
...@@ -99,15 +119,16 @@ body { ...@@ -99,15 +119,16 @@ body {
padding-left: 50px; padding-left: 50px;
padding-right: 50px; padding-right: 50px;
margin: auto; margin: auto;
} }
.container-fluid { .container-fluid {
max-width: 1000px !important; max-width: 1000px !important;
min-height: 90%;
} }
.container-fluid .row #stickyy { .container-fluid .row #stickyy {
position: sticky !important; position: sticky !important;
position: -webkit-sticky;
top: 40px; top: 40px;
width: fit-content; width: fit-content;
height: fit-content; height: fit-content;
......
...@@ -7,6 +7,7 @@ import LoginPage from './pages/LoginPage'; ...@@ -7,6 +7,7 @@ import LoginPage from './pages/LoginPage';
import LocalCodePage from './pages/LocalCodePage'; import LocalCodePage from './pages/LocalCodePage';
import PrivateRoute from './utils/PrivateRoutes'; import PrivateRoute from './utils/PrivateRoutes';
import PageNotFound from './components/PageNotFound'; import PageNotFound from './components/PageNotFound';
import Footer from './components/Footer';
function App() { function App() {
...@@ -17,6 +18,7 @@ function App() { ...@@ -17,6 +18,7 @@ function App() {
<Route exact path='/' component={Home} /> <Route exact path='/' component={Home} />
<Route path='/signup' component={SignupPage} /> <Route path='/signup' component={SignupPage} />
<Route path='/login' component={LoginPage} /> <Route path='/login' component={LoginPage} />
<Route path='/loc' component={LocalCodePage} />
<PrivateRoute path='/local_code'> <PrivateRoute path='/local_code'>
<LocalCodePage /> <LocalCodePage />
...@@ -24,6 +26,7 @@ function App() { ...@@ -24,6 +26,7 @@ function App() {
<Route component={PageNotFound} /> <Route component={PageNotFound} />
</Switch> </Switch>
<Footer />
</Router> </Router>
); );
......
import React, { useEffect, useState } from 'react'
import { Row, Card, Button, Col, Modal, } from 'react-bootstrap';
import { CopyToClipboard } from 'react-copy-to-clipboard';
import '../App.css'
function Donation() {
const cardstyled = {
margin: 'auto',
padding: '1em',
display: 'flex',
justifyContent: 'center',
width: '100%',
borderWidth: '3px',
borderRadius: '20px',
borderColor: 'rgb(110, 189, 142)',
color: '#04AB70'
}
const btnstyled2 = {
background: 'white',
margin: '1px',
maxWidth: 'fit-content',
borderWidth: '2px',
color: 'rgb(110, 189, 142)',
borderColor: 'rgba(195, 195, 195, 0.753)',
borderRadius: '20px',
}
const [donateShow, setDonateShow] = useState(false);
const [isCopyshow, setCopyShow] = useState(false);
const HandleClose = () => setDonateShow(false);
function clickAndTwoSec() {
return new Promise((resolve) => setTimeout(resolve, 2000))
}
useEffect(() => {
if (isCopyshow) {
clickAndTwoSec().then(() => {
setCopyShow(false);
});
}
}, [isCopyshow]);
// isCopyshow 가 바뀔 때만 effect를 재실행한다.
const handleClick = () => setCopyShow(true);
return (
<Row className='text-center w-100 my-2'>
<Card style={cardstyled}>
<Card.Title>
<p>
서버비용 후원하기
</p>
</Card.Title>
<Card.Subtitle>
이용하시는데 불편함이 없도록 광고 없이 운영하고 있습니다. <br />
서버비용 충당 후원금이 남을시 UNICEF 기부하겠습니다.
</Card.Subtitle>
<Row className='my-2 d-flex justify-content-center'>
<Button variant='light' style={btnstyled2} onClick={() => setDonateShow(true)}>
후원하기
</Button>
<Modal
size='md'
show={donateShow}
onHide={HandleClose}
style={{ top: '80px', left: '1vw' }}
>
<Modal.Header className='d-flex justify-content-center'>
<Modal.Title>
Thank you for Donation
</Modal.Title>
</Modal.Header>
<Modal.Body>
<Col className='d-flex justify-content-center text-center' style={{ flexDirection: 'column' }}>
<Card style={{ color: 'rgb(109, 110, 109)', paddingTop: '10px' }}>
카카오뱅크
<CopyToClipboard text={'박상호 3333-16-7299769'}>
<p className='m-auto' style={btnstyled2} >
박상호 3333-16-7299769
<Button variant='light'
disabled={isCopyshow}
onClick={!isCopyshow ? handleClick : null}
style={{
background: 'lightgray',
margin: '5px',
maxWidth: 'fit-content',
borderWidth: '2px',
fontSize: '14px',
color: 'black',
border: 'none',
whiteSpace: 'nowrap'
}}>
{isCopyshow ? '복사 성공!' : '복사'}
</Button>
</p>
</CopyToClipboard>
</Card>
</Col>
</Modal.Body>
<Modal.Footer>
<Button variant='light' style={btnstyled2} onClick={HandleClose}>
닫기
</Button>
</Modal.Footer>
</Modal>
</Row>
<Row className='d-flex justify-content-center flex-direction-column' style={{ color: 'rgb(109, 110, 109)', flexDirection: 'column', fontSize: '0.8em' }}>
</Row>
</Card>
</Row>
)
}
export default Donation;
\ No newline at end of file
...@@ -14,6 +14,7 @@ function EueSuggest() { ...@@ -14,6 +14,7 @@ function EueSuggest() {
borderColor: 'rgb(110, 189, 142)', borderColor: 'rgb(110, 189, 142)',
color: '#04AB70' color: '#04AB70'
} }
const airUsing = localStorage.getItem('using-aircondition') const airUsing = localStorage.getItem('using-aircondition')
......
import React, { useEffect, useState } from 'react' import React from 'react'
import { Row, Card, Button, Col, Modal, } from 'react-bootstrap';
import { CopyToClipboard } from 'react-copy-to-clipboard';
import '../App.css' import '../App.css'
import { Container, Row, Col } from 'react-bootstrap';
function Footer() {
const cardstyled = {
margin: 'auto',
padding: '1em',
display: 'flex',
justifyContent: 'center',
width: '100%',
borderWidth: '3px',
borderRadius: '20px',
borderColor: 'rgb(110, 189, 142)',
color: '#04AB70'
}
const btnstyled2 = {
background: 'white',
margin: '1px',
maxWidth: 'fit-content',
borderWidth: '2px',
color: 'rgb(110, 189, 142)',
borderColor: 'rgba(195, 195, 195, 0.753)',
borderRadius: '20px',
}
const [donateShow, setDonateShow] = useState(false);
const [isCopyshow, setCopyShow] = useState(false);
const HandleClose = () => setDonateShow(false);
function clickAndTwoSec() {
return new Promise((resolve) => setTimeout(resolve, 2000))
}
useEffect(() => { function Footer() {
if (isCopyshow) {
clickAndTwoSec().then(() => {
setCopyShow(false);
});
}
}, [isCopyshow]);
// isCopyshow 가 바뀔 때만 effect를 재실행한다.
const handleClick = () => setCopyShow(true);
return ( return (
<Row className='text-center w-100 my-2'> <Container className='m-auto d-flex justify-content-center' id='footer'>
<Card style={cardstyled}> <Row className='m-auto d-flex justify-content-center text-center w-100'
<Card.Title> style={{ fontSize: '0.8em' }}>
<p> <hr />
서버비용 후원하기 <Col style={{ display: 'flex', color: 'gray', fontWeight: '300', alignItems: 'center', justifyContent: 'center' }}>
</p> © 2021 TEAM EUE. All rights reserved
</Card.Title> </Col>
<Card.Subtitle> <Col>
이용하시는데 불편함이 없도록 광고 없이 운영하고 있습니다. <br /> <a href='https://www.notion.so/EUE-047f1812c6c24096a528dfd3330c227d'
서버비용 충당 후원금이 남을시 UNICEF 기부하겠습니다. style={{ color: '#04AB70', textDecoration: 'none', fontWeight: '300' }}>
</Card.Subtitle>
<Row className='my-2 d-flex justify-content-center'> <strong>
<Button variant='light' style={btnstyled2} onClick={() => setDonateShow(true)}> TEAM EUE
후원하기 </strong>
</Button> </a> <br />안강민, 박상호, 박예은
<Modal </Col>
size='md' </Row>
show={donateShow} </Container >
onHide={HandleClose}
style={{ top: '80px', left: '1vw' }}
>
<Modal.Header className='d-flex justify-content-center'>
<Modal.Title>
Thank you for Donation
</Modal.Title>
</Modal.Header>
<Modal.Body>
<Col className='d-flex justify-content-center text-center' style={{ flexDirection: 'column' }}>
<Card style={{ color: 'rgb(109, 110, 109)', paddingTop: '10px' }}>
카카오뱅크
<CopyToClipboard text={'박상호 3333-16-7299769'}>
<p className='m-auto' style={btnstyled2} >
박상호 3333-16-7299769
<Button variant='light'
disabled={isCopyshow}
onClick={!isCopyshow ? handleClick : null}
style={{
background: 'lightgray',
margin: '5px',
maxWidth: 'fit-content',
borderWidth: '2px',
fontSize: '14px',
color: 'black',
border: 'none',
whiteSpace: 'nowrap'
}}>
{isCopyshow ? '복사 성공!' : '복사'}
</Button>
</p>
</CopyToClipboard>
</Card>
</Col>
</Modal.Body>
<Modal.Footer>
<Button variant='light' style={btnstyled2} onClick={HandleClose}>
닫기
</Button>
</Modal.Footer>
</Modal>
</Row>
<Row className='d-flex justify-content-center flex-direction-column' style={{ color: 'rgb(109, 110, 109)', flexDirection: 'column', fontSize: '0.8em' }}>
<Col>
<a href='https://www.notion.so/EUE-047f1812c6c24096a528dfd3330c227d' style={{ color: 'rgb(110, 189, 142)' }}>TEAM EUE </a> : 안강민, 박상호, 박예
</Col>
<Col>
© 2021 TEAM EUE. All rights reserved
</Col>
</Row>
</Card>
</Row>
) )
} }
......
...@@ -22,9 +22,11 @@ function LocCodeChange() { ...@@ -22,9 +22,11 @@ function LocCodeChange() {
const inboxstyled = { const inboxstyled = {
display: 'flex', display: 'flex',
flexDirection: 'column', flexDirection: 'column',
maxWidth: '80%',
justifyContent: 'center', justifyContent: 'center',
margin: 'auto', margin: 'auto',
padding: '10px' padding: '0.5em',
color: 'black'
} }
const btnstyled2 = { const btnstyled2 = {
...@@ -45,6 +47,7 @@ function LocCodeChange() { ...@@ -45,6 +47,7 @@ function LocCodeChange() {
const sggSelect = document.getElementById('select-sgg') const sggSelect = document.getElementById('select-sgg')
const emdSelect = document.getElementById('select-emd') const emdSelect = document.getElementById('select-emd')
function handleClickLoc() { function handleClickLoc() {
if (doeSelect.options[doeSelect.selectedIndex].text !== '' && sggSelect.options[sggSelect.selectedIndex].text !== '시군구' && emdSelect.options[emdSelect.selectedIndex].text !== '읍면동') { if (doeSelect.options[doeSelect.selectedIndex].text !== '' && sggSelect.options[sggSelect.selectedIndex].text !== '시군구' && emdSelect.options[emdSelect.selectedIndex].text !== '읍면동') {
localStorage.setItem('code_doe', doeSelect.value) localStorage.setItem('code_doe', doeSelect.value)
...@@ -116,10 +119,10 @@ function LocCodeChange() { ...@@ -116,10 +119,10 @@ function LocCodeChange() {
<Row className='text-center w-100 my-2'> <Row className='text-center w-100 my-2'>
<Card style={cardstyled}> <Card style={cardstyled}>
<Card.Title id='impactTitle'> <Card.Title id='impactTitle'>
Local Code 지역 코드
</Card.Title> </Card.Title>
<Card.Subtitle style={{ fontWeight: 'lighter' }}> <Card.Subtitle style={{ fontWeight: 'lighter' }}>
Please select a your region 본인의 지역을 선택해주세요
</Card.Subtitle> </Card.Subtitle>
<hr /> <hr />
<Card.Text className='m-0'> <Card.Text className='m-0'>
...@@ -170,16 +173,14 @@ function LocCodeChange() { ...@@ -170,16 +173,14 @@ function LocCodeChange() {
</Form.Group> </Form.Group>
</Row> </Row>
</Form> </Form>
<Row className='d-flex justify-content-center'>
<Button
variant='light' style={btnstyled2} onClick={handleClickLoc}>
확인
</Button>
</Row>
</Card.Text> </Card.Text>
<Row className='d-flex justify-content-center'>
<Button
variant='light' style={btnstyled2} onClick={handleClickLoc}>
확인
</Button>
</Row>
</Card> </Card>
</Row> </Row>
) )
} }
......
import React, { useState } from 'react'; import React, { useState } from 'react';
import '../App.css' import '../App.css'
import { Form, Button, Row, Col, Card, Alert } from 'react-bootstrap'; import { Form, Button, Row, Col, Card, Alert, FloatingLabel } from 'react-bootstrap';
import { LoginWithKakao } from '../utils/Oauth'; import { LoginWithKakao } from '../utils/Oauth';
function LoginComp() { function LoginComp() {
...@@ -23,7 +23,8 @@ function LoginComp() { ...@@ -23,7 +23,8 @@ function LoginComp() {
maxWidth: '80%', maxWidth: '80%',
justifyContent: 'center', justifyContent: 'center',
margin: 'auto', margin: 'auto',
padding: '10px' padding: '0.5em',
color: 'black'
} }
const [emailSentAlert, setEmailSentAlert] = useState(false) const [emailSentAlert, setEmailSentAlert] = useState(false)
...@@ -34,7 +35,7 @@ function LoginComp() { ...@@ -34,7 +35,7 @@ function LoginComp() {
function CheckEmailSend() { function CheckEmailSend() {
localStorage.setItem('login_email_Address', emailAddress) localStorage.setItem('login_email_Address', emailAddress)
const emailIs = localStorage.getItem('login_email_Address').split('@')[1] const emailIs = localStorage.getItem('login_email_Address').split('@')[1]
if(emailIs) { if (emailIs) {
setAlertShow(true) setAlertShow(true)
setEmailSentAlert(false) setEmailSentAlert(false)
} }
...@@ -89,9 +90,13 @@ function LoginComp() { ...@@ -89,9 +90,13 @@ function LoginComp() {
</Row> </Row>
<Form style={inboxstyled}> <Form style={inboxstyled}>
<Form.Group controlId="formBasicEmail"> <FloatingLabel
controlId="floatingInput"
label="Email"
>
<Form.Control type="email" placeholder="Email" onChange={handleChange} /> <Form.Control type="email" placeholder="Email" onChange={handleChange} />
</Form.Group>
</FloatingLabel>
<Button variant='light' className='mt-3' id='formbtn' onClick={CheckEmailSend}> <Button variant='light' className='mt-3' id='formbtn' onClick={CheckEmailSend}>
LOGIN LOGIN
</Button> </Button>
......
...@@ -4,6 +4,7 @@ import { Link } from 'react-router-dom'; ...@@ -4,6 +4,7 @@ import { Link } from 'react-router-dom';
import '../App.css' import '../App.css'
import UserInfo from './UserInfo'; import UserInfo from './UserInfo';
import { kakaoLogout } from '../utils/Oauth'; import { kakaoLogout } from '../utils/Oauth';
import axios from 'axios';
function MainLayer() { function MainLayer() {
...@@ -13,10 +14,8 @@ function MainLayer() { ...@@ -13,10 +14,8 @@ function MainLayer() {
color: 'rgba(195, 195, 195, 0.753)', color: 'rgba(195, 195, 195, 0.753)',
borderRadius: '20px', borderRadius: '20px',
borderWidth: '3px', borderWidth: '3px',
marginBottom: '1em',
width: '100%', width: '100%',
backgroundSize: 'contain', backgroundSize: 'contain',
margin: 'auto',
textDecorationColor: 'none' textDecorationColor: 'none'
} }
...@@ -45,21 +44,17 @@ function MainLayer() { ...@@ -45,21 +44,17 @@ function MainLayer() {
useEffect(() => { useEffect(() => {
const airUsingLocal = localStorage.getItem('using-aircondition') const airUsingLocal = localStorage.getItem('using-aircondition')
if (airUsingLocal === 'true') { if (airUsingLocal === 'true') {
console.log('!!', airUsing);
console.log(airUsingLocal);
return setAirUsing(true) return setAirUsing(true)
} }
else { else {
console.log('%%', airUsing);
console.log(airUsingLocal);
return setAirUsing(false) return setAirUsing(false)
} }
}); });
return ( return (
<Col> <Col>
<Row className='d-flex align-items-center m-auto w-100'> <Row className='d-flex align-items-center m-auto w-100 p-0'>
<Link to='/' className=' m-auto'> <Link to='/' className='p-0 m-auto'>
<Image src='/images/EUE11.jpg' alt='EUE' style={boxstyled} /> <Image src='/images/EUE11.jpg' alt='EUE' style={boxstyled} />
</Link> </Link>
</Row> </Row>
...@@ -73,7 +68,7 @@ function MainLayer() { ...@@ -73,7 +68,7 @@ function MainLayer() {
key='checkbox' className="d-flex justify-content-center w-100" style={{ flexDirection: 'row-reverse' }}> key='checkbox' className="d-flex justify-content-center w-100" style={{ flexDirection: 'row-reverse' }}>
<Form.Check <Form.Check
type='switch' type='switch'
id='aircondition-checkbox' id='airconditioner'
label='에어컨 사용중' label='에어컨 사용중'
onChange={aircondiCheck} onChange={aircondiCheck}
checked={airUsing} checked={airUsing}
......
import React, { useEffect } from 'react'
import { Row, Card, Col, Form, Button, FloatingLabel } from 'react-bootstrap';
function NicknameChange() {
const cardstyled = {
margin: 'auto',
padding: '1em',
display: 'flex',
justifyContent: 'center',
width: '100%',
borderWidth: '3px',
borderRadius: '20px',
borderColor: 'rgb(110, 189, 142)',
color: '#04AB70'
}
const inboxstyled = {
display: 'flex',
flexDirection: 'column',
maxWidth: '80%',
justifyContent: 'center',
margin: 'auto',
padding: '0.5em',
color: 'black'
}
const exNick = localStorage.getItem('nickname')
console.log(exNick)
function handleChange ({ target: { value } }) {
localStorage.setItem('nickname', value)
}
function handleSubmit(event) {
event.preventDefault();
window.location.reload();
};
return (
<Row className='text-center w-100 my-2'>
<Card style={cardstyled}>
<Card.Title id='impactTitle'>
닉네임 변경
</Card.Title>
<Card.Subtitle style={{ fontWeight: 'lighter' }}>
새로운 닉네임으로 변경해보세요
</Card.Subtitle>
<hr />
<Card.Text className='m-0'>
<Form style={inboxstyled} onSubmit={handleSubmit}>
<FloatingLabel
controlId="floatingInput"
label="Nickname"
>
<Form.Control type="text" placeholder="닉네임 변경" id='nickname' onChange={handleChange} />
</FloatingLabel>
<Button variant='light' className='mt-3' id='formbtn' type='submit'>
</Button>
</Form>
</Card.Text>
</Card>
</Row>
)
}
export default NicknameChange;
\ No newline at end of file
import React, { useState } from 'react' import React, { useState } from 'react'
import '../App.css' import '../App.css'
import { Form, Button, Row, Col, Card, Alert } from 'react-bootstrap'; import { Form, Button, Row, Col, Card, Alert, FloatingLabel } from 'react-bootstrap';
import { LoginWithKakao } from '../utils/Oauth'; import { LoginWithKakao } from '../utils/Oauth';
function SignupComp() { function SignupComp() {
...@@ -23,7 +23,8 @@ function SignupComp() { ...@@ -23,7 +23,8 @@ function SignupComp() {
maxWidth: '80%', maxWidth: '80%',
justifyContent: 'center', justifyContent: 'center',
margin: 'auto', margin: 'auto',
padding: '1rem' padding: '0.5em',
color: 'black'
} }
const initValues = { const initValues = {
...@@ -125,35 +126,36 @@ function SignupComp() { ...@@ -125,35 +126,36 @@ function SignupComp() {
} }
</Row> </Row>
<Form style={inboxstyled} <Form style={inboxstyled} onSubmit={handleSubmit}>
onSubmit={handleSubmit}> <FloatingLabel
<Form.Group controlId="username"> controlId="floatingInput"
<Row className='m-auto mb-1 d-flex justify-content-center'> label="Name"
<Form.Control className='mb-3'
type="text" >
name="name" <Form.Control
placeholder="Name" type="text"
value={formValues.name} name="name"
onChange={handleChange} placeholder="Name"
required value={formValues.name}
/> onChange={handleChange}
</Row> required
<Row> />
<p></p> </FloatingLabel>
</Row> <FloatingLabel
<Row className='m-auto d-flex justify-content-center'> controlId="floatingInput"
<Form.Control label="Email Address"
type="email" >
name="email" <Form.Control
placeholder="Email Address" type="email"
value={formValues.email} name="email"
onChange={handleChange} placeholder="Email Address"
required value={formValues.email}
/> onChange={handleChange}
</Row> required
</Form.Group> />
</FloatingLabel>
<Button variant='light' className='mt-3' id='formbtn' onClick={CheckUserExist}>
<Button variant='light' className='mt-3' id='formbtn' type='submit' onClick={CheckUserExist}>
{/* type="submit" */} {/* type="submit" */}
Sign Up Sign Up
</Button> </Button>
......
...@@ -40,7 +40,6 @@ function UserInfo() { ...@@ -40,7 +40,6 @@ function UserInfo() {
} }
return ( return (
<Row>
<Col className='text-center pt-3 pb-2 px-0'> <Col className='text-center pt-3 pb-2 px-0'>
<Card style={cardstyled} id='localName'> <Card style={cardstyled} id='localName'>
<Card.Title> <Card.Title>
...@@ -95,7 +94,6 @@ function UserInfo() { ...@@ -95,7 +94,6 @@ function UserInfo() {
} }
</Card> </Card>
</Col> </Col>
</Row>
) )
} }
export default UserInfo; export default UserInfo;
\ No newline at end of file
...@@ -6,7 +6,7 @@ import '../App.css' ...@@ -6,7 +6,7 @@ import '../App.css'
import EueSuggest from '../components/EueSuggest'; import EueSuggest from '../components/EueSuggest';
import ChartLine from '../components/ChartLine'; import ChartLine from '../components/ChartLine';
import ChartDoughnut from '../components/ChartDoughnut'; import ChartDoughnut from '../components/ChartDoughnut';
import Footer from './../components/Footer'; import Donation from '../components/Donation';
import axios from 'axios'; import axios from 'axios';
...@@ -32,33 +32,31 @@ function Home() { ...@@ -32,33 +32,31 @@ function Home() {
padding: '0' padding: '0'
} }
axios({ const getusername = axios.get(`/api/user`)
method: 'get', console.log(getusername)
url: 'localhost:4500/loccode/doe'
}).then((res) => {
console.log(res)
})
return ( return (
<Container fluid className='m-auto d-flex justify-content-center position-relative'> <Container className='m-auto d-flex position-relative'
<Row style={constyled} className='m-auto'> style={{ flexDirection: 'column' }} fluid>
<Col xs={12} md={6} className='d-flex justify-content-center' id='stickyy'> <Row className='d-flex'>
<Row style={col1sty} className='m-auto'> <Row style={constyled} className='m-auto'>
<MainLayer /> <Col xs={12} md={6} className='d-flex justify-content-center' id='stickyy'>
<Row style={col1sty} className='m-auto'>
<MainLayer />
</Row>
</Col>
<Col md={6} style={col2sty}>
{/* <TimeNow /> */}
<EueSuggest />
<ChartLine />
<ChartDoughnut />
<Donation />
</Col>
</Row> </Row>
</Col> </Row>
</Container>
<Col md={6} style={col2sty}>
{/* <TimeNow /> */}
<EueSuggest />
<ChartLine />
<ChartDoughnut />
<Footer />
</Col>
</Row>
</Container>
); );
} }
......
...@@ -3,6 +3,7 @@ import { Container, Row, Col } from 'react-bootstrap'; ...@@ -3,6 +3,7 @@ import { Container, Row, Col } from 'react-bootstrap';
import MainLayer from '../components/MainLayer'; import MainLayer from '../components/MainLayer';
import '../App.css' import '../App.css'
import LocCodeChange from '../components/LocCodeChange'; import LocCodeChange from '../components/LocCodeChange';
import NicknameChange from '../components/NicknameChange';
function SignupPage() { function SignupPage() {
const constyled = { const constyled = {
...@@ -28,20 +29,23 @@ function SignupPage() { ...@@ -28,20 +29,23 @@ function SignupPage() {
return ( return (
<Container fluid className='m-auto d-flex justify-content-center position-relative'> <Container className='m-auto d-flex position-relative'
<Row style={constyled} className='m-auto'> style={{ flexDirection: 'column' }} fluid>
<Col xs={12} md={6} className='d-flex justify-content-center' id='stickyy'> <Row className='d-flex'>
<Row style={col1sty} className='m-auto'> <Row style={constyled} className='m-auto'>
<MainLayer /> <Col xs={12} md={6} className='d-flex justify-content-center' id='stickyy'>
</Row> <Row style={col1sty} className='m-auto'>
</Col> <MainLayer />
</Row>
<Col md={6} style={col2sty}> </Col>
<Col md={6} style={col2sty}>
<NicknameChange />
<LocCodeChange /> <LocCodeChange />
</Col> </Col>
</Row>
</Row> </Row>
</Container> </Container>
); );
} }
......
...@@ -3,6 +3,7 @@ import { Container, Row, Col } from 'react-bootstrap'; ...@@ -3,6 +3,7 @@ import { Container, Row, Col } from 'react-bootstrap';
import MainLayer from '../components/MainLayer'; import MainLayer from '../components/MainLayer';
import '../App.css' import '../App.css'
import LoginComp from '../components/LoginComp'; import LoginComp from '../components/LoginComp';
import Footer from './../components/Footer';
function SignupPage() { function SignupPage() {
const constyled = { const constyled = {
...@@ -28,18 +29,20 @@ function SignupPage() { ...@@ -28,18 +29,20 @@ function SignupPage() {
return ( return (
<Container fluid className='m-auto d-flex justify-content-center position-relative'> <Container className='m-auto d-flex position-relative'
<Row style={constyled} className='m-auto'> style={{ flexDirection: 'column' }} fluid>
<Col xs={12} md={6} className='d-flex justify-content-center' id='stickyy'> <Row className='d-flex'>
<Row style={col1sty} className='m-auto'> <Row style={constyled} className='m-auto'>
<MainLayer /> <Col xs={12} md={6} className='d-flex justify-content-center' id='stickyy'>
</Row> <Row style={col1sty} className='m-auto'>
</Col> <MainLayer />
</Row>
<Col md={6} style={col2sty}> </Col>
<Col md={6} style={col2sty}>
<LoginComp /> <LoginComp />
</Col> </Col>
</Row>
</Row> </Row>
</Container> </Container>
......
...@@ -3,6 +3,7 @@ import { Container, Row, Col } from 'react-bootstrap'; ...@@ -3,6 +3,7 @@ import { Container, Row, Col } from 'react-bootstrap';
import MainLayer from '../components/MainLayer'; import MainLayer from '../components/MainLayer';
import '../App.css' import '../App.css'
import SignupComp from '../components/SignupComp'; import SignupComp from '../components/SignupComp';
import Footer from './../components/Footer';
function SignupPage() { function SignupPage() {
const constyled = { const constyled = {
...@@ -28,17 +29,20 @@ function SignupPage() { ...@@ -28,17 +29,20 @@ function SignupPage() {
return ( return (
<Container fluid className='m-auto d-flex justify-content-center position-relative'> <Container className='m-auto d-flex position-relative'
<Row style={constyled} className='m-auto'> style={{ flexDirection: 'column' }} fluid>
<Col xs={12} md={6} className='d-flex justify-content-center' id='stickyy'> <Row className='d-flex'>
<Row style={col1sty} className='m-auto'> <Row style={constyled} className='m-auto'>
<MainLayer /> <Col xs={12} md={6} className='d-flex justify-content-center' id='stickyy'>
</Row> <Row style={col1sty} className='m-auto'>
</Col> <MainLayer />
</Row>
<Col md={6} style={col2sty}> </Col>
<SignupComp />
</Col> <Col md={6} style={col2sty}>
<SignupComp />
</Col>
</Row>
</Row> </Row>
</Container> </Container>
......
...@@ -4,3 +4,11 @@ export const routes = { ...@@ -4,3 +4,11 @@ export const routes = {
login: 'login', login: 'login',
localcode: '/local_code', localcode: '/local_code',
} }
// post, put { body }
// email :
// nick_name :
// using_aircon :
// created_at :
// loc_code
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment