Merge branch 'main' of https://github.com/2022-Sejong-Creative-Semest…

…er/Traffic-Information-Service-for-the-Disabled into Backend
2022-Sejong-Creative-Semester · Dec 9, 2022 · 5e20f6e · 5e20f6e
2 parents d74856f + a8a710c
commit 5e20f6e
Show file tree

Hide file tree

Showing 44 changed files with 679 additions and 103 deletions.
diff --git a/Backend/Frontend/creative/src/App.js b/Backend/Frontend/creative/src/App.js
@@ -15,9 +15,9 @@ function App() {
         <Route path="/bus" element={<BusPage />} />
         <Route path="/subway" element={<SubwayPage />} />
         <Route path="/subway/detail/:stCd/:stNm" element={<SubwayDetailPage />} />
-        <Route path="/subway/elevator/:stCd" element={<SubwayElevatorPage />} />
-        <Route path="/subway/transfer/:stCd" element={<SubwayTransferPage />} />
-        <Route path="/subway/bathchair/:stCd" element={<SubwayBathChairPage />} />
+        <Route path="/subway/elevator/:stCd/:stNm/:railCd/:lnCd" element={<SubwayElevatorPage />} />
+        <Route path="/subway/transfer/:stCd/:stNm/:railCd/:lnCd" element={<SubwayTransferPage />} />
+        <Route path="/subway/bathchair/:stCd/:stNm/:railCd/:lnCd" element={<SubwayBathChairPage />} />
       </Routes>
     </BrowserRouter>
   );

diff --git a/Backend/Frontend/creative/src/component/bus-component/busform/BusButton.js b/Backend/Frontend/creative/src/component/bus-component/busform/BusButton.js
@@ -1,10 +1,15 @@
 import styled from "styled-components"
 
 const StyledButton = styled.button`
-width: 99px;
-height: 100px;
+width: 16%;
+height: 11vh;
 background: #CDD029;
-border: 4px solid #CDD029;
+border: 1px solid #CDD029;
+padding:0;
+@media (max-width:500px){
+    width:20%;
+    height:100%;
+}
 
 `
 

diff --git a/Backend/Frontend/creative/src/component/bus-component/busform/BusForm.js b/Backend/Frontend/creative/src/component/bus-component/busform/BusForm.js
@@ -1,7 +1,6 @@
 import BusButton from "./BusButton";
 import BusInput from "./BusInput";
 import styled from "styled-components";
-import axios from "axios"
 import { api } from "../../auth/Api";
 import { MapActions } from "../../../store/Map-slice";
 import { BusActions } from "../../../store/Bus-slice";
@@ -10,9 +9,13 @@ import { useDispatch } from "react-redux";
 
 const StyledForm = styled.form`
     display:flex;
-    width: 727px;
-    height: 98px;
+    width: 34.6vw;
+    height: 11vh;
     border: 4px solid #CDD029;
+    @media (max-width:500px){
+        width: 98vw;
+        height: 15vw;
+    }
 `
 
 

diff --git a/Backend/Frontend/creative/src/component/bus-component/busform/BusInput.js b/Backend/Frontend/creative/src/component/bus-component/busform/BusInput.js
@@ -1,12 +1,19 @@
 import styled from "styled-components"
 
 const StyledInput = styled.input`
-width: 621px;
-height: 60px;
+width: 80%;
+height: 10vh;
 padding: 15px;
-font-size: 50px;
+font-size: 2.5vw;
 border:0;
 font-family: 'Pretendard-Regular';
+@media (max-width:500px){
+    font-family: 'Pretendard-Regular';
+    width: 80%;
+    height: 15vw;
+    font-size: 6vw;
+    padding: 1%;
+}
 `
 
 const BusInput = () => {

diff --git a/Backend/Frontend/creative/src/component/bus-component/buslist/BusItem.js b/Backend/Frontend/creative/src/component/bus-component/buslist/BusItem.js
@@ -25,28 +25,41 @@ div{
 }
 .Name{
     padding-left:20px;
-    font-family: 'Pretendard';
+    font-family: 'Pretendard-Regular';
     font-style: normal;
     font-weight: 600;
     font-size: 40px;
     line-height: 60px;
 }
 .direction{
-    font-family: 'Pretendard';
+    font-family: 'Pretendard-Regular';
     font-style: normal;
     font-weight: 600;
     font-size: 24px;
     line-height: 29px;
 }
 .id{
     padding-right:20px;
-    font-family: 'Pretendard';
+    font-family: 'Pretendard-Regular';
     font-style: normal;
     font-weight: 600;
     font-size: 24px;
     line-height: 29px;
     color: #9C9C9C;
 }
+
+@media (max-width:500px){
+    height:43%;
+    .Name{
+        font-size: 5vw;
+    }
+    .direction{
+        font-size: 3vw;
+    }
+    .id{
+        font-size: 3vw;
+    }
+}
 `
 
 const BusItem = (props) => {

diff --git a/Backend/Frontend/creative/src/component/bus-component/buslist/BusList.js b/Backend/Frontend/creative/src/component/bus-component/buslist/BusList.js
@@ -9,13 +9,17 @@ display:flex;
 flex-direction:column;
 align-items: center;
 box-sizing: border-box;
-width: 735px;
-height: 640px;
+width: 35vw;
+height: 68vh;
 background: #FFFFFF;
 border: 4px solid #CDD029 ;
 padding:0;
 margin:0;
 overflow:auto;
+@media (max-width:500px) {
+    width:100%;
+    height:50vw;
+}
 `
 
 const BusList = () => {

diff --git a/Backend/Frontend/creative/src/component/bus-component/buslist/RefreshButton.js b/Backend/Frontend/creative/src/component/bus-component/buslist/RefreshButton.js
@@ -16,6 +16,10 @@ img{
 :hover{
     cursor: pointer;
 }
+@media (max-width:500px){
+    width:8vw;
+    height:8vw;
+}
 `
 
 

diff --git a/Backend/Frontend/creative/src/component/bus-component/buslist/StationItem.js b/Backend/Frontend/creative/src/component/bus-component/buslist/StationItem.js
@@ -65,26 +65,37 @@ font-family: 'Pretendard-Regular';
 
 .Name{
     padding-left:20px;
-    font-family: 'Pretendard';
+    font-family: 'Pretendard-Regular';
     font-style: normal;
     font-weight: 600;
-    font-size: 40px;
+    font-size: 2vw;
     line-height: 60px;
     color:${props => (props.color ? "#000000" : "#FFFFFF")};
 }
 
 .id{
     padding-right:20px;
-    font-family: 'Pretendard';
+    font-family: 'Pretendard-Regular';
     font-style: normal;
     font-weight: 600;
-    font-size: 24px;
+    font-size: 1.7vw;
     line-height: 29px;
     display: flex;
     align-items: center;
     text-align: center;
     color:${props => (props.color ? "#9C9C9C" : "black")};
 }
+@media (max-width:500px){
+    height:43%;
+    .Name{
+        font-family: 'Pretendard-Regular';
+        font-size: 5vw;
+    }
+    .id{
+        font-family: 'Pretendard-Regular';
+        font-size: 3vw;
+    }
+}
 `
 
 export default StationItem;
diff --git a/Backend/Frontend/creative/src/component/bus-component/busnumber/BusNumber.js b/Backend/Frontend/creative/src/component/bus-component/busnumber/BusNumber.js
@@ -10,13 +10,17 @@ align-items:center;
 height:50px;
 width:90%;
 height:auto;
-font-size:30px;
+font-size:1.9vw;
 font-family: 'Pretendard-Regular';
 padding:0;
 p{
     font-weight:bold;
     margin:0;
 }
+@media (max-width:500px){
+    font-size:5vw;
+    height:28%;
+}
 `
 
 const BusNumber = (props) => {

diff --git a/Backend/Frontend/creative/src/component/bus-component/buspanel/BusPanel.js b/Backend/Frontend/creative/src/component/bus-component/buspanel/BusPanel.js
@@ -6,26 +6,40 @@ display:flex;
 flex-direction:column;
 align-items:center;
 text-align:center;
-width: 348px;
-height: 795x;
+width: 19vw;
+height: 85vh;
 margin-right:30px;
 font-family: 'Pretendard-Regular';
 background: linear-gradient(270.31deg, #999C0D -27.07%, rgba(205, 208, 41, 0) 206.73%);
 .first{
-    font-size: 50px;
+    font-size: 4vw;
     color: #FFFFFF;
 }
 .second{
-    font-size: 30px;
+    font-size: 2vw;
     color: #FFFFFF;
 }
+
+
+@media (max-width:500px) {
+width:100vw;
+height:5vh;
+flex-direction:row;
+justify-content:space-evenly;
+.first{
+    font-size: 4.5vw;
+}
+.second{
+    font-size: 3vw;
+}
+}
 `
 
 const BusPanel = () => {
     return (
         <StyledBusPanel>
             <p className="first">저상버스</p><br />
-            <p className="second">저상버스가 오는 <br /> 정류장만 표시됩니다.</p>
+            <p className="second">저상버스가 오는 정류장만 표시됩니다.</p>
         </StyledBusPanel>
     )
 }

diff --git a/Backend/Frontend/creative/src/component/header/Header.js b/Backend/Frontend/creative/src/component/header/Header.js
@@ -10,15 +10,19 @@ display:flex;
 align-items:center;
 font-family: 'GmarketSansMedium';
 font-weight: 700;
-font-size: 60px;
+font-size: 4vw;
 background-color:#FFFFFF;
 border-bottom: 2px solid #EBEBEB;
-width:1728px;
-height:148px;
+width:95%;
+height:15vh;
 a{  
     color:#000000;
     text-decoration:none;
 }
+@media (max-width:500px) {
+    font-size:8vw;
+    height:8vh;
+}
 `
 
 const Header = () => {

diff --git a/Backend/Frontend/creative/src/component/map/Mapping.module.css b/Backend/Frontend/creative/src/component/map/Mapping.module.css
@@ -1,5 +1,12 @@
 .map {
-    width: 698px;
-    height: 734px;
+    width: 35vw;
+    height: 80vh;
 
+}
+
+@media (max-width:500px) {
+    .map {
+        width: 100vw;
+        height: 80vw;
+    }
 }
diff --git a/Backend/Frontend/creative/src/component/menu/MenuBar.js b/Backend/Frontend/creative/src/component/menu/MenuBar.js
@@ -7,9 +7,13 @@ import MenuExplan from "./MenuExplan"
 const StyleMenuBar = styled.div`
 display:flex;
 justify-content: space-between;
-width: 1920px;
+width: 100%;
 padding-top:5vw;
 height: 633px;
+@media (max-width:500px){
+    flex-direction: column; 
+    justify-content:  space-evenly;
+}
 `
 
 

diff --git a/Backend/Frontend/creative/src/component/menu/MenuBusButton.js b/Backend/Frontend/creative/src/component/menu/MenuBusButton.js
@@ -5,17 +5,25 @@ import { MapActions } from '../../store/Map-slice'
 const StyledButton = styled.button`
 width: 442.5px;
 height: 537px;
-font-size: 3vw;
+font-size: 60px;
 color: #FFFFFF;
 font-family: 'Pretendard-Regular';
 background: rgba(205, 208, 41, 0.8);
 box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.25);
 border-radius: 0px 20px 20px 0px;
-
-
 :hover{
     cursor: pointer;
 }
+@media (max-width:1630px){
+    font-size: 4vw;
+    width: 26vw;
+    height: 60vh;
+}
+@media (max-width:500px){
+    font-size: 6vw;
+    width: 80vw;
+    height: 10vh;
+}
 `
 
 

diff --git a/Backend/Frontend/creative/src/component/menu/MenuExplan.js b/Backend/Frontend/creative/src/component/menu/MenuExplan.js
@@ -17,7 +17,22 @@ color:#E2E2E2;
     font-family: 'Pretendard-Regular';
     font-size: 40px;
 }
-
+@media (max-width:1630px){
+    .first{
+        font-size: 4vw;
+    }
+    .second{
+        font-size: 2.5vw;
+    }
+}
+@media (max-width:500px){
+    .first{
+        font-size: 10vw;
+    }
+    .second{
+        font-size: 5vw;
+    }
+}
 `
 
 const MenuExplan = () => {

diff --git a/Backend/Frontend/creative/src/component/menu/MenuSubwayButton.js b/Backend/Frontend/creative/src/component/menu/MenuSubwayButton.js
@@ -5,16 +5,26 @@ import { MapActions } from '../../store/Map-slice'
 const StyledButton = styled.button`
 width: 442.5px;
 height: 537px;
-font-size: 3vw;
+font-size: 60px;
 color: #FFFFFF;
 font-family: 'Pretendard-Regular';
 background: rgba(146, 85, 245, 0.8);
 box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.25);
 border-radius: 20px 0px 0px 20px;
-
 :hover{
     cursor: pointer;
 }
+@media (max-width:1630px){
+    font-size: 3vw;
+    width: 25vw;
+    height: 60vh;
+}
+@media (max-width:500px){
+    font-size: 6vw;
+    width: 80vw;
+    height: 10vh;
+    margin-left:20vw;
+}
 `