feat. Footer Component

+import styled from 'styled-components';
+
+export const Container = styled.div `
+    width : 100%;
+    position : relative;
+
+    margin : 5px 0;
+    padding : 20px 5px;
+
+    border-top : 1px solid #ddd;
+
+    display : flex;
+    flex-direction : column;
+`;
+
+export const InfoWrapper = styled.div `
+    display : flex;
+    flex-direction : row;
+
+    border : none;
+    background-color : transparent;
+`;
+
+export const LicenseWrapper = styled.div `
+    flex : 1;
+    display : flex;
+    flex-direction : column;
+
+    border : none;
+    background-color : transparent;
+    justify-content : center;
+    align-items : flex-start;
+
+`;
+
+export const LicenseExplain = styled.div `
+    color : #a0a0a0;
+    font-size : 14px;
+
+    font-weight : 400;
+    padding : 0 5px;
+
+    border : none;
+`;
+
+export const LicenseImg = styled.img `
+    height : 60px;
+    width : 150px;
+`;
+
+export const ServiceInfoWrapper = styled.div `
+    flex : 3;
+    display : flex;
+    flex-direction : column;
+    justify-content : center;
+    align-items : center;
+
+    border : none;
+    background-color : transparent;
+`;
+
+export const ServiceInfoEach = styled.div `
+    color : #d0d0d0;
+    font-size : 13px;
+    
+    font-weight : 400
+`;
\ No newline at end of file

+import React from 'react';
+import * as styled from './FooterStyled';
+
+const ApiLicense = '/static/img/apiLicense.png';
+
+
+const Footer = () => {
+    return (
+        <styled.Container>
+            <styled.InfoWrapper>
+                <styled.LicenseWrapper>
+                    <styled.LicenseExplain>저작권</styled.LicenseExplain>
+                    <styled.LicenseImg src = {ApiLicense}/>
+                </styled.LicenseWrapper>
+                <styled.ServiceInfoWrapper>
+                    <styled.ServiceInfoEach>서비스명 : Smart Medicine Box (SMB)</styled.ServiceInfoEach>
+                    <styled.ServiceInfoEach>서비스제공 : IoT 약병 제작회</styled.ServiceInfoEach>
+                    <styled.ServiceInfoEach>담당자 : 박권수</styled.ServiceInfoEach>
+                    <styled.ServiceInfoEach>주소 : OOO도 OOO시 OOO구 OOO OOO OOO</styled.ServiceInfoEach>
+                    <styled.ServiceInfoEach>연락처 : 010 - 0000 - 0000</styled.ServiceInfoEach>
+                </styled.ServiceInfoWrapper>
+                <styled.LicenseWrapper/>
+            </styled.InfoWrapper>
+        </styled.Container>
+    )
+};
+
+export default Footer;
\ No newline at end of file

@@ -10,7 +10,6 @@ import * as styled from './HeaderStyled';
 import { authApi } from '../../api';
 
 const headerImg = '/static/img/pharmacy.png';
-const backButtonWhite = '/static/img/backButtonWhite.png';
 const backButtonBlue = '/static/img/backButtonBlue.png';
 const logout = '/static/img/logout.png';
 

@@ -3,6 +3,7 @@ import { BrowserRouter, Route, Switch, Redirect } from 'react-router-dom';
 
 import Error from '../components/error';
 import Loading from '../components/Loading';
+import Footer from '../components/Footer';
 import { LoginContainer } from "./login";
 import { RegisterContainer } from './register';
 import { MainContainer } from "./main";

@@ -9,6 +9,7 @@ import * as Alert from '../../util/alertMessage';
 import moment from 'moment';
 
 import Header from '../../components/Header';
+import Footer from '../../components/Footer';
 import BottleInfoPresenter from './BottleInfoPresenter';
 
 import { doctorApi } from '../../api';
@@ -179,9 +180,8 @@ const BottleInfoContainer = (props : BottleInfoProps) => {
             fdbType = {fdbType}
             setFdbType = {setFdbType}
             onSubmitFeedback = {onSubmitFeedback}
-
-
         />
+        <Footer/>
         </>
     );
 };

@@ -6,6 +6,7 @@ import * as recoilUtil from '../../util/recoilUtil';
 
 
 import Header from '../../components/Header';
+import Footer from '../../components/Footer';
 import DoctorMenuContainer from './doctor';
 import ManagerMenuContainer from './manager';
 
@@ -32,6 +33,7 @@ const MainContainer = (props : MainProps) => {
             userTypeCd === 'MANAGER' ?
             <ManagerMenuContainer {...props}/> : null
         }
+        <Footer/>
         </>
     );
 };

-import React from 'react';
-
-import * as styled from './MainStyled';
-
-
-interface MainProps {
-    userTypeCd : string;
-}
-
-const MainPresenter = (props : MainProps) => {
-    return (
-        <styled.Container>
-            <styled.InfoAndSearchWrapper>
-                <styled.InfoWrapper>
-                    <styled.InfoSquare>
-
-                    </styled.InfoSquare>
-                    <styled.NewPatientButton>새 환자 등록</styled.NewPatientButton>
-                </styled.InfoWrapper>
-                <styled.SearchAndDetailWrapper>
-                    <styled.SearchBarWrapper>
-                        <styled.SearchBar 
-                            placeholder = '환자 이름'
-                        />
-                        <styled.SearchButton>
-                            검색
-                        </styled.SearchButton>
-                    </styled.SearchBarWrapper>
-                    <styled.SearchResultWrapper>
-
-                    </styled.SearchResultWrapper>
-                </styled.SearchAndDetailWrapper>
-            </styled.InfoAndSearchWrapper>
-            <styled.BottleListWrapper>
-                bottleListWrapper
-            </styled.BottleListWrapper>
-        </styled.Container>
-    )
-};
-
-export default MainPresenter;
\ No newline at end of file