diff --git a/src/App.scss b/src/App.scss index 4fb119d..1033d9d 100644 --- a/src/App.scss +++ b/src/App.scss @@ -46,7 +46,7 @@ font-size: 1rem; @include smallScreen() { - font-size: calc(0.5rem + 1.1vw); + font-size: calc(0.55rem + 1.1vw); } @include screenLandscape() { diff --git a/src/components/JournalView/JournalDispatchersList.vue b/src/components/JournalView/JournalDispatchersList.vue index e72ce69..2b63c99 100644 --- a/src/components/JournalView/JournalDispatchersList.vue +++ b/src/components/JournalView/JournalDispatchersList.vue @@ -136,6 +136,8 @@ li.sticky { display: flex; align-items: center; gap: 0.25em; + flex-wrap: wrap; + .level-badge { margin-right: 0.25em; diff --git a/src/components/JournalView/JournalTimetablesList.vue b/src/components/JournalView/JournalTimetablesList.vue index a14f89e..e4ad7cd 100644 --- a/src/components/JournalView/JournalTimetablesList.vue +++ b/src/components/JournalView/JournalTimetablesList.vue @@ -252,7 +252,7 @@ hr { align-items: center; flex-wrap: wrap; - gap: 0.25em; + gap: 0.5em; margin-bottom: 0.5em; } diff --git a/src/components/SceneryView/SceneryDispatchersHistory.vue b/src/components/SceneryView/SceneryDispatchersHistory.vue index 17b4c73..ca07009 100644 --- a/src/components/SceneryView/SceneryDispatchersHistory.vue +++ b/src/components/SceneryView/SceneryDispatchersHistory.vue @@ -62,7 +62,7 @@ export default defineComponent({ dataStatus: DataStatus.Loading, }; }, - mounted() { + activated() { this.fetchAPIData(); }, methods: { @@ -106,6 +106,7 @@ export default defineComponent({ .item-general { display: flex; align-items: center; + flex-wrap: wrap; gap: 0.25em; } diff --git a/src/components/SceneryView/SceneryTimetablesHistory.vue b/src/components/SceneryView/SceneryTimetablesHistory.vue index e59e311..7182fac 100644 --- a/src/components/SceneryView/SceneryTimetablesHistory.vue +++ b/src/components/SceneryView/SceneryTimetablesHistory.vue @@ -2,8 +2,46 @@
-
{{ $t('scenery.history-list-empty') }}
- + -->
@@ -57,7 +93,7 @@ export default defineComponent({ dataStatus: DataStatus.Loading, }; }, - mounted() { + activated() { this.fetchAPIData(); }, methods: { @@ -72,6 +108,10 @@ export default defineComponent({ console.error(error); } }, + + test() { + console.log('test'); + }, }, components: { Loading }, }); @@ -91,17 +131,29 @@ export default defineComponent({ padding: 0 0.5em; } -.list-item { - display: grid; - grid-template-columns: 1fr 2fr 2fr 1fr; - gap: 1em; - align-items: center; +table { + width: 100%; + border-collapse: collapse; - background-color: #353535; - padding: 0.5em; - margin: 0.5em 0; + thead { + position: sticky; + top: 0; + background-color: #222222; + } - line-height: 1.5em; + th { + padding: 0.5em; + } + + tr { + background-color: #353535; + border: none; + } + + td { + padding: 0.75em; + border-bottom: solid 5px #111; + } } @include smallScreen { diff --git a/src/components/TrainsView/TrainInfo.vue b/src/components/TrainsView/TrainInfo.vue index fd200bc..37be2b5 100644 --- a/src/components/TrainsView/TrainInfo.vue +++ b/src/components/TrainsView/TrainInfo.vue @@ -11,7 +11,7 @@ - {{ train.timetableData.category }}  + {{ train.timetableData.category }}  {{ train.trainNo }} diff --git a/src/mixins/styleMixin.ts b/src/mixins/styleMixin.ts index cc4747b..0702eab 100644 --- a/src/mixins/styleMixin.ts +++ b/src/mixins/styleMixin.ts @@ -6,7 +6,7 @@ export default defineComponent({ const bgColor = exp > -1 ? (exp < 2 ? '#26B0D9' : `hsl(${-exp * 5 + 100}, 85%, 50%)`) : '#666'; const fontColor = exp > 14 || exp == -1 ? 'white' : 'black'; - const boxShadow = isSupporter ? `box-shadow: 0 0 10px 2px ${bgColor};` : ''; + const boxShadow = isSupporter ? `box-shadow: 0 0 6px 2px ${bgColor};` : ''; return `background-color: ${bgColor}; color: ${fontColor}; ${boxShadow};`; }, @@ -14,7 +14,7 @@ export default defineComponent({ calculateTextExpStyle(exp: number, isSupporter = false): string { const textColor = exp > -1 ? (exp < 2 ? '#26B0D9' : `hsl(${-exp * 5 + 100}, 75%, 50%)`) : '#666'; - return `color: ${textColor}; ${isSupporter ? 'text-shadow: 0 0 10px ' + textColor : ''};`; + return `color: ${textColor}; ${isSupporter ? 'text-shadow: 0 0 6px ' + textColor : ''};`; }, statusClasses(occupiedTo: string) { diff --git a/src/styles/global.scss b/src/styles/global.scss index 96f9129..033831a 100644 --- a/src/styles/global.scss +++ b/src/styles/global.scss @@ -29,6 +29,10 @@ &-thumb { background-color: #666; } + + &-corner { + background-color: #333; + } } html {