ui: 킥보드 페이지 레이아웃 구성

-/*!
-
-=========================================================
-* Light Bootstrap Dashboard React - v1.3.0
-=========================================================
-
-* Product Page: https://www.creative-tim.com/product/light-bootstrap-dashboard-react
-* Copyright 2019 Creative Tim (https://www.creative-tim.com)
-* Licensed under MIT (https://github.com/creativetimofficial/light-bootstrap-dashboard-react/blob/master/LICENSE.md)
-
-* Coded by Creative Tim
-
-=========================================================
-
-* The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
-
-*/
 import Dashboard from "views/Dashboard.jsx";
 import Dashboard from "views/Dashboard.jsx";
 import UserProfile from "views/UserProfile.jsx";
 import UserProfile from "views/UserProfile.jsx";
 import TableList from "views/TableList.jsx";
 import TableList from "views/TableList.jsx";
@@ -22,7 +5,7 @@ import Typography from "views/Typography.jsx";
 import Icons from "views/Icons.jsx";
 import Icons from "views/Icons.jsx";
 import Maps from "views/Maps.jsx";
 import Maps from "views/Maps.jsx";
 import Notifications from "views/Notifications.jsx";
 import Notifications from "views/Notifications.jsx";
-import Upgrade from "views/Upgrade.jsx";
+import Kickboard from "views/Kickboard"
 
 
 const dashboardRoutes = [
 const dashboardRoutes = [
   {
   {
@@ -74,6 +57,13 @@ const dashboardRoutes = [
     component: Notifications,
     component: Notifications,
     layout: "/admin"
     layout: "/admin"
   },
   },
+  {
+    path: "/kickboard",
+    name: "Kickboard",
+    icon: "pe-7s-bicycle",
+    component: Kickboard,
+    layout: "/admin"
+  },
 ];
 ];
 
 
 export default dashboardRoutes;
 export default dashboardRoutes;

+import React from "react";
+import ChartistGraph from "react-chartist";
+import {Grid, Row, Col, Table} from "react-bootstrap";
+import { Card } from "components/Card/Card.jsx";
+import { Tasks } from "components/Tasks/Tasks.jsx";
+import {
+  dataBar,
+  optionsBar,
+  responsiveBar,
+} from "variables/Variables.jsx";
+import { thArray, tdArray } from "variables/Variables.jsx";
+
+const Kickboard = () => {
+  return (
+    <div className="content">
+      <Grid fluid>
+        <Row>
+          <Col md={3} mdOffset={9} sm={3} smOffset={9} style={{marginBottom:15}}>
+            <input type="text" className="form-control" placeholder={"킥보드 번호로 검색하기"}/>
+          </Col>
+        </Row>
+        <Row>
+          <Col md={6}>
+            <Card
+              id="chartActivity"
+              title="2014 Sales"
+              category="All products including Taxes"
+              stats="마지막 업데이트 2020/04/20 17:23"
+              statsIcon="fa fa-check"
+              content={
+                <div className="ct-chart">
+                  <ChartistGraph
+                    data={dataBar}
+                    type="Bar"
+                    options={optionsBar}
+                    responsiveOptions={responsiveBar}
+                  />
+                </div>
+              }
+            />
+          </Col>
+          <Col md={6}>
+            <Card
+              title="Tasks"
+              category="Backend development"
+              stats="Updated 3 minutes ago"
+              statsIcon="fa fa-history"
+              content={
+                <div className="table-full-width">
+                  <table className="table">
+                    <Tasks />
+                  </table>
+                </div>
+              }
+            />
+          </Col>
+        </Row>
+        <Row>
+          <Col md={12}>
+            <Card
+              title="Striped Table with Hover"
+              category="Here is a subtitle for this table"
+              ctTableFullWidth
+              ctTableResponsive
+              content={
+                <Table striped>
+                  <thead>
+                  <tr>
+                    {thArray.map((prop, key) => {
+                      return <th key={key}>{prop}</th>;
+                    })}
+                  </tr>
+                  </thead>
+                  <tbody>
+                  {tdArray.map((prop, key) => {
+                    return (
+                      <tr key={key}>
+                        {prop.map((prop, key) => {
+                          return <td key={key}>{prop}</td>;
+                        })}
+                      </tr>
+                    );
+                  })}
+                  </tbody>
+                </Table>
+              }
+            />
+          </Col>
+        </Row>
+      </Grid>
+    </div>
+  );
+}
+
+export default Kickboard;