Showing
2 changed files
with
39 additions
and
3 deletions
| ... | @@ -13,7 +13,7 @@ const NavBar = () => { | ... | @@ -13,7 +13,7 @@ const NavBar = () => { |
| 13 | ); | 13 | ); |
| 14 | } | 14 | } |
| 15 | 15 | ||
| 16 | -const SideBar = () => { | 16 | +const LeftSideBar = () => { |
| 17 | return ( | 17 | return ( |
| 18 | <nav class="col-md-2 d-none d-md-block bg-light sidebar"> | 18 | <nav class="col-md-2 d-none d-md-block bg-light sidebar"> |
| 19 | <div class="sidebar-sticky"> | 19 | <div class="sidebar-sticky"> |
| ... | @@ -70,12 +70,49 @@ const SideBar = () => { | ... | @@ -70,12 +70,49 @@ const SideBar = () => { |
| 70 | ); | 70 | ); |
| 71 | } | 71 | } |
| 72 | 72 | ||
| 73 | +const RightSideBar = () => { | ||
| 74 | + return ( | ||
| 75 | + <nav class="col-md-2 d-none d-md-block bg-light sidebar"> | ||
| 76 | + <div class="sidebar-sticky"> | ||
| 77 | + <ul class="nav flex-column"> | ||
| 78 | + <li class="nav-item"> | ||
| 79 | + <a class="nav-link active" href="#"> | ||
| 80 | + <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> | ||
| 81 | + Dashboard <span class="sr-only">(current)</span> | ||
| 82 | + </a> | ||
| 83 | + </li> | ||
| 84 | + <li class="nav-item"> | ||
| 85 | + <a class="nav-link" href="#"> | ||
| 86 | + <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> | ||
| 87 | + 파일 업로드 | ||
| 88 | + </a> | ||
| 89 | + </li> | ||
| 90 | + <li class="nav-item"> | ||
| 91 | + <a class="nav-link" href="#"> | ||
| 92 | + <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> | ||
| 93 | + 폴더 업로드 | ||
| 94 | + </a> | ||
| 95 | + </li> | ||
| 96 | + <li class="nav-item"> | ||
| 97 | + <a class="nav-link" href="#"> | ||
| 98 | + <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> | ||
| 99 | + 새 폴더 | ||
| 100 | + </a> | ||
| 101 | + </li> | ||
| 102 | + </ul> | ||
| 103 | + </div> | ||
| 104 | + </nav> | ||
| 105 | + | ||
| 106 | + ); | ||
| 107 | +} | ||
| 108 | + | ||
| 73 | function App() { | 109 | function App() { |
| 74 | return ( | 110 | return ( |
| 75 | <div className="App"> | 111 | <div className="App"> |
| 76 | <NavBar /> | 112 | <NavBar /> |
| 77 | <div class="row"> | 113 | <div class="row"> |
| 78 | - <SideBar /> | 114 | + <LeftSideBar /> |
| 115 | + <RightSideBar /> | ||
| 79 | </div> | 116 | </div> |
| 80 | </div> | 117 | </div> |
| 81 | ); | 118 | ); | ... | ... |
| ... | @@ -2,7 +2,6 @@ import React from 'react'; | ... | @@ -2,7 +2,6 @@ import React from 'react'; |
| 2 | import ReactDOM from 'react-dom'; | 2 | import ReactDOM from 'react-dom'; |
| 3 | import './index.css'; | 3 | import './index.css'; |
| 4 | import App from './App'; | 4 | import App from './App'; |
| 5 | -import * as serviceWorker from './serviceWorker'; | ||
| 6 | 5 | ||
| 7 | ReactDOM.render( | 6 | ReactDOM.render( |
| 8 | <App />, | 7 | <App />, | ... | ... |
-
Please register or login to post a comment