diff --git a/src/components/tabs/WikiListTab.vue b/src/components/tabs/WikiListTab.vue
index 60c582d..010243a 100644
--- a/src/components/tabs/WikiListTab.vue
+++ b/src/components/tabs/WikiListTab.vue
@@ -6,41 +6,48 @@
-
+
+
+ {{ $t('wiki.no-vehicles') }}
+
@@ -148,23 +159,24 @@ export default defineComponent({
this.previewVehicle(vehicle);
},
+ resetSearchInput() {
+ this.searchedVehicleTypeName = '';
+ },
+
filterVehicles(v: IVehicle) {
- if (this.searchedVehicleTypeName)
- return v.type
- .toLocaleLowerCase()
- .includes(this.searchedVehicleTypeName.toLocaleLowerCase());
+ if (
+ this.searchedVehicleTypeName != '' &&
+ !v.type.toLocaleLowerCase().includes(this.searchedVehicleTypeName.toLocaleLowerCase())
+ )
+ return false;
- switch (this.filterType) {
- case 'vehicles-all':
- return true;
- case 'vehicles-traction':
- return isTractionUnit(v);
- case 'vehicles-wagon':
- return !isTractionUnit(v);
+ if (
+ (this.filterType == 'vehicles-traction' && !isTractionUnit(v)) ||
+ (this.filterType == 'vehicles-wagon' && isTractionUnit(v))
+ )
+ return false;
- default:
- return false;
- }
+ return true;
},
sortVehicles(v1: IVehicle, v2: IVehicle) {
@@ -180,21 +192,6 @@ export default defineComponent({
case 'maxSpeed':
return Math.sign(v1[this.sorterType] - v2[this.sorterType]) * direction;
- // case 'cargoCount':
- // return (
- // Math.sign(
- // (!isTractionUnit(v1) ? v1.cargoTypes.length || -1 : -1) -
- // (!isTractionUnit(row2.vehicle) ? row2.vehicle.cargoTypes.length || -1 : -1)
- // ) * direction
- // );
-
- // case 'coldStart':
- // return (
- // ((isTractionUnit(v1) && v1.coldStart ? 1 : -1) -
- // (isTractionUnit(row2.vehicle) && row2.vehicle.coldStart ? 1 : -1)) *
- // direction
- // );
-
default:
return v1.type.localeCompare(v2.type) * direction;
}
@@ -220,16 +217,29 @@ export default defineComponent({
gap: 0.5em;
}
-.actions > label {
+.action {
display: flex;
flex-direction: column;
- gap: 0.25em;
+ gap: 0.5em;
- span {
+ label {
color: #ccc;
+ position: relative;
}
}
+.action.action-input label {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+}
+
+.reset-btn {
+ display: flex;
+ background-color: #161c2e;
+ border-radius: 0.25em;
+}
+
.vehicles {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
@@ -290,6 +300,12 @@ export default defineComponent({
color: #ccc;
}
+.no-vehicles-warning {
+ text-align: center;
+ padding: 1em;
+ background-color: #161c2e;
+}
+
@media screen and (max-width: $breakpointSm) {
.actions-panel {
align-items: stretch;
diff --git a/src/locales/en.json b/src/locales/en.json
index fdc7102..a8acb06 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -163,6 +163,7 @@
},
"wiki": {
"title": "LIST OF AVAILABLE VEHICLES",
+ "no-vehicles": "No vehicles to show with the selected filters!",
"labels": {
"vehicles": "Vehicles",
"sort-by": "Sort by",
diff --git a/src/locales/pl.json b/src/locales/pl.json
index a04f8b2..2853c51 100644
--- a/src/locales/pl.json
+++ b/src/locales/pl.json
@@ -163,6 +163,7 @@
},
"wiki": {
"title": "LISTA DOSTĘPNYCH POJAZDÓW",
+ "no-vehicles": "Brak pojazdów do pokazania przy obecnych filtrach!",
"labels": {
"vehicles": "Pojazdy",
"sort-by": "Sortuj wg",
diff --git a/src/styles/global.scss b/src/styles/global.scss
index b5c21fa..b273aab 100644
--- a/src/styles/global.scss
+++ b/src/styles/global.scss
@@ -115,6 +115,10 @@ button {
&:hover {
color: $accentColor;
}
+
+ &:focus-visible {
+ outline: 1px solid $accentColor;
+ }
}
[data-tooltip]:hover::after,