From b84d7583ccfcc0a5c3a9d819fb3c232fd6beafa3 Mon Sep 17 00:00:00 2001 From: Seonghwan Sim Date: Fri, 23 Feb 2024 02:32:35 +0900 Subject: [PATCH 1/2] =?UTF-8?q?feat:=20move=20=EA=B5=AC=ED=98=84?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../Changing/OutAirport/OutMove.jsx | 61 +++++++++++++++++++ src/components/SchedulePage/OutAirport.jsx | 2 + src/img/City.svg | 6 ++ 3 files changed, 69 insertions(+) create mode 100644 src/components/SchedulePage/Changing/OutAirport/OutMove.jsx create mode 100644 src/img/City.svg diff --git a/src/components/SchedulePage/Changing/OutAirport/OutMove.jsx b/src/components/SchedulePage/Changing/OutAirport/OutMove.jsx new file mode 100644 index 0000000..1d03f81 --- /dev/null +++ b/src/components/SchedulePage/Changing/OutAirport/OutMove.jsx @@ -0,0 +1,61 @@ +import styled from "styled-components"; +import AboutFadin from "../../../AboutPage/About_fadin"; +import CityIcon from "../../../../img/City.svg"; +import "../../../../font/font.css"; + +const StyleContainer = styled.div` + background-color: black; + color: white; +`; + +const Main = styled.div` + display: flex; + justify-content: space-between; + + margin: 0 3.5%; + padding: 100px 0; +`; + +const City = styled.img` + padding-right: 80px; +`; + +const Title = styled.div` + font-size: 40px; + font-weight: 200; + font-family: Esamanru; +`; + +const Right = styled.div` + display: flex; + + padding-right: 230px; +`; + +const Contents = styled.div` + display: flex; + flex-direction: column; + justify-content: space-evenly; + + font-family: Pretendard-Light; + font-size: 23px; +`; + +export default function OutMove() { + return ( + + +
+ 도심까지 이동시간 + + + +
편도 | 1시간 30분 ~ 2시간 소요
+
왕복 | 3시간 ~ 4시간 소요
+ + +
+ + + ); +} diff --git a/src/components/SchedulePage/OutAirport.jsx b/src/components/SchedulePage/OutAirport.jsx index b2b7c93..3570f44 100644 --- a/src/components/SchedulePage/OutAirport.jsx +++ b/src/components/SchedulePage/OutAirport.jsx @@ -1,6 +1,7 @@ import ScheduleBanner1 from "./NoChanging/Schedule_Banner1"; import ScheduleBanner2 from "./NoChanging/Schedule_Banner2"; import OutGreenGrid from "./Changing/OutAirport/OutGreenGrid"; +import OutMove from "./Changing/OutAirport/OutMove"; export default function OutAirport() { return ( @@ -8,6 +9,7 @@ export default function OutAirport() { + ); } diff --git a/src/img/City.svg b/src/img/City.svg new file mode 100644 index 0000000..18297cb --- /dev/null +++ b/src/img/City.svg @@ -0,0 +1,6 @@ + + + + + + From 4dd754633781051bb95a2d5d25aadf6dbf775ba1 Mon Sep 17 00:00:00 2001 From: Seonghwan Sim Date: Fri, 23 Feb 2024 03:39:53 +0900 Subject: [PATCH 2/2] =?UTF-8?q?style:=20OutTraffic=20=EA=B5=AC=ED=98=84?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../Changing/OutAirport/OutTraffic.jsx | 97 +++++++++++++++++++ src/components/SchedulePage/OutAirport.jsx | 2 + src/img/AirportTransfer.svg | 3 + src/img/PublicBus.svg | 3 + src/img/Taxi.svg | 3 + 5 files changed, 108 insertions(+) create mode 100644 src/components/SchedulePage/Changing/OutAirport/OutTraffic.jsx create mode 100644 src/img/AirportTransfer.svg create mode 100644 src/img/PublicBus.svg create mode 100644 src/img/Taxi.svg diff --git a/src/components/SchedulePage/Changing/OutAirport/OutTraffic.jsx b/src/components/SchedulePage/Changing/OutAirport/OutTraffic.jsx new file mode 100644 index 0000000..60e72d0 --- /dev/null +++ b/src/components/SchedulePage/Changing/OutAirport/OutTraffic.jsx @@ -0,0 +1,97 @@ +import styled from "styled-components"; +import AboutFadin from "../../../AboutPage/About_fadin"; +import TrainIcon from "../../../../img/SkyTrain.svg"; +import TaxiIcon from "../../../../img/Taxi.svg"; +import ShuttleIcon from "../../../../img/Bus.svg"; +import PublicBusIcon from "../../../../img/PublicBus.svg"; +import AirportTransferIcon from "../../../../img/AirportTransfer.svg"; +import "../../../../font/font.css"; + +const StyleContainer = styled.div` + background-color: black; + color: white; +`; + +const Main = styled.div` + padding: 50px 3.5%; +`; + +const LineBox = styled.div` + display: flex; + justify-content: space-between; + border-top: 1px solid white; + border-bottom: 1px solid white; + padding: 105px 0; +`; + +const Title = styled.div` + font-size: 40px; + font-family: Esamanru; + font-weight: 300; +`; + +const Right = styled.div` + display: flex; +`; + +const Card = styled.div` + display: flex; + flex-direction: column; + align-items: center; + justify-content: space-between; + height: 130px; + width: 130px; + padding: 0 20px; + + font-size: 18px; + font-family: Plaid; + font-weight: 300; + + opacity: 0.8; + + &:hover { + opacity: 1; + } +`; + +const Train = styled.img``; +const Taxi = styled.img``; +const Shuttle = styled.img``; +const PublicBus = styled.img``; +const AirportTransfer = styled.img``; + +export default function OutTraffic() { + return ( + + +
+ + 공항 - 도심 간 이동 교통편 + + + +
Train MRT
+ + + +
Taxi
+ + + +
Shuttle Service
+ + + +
Public Bus
+ + + +
Airport Transfer
+ + + +
+ + + ); +} diff --git a/src/components/SchedulePage/OutAirport.jsx b/src/components/SchedulePage/OutAirport.jsx index 3570f44..d9aaf9e 100644 --- a/src/components/SchedulePage/OutAirport.jsx +++ b/src/components/SchedulePage/OutAirport.jsx @@ -2,6 +2,7 @@ import ScheduleBanner1 from "./NoChanging/Schedule_Banner1"; import ScheduleBanner2 from "./NoChanging/Schedule_Banner2"; import OutGreenGrid from "./Changing/OutAirport/OutGreenGrid"; import OutMove from "./Changing/OutAirport/OutMove"; +import OutTraffic from "./Changing/OutAirport/OutTraffic"; export default function OutAirport() { return ( @@ -10,6 +11,7 @@ export default function OutAirport() { + ); } diff --git a/src/img/AirportTransfer.svg b/src/img/AirportTransfer.svg new file mode 100644 index 0000000..377c671 --- /dev/null +++ b/src/img/AirportTransfer.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/img/PublicBus.svg b/src/img/PublicBus.svg new file mode 100644 index 0000000..b6b648d --- /dev/null +++ b/src/img/PublicBus.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/img/Taxi.svg b/src/img/Taxi.svg new file mode 100644 index 0000000..895b551 --- /dev/null +++ b/src/img/Taxi.svg @@ -0,0 +1,3 @@ + + +