Toggle navigation
Toggle navigation
This project
Loading...
Sign in
2020-1-capstone-design1
/
Triz_Project1
Go to a project
Toggle navigation
Toggle navigation pinning
Projects
Groups
Snippets
Help
Project
Activity
Repository
Pipelines
Graphs
Issues
1
Merge Requests
0
Wiki
Snippets
Network
Create a new issue
Builds
Commits
Issue Boards
Authored by
sdy
2020-07-16 19:30:05 +0900
Browse Files
Options
Browse Files
Download
Email Patches
Plain Diff
Commit
cfe2c6d4f2c8403356e0f52d0ce5263948a7166a
cfe2c6d4
1 parent
477af818
create Footer component
Show whitespace changes
Inline
Side-by-side
Showing
1 changed file
with
118 additions
and
0 deletions
front/src/Components/Footer.js
front/src/Components/Footer.js
0 → 100644
View file @
cfe2c6d
import
React
from
"react"
;
import
styled
from
"styled-components"
;
import
{
Link
}
from
"react-router-dom"
;
const
Footer
=
styled
.
footer
`
width: 100%;
border-top: 1px solid #ebeaeb;
`
;
const
MenuContainer
=
styled
.
div
`
padding: 5rem 0;
`
;
const
MenuNav
=
styled
.
nav
`
display: grid;
grid-gap: 2rem;
max-width: 80%;
margin: 0 auto;
grid-template-columns: repeat(3, 1fr);
`
;
const
MenuBlock
=
styled
.
div
`
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
`
;
const
MenuTitle
=
styled
.
p
`
padding: 10px;
font-weight: 600;
font-size: 1.3rem;
`
;
const
MenuList
=
styled
.
ul
`
line-height: 2;
`
;
const
MenuItem
=
styled
.
li
`
text-align: center;
`
;
const
CopyRightBox
=
styled
.
div
`
width: 100%;
`
;
const
CopyRightBlock
=
styled
.
div
`
max-width: 80%;
margin: 0 auto;
height: 2.5rem;
display: flex;
align-items: center;
`
;
const
CopyRightSpan
=
styled
.
span
`
font-size: 1rem;
`
;
export
default
()
=>
{
return
(
<
Footer
>
<
MenuContainer
>
<
MenuNav
>
<
MenuBlock
>
<
MenuTitle
>
CONCEPT
<
/MenuTitle
>
<
MenuList
>
<
MenuItem
>
<
Link
to
=
"/"
>
Features
<
/Link
>
<
/MenuItem
>
<
MenuItem
>
<
Link
to
=
"/"
>
Test
<
/Link
>
<
/MenuItem
>
<
MenuItem
>
<
Link
to
=
"/"
>
Observation
<
/Link
>
<
/MenuItem
>
<
/MenuList
>
<
/MenuBlock
>
<
MenuBlock
>
<
MenuTitle
>
SUBJECT
<
/MenuTitle
>
<
MenuList
>
<
MenuItem
>
<
Link
to
=
"/"
>
What
<
/Link
>
<
/MenuItem
>
<
MenuItem
>
<
Link
to
=
"/"
>
How
<
/Link
>
<
/MenuItem
>
<
MenuItem
>
<
Link
to
=
"/"
>
Why
<
/Link
>
<
/MenuItem
>
<
/MenuList
>
<
/MenuBlock
>
<
MenuBlock
>
<
MenuTitle
>
COMPANY
<
/MenuTitle
>
<
MenuList
>
<
MenuItem
>
<
Link
to
=
"/"
>
Leader
<
/Link
>
<
/MenuItem
>
<
MenuItem
>
<
Link
to
=
"/"
>
Empolyee
<
/Link
>
<
/MenuItem
>
<
MenuItem
>
<
Link
to
=
"/"
>
Salary
<
/Link
>
<
/MenuItem
>
<
/MenuList
>
<
/MenuBlock
>
<
/MenuNav
>
<
/MenuContainer
>
<
CopyRightBox
>
<
CopyRightBlock
>
<
CopyRightSpan
>
@
Copyright
2020
KhuChat
.
All
rights
reserved
.
Various
trademarks
held
by
their
respective
owners
.
<
/CopyRightSpan
>
<
/CopyRightBlock
>
<
/CopyRightBox
>
<
/Footer
>
);
};
Please
register
or
login
to post a comment