feat. web view img add and register button, medicine bottle img and etc..

@@ -3,17 +3,31 @@ import styled from 'styled-components';
 export const Container = styled.div `
     width : 100%;
     position : relative;
-    display : inline-block;
     padding : 20px 0;
     box-shadow: 0px 0px 10px #a0a0a0;
     margin : 0 0 15px 0;
     z-index : 50;
+
+    display : flex;
+    flex-direction : row;
+    justify-content : center;
+    align-items : center;
 `;
 
 export const HeaderWrapper = styled.div `
     display : flex;
+    flex-direction : row;
     justify-content : center;
     align-items : center;
+
+    border : none;
+`;
+
+export const TitleImg = styled.img `
+    height : 30px;
+    width : 30px;
+
+    margin : 0 10px 0 0px;
 `;
 
 export const Title = styled.div `

@@ -2,11 +2,14 @@ import React from 'react';
 
 import * as styled from './HeaderStyled';
 
+const headerImg = '/static/img/pharmacy.png';
+
 
 const Header = () => {
     return (
         <styled.Container>
             <styled.HeaderWrapper>
+                <styled.TitleImg src = {headerImg} />
                 <styled.Title>내 손 안의 주치의</styled.Title>
             </styled.HeaderWrapper>
         </styled.Container>

@@ -40,9 +40,17 @@ const LoginPresenter = (props : LoginProps) => {
                         />
                     </styled.LoginEachInputWrapper>
                 </styled.LoginInputWrapper>
+                <styled.RegisterButtonWrapper>
+                    <styled.RegisterButton
+                        onClick = {() => console.log('회원가입 버튼')}
+                    >
+                        회원가입
+                    </styled.RegisterButton>
+                </styled.RegisterButtonWrapper>
                 <styled.LoginButtonWrapper>
                     <styled.LoginButton
                         onClick = {props.onLogin}
+                        isLoginButton = {true}
                     >
                         로그인
                     </styled.LoginButton>

@@ -48,18 +48,47 @@ export const LoginInput = styled.input `
     align-self : center;
 `;
 
+export const RegisterButtonWrapper = styled.div `
+    margin : 10px 0 0 0;
+    display : flex;
+
+    width : 80%;
+
+    justify-content : flex-end;
+    align-items : center;
+`;
+
+export const RegisterButton = styled.button `
+    border : none;
+    border-bottom : 1px solid;
+    background-color : transparent;
+    color : #337DFF;
+
+    cursor : pointer;
+
+    font-size : 11px;
+
+    transition : .25s all;
+
+    &:hover { 
+        opacity : .5;
+    }
+    
+`;
+
 export const LoginButtonWrapper = styled.div `
-    width: 30%;
+    margin : 25px 0 0 0;
+    width: 100%;
     display : flex;
     flex-direction : row;
     justify-content : center;
     align-items : center;
+    
 `;
 
-export const LoginButton = styled.button `
-    margin : 30px 0 5px 0;
+export const LoginButton = styled.button<{isLoginButton : boolean}> `
     background-color : #fff;
-    border : 1px solid #a0a0a0;
+    border : 1.2px solid;
     border-radius : 5px;
     padding : 10px 30px;
 
@@ -68,9 +97,13 @@ export const LoginButton = styled.button `
     transition : .25s all;
 
     color : #343434;
+    font-weight : 600;
 
     &:hover {
         background-color : #343434;
         color : #fff;
+        border : 1.2px solid transparent;
     }
+
+    margin : 0 15px;
 `;
\ No newline at end of file

@@ -2,6 +2,8 @@ import React from 'react';
 
 import * as styled from './DoctorMenuStyled';
 
+const medicineImg = '/static/img/medicine.png';
+
 
 interface DoctorMenuProps {
     info : {
@@ -177,9 +179,9 @@ const DoctorMenuPresenter = (props : DoctorMenuProps) => {
                         <styled.EachBottleWrapper
                             key = {bottle._id}
                         >
-                        {
-                            bottle.bottleId
-                        }
+                            <styled.EachBottleImg src = {medicineImg}/>
+                            <styled.EachBottleInfo>{bottle.medicine.name.slice(0, 14)}</styled.EachBottleInfo>
+                            <styled.EachBottleInfo>{`등록일 : ${bottle.regDtm.slice(0, 10)}`}</styled.EachBottleInfo>
                         </styled.EachBottleWrapper>
                     )
                 }) :

@@ -492,6 +492,17 @@ export const EachBottleWrapper = styled.div `
     }
 `;
 
+export const EachBottleImg = styled.img `
+    height : 50px;
+    width : 50px;
+    margin : 0 0 10px 0;
+`;
+
+export const EachBottleInfo = styled.div `
+    font-size : 11px;
+    letter-spacing : 1px;
+`;
+
 export const NothingWrapper = styled.div `
     height : 100%;
     width : 100%;