조민지

feat: 사용자 편의 UI 추가

......@@ -219,7 +219,7 @@ input:focus {
background-size: cover;
background-position: center center; }
.sidebar .logo {
padding: 10px 30px;
padding: 12px 30px;
border-bottom: 1px solid rgba(255, 255, 255, 0.2);
position: relative;
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{
padding: 10px 30px;
padding: 12px 30px;
border-bottom: 1px solid rgba(255, 255, 255, 0.2);
position: relative;
z-index: 4;
......@@ -148,7 +148,7 @@
.sidebar,
body > .navbar-collapse{
.logo{
padding: 10px 30px;
padding: 12px 30px;
border-bottom: 1px solid rgba(255, 255, 255, 0.2);
p{
......
......@@ -18,12 +18,7 @@
/*eslint-disable*/
import React, { Component } from "react";
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 {
constructor(props) {
super(props);
......
......@@ -3,7 +3,8 @@ import { NavLink } from "react-router-dom";
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 {
constructor(props) {
......@@ -32,20 +33,11 @@ class Sidebar extends Component {
id="sidebar"
className="sidebar"
>
<div className="logo">
<div className="logo" style={{display: 'flex',justifyContent: 'center', alignItems: 'center'}}>
<a
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>
</div>
<div className="sidebar-wrapper">
......
......@@ -2,6 +2,7 @@ import React, {useRef} from "react";
import styled from "styled-components";
import {Col, Row} from "react-bootstrap";
import Card from "components/Card/Card.jsx";
import {search_user, empty} from '../../assets/img'
const Wrapper = styled.div`
display: flex;
......@@ -17,12 +18,16 @@ const EmptyImage = styled.img`
`;
const SearchButton = (props) => {
const fallbackImg = Number(props.userId)<0
? empty
: search_user;
return (
<Card
content={
<Row>
<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 md={12} sm={12} xs={12}>
<Wrapper>
......
......@@ -15,7 +15,7 @@ ReactDOM.render(
<BrowserRouter>
<Switch>
<Route path="/admin" render={props => <AdminLayout {...props} />} />
<Redirect from="/" to="/admin/dashboard" />
<Redirect from="/" to="/admin/kickboard" />
</Switch>
</BrowserRouter>,
document.getElementById("root")
......
......@@ -28,13 +28,12 @@ import { style } from "variables/Variables.jsx";
import routes from "routes.js";
import image from "assets/img/sidebar-3.jpg";
class Admin extends Component {
constructor(props) {
super(props);
this.state = {
image: image,
image: '',
color: "black",
hasImage: true,
fixedClasses: "dropdown show-dropdown open"
......
......@@ -30,7 +30,6 @@ import { FormInputs } from "components/FormInputs/FormInputs.jsx";
import { UserCard } from "components/UserCard/UserCard.jsx";
import Button from "components/CustomButton/CustomButton.jsx";
import avatar from "assets/img/faces/face-3.jpg";
class UserProfile extends Component {
render() {
......@@ -152,7 +151,7 @@ class UserProfile extends Component {
<Col md={4}>
<UserCard
bgImage="https://ununsplash.imgix.net/photo-1431578500526-4d9613015464?fit=crop&fm=jpg&h=300&q=75&w=400"
avatar={avatar}
avatar={''}
name="Mike Andrew"
userName="michael24"
description={
......