From 8ac8bd16816b1c17756fa63092c0b69deaa47f53 Mon Sep 17 00:00:00 2001 From: Lee Naeun Date: Wed, 1 Sep 2021 10:50:20 +0900 Subject: [PATCH] =?UTF-8?q?[Client]=20Mypage.js=20:=20css=20=EB=B0=8F=20?= =?UTF-8?q?=EC=B5=9C=EC=8B=A0=20=EC=84=B1=EB=8A=A5=EA=B0=9C=EC=84=A0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- client/src/App.js | 3 +- client/src/comp/SearchResult.js | 28 ++++++--- client/src/comp/logoutModal.js | 2 + client/src/dummy/dummyData.js | 107 -------------------------------- client/src/pages/Mypage.js | 49 ++++++++++----- client/src/pages/Search.js | 4 +- 6 files changed, 60 insertions(+), 133 deletions(-) delete mode 100644 client/src/dummy/dummyData.js diff --git a/client/src/App.js b/client/src/App.js index fd1c2a2..e323632 100644 --- a/client/src/App.js +++ b/client/src/App.js @@ -1,5 +1,4 @@ import "./app.css"; -import dummyData from "./dummy/dummyData"; import Search from "./pages/Search"; import SearchMore from "./pages/SearchMore"; import { useEffect, useState } from "react"; @@ -113,6 +112,7 @@ function App() { setCloseLogoutModal={setCloseLogoutModal} setisLogin={setisLogin} accToken={accToken} + setSearched={setSearched} setAccToken={setAccToken} /> ) : null} @@ -205,6 +205,7 @@ function App() { setCurrResult={setCurrResult} setEditContentModal={setEditContentModal} setEditResult={setEditResult} + setUserContent={setUserContent} /> diff --git a/client/src/comp/SearchResult.js b/client/src/comp/SearchResult.js index c6a859d..94ad836 100644 --- a/client/src/comp/SearchResult.js +++ b/client/src/comp/SearchResult.js @@ -1,5 +1,6 @@ import React, { useEffect } from "react"; import styled from "styled-components"; +import thumbs_up_icon from "../thumbs_up_icon.png"; import { Link, Redirect } from "react-router-dom"; import empty from "../empty.png"; @@ -43,23 +44,29 @@ function SearchResult({ cursor: pointer; transition: all 0.3s; p { - padding: 0 5px; + flex: 1 1 auto; font-size: max(14px, 1vw); - flex: 1 0 auto; - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; } p:nth-child(2) { flex: 3 1 auto; } + .imgWrap { + position: relative; + right: 0.5vw; + } + .imgWrap img { + position: relative; + top: 0.2vw; + width: max(1.1vw, 18px); + height: max(1.1vw, 18px); + } } li:nth-child(1) { margin-top: 0px; } li:hover { - background-color: #000; - color: #fff; + background-color: white; + color: black; } `; const EmptyResult = styled.div` @@ -131,7 +138,12 @@ function SearchResult({
  • showMore(ele)}>

    {ele.wordName}

    {ele.wordMean}

    -

    {ele.thumbsup}

    +

    + + thumbsup + + {ele.thumbsup} +

    • ); })} diff --git a/client/src/comp/logoutModal.js b/client/src/comp/logoutModal.js index d52c6a3..200de44 100644 --- a/client/src/comp/logoutModal.js +++ b/client/src/comp/logoutModal.js @@ -96,6 +96,7 @@ function LogoutModal({ setCloseLogoutModal, setisLogin, accToken, + setSearched, setAccToken, }) { const url = process.env.REACT_APP_API_URL || `http://localhost:4000`; @@ -107,6 +108,7 @@ function LogoutModal({ setCloseLogoutModal(false); setAccToken(null); setisLogin(false); + setSearched(false); localStorage.clear(); history.push("/"); }; diff --git a/client/src/dummy/dummyData.js b/client/src/dummy/dummyData.js deleted file mode 100644 index 97ca478..0000000 --- a/client/src/dummy/dummyData.js +++ /dev/null @@ -1,107 +0,0 @@ -const word = [ - { - id: 1, - wordName: "자만추", - wordMean: "자연스러운 만남 추구", - thumbsup: 10, - created_at: Date.now(), - userId: 4, - }, - { - id: 2, - wordName: "자만추", - wordMean: "자릿값 만원 추가", - thumbsup: 15, - created_at: Date.now(), - userId: 3, - }, - { - id: 3, - wordName: "자만추", - wordMean: "자장면에 만두 추가", - thumbsup: 5, - created_at: Date.now(), - userId: 2, - }, - { - id: 4, - wordName: "자만추", - wordMean: "자주 만나기 추하다", - thumbsup: 20, - created_at: Date.now(), - userId: 3, - }, - { - id: 4, - wordName: "자만추", - wordMean: "자주 만나기 추하다", - thumbsup: 20, - created_at: Date.now(), - userId: 3, - }, - { - id: 4, - wordName: "자만추", - wordMean: "자주 만나기 추하다", - thumbsup: 20, - created_at: Date.now(), - userId: 3, - }, - { - id: 4, - wordName: "자만추", - wordMean: "자주 만나기 추하다", - thumbsup: 20, - created_at: Date.now(), - userId: 3, - }, - { - id: 4, - wordName: "자만추", - wordMean: "자주 만나기 추하다", - thumbsup: 20, - created_at: Date.now(), - userId: 3, - }, -]; - -const userInfo = [ - { - id: 1, - username: "김민재", - email: "blackbean@gmail.com", - password: "Minjae!123", - phone: "01010101010", - userPic: null, - created_at: Date.now(), - }, - { - id: 2, - username: "강영서", - email: "younglady@gmail.com", - password: "Young!123", - phone: "01012121212", - userPic: null, - created_at: Date.now(), - }, - { - id: 3, - username: "배윤수", - email: "pearYoon@gmail.com", - password: "Pear!123", - phone: "01022222222", - userPic: null, - created_at: Date.now(), - }, - { - id: 4, - username: "이나은", - email: "nanni@gmail.com", - password: "Nanni!123", - phone: "01088888888", - userPic: null, - created_at: Date.now(), - }, -]; - -export default { userInfo, word }; diff --git a/client/src/pages/Mypage.js b/client/src/pages/Mypage.js index 3eba74a..b0f3490 100644 --- a/client/src/pages/Mypage.js +++ b/client/src/pages/Mypage.js @@ -24,6 +24,28 @@ const UserContent = styled.div` padding: 1vw 0; border-bottom: 3px solid #000; margin-bottom: 2vw; + > p { + line-height: 20px; + font-size: max(0.9vw, 13px); + padding: 10px 0; + > span { + font-weight: 700; + } + } + > select { + width: max(5vw, 60px); + height: max(2vw, 20px); + background-color: white; + border-radius: 20px; + outline: none; + cursor: pointer; + text-align-last: center; + text-align: center; + border: 2px solid black; + -ms-text-align-last: center; + -moz-text-align-last: center; + font-size: max(0.8vw, 10px); + } `; const ContentList = styled.ul` @@ -94,6 +116,7 @@ function Mypage({ userContent.data.map((el) => el.id) ); + console.log(userContent); useEffect(() => { searchUserWord(); }, [gotDeleted]); // 삭제시 다시 데이터 받아옴 @@ -167,10 +190,20 @@ function Mypage({ {" "} {/* 내가 쓴 글 목록 */} +
    + handleAllCheck(e.target.checked)} + /> + 전체 선택 +

    - 작성하신 글은 {contentCount}개 이며, 최대 추천수는{" "} - {contentThumbsupCount}개 입니다 + 작성하신 글은 {contentCount}개 이며, 최대 추천수는{" "} + {contentThumbsupCount}개 입니다

    handleAllCheck(e.target.checked)} - /> - 전체 선택 - diff --git a/client/src/pages/Search.js b/client/src/pages/Search.js index 2ef5f5a..282ccfe 100644 --- a/client/src/pages/Search.js +++ b/client/src/pages/Search.js @@ -50,9 +50,7 @@ function Search({ setAccToken={setAccToken} setCurrResult={setCurrResult} /> - ) : ( -
    하이~ 에이치아이~
    - )} + ) : null} ); }