Toggle navigation
Toggle navigation
This project
Loading...
Sign in
2020-1-CloudComputing-E
/
E_Team_KhuBox
Go to a project
Toggle navigation
Toggle navigation pinning
Projects
Groups
Snippets
Help
Project
Activity
Repository
Graphs
Network
Create a new issue
Commits
Issue Boards
Authored by
Woojin Lee
2020-04-29 21:22:31 +0900
Browse Files
Options
Browse Files
Download
Email Patches
Plain Diff
Commit
077e703947e3d89ceb108a316fdcdebc5ee5d4b0
077e7039
1 parent
8a1f4d1d
Add sidebar
Hide whitespace changes
Inline
Side-by-side
Showing
1 changed file
with
60 additions
and
0 deletions
khubox-front/khubox/src/App.js
khubox-front/khubox/src/App.js
View file @
077e703
...
...
@@ -13,10 +13,70 @@ const NavBar = () => {
);
}
const
SideBar
=
()
=>
{
return
(
<
nav
class
=
"col-md-2 d-none d-md-block bg-light sidebar"
>
<
div
class
=
"sidebar-sticky"
>
<
ul
class
=
"nav flex-column"
>
<
li
class
=
"nav-item"
>
<
a
class
=
"nav-link active"
href
=
"#"
>
<
svg
xmlns
=
"http://www.w3.org/2000/svg"
width
=
"24"
height
=
"24"
viewBox
=
"0 0 24 24"
fill
=
"none"
stroke
=
"currentColor"
stroke
-
width
=
"2"
stroke
-
linecap
=
"round"
stroke
-
linejoin
=
"round"
class
=
"feather feather-home"
><
path
d
=
"M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"
><
/path><polyline points="9 22 9 12 15 12 15 22"></
polyline
><
/svg
>
Dashboard
<
span
class
=
"sr-only"
>
(
current
)
<
/span
>
<
/a
>
<
/li
>
<
li
class
=
"nav-item"
>
<
a
class
=
"nav-link"
href
=
"#"
>
<
svg
xmlns
=
"http://www.w3.org/2000/svg"
width
=
"24"
height
=
"24"
viewBox
=
"0 0 24 24"
fill
=
"none"
stroke
=
"currentColor"
stroke
-
width
=
"2"
stroke
-
linecap
=
"round"
stroke
-
linejoin
=
"round"
class
=
"feather feather-file"
><
path
d
=
"M13 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V9z"
><
/path><polyline points="13 2 13 9 20 9"></
polyline
><
/svg
>
내
드라이브
<
/a
>
<
/li
>
<
li
class
=
"nav-item"
>
<
a
class
=
"nav-link"
href
=
"#"
>
<
svg
xmlns
=
"http://www.w3.org/2000/svg"
width
=
"24"
height
=
"24"
viewBox
=
"0 0 24 24"
fill
=
"none"
stroke
=
"currentColor"
stroke
-
width
=
"2"
stroke
-
linecap
=
"round"
stroke
-
linejoin
=
"round"
class
=
"feather feather-shopping-cart"
><
circle
cx
=
"9"
cy
=
"21"
r
=
"1"
><
/circle><circle cx="20" cy="21" r="1"></
circle
><
path
d
=
"M1 1h4l2.68 13.39a2 2 0 0 0 2 1.61h9.72a2 2 0 0 0 2-1.61L23 6H6"
><
/path></
svg
>
공유함
<
/a
>
<
/li
>
<
li
class
=
"nav-item"
>
<
a
class
=
"nav-link"
href
=
"#"
>
<
svg
xmlns
=
"http://www.w3.org/2000/svg"
width
=
"24"
height
=
"24"
viewBox
=
"0 0 24 24"
fill
=
"none"
stroke
=
"currentColor"
stroke
-
width
=
"2"
stroke
-
linecap
=
"round"
stroke
-
linejoin
=
"round"
class
=
"feather feather-users"
><
path
d
=
"M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"
><
/path><circle cx="9" cy="7" r="4"></
circle
><
path
d
=
"M23 21v-2a4 4 0 0 0-3-3.87"
><
/path><path d="M16 3.13a4 4 0 0 1 0 7.75"></
path
><
/svg
>
최근
열어본
파일
<
/a
>
<
/li
>
<
li
class
=
"nav-item"
>
<
a
class
=
"nav-link"
href
=
"#"
>
<
svg
xmlns
=
"http://www.w3.org/2000/svg"
width
=
"24"
height
=
"24"
viewBox
=
"0 0 24 24"
fill
=
"none"
stroke
=
"currentColor"
stroke
-
width
=
"2"
stroke
-
linecap
=
"round"
stroke
-
linejoin
=
"round"
class
=
"feather feather-bar-chart-2"
><
line
x1
=
"18"
y1
=
"20"
x2
=
"18"
y2
=
"10"
><
/line><line x1="12" y1="20" x2="12" y2="4"></
line
><
line
x1
=
"6"
y1
=
"20"
x2
=
"6"
y2
=
"14"
><
/line></
svg
>
휴지통
<
/a
>
<
/li
>
<
/ul
>
<
h6
class
=
"sidebar-heading d-flex justify-content-between align-items-center px-3 mt-4 mb-1 text-muted"
>
<
span
>
저장
용량
<
/span
>
<
/h6
>
<
ul
class
=
"nav flex-column mb-2"
>
<
li
class
=
"nav-item"
>
(
저장
용량
그래프
)
<
/li
>
<
li
class
=
"nav-item"
>
<
a
class
=
"nav-link"
href
=
"#"
>
<
svg
xmlns
=
"http://www.w3.org/2000/svg"
width
=
"24"
height
=
"24"
viewBox
=
"0 0 24 24"
fill
=
"none"
stroke
=
"currentColor"
stroke
-
width
=
"2"
stroke
-
linecap
=
"round"
stroke
-
linejoin
=
"round"
class
=
"feather feather-file-text"
><
path
d
=
"M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"
><
/path><polyline points="14 2 14 8 20 8"></
polyline
><
line
x1
=
"16"
y1
=
"13"
x2
=
"8"
y2
=
"13"
><
/line><line x1="16" y1="17" x2="8" y2="17"></
line
><
polyline
points
=
"10 9 9 9 8 9"
><
/polyline></
svg
>
저장
용량
구매
<
/a
>
<
/li
>
<
/ul
>
<
/div
>
<
/nav
>
);
}
function
App
()
{
return
(
<
div
className
=
"App"
>
<
NavBar
/>
<
div
class
=
"row"
>
<
SideBar
/>
<
/div
>
<
/div
>
);
}
...
...
Please
register
or
login
to post a comment