diff --git a/src/assets/punctualityIcon.png b/src/assets/punctualityIcon.png
new file mode 100644
index 0000000..a9feb10
Binary files /dev/null and b/src/assets/punctualityIcon.png differ
diff --git a/src/components/StationSidebar.vue b/src/components/StationSidebar.vue
index 87ca5f3..05c2847 100644
--- a/src/components/StationSidebar.vue
+++ b/src/components/StationSidebar.vue
@@ -86,6 +86,7 @@ export default {
#xButton:hover{
color:red;
+ cursor: pointer;
}
#typeDiv, #positionDiv, #descriptionDiv{
diff --git a/src/components/TrainSidebar.vue b/src/components/TrainSidebar.vue
index 20d1359..07fb815 100644
--- a/src/components/TrainSidebar.vue
+++ b/src/components/TrainSidebar.vue
@@ -49,20 +49,28 @@
Direction:
{{ store.selectedTrain["Direction"][0] }}
-
-
-

-
-
Punctuality:
{{ store.selectedTrain["Punctuality"][0] }}
-
-
-
+
Public Message:
Public Message: {{ store.selectedTrain["PublicMessage"][0] }}
-
+
+
+
+

+
+
Public Message:
Public Message: {{ store.selectedTrain["PublicMessage"][0] }}
+
+
+
+
+

+
+
Punctuality:
{{ store.selectedTrain["Punctuality"][0] }}
+
+
+
@@ -157,6 +165,7 @@ export default {
#xButton:hover{
color:red;
+ cursor: pointer;
}
#originDiv, #destinationDiv{
@@ -177,12 +186,13 @@ export default {
/* Sidebar Section Divs */
-#typeDiv, #dateDiv, #positionDiv, #directionDiv, #publicMessageDiv, #punctualityDiv{
+#typeDiv, #dateDiv, #positionDiv, #directionDiv, #publicMessageDiv, #notRunningPublicMessageDiv, #punctualityDiv{
background-color: rgb(230, 230, 230);
height: 12%;
position: absolute;
right:0px;
width:100%;
+
}
#typeIcon, #dateIcon, #positionIcon, #directionIcon, #publicMessageIcon, #punctualityIcon{
@@ -195,17 +205,13 @@ export default {
justify-content: center;
}
-#publicMessageIcon{
- align-items: center;
-}
-
#typeP, #dateP, #longP, #latP, #directionP, #publicMessageP, #punctualityP{
- font-size: 16px;
+ font-size: 15px;
position: relative;
- bottom: 2px;
width: 40%;
left: 22%;
text-align: left;
+ bottom:4px;
}
#positionParagraphDiv{
@@ -225,27 +231,24 @@ export default {
width: 70%;
}
-#dateImage, #positionImage, #directionImage{
+#dateImage, #positionImage, #directionImage, #punctualityImage, #publicMessageImage{
padding-top: 2px;
padding-bottom: 2px;
}
-
-#publicMessageImage{
- height: 40%;
- position: relative;
- top:-10px;
-}
-
/*Positioning rows*/
-#dateDiv{top: 60px;}
-#positionDiv{top: 110px;}
-#directionDiv{top: 160px;}
-#punctualityDiv{top: 210px;}
-#publicMessageDiv{
- top:260px;
- height: 40%;
+#dateDiv{top: 16%;}
+#positionDiv{top: 29%;}
+#directionDiv{top: 42%;}
+#punctualityDiv{top: 55%;}
+#publicMessageDiv, #notRunningPublicMessageDiv{
+ top:68%;
+ height: fit-content;
}
+#notRunningPublicMessageDiv{top: 55%;}
+
+
+
@media screen and (max-width: 850px) {
.headerImage{
height: 100%;
@@ -253,5 +256,9 @@ export default {
padding: 10px;
}
+ #typeImage{
+ width: 45%;
+ }
+
}
diff --git a/src/pages/AccountPage.vue b/src/pages/AccountPage.vue
index d3d6310..c7d3f50 100644
--- a/src/pages/AccountPage.vue
+++ b/src/pages/AccountPage.vue
@@ -21,8 +21,8 @@
@@ -276,9 +276,6 @@ input {
align-items: center;
}
-#imgDiv1:hover, #imgDiv2:hover{
- transform: scale(1.1);
-}
#eyeImg{
width: 6%;
@@ -286,6 +283,9 @@ input {
order: 2;
}
+#eyeImg:hover{
+ transform: scale(1.1);
+}
::placeholder{
font-size: 14px;;
diff --git a/src/pages/MapPage.vue b/src/pages/MapPage.vue
index 59eb804..94f8349 100644
--- a/src/pages/MapPage.vue
+++ b/src/pages/MapPage.vue
@@ -16,7 +16,7 @@