Skip to content
GitLab
Menu
Projects
Groups
Snippets
Loading...
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in / Register
Toggle navigation
Menu
Open sidebar
students
eue
Commits
cf553154
Commit
cf553154
authored
Jul 28, 2021
by
Spark
Browse files
footer 추가, editNickname
parent
ecaf9de8
Changes
11
Show whitespace changes
Inline
Side-by-side
client/src/App.css
View file @
cf553154
...
...
@@ -2,12 +2,32 @@
body
{
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
{
background-color
:
#04AB70
!important
;
}
border
:
none
;
}
#btnlink
{
color
:
white
!important
;
...
...
@@ -56,7 +76,6 @@ body {
width
:
50%
;
height
:
6em
;
object-fit
:
cover
;
}
#socialLink
{
...
...
@@ -70,6 +89,7 @@ body {
width
:
fit-content
;
}
@media
(
max-width
:
767.98px
)
{
body
{
padding
:
30px
;
...
...
@@ -99,15 +119,16 @@ body {
padding-left
:
50px
;
padding-right
:
50px
;
margin
:
auto
;
}
.container-fluid
{
max-width
:
1000px
!important
;
min-height
:
90%
;
}
.container-fluid
.row
#stickyy
{
position
:
sticky
!important
;
position
:
-webkit-sticky
;
top
:
40px
;
width
:
fit-content
;
height
:
fit-content
;
...
...
client/src/App.js
View file @
cf553154
...
...
@@ -7,6 +7,7 @@ import LoginPage from './pages/LoginPage';
import
LocalCodePage
from
'
./pages/LocalCodePage
'
;
import
PrivateRoute
from
'
./utils/PrivateRoutes
'
;
import
PageNotFound
from
'
./components/PageNotFound
'
;
import
Footer
from
'
./components/Footer
'
;
function
App
()
{
...
...
@@ -17,6 +18,7 @@ function App() {
<
Route
exact
path
=
'
/
'
component
=
{
Home
}
/
>
<
Route
path
=
'
/signup
'
component
=
{
SignupPage
}
/
>
<
Route
path
=
'
/login
'
component
=
{
LoginPage
}
/
>
<
Route
path
=
'
/loc
'
component
=
{
LocalCodePage
}
/
>
<
PrivateRoute
path
=
'
/local_code
'
>
<
LocalCodePage
/>
...
...
@@ -24,6 +26,7 @@ function App() {
<
Route
component
=
{
PageNotFound
}
/
>
<
/Switch
>
<
Footer
/>
<
/Router
>
);
...
...
client/src/components/Donation.js
0 → 100644
View file @
cf553154
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
client/src/components/Footer.js
View file @
cf553154
import
React
,
{
useEffect
,
useState
}
from
'
react
'
import
{
Row
,
Card
,
Button
,
Col
,
Modal
,
}
from
'
react-bootstrap
'
;
import
{
CopyToClipboard
}
from
'
react-copy-to-clipboard
'
;
import
React
from
'
react
'
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
(()
=>
{
if
(
isCopyshow
)
{
clickAndTwoSec
().
then
(()
=>
{
setCopyShow
(
false
);
});
}
},
[
isCopyshow
]);
// isCopyshow 가 바뀔 때만 effect를 재실행한다.
const
handleClick
=
()
=>
setCopyShow
(
true
);
function
Footer
()
{
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
'
}}
>
<
Col
>
<
a
href
=
'
https://www.notion.so/EUE-047f1812c6c24096a528dfd3330c227d
'
style
=
{{
color
:
'
rgb(110, 189, 142)
'
}}
>
TEAM
EUE
<
/a> : 안강민, 박상호, 박예
은
<
/Col
>
<
Col
>
<
Container
className
=
'
m-auto d-flex justify-content-center
'
id
=
'
footer
'
>
<
Row
className
=
'
m-auto d-flex justify-content-center text-center w-100
'
style
=
{{
fontSize
:
'
0.8em
'
}}
>
<
hr
/>
<
Col
style
=
{{
display
:
'
flex
'
,
color
:
'
gray
'
,
fontWeight
:
'
300
'
,
alignItems
:
'
center
'
,
justifyContent
:
'
center
'
}}
>
©
2021
TEAM
EUE
.
All
rights
reserved
<
/Col
>
<
/Row
>
<
Col
>
<
a
href
=
'
https://www.notion.so/EUE-047f1812c6c24096a528dfd3330c227d
'
style
=
{{
color
:
'
#04AB70
'
,
textDecoration
:
'
none
'
,
fontWeight
:
'
300
'
}}
>
<
/Card
>
<
strong
>
TEAM
EUE
<
/strong
>
<
/a> <br /
>
안강민
,
박상호
,
박예은
<
/Col
>
<
/Row
>
<
/Container
>
)
}
...
...
client/src/components/LocCodeChange.js
View file @
cf553154
...
...
@@ -45,6 +45,7 @@ function LocCodeChange() {
const
sggSelect
=
document
.
getElementById
(
'
select-sgg
'
)
const
emdSelect
=
document
.
getElementById
(
'
select-emd
'
)
function
handleClickLoc
()
{
if
(
doeSelect
.
options
[
doeSelect
.
selectedIndex
].
text
!==
'
도
'
&&
sggSelect
.
options
[
sggSelect
.
selectedIndex
].
text
!==
'
시군구
'
&&
emdSelect
.
options
[
emdSelect
.
selectedIndex
].
text
!==
'
읍면동
'
)
{
localStorage
.
setItem
(
'
code_doe
'
,
doeSelect
.
value
)
...
...
@@ -170,16 +171,14 @@ function LocCodeChange() {
<
/Form.Group
>
<
/Row
>
<
/Form
>
<
/Card.Text
>
<
Row
className
=
'
d-flex justify-content-center
'
>
<
Button
variant
=
'
light
'
style
=
{
btnstyled2
}
onClick
=
{
handleClickLoc
}
>
확인
<
/Button
>
<
/Row
>
<
/Card.Text
>
<
/Card
>
<
/Row
>
)
}
...
...
client/src/components/MainLayer.js
View file @
cf553154
...
...
@@ -4,6 +4,7 @@ import { Link } from 'react-router-dom';
import
'
../App.css
'
import
UserInfo
from
'
./UserInfo
'
;
import
{
kakaoLogout
}
from
'
../utils/Oauth
'
;
import
axios
from
'
axios
'
;
function
MainLayer
()
{
...
...
@@ -13,10 +14,8 @@ function MainLayer() {
color
:
'
rgba(195, 195, 195, 0.753)
'
,
borderRadius
:
'
20px
'
,
borderWidth
:
'
3px
'
,
marginBottom
:
'
1em
'
,
width
:
'
100%
'
,
backgroundSize
:
'
contain
'
,
margin
:
'
auto
'
,
textDecorationColor
:
'
none
'
}
...
...
@@ -45,21 +44,17 @@ function MainLayer() {
useEffect
(()
=>
{
const
airUsingLocal
=
localStorage
.
getItem
(
'
using-aircondition
'
)
if
(
airUsingLocal
===
'
true
'
)
{
console
.
log
(
'
!!
'
,
airUsing
);
console
.
log
(
airUsingLocal
);
return
setAirUsing
(
true
)
}
else
{
console
.
log
(
'
%%
'
,
airUsing
);
console
.
log
(
airUsingLocal
);
return
setAirUsing
(
false
)
}
});
return
(
<
Col
>
<
Row
className
=
'
d-flex align-items-center m-auto w-100
'
>
<
Link
to
=
'
/
'
className
=
'
m-auto
'
>
<
Row
className
=
'
d-flex align-items-center m-auto w-100
p-0
'
>
<
Link
to
=
'
/
'
className
=
'
p-0
m-auto
'
>
<
Image
src
=
'
/images/EUE11.jpg
'
alt
=
'
EUE
'
style
=
{
boxstyled
}
/
>
<
/Link
>
<
/Row
>
...
...
@@ -73,7 +68,7 @@ function MainLayer() {
key
=
'
checkbox
'
className
=
"
d-flex justify-content-center w-100
"
style
=
{{
flexDirection
:
'
row-reverse
'
}}
>
<
Form
.
Check
type
=
'
switch
'
id
=
'
aircondition
-checkbox
'
id
=
'
aircondition
er
'
label
=
'
에어컨 사용중
'
onChange
=
{
aircondiCheck
}
checked
=
{
airUsing
}
...
...
client/src/components/UserInfo.js
View file @
cf553154
...
...
@@ -40,7 +40,6 @@ function UserInfo() {
}
return
(
<
Row
>
<
Col
className
=
'
text-center pt-3 pb-2 px-0
'
>
<
Card
style
=
{
cardstyled
}
id
=
'
localName
'
>
<
Card
.
Title
>
...
...
@@ -95,7 +94,6 @@ function UserInfo() {
}
<
/Card
>
<
/Col
>
<
/Row
>
)
}
export
default
UserInfo
;
\ No newline at end of file
client/src/pages/Home.js
View file @
cf553154
...
...
@@ -6,8 +6,9 @@ import '../App.css'
import
EueSuggest
from
'
../components/EueSuggest
'
;
import
ChartLine
from
'
../components/ChartLine
'
;
import
ChartDoughnut
from
'
../components/ChartDoughnut
'
;
import
Footer
from
'
.
/.
./components/
Footer
'
;
import
Donation
from
'
../components/
Donation
'
;
import
axios
from
'
axios
'
;
import
Footer
from
'
../components/Footer
'
;
function
Home
()
{
...
...
@@ -41,7 +42,9 @@ function Home() {
return
(
<
Container
fluid
className
=
'
m-auto d-flex justify-content-center position-relative
'
>
<
Container
className
=
'
m-auto d-flex position-relative
'
style
=
{{
flexDirection
:
'
column
'
}}
fluid
>
<
Row
className
=
'
d-flex
'
>
<
Row
style
=
{
constyled
}
className
=
'
m-auto
'
>
<
Col
xs
=
{
12
}
md
=
{
6
}
className
=
'
d-flex justify-content-center
'
id
=
'
stickyy
'
>
<
Row
style
=
{
col1sty
}
className
=
'
m-auto
'
>
...
...
@@ -54,11 +57,11 @@ function Home() {
<
EueSuggest
/>
<
ChartLine
/>
<
ChartDoughnut
/>
<
Footer
/>
<
Donation
/>
<
/Col
>
<
/Row
>
<
/Row
>
<
/Container
>
);
}
...
...
client/src/pages/LocalCodePage.js
View file @
cf553154
...
...
@@ -28,7 +28,9 @@ function SignupPage() {
return
(
<
Container
fluid
className
=
'
m-auto d-flex justify-content-center position-relative
'
>
<
Container
className
=
'
m-auto d-flex position-relative
'
style
=
{{
flexDirection
:
'
column
'
}}
fluid
>
<
Row
className
=
'
d-flex
'
>
<
Row
style
=
{
constyled
}
className
=
'
m-auto
'
>
<
Col
xs
=
{
12
}
md
=
{
6
}
className
=
'
d-flex justify-content-center
'
id
=
'
stickyy
'
>
<
Row
style
=
{
col1sty
}
className
=
'
m-auto
'
>
...
...
@@ -40,8 +42,8 @@ function SignupPage() {
<
LocCodeChange
/>
<
/Col
>
<
/Row
>
<
/Row
>
<
/Container
>
);
}
...
...
client/src/pages/LoginPage.js
View file @
cf553154
...
...
@@ -3,6 +3,7 @@ import { Container, Row, Col } from 'react-bootstrap';
import
MainLayer
from
'
../components/MainLayer
'
;
import
'
../App.css
'
import
LoginComp
from
'
../components/LoginComp
'
;
import
Footer
from
'
./../components/Footer
'
;
function
SignupPage
()
{
const
constyled
=
{
...
...
@@ -28,7 +29,9 @@ function SignupPage() {
return
(
<
Container
fluid
className
=
'
m-auto d-flex justify-content-center position-relative
'
>
<
Container
className
=
'
m-auto d-flex position-relative
'
style
=
{{
flexDirection
:
'
column
'
}}
fluid
>
<
Row
className
=
'
d-flex
'
>
<
Row
style
=
{
constyled
}
className
=
'
m-auto
'
>
<
Col
xs
=
{
12
}
md
=
{
6
}
className
=
'
d-flex justify-content-center
'
id
=
'
stickyy
'
>
<
Row
style
=
{
col1sty
}
className
=
'
m-auto
'
>
...
...
@@ -37,10 +40,10 @@ function SignupPage() {
<
/Col
>
<
Col
md
=
{
6
}
style
=
{
col2sty
}
>
<
LoginComp
/>
<
/Col
>
<
/Row
>
<
/Row
>
<
/Container
>
);
...
...
client/src/pages/SignupPage.js
View file @
cf553154
...
...
@@ -3,6 +3,7 @@ import { Container, Row, Col } from 'react-bootstrap';
import
MainLayer
from
'
../components/MainLayer
'
;
import
'
../App.css
'
import
SignupComp
from
'
../components/SignupComp
'
;
import
Footer
from
'
./../components/Footer
'
;
function
SignupPage
()
{
const
constyled
=
{
...
...
@@ -28,7 +29,9 @@ function SignupPage() {
return
(
<
Container
fluid
className
=
'
m-auto d-flex justify-content-center position-relative
'
>
<
Container
className
=
'
m-auto d-flex position-relative
'
style
=
{{
flexDirection
:
'
column
'
}}
fluid
>
<
Row
className
=
'
d-flex
'
>
<
Row
style
=
{
constyled
}
className
=
'
m-auto
'
>
<
Col
xs
=
{
12
}
md
=
{
6
}
className
=
'
d-flex justify-content-center
'
id
=
'
stickyy
'
>
<
Row
style
=
{
col1sty
}
className
=
'
m-auto
'
>
...
...
@@ -40,6 +43,7 @@ function SignupPage() {
<
SignupComp
/>
<
/Col
>
<
/Row
>
<
/Row
>
<
/Container
>
);
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
.
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment