-
{{ $t('journal.title') }}
+
+
![icon history]()
+
{{ $t('journal.title') }}
+
@@ -19,25 +22,24 @@
@keydown.space="toggleTimeline(i)"
tabindex="0"
>
- {{ timeline.date }}
+ {{ timeline.date }}
+
-
-
-
-
-
- {{ timestampToString(dispatcher.dispatcherFrom, true) }}
-
- >
-
- {{ timestampToString(dispatcher.dispatcherTo, true) }}
-
- {{ dispatcher.dispatcherName }}
-
-
-
+
+
+
+ {{ dispatcher.dispatcherName }}
+
+
+ {{ timestampToString(dispatcher.dispatcherFrom, true) }}
+
+ >
+ {{ timestampToString(dispatcher.dispatcherTo, true) }}
+
+
+
+
@@ -87,8 +89,7 @@ export default defineComponent({
isLoaded: false,
icons: {
- ascArrow: require('@/assets/icon-arrow-asc.svg'),
- descArrow: require('@/assets/icon-arrow-desc.svg'),
+ history: require('@/assets/icon-history.svg'),
},
}),
props: {
@@ -100,7 +101,7 @@ export default defineComponent({
async mounted() {
try {
- const apiResult: HistoryResultAPI = (await axios.get(`${API_URL}?name=${this.name}&historyCount=100`)).data;
+ const apiResult: HistoryResultAPI = (await axios.get(`${API_URL}?name=${this.name}&historyCount=100`)).data;
if (!apiResult || !apiResult.response) return;
this.isLoaded = true;
@@ -118,7 +119,7 @@ export default defineComponent({
showTimeline: false,
};
- timelineDay.dispatchers.push(dispatcher);
+ timelineDay.dispatchers.unshift(dispatcher);
if (!acc.find((timeline) => timeline.date == dateStr)) acc.push(timelineDay);
@@ -202,6 +203,20 @@ export default defineComponent({
padding-top: 1em;
}
+.history-title {
+ display: flex;
+ justify-content: center;
+
+ margin-bottom: 0.5em;
+ font-size: 1.2em;
+
+ img {
+ margin-right: 0.5em;
+ width: 1.3em;
+ }
+}
+
+
ul {
height: 600px;
overflow-y: scroll;
@@ -218,12 +233,15 @@ li {
justify-content: center;
align-items: center;
- background: #444;
+ background: #2a2a2a;
padding: 0.5em;
margin: 0 auto 0.5em auto;
max-width: 700px;
+ position: sticky;
+ top: 0;
+
img {
width: 1.3em;
vertical-align: middle;
@@ -246,13 +264,12 @@ li {
margin: 0.5em auto;
background-color: #444;
- border-radius: 0.5em;
display: grid;
grid-template-columns: repeat(2, 1fr);
width: 90%;
- max-width: 400px;
+ max-width: 600px;
}
}
diff --git a/src/components/SceneryView/SceneryInfo.vue b/src/components/SceneryView/SceneryInfo.vue
index c4b2b5e..c614d50 100644
--- a/src/components/SceneryView/SceneryInfo.vue
+++ b/src/components/SceneryView/SceneryInfo.vue
@@ -2,7 +2,7 @@
-
+
@@ -32,7 +32,7 @@ import SceneryInfoIcons from './SceneryInfo/SceneryInfoIcons.vue';
import SceneryInfoStats from './SceneryInfo/SceneryInfoStats.vue';
import SceneryInfoUserList from './SceneryInfo/SceneryInfoUserList.vue';
import SceneryInfoSpawnList from './SceneryInfo/SceneryInfoSpawnList.vue';
-import SceneryInfoRoutes from "./SceneryInfo/SceneryInfoRoutes.vue";
+import SceneryInfoRoutes from './SceneryInfo/SceneryInfoRoutes.vue';
import Station from '@/scripts/interfaces/Station';
@@ -43,7 +43,7 @@ export default defineComponent({
SceneryInfoStats,
SceneryInfoUserList,
SceneryInfoSpawnList,
- SceneryInfoRoutes
+ SceneryInfoRoutes,
},
props: {
station: {
@@ -51,11 +51,11 @@ export default defineComponent({
default: {},
},
- timetableOnly: Boolean
+ timetableOnly: Boolean,
},
data: () => ({
- onlineFrom: -1
+ onlineFrom: -1,
}),
});
@@ -80,10 +80,9 @@ h3.section-header {
}
.info-lists {
- display: flex;
-
- align-items: center;
- flex-direction: column;
+ display: grid;
+ grid-template-columns: repeat(auto-fit, minmax(300px, 550px));
+ justify-content: center;
}
.badge {
diff --git a/src/components/SceneryView/SceneryInfo/SceneryInfoDispatcher.vue b/src/components/SceneryView/SceneryInfo/SceneryInfoDispatcher.vue
index a8aeaaf..90aca72 100644
--- a/src/components/SceneryView/SceneryInfo/SceneryInfoDispatcher.vue
+++ b/src/components/SceneryView/SceneryInfo/SceneryInfoDispatcher.vue
@@ -1,23 +1,25 @@
-
+
{{ station.onlineInfo.dispatcherExp > 1 ? station.onlineInfo.dispatcherExp : 'L' }}
{{ station.onlineInfo.dispatcherName }}
+
+
+
+ {{ station.onlineInfo?.dispatcherRate || '0' }}
+
- OD {{ new Date(onlineFrom).toLocaleTimeString('pl-PL', { hour: "2-digit", minute: "2-digit" }) }}
+ OD {{ new Date(onlineFrom).toLocaleTimeString('pl-PL', { hour: '2-digit', minute: '2-digit' }) }}
{{ $t(`status.${station.onlineInfo.statusID}`) }}
- {{ station.onlineInfo.statusID == 'online' ? timestampToString(station.onlineInfo.statusTimestamp) : '' }}
+ {{ station.onlineInfo.statusID == 'online' ? timestampToString(station.onlineInfo.statusTimestamp) : '' }}
@@ -34,7 +36,7 @@ import Station from '@/scripts/interfaces/Station';
import dateMixin from '@/mixins/dateMixin';
export default defineComponent({
- mixins: [styleMixin, dateMixin ],
+ mixins: [styleMixin, dateMixin],
props: {
station: {
type: Object as () => Station,
@@ -43,15 +45,15 @@ export default defineComponent({
onlineFrom: {
type: Number,
- default: -1
- }
+ default: -1,
+ },
},
-
data: () => ({
icons: {
spawn: require('@/assets/icon-spawn.svg'),
- }
+ like: require('@/assets/icon-like.svg'),
+ },
}),
});
@@ -81,12 +83,21 @@ export default defineComponent({
}
&_name {
- margin-right: 1em;
+ margin-right: 0.4em;
+ }
+
+ &_likes {
+ img {
+ height: 0.7em;
+ margin-right: 0.25em;
+ }
+
+ margin-right: 1.5em;
}
}
.status-badge {
- font-size: 1.2em;
+ font-size: 1.25em;
margin: 0.5em 0.25em;
}
}
diff --git a/src/components/SceneryView/SceneryInfo/SceneryInfoIcons.vue b/src/components/SceneryView/SceneryInfo/SceneryInfoIcons.vue
index e8453e7..ff8c30a 100644
--- a/src/components/SceneryView/SceneryInfo/SceneryInfoIcons.vue
+++ b/src/components/SceneryView/SceneryInfo/SceneryInfoIcons.vue
@@ -78,7 +78,7 @@ export default defineComponent({
.info-icons {
img {
width: 3.5em;
- margin: 0 0.5em;
+ margin: 1em 0.5em;
border: 2px solid #4e4e4e;
border-radius: 0.5em;
diff --git a/src/components/SceneryView/SceneryInfo/SceneryInfoRoutes.vue b/src/components/SceneryView/SceneryInfo/SceneryInfoRoutes.vue
index afadd6d..71dde25 100644
--- a/src/components/SceneryView/SceneryInfo/SceneryInfoRoutes.vue
+++ b/src/components/SceneryView/SceneryInfo/SceneryInfoRoutes.vue
@@ -21,8 +21,8 @@
{{ route.tracks }}tor
-
-
+
+
@@ -46,12 +46,12 @@ export default defineComponent({
data() {
return {
icons: {
- trackTWB: require("@/assets/icon-track-twb.svg"),
- trackSBL: require("@/assets/icon-track-sbl.svg"),
- trackCatenary: require("@/assets/icon-track-catenary.svg"),
- trackNoCatenary: require("@/assets/icon-track-nocatenary.svg"),
- }
- }
+ trackTWB: require('@/assets/icon-track-twb.svg'),
+ trackSBL: require('@/assets/icon-track-sbl.svg'),
+ trackCatenary: require('@/assets/icon-track-catenary.svg'),
+ trackNoCatenary: require('@/assets/icon-track-nocatenary.svg'),
+ },
+ };
},
});
@@ -90,5 +90,4 @@ export default defineComponent({
vertical-align: text-bottom;
}
}
-
diff --git a/src/components/SceneryView/SceneryInfo/SceneryInfoSpawnList.vue b/src/components/SceneryView/SceneryInfo/SceneryInfoSpawnList.vue
index 988c8c8..ecd7ef8 100644
--- a/src/components/SceneryView/SceneryInfo/SceneryInfoSpawnList.vue
+++ b/src/components/SceneryView/SceneryInfo/SceneryInfoSpawnList.vue
@@ -1,8 +1,9 @@
diff --git a/src/components/SceneryView/SceneryInfo/SceneryInfoStats.vue b/src/components/SceneryView/SceneryInfo/SceneryInfoStats.vue
index 6b5eafd..0b5bec4 100644
--- a/src/components/SceneryView/SceneryInfo/SceneryInfoStats.vue
+++ b/src/components/SceneryView/SceneryInfo/SceneryInfoStats.vue
@@ -83,7 +83,7 @@ export default defineComponent({
}
span > img {
- width: 1.2em;
+ width: 1.2em;
margin-right: 0.5em;
}
}
diff --git a/src/components/SceneryView/SceneryInfo/SceneryInfoUserList.vue b/src/components/SceneryView/SceneryInfo/SceneryInfoUserList.vue
index 7c460fa..4ee838e 100644
--- a/src/components/SceneryView/SceneryInfo/SceneryInfoUserList.vue
+++ b/src/components/SceneryView/SceneryInfo/SceneryInfoUserList.vue
@@ -1,8 +1,9 @@