feat: 사용자 편의 UI 추가

@@ -219,7 +219,7 @@ input:focus {
     background-size: cover;
     background-size: cover;
     background-position: center center; }
     background-position: center center; }
   .sidebar .logo {
   .sidebar .logo {
-    padding: 10px 30px;
+    padding: 12px 30px;
     border-bottom: 1px solid rgba(255, 255, 255, 0.2);
     border-bottom: 1px solid rgba(255, 255, 255, 0.2);
     position: relative;
     position: relative;
     z-index: 4; }
     z-index: 4; }

+export const empty = require('./empty.png');
+export const mate_logo = require('./mate_logo.png');
+export const search_user = require('./search_user.png');

-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" width="32" height="32" fill="white">
-  <circle transform="translate(8 0)" cx="0" cy="16" r="0"> 
-    <animate attributeName="r" values="0; 4; 0; 0" dur="1.2s" repeatCount="indefinite" begin="0"
-      keytimes="0;0.2;0.7;1" keySplines="0.2 0.2 0.4 0.8;0.2 0.6 0.4 0.8;0.2 0.6 0.4 0.8" calcMode="spline" />
-  </circle>
-  <circle transform="translate(16 0)" cx="0" cy="16" r="0"> 
-    <animate attributeName="r" values="0; 4; 0; 0" dur="1.2s" repeatCount="indefinite" begin="0.3"
-      keytimes="0;0.2;0.7;1" keySplines="0.2 0.2 0.4 0.8;0.2 0.6 0.4 0.8;0.2 0.6 0.4 0.8" calcMode="spline" />
-  </circle>
-  <circle transform="translate(24 0)" cx="0" cy="16" r="0"> 
-    <animate attributeName="r" values="0; 4; 0; 0" dur="1.2s" repeatCount="indefinite" begin="0.6"
-      keytimes="0;0.2;0.7;1" keySplines="0.2 0.2 0.4 0.8;0.2 0.6 0.4 0.8;0.2 0.6 0.4 0.8" calcMode="spline" />
-  </circle>
-</svg>

@@ -33,7 +33,7 @@
     }
     }
 
 
     .logo{
     .logo{
-        padding: 10px 30px;
+        padding: 12px 30px;
         border-bottom: 1px solid rgba(255, 255, 255, 0.2);
         border-bottom: 1px solid rgba(255, 255, 255, 0.2);
         position: relative;
         position: relative;
         z-index: 4;
         z-index: 4;
@@ -148,7 +148,7 @@
 .sidebar,
 .sidebar,
 body > .navbar-collapse{
 body > .navbar-collapse{
     .logo{
     .logo{
-        padding: 10px 30px;
+        padding: 12px 30px;
         border-bottom: 1px solid rgba(255, 255, 255, 0.2);
         border-bottom: 1px solid rgba(255, 255, 255, 0.2);
 
 
         p{
         p{

@@ -18,12 +18,7 @@
 /*eslint-disable*/
 /*eslint-disable*/
 import React, { Component } from "react";
 import React, { Component } from "react";
 import Toggle from "react-toggle";
 import Toggle from "react-toggle";
-
-import imagine1 from "assets/img/sidebar-1.jpg";
-import imagine2 from "assets/img/sidebar-2.jpg";
-import imagine3 from "assets/img/sidebar-3.jpg";
-import imagine4 from "assets/img/sidebar-4.jpg";
-
+``
 class FixedPlugin extends Component {
 class FixedPlugin extends Component {
   constructor(props) {
   constructor(props) {
     super(props);
     super(props);

@@ -3,7 +3,8 @@ import { NavLink } from "react-router-dom";
 
 
 import AdminNavbarLinks from "../Navbars/AdminNavbarLinks.jsx";
 import AdminNavbarLinks from "../Navbars/AdminNavbarLinks.jsx";
 
 
-import logo from "assets/img/reactlogo.png";
+// import logo from "../../assets/img/mate_logo.png";
+import {mate_logo} from '../../assets/img'
 
 
 class Sidebar extends Component {
 class Sidebar extends Component {
   constructor(props) {
   constructor(props) {
@@ -32,20 +33,11 @@ class Sidebar extends Component {
         id="sidebar"
         id="sidebar"
         className="sidebar"
         className="sidebar"
       >
       >
-        <div className="logo">
+        <div className="logo" style={{display: 'flex',justifyContent: 'center', alignItems: 'center'}}>
           <a
           <a
             href="https://www.creative-tim.com?ref=lbd-sidebar"
             href="https://www.creative-tim.com?ref=lbd-sidebar"
-            className="simple-text logo-mini"
           >
           >
-            <div className="logo-img">
-              <img src={logo} alt="logo_image" />
-            </div>
-          </a>
-          <a
-            href="https://www.creative-tim.com?ref=lbd-sidebar"
-            className="simple-text logo-normal"
-          >
-            Creative Tim
+            <img src={mate_logo} alt="logo_image" style={{width: '135px'}}/>
           </a>
           </a>
         </div>
         </div>
         <div className="sidebar-wrapper">
         <div className="sidebar-wrapper">

@@ -2,6 +2,7 @@ import React, {useRef} from "react";
 import styled from "styled-components";
 import styled from "styled-components";
 import {Col, Row} from "react-bootstrap";
 import {Col, Row} from "react-bootstrap";
 import Card from "components/Card/Card.jsx";
 import Card from "components/Card/Card.jsx";
+import {search_user, empty} from '../../assets/img'
 
 
 const Wrapper = styled.div`
 const Wrapper = styled.div`
   display: flex;
   display: flex;
@@ -17,12 +18,16 @@ const EmptyImage = styled.img`
 `;
 `;
 
 
 const SearchButton = (props) => {
 const SearchButton = (props) => {
+  const fallbackImg =  Number(props.userId)<0
+    ? empty
+    : search_user;
+
   return (
   return (
     <Card
     <Card
       content={
       content={
         <Row>
         <Row>
           <Col md={8} mdOffset={2} sm={8} smOffset={2} xs={8} xsOffset={2} style={{display: 'flex', justifyContent: 'center'}}>
           <Col md={8} mdOffset={2} sm={8} smOffset={2} xs={8} xsOffset={2} style={{display: 'flex', justifyContent: 'center'}}>
-            <EmptyImage src="https://raw.githubusercontent.com/devSoyoung/whale-extension-keycrab/master/images/empty.png" alt="empty"/>
+            <EmptyImage src={fallbackImg} alt="empty"/>
           </Col>
           </Col>
           <Col md={12} sm={12} xs={12}>
           <Col md={12} sm={12} xs={12}>
             <Wrapper>
             <Wrapper>

@@ -15,7 +15,7 @@ ReactDOM.render(
   <BrowserRouter>
   <BrowserRouter>
     <Switch>
     <Switch>
       <Route path="/admin" render={props => <AdminLayout {...props} />} />
       <Route path="/admin" render={props => <AdminLayout {...props} />} />
-      <Redirect from="/" to="/admin/dashboard" />
+      <Redirect from="/" to="/admin/kickboard" />
     </Switch>
     </Switch>
   </BrowserRouter>,
   </BrowserRouter>,
   document.getElementById("root")
   document.getElementById("root")

@@ -28,13 +28,12 @@ import { style } from "variables/Variables.jsx";
 
 
 import routes from "routes.js";
 import routes from "routes.js";
 
 
-import image from "assets/img/sidebar-3.jpg";
 
 
 class Admin extends Component {
 class Admin extends Component {
   constructor(props) {
   constructor(props) {
     super(props);
     super(props);
     this.state = {
     this.state = {
-      image: image,
+      image: '',
       color: "black",
       color: "black",
       hasImage: true,
       hasImage: true,
       fixedClasses: "dropdown show-dropdown open"
       fixedClasses: "dropdown show-dropdown open"

@@ -30,7 +30,6 @@ import { FormInputs } from "components/FormInputs/FormInputs.jsx";
 import { UserCard } from "components/UserCard/UserCard.jsx";
 import { UserCard } from "components/UserCard/UserCard.jsx";
 import Button from "components/CustomButton/CustomButton.jsx";
 import Button from "components/CustomButton/CustomButton.jsx";
 
 
-import avatar from "assets/img/faces/face-3.jpg";
 
 
 class UserProfile extends Component {
 class UserProfile extends Component {
   render() {
   render() {
@@ -152,7 +151,7 @@ class UserProfile extends Component {
             <Col md={4}>
             <Col md={4}>
               <UserCard
               <UserCard
                 bgImage="https://ununsplash.imgix.net/photo-1431578500526-4d9613015464?fit=crop&fm=jpg&h=300&q=75&w=400"
                 bgImage="https://ununsplash.imgix.net/photo-1431578500526-4d9613015464?fit=crop&fm=jpg&h=300&q=75&w=400"
-                avatar={avatar}
+                avatar={''}
                 name="Mike Andrew"
                 name="Mike Andrew"
                 userName="michael24"
                 userName="michael24"
                 description={
                 description={