diff --git a/src/components/css/StopTitle.css b/src/components/css/StopTitle.css index 2607aac..74abe93 100644 --- a/src/components/css/StopTitle.css +++ b/src/components/css/StopTitle.css @@ -16,7 +16,7 @@ } #stopTitle h1 { - font-size: 9vw; + font-size: 3.5vh; } #stopTitle h3 { @@ -26,7 +26,7 @@ @media screen and (min-width: 400px) { #stopTitle h1 { - font-size: 35px; + font-size: 4vh; } #stopTitle h3 { diff --git a/src/components/css/TrafficInfo.css b/src/components/css/TrafficInfo.css index b9e8775..e87b9fa 100644 --- a/src/components/css/TrafficInfo.css +++ b/src/components/css/TrafficInfo.css @@ -20,7 +20,7 @@ width: 90%; display: flex; flex-direction: row; - justify-content: space-evenly; + justify-content: flex-start; margin-bottom: 2vh; } @@ -50,12 +50,12 @@ .trafficEntry div div div { display: flex; flex-direction: row; - justify-content: flex-start; + justify-content: space-around; align-items: flex-end; } .timeColumn { - flex-basis: 15%; + flex-basis: 20%; justify-content: space-between !important; align-items: center; } @@ -78,8 +78,9 @@ } .lineColumn img { - width: 7.5vw; - margin-right: 10px; + flex-basis: 20%; + height: 9vw; + margin-right: 5%; } .infoWrapper p { @@ -106,12 +107,20 @@ color: white; font-size: 6vw; font-weight: 100; - margin-right: 10px; - padding: 1vw 4vw; + padding: 1vw 2.5vw; + border-radius: var(--borderRadius); + font-family: 'Roboto Light'; + height: 7vw; + flex-basis: 35%; + margin-right: 5%; } .destination { + height: 9vw; + font-size: 4vw; text-align: left; + display: flex; + align-items: flex-end; } .trafficEntry a {