Änderung: Hinzufügung des Taxi-Minispiels und zugehöriger Funktionen

Änderungen:
- Integration des Taxi-Minispiels mit neuen Routen und Komponenten im Backend und Frontend.
- Erstellung von Modellen und Datenbank-Schemas für das Taxi-Spiel, einschließlich TaxiGameState, TaxiLevelStats und TaxiMap.
- Erweiterung der Navigationsstruktur und der Benutzeroberfläche, um das Taxi-Spiel und die zugehörigen Tools zu unterstützen.
- Aktualisierung der Übersetzungen für das Taxi-Minispiel in Deutsch und Englisch.

Diese Anpassungen erweitern die Funktionalität der Anwendung um ein neues Minispiel und verbessern die Benutzererfahrung durch neue Features und Inhalte.

backend/app.js

@@ -13,6 +13,8 @@ import falukantRouter from './routers/falukantRouter.js';
 import friendshipRouter from './routers/friendshipRouter.js';
 import blogRouter from './routers/blogRouter.js';
 import match3Router from './routers/match3Router.js';
+import taxiRouter from './routers/taxiRouter.js';
+import taxiMapRouter from './routers/taxiMapRouter.js';
 import cors from 'cors';
 import './jobs/sessionCleanup.js';
 
@@ -39,6 +41,8 @@ app.use('/api/navigation', navigationRouter);
 app.use('/api/settings', settingsRouter);
 app.use('/api/admin', adminRouter);
 app.use('/api/match3', match3Router);
+app.use('/api/taxi', taxiRouter);
+app.use('/api/taxi-maps', taxiMapRouter);
 app.use('/images', express.static(path.join(__dirname, '../frontend/public/images')));
 app.use('/api/contact', contactRouter);
 app.use('/api/socialnetwork', socialnetworkRouter);

backend/controllers/navigationController.js

@@ -174,6 +174,10 @@ const menuStructure = {
             match3: {
                 visible: ["all"],
                 path: "/minigames/match3"
+            },
+            taxi: {
+                visible: ["all"],
+                path: "/minigames/taxi"
             }
         } 
     },
@@ -274,6 +278,10 @@ const menuStructure = {
                     match3: {
                         visible: ["mainadmin", "match3"],
                         path: "/admin/minigames/match3"
+                    },
+                    taxiTools: {
+                        visible: ["mainadmin", "taxi"],
+                        path: "/admin/minigames/taxi-tools"
                     }
                 }
             }

backend/controllers/taxiController.js

@@ -0,0 +1,144 @@
+import TaxiService from '../services/taxiService.js';
+
+function extractHashedUserId(req) {
+    return req.headers?.userid;
+}
+
+class TaxiController {
+  constructor() {
+    this.taxiService = new TaxiService();
+  }
+
+  // Spielstand laden
+  async getGameState(req, res) {
+    try {
+      const hashedUserId = extractHashedUserId(req);
+      const gameState = await this.taxiService.getGameState(hashedUserId);
+      res.json({ success: true, data: gameState });
+    } catch (error) {
+      console.error('Error getting taxi game state:', error);
+      res.status(500).json({ success: false, message: 'Fehler beim Laden des Spielstands' });
+    }
+  }
+
+  // Spielstand speichern
+  async saveGameState(req, res) {
+    try {
+      const userId = extractHashedUserId(req);
+      const { level, score, money, passengersDelivered, fuel } = req.body;
+      
+      const gameState = await this.taxiService.saveGameState(userId, {
+        level,
+        score,
+        money,
+        passengersDelivered,
+        fuel
+      });
+      
+      res.json({ success: true, data: gameState });
+    } catch (error) {
+      console.error('Error saving taxi game state:', error);
+      res.status(500).json({ success: false, message: 'Fehler beim Speichern des Spielstands' });
+    }
+  }
+
+  // Level-Statistiken abrufen
+  async getLevelStats(req, res) {
+    try {
+      const userId = extractHashedUserId(req);
+      const { level } = req.params;
+      
+      const stats = await this.taxiService.getLevelStats(userId, parseInt(level));
+      res.json({ success: true, data: stats });
+    } catch (error) {
+      console.error('Error getting level stats:', error);
+      res.status(500).json({ success: false, message: 'Fehler beim Laden der Level-Statistiken' });
+    }
+  }
+
+  // Bestenliste abrufen
+  async getLeaderboard(req, res) {
+    try {
+      const { type = 'score', limit = 10 } = req.query;
+      const leaderboard = await this.taxiService.getLeaderboard(type, parseInt(limit));
+      res.json({ success: true, data: leaderboard });
+    } catch (error) {
+      console.error('Error getting leaderboard:', error);
+      res.status(500).json({ success: false, message: 'Fehler beim Laden der Bestenliste' });
+    }
+  }
+
+  // Spiel beenden und Punkte verarbeiten
+  async finishGame(req, res) {
+    try {
+      const userId = extractHashedUserId(req);
+      const { finalScore, finalMoney, passengersDelivered, level } = req.body;
+      
+      const result = await this.taxiService.finishGame(userId, {
+        finalScore,
+        finalMoney,
+        passengersDelivered,
+        level
+      });
+      
+      res.json({ success: true, data: result });
+    } catch (error) {
+      console.error('Error finishing game:', error);
+      res.status(500).json({ success: false, message: 'Fehler beim Beenden des Spiels' });
+    }
+  }
+
+  // Level freischalten
+  async unlockLevel(req, res) {
+    try {
+      const userId = extractHashedUserId(req);
+      const { level } = req.body;
+      
+      const result = await this.taxiService.unlockLevel(userId, level);
+      res.json({ success: true, data: result });
+    } catch (error) {
+      console.error('Error unlocking level:', error);
+      res.status(500).json({ success: false, message: 'Fehler beim Freischalten des Levels' });
+    }
+  }
+
+  // Spieler-Statistiken abrufen
+  async getPlayerStats(req, res) {
+    try {
+      const userId = extractHashedUserId(req);
+      const stats = await this.taxiService.getPlayerStats(userId);
+      res.json({ success: true, data: stats });
+    } catch (error) {
+      console.error('Error getting player stats:', error);
+      res.status(500).json({ success: false, message: 'Fehler beim Laden der Spieler-Statistiken' });
+    }
+  }
+
+  // Level zurücksetzen
+  async resetLevel(req, res) {
+    try {
+      const userId = extractHashedUserId(req);
+      const { level } = req.body;
+      
+      const result = await this.taxiService.resetLevel(userId, level);
+      res.json({ success: true, data: result });
+    } catch (error) {
+      console.error('Error resetting level:', error);
+      res.status(500).json({ success: false, message: 'Fehler beim Zurücksetzen des Levels' });
+    }
+  }
+
+  // Alle Spielstände zurücksetzen
+  async resetAllProgress(req, res) {
+    try {
+      const userId = extractHashedUserId(req);
+      const result = await this.taxiService.resetAllProgress(userId);
+      res.json({ success: true, data: result });
+    } catch (error) {
+      console.error('Error resetting all progress:', error);
+      res.status(500).json({ success: false, message: 'Fehler beim Zurücksetzen aller Fortschritte' });
+    }
+  }
+}
+
+export default TaxiController;

backend/controllers/taxiMapController.js

@@ -0,0 +1,144 @@
+import TaxiMapService from '../services/taxiMapService.js';
+
+class TaxiMapController {
+  constructor() {
+    this.taxiMapService = new TaxiMapService();
+    
+    // Bind all methods to the class instance
+    this.getMapTypes = this.getMapTypes.bind(this);
+    this.getMaps = this.getMaps.bind(this);
+    this.getMapById = this.getMapById.bind(this);
+    this.getMapByPosition = this.getMapByPosition.bind(this);
+    this.getDefaultMap = this.getDefaultMap.bind(this);
+    this.createMap = this.createMap.bind(this);
+    this.updateMap = this.updateMap.bind(this);
+    this.deleteMap = this.deleteMap.bind(this);
+    this.setDefaultMap = this.setDefaultMap.bind(this);
+  }
+
+  async getMapTypes(req, res) {
+    try {
+      const mapTypes = await this.taxiMapService.getMapTypes();
+      res.json({ success: true, data: mapTypes });
+    } catch (error) {
+      console.error('Error getting map types:', error);
+      res.status(500).json({ success: false, message: 'Fehler beim Laden der Map-Typen' });
+    }
+  }
+
+  async getMaps(req, res) {
+    try {
+      const maps = await this.taxiMapService.getMaps();
+      res.json({ success: true, data: maps });
+    } catch (error) {
+      console.error('Error getting maps:', error);
+      res.status(500).json({ success: false, message: 'Fehler beim Laden der Maps' });
+    }
+  }
+
+  async getMapById(req, res) {
+    try {
+      const { mapId } = req.params;
+      const map = await this.taxiMapService.getMapById(mapId);
+      
+      if (!map) {
+        return res.status(404).json({ success: false, message: 'Map nicht gefunden' });
+      }
+      
+      res.json({ success: true, data: map });
+    } catch (error) {
+      console.error('Error getting map by ID:', error);
+      res.status(500).json({ success: false, message: 'Fehler beim Laden der Map' });
+    }
+  }
+
+  async getMapByPosition(req, res) {
+    try {
+      const { positionX, positionY } = req.params;
+      const map = await this.taxiMapService.getMapByPosition(
+        parseInt(positionX), 
+        parseInt(positionY)
+      );
+      
+      if (!map) {
+        return res.status(404).json({ success: false, message: 'Map an Position nicht gefunden' });
+      }
+      
+      res.json({ success: true, data: map });
+    } catch (error) {
+      console.error('Error getting map by position:', error);
+      res.status(500).json({ success: false, message: 'Fehler beim Laden der Map' });
+    }
+  }
+
+  async getDefaultMap(req, res) {
+    try {
+      const map = await this.taxiMapService.getDefaultMap();
+      
+      if (!map) {
+        return res.status(404).json({ success: false, message: 'Keine Standard-Map gefunden' });
+      }
+      
+      res.json({ success: true, data: map });
+    } catch (error) {
+      console.error('Error getting default map:', error);
+      res.status(500).json({ success: false, message: 'Fehler beim Laden der Standard-Map' });
+    }
+  }
+
+  async createMap(req, res) {
+    try {
+      const mapData = req.body;
+      const map = await this.taxiMapService.createMap(mapData);
+      res.status(201).json({ success: true, data: map });
+    } catch (error) {
+      console.error('Error creating map:', error);
+      res.status(500).json({ success: false, message: 'Fehler beim Erstellen der Map' });
+    }
+  }
+
+  async updateMap(req, res) {
+    try {
+      const { mapId } = req.params;
+      const updateData = req.body;
+      const map = await this.taxiMapService.updateMap(mapId, updateData);
+      res.json({ success: true, data: map });
+    } catch (error) {
+      console.error('Error updating map:', error);
+      if (error.message === 'Map not found') {
+        return res.status(404).json({ success: false, message: 'Map nicht gefunden' });
+      }
+      res.status(500).json({ success: false, message: 'Fehler beim Aktualisieren der Map' });
+    }
+  }
+
+  async deleteMap(req, res) {
+    try {
+      const { mapId } = req.params;
+      await this.taxiMapService.deleteMap(mapId);
+      res.json({ success: true, message: 'Map erfolgreich gelöscht' });
+    } catch (error) {
+      console.error('Error deleting map:', error);
+      if (error.message === 'Map not found') {
+        return res.status(404).json({ success: false, message: 'Map nicht gefunden' });
+      }
+      res.status(500).json({ success: false, message: 'Fehler beim Löschen der Map' });
+    }
+  }
+
+  async setDefaultMap(req, res) {
+    try {
+      const { mapId } = req.params;
+      await this.taxiMapService.setDefaultMap(mapId);
+      res.json({ success: true, message: 'Standard-Map erfolgreich gesetzt' });
+    } catch (error) {
+      console.error('Error setting default map:', error);
+      if (error.message === 'Map not found') {
+        return res.status(404).json({ success: false, message: 'Map nicht gefunden' });
+      }
+      res.status(500).json({ success: false, message: 'Fehler beim Setzen der Standard-Map' });
+    }
+  }
+}
+
+export default TaxiMapController;

backend/models/associations.js

@@ -102,6 +102,10 @@ import Match3Level from './match3/level.js';
 import Objective from './match3/objective.js';
 import UserProgress from './match3/userProgress.js';
 import UserLevelProgress from './match3/userLevelProgress.js';
+import TaxiGameState from './taxi/taxiGameState.js';
+import TaxiLevelStats from './taxi/taxiLevelStats.js';
+import TaxiMapType from './taxi/taxiMapType.js';
+import TaxiMap from './taxi/taxiMap.js';
 
 export default function setupAssociations() {
   // RoomType 1:n Room
@@ -786,4 +790,15 @@ export default function setupAssociations() {
   UserLevelProgress.belongsTo(UserProgress, { foreignKey: 'userProgressId', as: 'userProgress' });
   Match3Level.hasMany(UserLevelProgress, { foreignKey: 'levelId', as: 'userLevelProgress' });
   UserLevelProgress.belongsTo(Match3Level, { foreignKey: 'levelId', as: 'level' });
+
+  // Taxi Game associations
+  TaxiGameState.belongsTo(User, { foreignKey: 'userId', as: 'user' });
+  User.hasOne(TaxiGameState, { foreignKey: 'userId', as: 'taxiGameState' });
+  
+  TaxiLevelStats.belongsTo(User, { foreignKey: 'userId', as: 'user' });
+  User.hasMany(TaxiLevelStats, { foreignKey: 'userId', as: 'taxiLevelStats' });
+  
+  // Taxi Map associations
+  TaxiMap.belongsTo(TaxiMapType, { foreignKey: 'mapTypeId', as: 'mapType' });
+  TaxiMapType.hasMany(TaxiMap, { foreignKey: 'mapTypeId', as: 'maps' });
 }

backend/models/index.js

@@ -95,6 +95,9 @@ import Match3Objective from './match3/objective.js';
 import Match3UserProgress from './match3/userProgress.js';
 import Match3UserLevelProgress from './match3/userLevelProgress.js';
 
+// — Taxi Minigame —
+import { TaxiGameState, TaxiLevelStats } from './taxi/index.js';
+
 // — Politische Ämter (Politics) —
 import PoliticalOfficeType from './falukant/type/political_office_type.js';
 import PoliticalOfficeRequirement from './falukant/predefine/political_office_prerequisite.js';
@@ -230,6 +233,10 @@ const models = {
   Match3Objective,
   Match3UserProgress,
   Match3UserLevelProgress,
+  
+  // Taxi Minigame
+  TaxiGameState,
+  TaxiLevelStats,
 };
 
 export default models;

backend/models/taxi/index.js

@@ -0,0 +1,6 @@
+import TaxiGameState from './taxiGameState.js';
+import TaxiLevelStats from './taxiLevelStats.js';
+import TaxiMapType from './taxiMapType.js';
+import TaxiMap from './taxiMap.js';
+
+export { TaxiGameState, TaxiLevelStats, TaxiMapType, TaxiMap };

backend/models/taxi/taxiGameState.js

@@ -0,0 +1,75 @@
+import { DataTypes } from 'sequelize';
+import { sequelize } from '../../utils/sequelize.js';
+
+const TaxiGameState = sequelize.define('TaxiGameState', {
+  id: {
+    type: DataTypes.INTEGER,
+    primaryKey: true,
+    autoIncrement: true
+  },
+  userId: {
+    type: DataTypes.INTEGER,
+    allowNull: false
+  },
+  currentLevel: {
+    type: DataTypes.INTEGER,
+    allowNull: false,
+    defaultValue: 1
+  },
+  totalScore: {
+    type: DataTypes.INTEGER,
+    allowNull: false,
+    defaultValue: 0
+  },
+  totalMoney: {
+    type: DataTypes.INTEGER,
+    allowNull: false,
+    defaultValue: 0
+  },
+  totalPassengersDelivered: {
+    type: DataTypes.INTEGER,
+    allowNull: false,
+    defaultValue: 0
+  },
+  unlockedLevels: {
+    type: DataTypes.JSON,
+    allowNull: false,
+    defaultValue: [1]
+  },
+  achievements: {
+    type: DataTypes.JSON,
+    allowNull: false,
+    defaultValue: []
+  },
+  createdAt: {
+    type: DataTypes.DATE,
+    allowNull: false,
+    defaultValue: DataTypes.NOW
+  },
+  updatedAt: {
+    type: DataTypes.DATE,
+    allowNull: false,
+    defaultValue: DataTypes.NOW
+  }
+}, {
+  tableName: 'taxi_game_states',
+  schema: 'taxi',
+  timestamps: true,
+  indexes: [
+    {
+      unique: true,
+      fields: ['user_id']
+    },
+    {
+      fields: ['total_score']
+    },
+    {
+      fields: ['total_money']
+    },
+    {
+      fields: ['total_passengers_delivered']
+    }
+  ]
+});
+
+export default TaxiGameState;

backend/models/taxi/taxiLevelStats.js

@@ -0,0 +1,79 @@
+import { DataTypes } from 'sequelize';
+import { sequelize } from '../../utils/sequelize.js';
+
+const TaxiLevelStats = sequelize.define('TaxiLevelStats', {
+  id: {
+    type: DataTypes.INTEGER,
+    primaryKey: true,
+    autoIncrement: true
+  },
+  userId: {
+    type: DataTypes.INTEGER,
+    allowNull: false
+  },
+  level: {
+    type: DataTypes.INTEGER,
+    allowNull: false
+  },
+  bestScore: {
+    type: DataTypes.INTEGER,
+    allowNull: false,
+    defaultValue: 0
+  },
+  bestMoney: {
+    type: DataTypes.INTEGER,
+    allowNull: false,
+    defaultValue: 0
+  },
+  bestPassengersDelivered: {
+    type: DataTypes.INTEGER,
+    allowNull: false,
+    defaultValue: 0
+  },
+  timesPlayed: {
+    type: DataTypes.INTEGER,
+    allowNull: false,
+    defaultValue: 0
+  },
+  completed: {
+    type: DataTypes.BOOLEAN,
+    allowNull: false,
+    defaultValue: false
+  },
+  playTime: {
+    type: DataTypes.INTEGER,
+    allowNull: true,
+    comment: 'Play time in seconds'
+  },
+  createdAt: {
+    type: DataTypes.DATE,
+    allowNull: false,
+    defaultValue: DataTypes.NOW
+  },
+  updatedAt: {
+    type: DataTypes.DATE,
+    allowNull: false,
+    defaultValue: DataTypes.NOW
+  }
+}, {
+  tableName: 'taxi_level_stats',
+  schema: 'taxi',
+  timestamps: true,
+  indexes: [
+    {
+      unique: true,
+      fields: ['user_id', 'level']
+    },
+    {
+      fields: ['level']
+    },
+    {
+      fields: ['best_score']
+    },
+    {
+      fields: ['completed']
+    }
+  ]
+});
+
+export default TaxiLevelStats;

backend/models/taxi/taxiMap.js

@@ -0,0 +1,101 @@
+import { DataTypes } from 'sequelize';
+import { sequelize } from '../../utils/sequelize.js';
+
+const TaxiMap = sequelize.define('TaxiMap', {
+  id: {
+    type: DataTypes.INTEGER,
+    primaryKey: true,
+    autoIncrement: true
+  },
+  name: {
+    type: DataTypes.STRING(100),
+    allowNull: false
+  },
+  description: {
+    type: DataTypes.TEXT,
+    allowNull: true
+  },
+  width: {
+    type: DataTypes.INTEGER,
+    allowNull: false,
+    defaultValue: 8,
+    comment: 'Map width in tiles'
+  },
+  height: {
+    type: DataTypes.INTEGER,
+    allowNull: false,
+    defaultValue: 8,
+    comment: 'Map height in tiles'
+  },
+  tileSize: {
+    type: DataTypes.INTEGER,
+    allowNull: false,
+    defaultValue: 50,
+    comment: 'Size of each tile in pixels'
+  },
+  mapTypeId: {
+    type: DataTypes.INTEGER,
+    allowNull: false,
+    comment: 'Reference to TaxiMapType'
+  },
+  mapData: {
+    type: DataTypes.JSON,
+    allowNull: false,
+    comment: '2D array of map type IDs for each tile position'
+  },
+  positionX: {
+    type: DataTypes.INTEGER,
+    allowNull: false,
+    comment: 'X position as continuous integer (1, 2, 3, ...)'
+  },
+  positionY: {
+    type: DataTypes.INTEGER,
+    allowNull: false,
+    comment: 'Y position as continuous integer (1, 2, 3, ...)'
+  },
+  isActive: {
+    type: DataTypes.BOOLEAN,
+    allowNull: false,
+    defaultValue: true
+  },
+  isDefault: {
+    type: DataTypes.BOOLEAN,
+    allowNull: false,
+    defaultValue: false,
+    comment: 'Whether this is the default map for new games'
+  },
+  createdAt: {
+    type: DataTypes.DATE,
+    allowNull: false,
+    defaultValue: DataTypes.NOW
+  },
+  updatedAt: {
+    type: DataTypes.DATE,
+    allowNull: false,
+    defaultValue: DataTypes.NOW
+  }
+}, {
+  tableName: 'taxi_maps',
+  schema: 'taxi',
+  timestamps: true,
+  indexes: [
+    {
+      fields: ['name']
+    },
+    {
+      fields: ['is_active']
+    },
+    {
+      fields: ['is_default']
+    },
+    {
+      fields: ['position_x', 'position_y']
+    },
+    {
+      unique: true,
+      fields: ['position_x', 'position_y']
+    }
+  ]
+});
+
+export default TaxiMap;

backend/models/taxi/taxiMapType.js

@@ -0,0 +1,57 @@
+import { DataTypes } from 'sequelize';
+import { sequelize } from '../../utils/sequelize.js';
+
+const TaxiMapType = sequelize.define('TaxiMapType', {
+  id: {
+    type: DataTypes.INTEGER,
+    primaryKey: true,
+    autoIncrement: true
+  },
+  name: {
+    type: DataTypes.STRING(50),
+    allowNull: false,
+    unique: true
+  },
+  description: {
+    type: DataTypes.TEXT,
+    allowNull: true
+  },
+  tileType: {
+    type: DataTypes.STRING(50),
+    allowNull: false,
+    comment: 'Type of tile: cornerBottomLeft, cornerBottomRight, cornerTopLeft, cornerTopRight, horizontal, vertical, cross, fuelHorizontal, fuelVertical, tLeft, tRight, tUp, tDown'
+  },
+  isActive: {
+    type: DataTypes.BOOLEAN,
+    allowNull: false,
+    defaultValue: true
+  },
+  createdAt: {
+    type: DataTypes.DATE,
+    allowNull: false,
+    defaultValue: DataTypes.NOW
+  },
+  updatedAt: {
+    type: DataTypes.DATE,
+    allowNull: false,
+    defaultValue: DataTypes.NOW
+  }
+}, {
+  tableName: 'taxi_map_types',
+  schema: 'taxi',
+  timestamps: true,
+  indexes: [
+    {
+      unique: true,
+      fields: ['name']
+    },
+    {
+      fields: ['tile_type']
+    },
+    {
+      fields: ['is_active']
+    }
+  ]
+});
+
+export default TaxiMapType;

backend/routers/taxiMapRouter.js

@@ -0,0 +1,26 @@
+import express from 'express';
+import TaxiMapController from '../controllers/taxiMapController.js';
+import { authenticate } from '../middleware/authMiddleware.js';
+
+const router = express.Router();
+const taxiMapController = new TaxiMapController();
+
+// All routes require authentication
+router.use(authenticate);
+
+// Map types routes
+router.get('/map-types', (req, res) => taxiMapController.getMapTypes(req, res));
+
+// Maps routes
+router.get('/maps', (req, res) => taxiMapController.getMaps(req, res));
+router.get('/maps/default', (req, res) => taxiMapController.getDefaultMap(req, res));
+router.get('/maps/position/:positionX/:positionY', (req, res) => taxiMapController.getMapByPosition(req, res));
+router.get('/maps/:mapId', (req, res) => taxiMapController.getMapById(req, res));
+
+// Map management routes (admin only - you might want to add admin middleware)
+router.post('/maps', (req, res) => taxiMapController.createMap(req, res));
+router.put('/maps/:mapId', (req, res) => taxiMapController.updateMap(req, res));
+router.delete('/maps/:mapId', (req, res) => taxiMapController.deleteMap(req, res));
+router.post('/maps/:mapId/set-default', (req, res) => taxiMapController.setDefaultMap(req, res));
+
+export default router;

backend/routers/taxiRouter.js

@@ -0,0 +1,30 @@
+import express from 'express';
+import TaxiController from '../controllers/taxiController.js';
+import { authenticate } from '../middleware/authMiddleware.js';
+
+const router = express.Router();
+const taxiController = new TaxiController();
+
+// Alle Routen erfordern Authentifizierung
+router.use(authenticate);
+
+// Spielstand-Routen
+router.get('/game-state', (req, res) => taxiController.getGameState(req, res));
+router.post('/game-state', (req, res) => taxiController.saveGameState(req, res));
+
+// Level-Routen
+router.get('/level/:level/stats', (req, res) => taxiController.getLevelStats(req, res));
+router.post('/level/unlock', (req, res) => taxiController.unlockLevel(req, res));
+router.post('/level/reset', (req, res) => taxiController.resetLevel(req, res));
+
+// Spiel-Routen
+router.post('/finish', (req, res) => taxiController.finishGame(req, res));
+
+// Statistik-Routen
+router.get('/leaderboard', (req, res) => taxiController.getLeaderboard(req, res));
+router.get('/player-stats', (req, res) => taxiController.getPlayerStats(req, res));
+
+// Reset-Routen
+router.post('/reset-all', (req, res) => taxiController.resetAllProgress(req, res));
+
+export default router;

backend/services/taxiMapService.js

@@ -0,0 +1,269 @@
+import BaseService from './BaseService.js';
+import TaxiMap from '../models/taxi/taxiMap.js';
+import TaxiMapType from '../models/taxi/taxiMapType.js';
+
+class TaxiMapService extends BaseService {
+  constructor() {
+    super();
+  }
+
+  /**
+   * Holt alle verfügbaren Map-Typen
+   */
+  async getMapTypes() {
+    try {
+      const mapTypes = await TaxiMapType.findAll({
+        where: { isActive: true },
+        order: [['name', 'ASC']]
+      });
+      return mapTypes;
+    } catch (error) {
+      console.error('Error getting map types:', error);
+      throw error;
+    }
+  }
+
+  /**
+   * Holt alle verfügbaren Maps
+   */
+  async getMaps() {
+    try {
+      const maps = await TaxiMap.findAll({
+        where: { isActive: true },
+        include: [{
+          model: TaxiMapType,
+          as: 'mapType'
+        }],
+        order: [['positionY', 'ASC'], ['positionX', 'ASC']]
+      });
+      return maps;
+    } catch (error) {
+      console.error('Error getting maps:', error);
+      throw error;
+    }
+  }
+
+  /**
+   * Holt eine spezifische Map
+   */
+  async getMapById(mapId) {
+    try {
+      const map = await TaxiMap.findOne({
+        where: { 
+          id: mapId,
+          isActive: true 
+        },
+        include: [{
+          model: TaxiMapType,
+          as: 'mapType'
+        }]
+      });
+      return map;
+    } catch (error) {
+      console.error('Error getting map by ID:', error);
+      throw error;
+    }
+  }
+
+  /**
+   * Holt eine Map nach Position
+   */
+  async getMapByPosition(positionX, positionY) {
+    try {
+      const map = await TaxiMap.findOne({
+        where: { 
+          positionX: positionX,
+          positionY: positionY,
+          isActive: true 
+        },
+        include: [{
+          model: TaxiMapType,
+          as: 'mapType'
+        }]
+      });
+      return map;
+    } catch (error) {
+      console.error('Error getting map by position:', error);
+      throw error;
+    }
+  }
+
+  /**
+   * Holt die Standard-Map
+   */
+  async getDefaultMap() {
+    try {
+      const map = await TaxiMap.findOne({
+        where: { 
+          isDefault: true,
+          isActive: true 
+        },
+        include: [{
+          model: TaxiMapType,
+          as: 'mapType'
+        }]
+      });
+      return map;
+    } catch (error) {
+      console.error('Error getting default map:', error);
+      throw error;
+    }
+  }
+
+  /**
+   * Erstellt eine neue Map
+   */
+  async createMap(mapData) {
+    try {
+      const map = await TaxiMap.create(mapData);
+      return map;
+    } catch (error) {
+      console.error('Error creating map:', error);
+      throw error;
+    }
+  }
+
+  /**
+   * Aktualisiert eine Map
+   */
+  async updateMap(mapId, updateData) {
+    try {
+      const [updatedRowsCount] = await TaxiMap.update(updateData, {
+        where: { id: mapId }
+      });
+      
+      if (updatedRowsCount === 0) {
+        throw new Error('Map not found');
+      }
+      
+      return await this.getMapById(mapId);
+    } catch (error) {
+      console.error('Error updating map:', error);
+      throw error;
+    }
+  }
+
+  /**
+   * Löscht eine Map (soft delete)
+   */
+  async deleteMap(mapId) {
+    try {
+      const [updatedRowsCount] = await TaxiMap.update(
+        { isActive: false },
+        { where: { id: mapId } }
+      );
+      
+      if (updatedRowsCount === 0) {
+        throw new Error('Map not found');
+      }
+      
+      return { success: true };
+    } catch (error) {
+      console.error('Error deleting map:', error);
+      throw error;
+    }
+  }
+
+  /**
+   * Setzt eine Map als Standard
+   */
+  async setDefaultMap(mapId) {
+    try {
+      // Entferne Standard-Status von allen anderen Maps
+      await TaxiMap.update(
+        { isDefault: false },
+        { where: { isDefault: true } }
+      );
+      
+      // Setze neue Standard-Map
+      const [updatedRowsCount] = await TaxiMap.update(
+        { isDefault: true },
+        { where: { id: mapId } }
+      );
+      
+      if (updatedRowsCount === 0) {
+        throw new Error('Map not found');
+      }
+      
+      return { success: true };
+    } catch (error) {
+      console.error('Error setting default map:', error);
+      throw error;
+    }
+  }
+
+  /**
+   * Initialisiert Standard-Map-Typen
+   */
+  async initializeMapTypes() {
+    try {
+      const mapTypes = [
+        { name: 'Corner Bottom Left', tileType: 'cornerBottomLeft', description: 'Bottom left corner tile' },
+        { name: 'Corner Bottom Right', tileType: 'cornerBottomRight', description: 'Bottom right corner tile' },
+        { name: 'Corner Top Left', tileType: 'cornerTopLeft', description: 'Top left corner tile' },
+        { name: 'Corner Top Right', tileType: 'cornerTopRight', description: 'Top right corner tile' },
+        { name: 'Horizontal', tileType: 'horizontal', description: 'Horizontal road tile' },
+        { name: 'Vertical', tileType: 'vertical', description: 'Vertical road tile' },
+        { name: 'Cross', tileType: 'cross', description: 'Cross intersection tile' },
+        { name: 'Fuel Horizontal', tileType: 'fuelHorizontal', description: 'Horizontal road with fuel station' },
+        { name: 'Fuel Vertical', tileType: 'fuelVertical', description: 'Vertical road with fuel station' },
+        { name: 'T-Left', tileType: 'tLeft', description: 'T-junction facing left' },
+        { name: 'T-Right', tileType: 'tRight', description: 'T-junction facing right' },
+        { name: 'T-Up', tileType: 'tUp', description: 'T-junction facing up' },
+        { name: 'T-Down', tileType: 'tDown', description: 'T-junction facing down' }
+      ];
+
+      for (const mapType of mapTypes) {
+        await TaxiMapType.findOrCreate({
+          where: { name: mapType.name },
+          defaults: mapType
+        });
+      }
+
+      console.log('Taxi map types initialized');
+    } catch (error) {
+      console.error('Error initializing map types:', error);
+      throw error;
+    }
+  }
+
+  /**
+   * Erstellt eine Standard-Map
+   */
+  async createDefaultMap() {
+    try {
+      // 8x8 Standard-Map mit verschiedenen Tile-Typen
+      const mapData = [
+        ['cornerTopLeft', 'horizontal', 'horizontal', 'horizontal', 'horizontal', 'horizontal', 'horizontal', 'cornerTopRight'],
+        ['vertical', 'cross', 'cross', 'cross', 'cross', 'cross', 'cross', 'vertical'],
+        ['vertical', 'cross', 'cross', 'cross', 'cross', 'cross', 'cross', 'vertical'],
+        ['vertical', 'cross', 'cross', 'cross', 'cross', 'cross', 'cross', 'vertical'],
+        ['vertical', 'cross', 'cross', 'cross', 'cross', 'cross', 'cross', 'vertical'],
+        ['vertical', 'cross', 'cross', 'cross', 'cross', 'cross', 'cross', 'vertical'],
+        ['vertical', 'cross', 'cross', 'cross', 'cross', 'cross', 'cross', 'vertical'],
+        ['cornerBottomLeft', 'horizontal', 'horizontal', 'horizontal', 'horizontal', 'horizontal', 'horizontal', 'cornerBottomRight']
+      ];
+
+      const map = await TaxiMap.create({
+        name: 'Standard City Map',
+        description: 'A standard 8x8 city map with roads and intersections',
+        width: 8,
+        height: 8,
+        tileSize: 50,
+        mapTypeId: 1, // Assuming first map type
+        mapData: mapData,
+        positionX: 1,
+        positionY: 1,
+        isDefault: true,
+        isActive: true
+      });
+
+      return map;
+    } catch (error) {
+      console.error('Error creating default map:', error);
+      throw error;
+    }
+  }
+}
+
+export default TaxiMapService;

backend/services/taxiService.js

@@ -0,0 +1,407 @@
+import BaseService from './BaseService.js';
+import TaxiGameState from '../models/taxi/taxiGameState.js';
+import TaxiLevelStats from '../models/taxi/taxiLevelStats.js';
+import User from '../models/community/user.js';
+
+class TaxiService extends BaseService {
+  constructor() {
+    super();
+  }
+
+  // Hilfsmethode: Konvertiere hashedId zu userId
+  async getUserIdFromHashedId(hashedUserId) {
+    const user = await User.findOne({ where: { hashedId: hashedUserId } });
+    if (!user) {
+      throw new Error('User not found');
+    }
+    return user.id;
+  }
+
+  // Spielstand abrufen
+  async getGameState(hashedUserId) {
+    try {
+      const userId = await this.getUserIdFromHashedId(hashedUserId);
+
+      let gameState = await TaxiGameState.findOne({
+        where: { userId }
+      });
+
+      if (!gameState) {
+        // Erstelle neuen Spielstand
+        gameState = await TaxiGameState.create({
+          userId,
+          currentLevel: 1,
+          totalScore: 0,
+          totalMoney: 0,
+          totalPassengersDelivered: 0,
+          unlockedLevels: [1],
+          achievements: [] 
+        });
+      }
+
+      return {
+        currentLevel: gameState.currentLevel,
+        totalScore: gameState.totalScore,
+        totalMoney: gameState.totalMoney,
+        totalPassengersDelivered: gameState.totalPassengersDelivered,
+        unlockedLevels: gameState.unlockedLevels,
+        achievements: gameState.achievements
+      };
+    } catch (error) {
+      console.error('Error getting taxi game state:', error);
+      throw error;
+    }
+  }
+
+  // Spielstand speichern
+  async saveGameState(hashedUserId, gameData) {
+    try {
+      const userId = await this.getUserIdFromHashedId(hashedUserId);
+      const { level, score, money, passengersDelivered, fuel } = gameData;
+
+      const [gameState, created] = await TaxiGameState.findOrCreate({
+        where: { userId },
+        defaults: {
+          userId,
+          currentLevel: level || 1,
+          totalScore: score || 0,
+          totalMoney: money || 0,
+          totalPassengersDelivered: passengersDelivered || 0,
+          unlockedLevels: [1],
+          achievements: []
+        }
+      });
+
+      if (!created) {
+        // Aktualisiere bestehenden Spielstand
+        await gameState.update({
+          currentLevel: Math.max(gameState.currentLevel, level || 1),
+          totalScore: Math.max(gameState.totalScore, score || 0),
+          totalMoney: Math.max(gameState.totalMoney, money || 0),
+          totalPassengersDelivered: Math.max(gameState.totalPassengersDelivered, passengersDelivered || 0)
+        });
+      }
+
+      return {
+        currentLevel: gameState.currentLevel,
+        totalScore: gameState.totalScore,
+        totalMoney: gameState.totalMoney,
+        totalPassengersDelivered: gameState.totalPassengersDelivered,
+        unlockedLevels: gameState.unlockedLevels,
+        achievements: gameState.achievements
+      };
+    } catch (error) {
+      console.error('Error saving taxi game state:', error);
+      throw error;
+    }
+  }
+
+  // Level-Statistiken abrufen
+  async getLevelStats(hashedUserId, level) {
+    try {
+      const userId = await this.getUserIdFromHashedId(hashedUserId);
+      const stats = await TaxiLevelStats.findOne({
+        where: { userId, level }
+      });
+
+      if (!stats) {
+        return {
+          level,
+          bestScore: 0,
+          bestMoney: 0,
+          bestPassengersDelivered: 0,
+          timesPlayed: 0,
+          completed: false
+        };
+      }
+
+      return {
+        level: stats.level,
+        bestScore: stats.bestScore,
+        bestMoney: stats.bestMoney,
+        bestPassengersDelivered: stats.bestPassengersDelivered,
+        timesPlayed: stats.timesPlayed,
+        completed: stats.completed
+      };
+    } catch (error) {
+      console.error('Error getting level stats:', error);
+      throw error;
+    }
+  }
+
+  // Bestenliste abrufen
+  async getLeaderboard(type = 'score', limit = 10) {
+    try {
+      let orderBy;
+      switch (type) {
+        case 'money':
+          orderBy = [['totalMoney', 'DESC']];
+          break;
+        case 'passengers':
+          orderBy = [['totalPassengersDelivered', 'DESC']];
+          break;
+        case 'level':
+          orderBy = [['currentLevel', 'DESC']];
+          break;
+        default:
+          orderBy = [['totalScore', 'DESC']];
+      }
+
+      const leaderboard = await TaxiGameState.findAll({
+        order: orderBy,
+        limit: parseInt(limit),
+        include: [{
+          model: User,
+          attributes: ['username', 'id']
+        }]
+      });
+
+      return leaderboard.map((entry, index) => ({
+        rank: index + 1,
+        username: entry.User.username,
+        userId: entry.User.id,
+        score: entry.totalScore,
+        money: entry.totalMoney,
+        passengers: entry.totalPassengersDelivered,
+        level: entry.currentLevel
+      }));
+    } catch (error) {
+      console.error('Error getting leaderboard:', error);
+      throw error;
+    }
+  }
+
+  // Spiel beenden und Punkte verarbeiten
+  async finishGame(hashedUserId, gameData) {
+    try {
+      const userId = await this.getUserIdFromHashedId(hashedUserId);
+      const { finalScore, finalMoney, passengersDelivered, level } = gameData;
+
+      // Aktualisiere Spielstand
+      const gameState = await this.saveGameState(userId, {
+        level,
+        score: finalScore,
+        money: finalMoney,
+        passengersDelivered
+      });
+
+      // Aktualisiere Level-Statistiken
+      await this.updateLevelStats(hashedUserId, level, {
+        score: finalScore,
+        money: finalMoney,
+        passengersDelivered
+      });
+
+      // Prüfe auf neue freigeschaltete Level
+      const newUnlockedLevels = await this.checkUnlockedLevels(hashedUserId, level);
+
+      // Prüfe auf neue Erfolge
+      const newAchievements = await this.checkAchievements(hashedUserId, gameState);
+
+      return {
+        gameState,
+        newUnlockedLevels,
+        newAchievements
+      };
+    } catch (error) {
+      console.error('Error finishing game:', error);
+      throw error;
+    }
+  }
+
+  // Level freischalten
+  async unlockLevel(hashedUserId, level) {
+    try {
+      const userId = await this.getUserIdFromHashedId(hashedUserId);
+      const gameState = await TaxiGameState.findOne({
+        where: { userId }
+      });
+
+      if (!gameState) {
+        throw new Error('Spielstand nicht gefunden');
+      }
+
+      const unlockedLevels = [...gameState.unlockedLevels];
+      if (!unlockedLevels.includes(level)) {
+        unlockedLevels.push(level);
+        unlockedLevels.sort((a, b) => a - b);
+
+        await gameState.update({
+          unlockedLevels
+        });
+      }
+
+      return { unlockedLevels };
+    } catch (error) {
+      console.error('Error unlocking level:', error);
+      throw error;
+    }
+  }
+
+  // Spieler-Statistiken abrufen
+  async getPlayerStats(hashedUserId) {
+    try {
+      const userId = await this.getUserIdFromHashedId(hashedUserId);
+      const gameState = await this.getGameState(hashedUserId);
+      const levelStats = await TaxiLevelStats.findAll({
+        where: { userId },
+        order: [['level', 'ASC']]
+      });
+
+      const totalLevelsPlayed = levelStats.length;
+      const completedLevels = levelStats.filter(stat => stat.completed).length;
+      const totalPlayTime = levelStats.reduce((sum, stat) => sum + (stat.playTime || 0), 0);
+
+      return {
+        ...gameState,
+        totalLevelsPlayed,
+        completedLevels,
+        totalPlayTime,
+        levelStats: levelStats.map(stat => ({
+          level: stat.level,
+          bestScore: stat.bestScore,
+          bestMoney: stat.bestMoney,
+          bestPassengersDelivered: stat.bestPassengersDelivered,
+          timesPlayed: stat.timesPlayed,
+          completed: stat.completed
+        }))
+      };
+    } catch (error) {
+      console.error('Error getting player stats:', error);
+      throw error;
+    }
+  }
+
+  // Level zurücksetzen
+  async resetLevel(hashedUserId, level) {
+    try {
+      const userId = await this.getUserIdFromHashedId(hashedUserId);
+      await TaxiLevelStats.destroy({
+        where: { userId, level }
+      });
+
+      return { success: true };
+    } catch (error) {
+      console.error('Error resetting level:', error);
+      throw error;
+    }
+  }
+
+  // Alle Spielstände zurücksetzen
+  async resetAllProgress(hashedUserId) {
+    try {
+      const userId = await this.getUserIdFromHashedId(hashedUserId);
+      await TaxiGameState.destroy({
+        where: { userId }
+      });
+
+      await TaxiLevelStats.destroy({
+        where: { userId }
+      });
+
+      return { success: true };
+    } catch (error) {
+      console.error('Error resetting all progress:', error);
+      throw error;
+    }
+  }
+
+  // Hilfsmethoden
+  async updateLevelStats(hashedUserId, level, stats) {
+    try {
+      const userId = await this.getUserIdFromHashedId(hashedUserId);
+      const { score, money, passengersDelivered } = stats;
+
+      const [levelStat, created] = await TaxiLevelStats.findOrCreate({
+        where: { userId, level },
+        defaults: {
+          userId,
+          level,
+          bestScore: score,
+          bestMoney: money,
+          bestPassengersDelivered: passengersDelivered,
+          timesPlayed: 1,
+          completed: true
+        }
+      });
+
+      if (!created) {
+        const updates = {
+          timesPlayed: levelStat.timesPlayed + 1,
+          completed: true
+        };
+
+        if (score > levelStat.bestScore) updates.bestScore = score;
+        if (money > levelStat.bestMoney) updates.bestMoney = money;
+        if (passengersDelivered > levelStat.bestPassengersDelivered) {
+          updates.bestPassengersDelivered = passengersDelivered;
+        }
+
+        await levelStat.update(updates);
+      }
+    } catch (error) {
+      console.error('Error updating level stats:', error);
+      throw error;
+    }
+  }
+
+  async checkUnlockedLevels(hashedUserId, currentLevel) {
+    try {
+      const userId = await this.getUserIdFromHashedId(hashedUserId);
+      const gameState = await TaxiGameState.findOne({
+        where: { userId }
+      });
+
+      if (!gameState) return [];
+
+      const newUnlockedLevels = [];
+      const nextLevel = currentLevel + 1;
+
+      if (!gameState.unlockedLevels.includes(nextLevel)) {
+        newUnlockedLevels.push(nextLevel);
+        await this.unlockLevel(hashedUserId, nextLevel);
+      }
+
+      return newUnlockedLevels;
+    } catch (error) {
+      console.error('Error checking unlocked levels:', error);
+      return [];
+    }
+  }
+
+  async checkAchievements(hashedUserId, gameState) {
+    try {
+      const userId = await this.getUserIdFromHashedId(hashedUserId);
+      const achievements = [];
+      const currentAchievements = gameState.achievements || [];
+
+      // Beispiel-Erfolge
+      if (gameState.totalScore >= 1000 && !currentAchievements.includes('score_1000')) {
+        achievements.push('score_1000');
+      }
+
+      if (gameState.totalPassengersDelivered >= 50 && !currentAchievements.includes('passengers_50')) {
+        achievements.push('passengers_50');
+      }
+
+      if (gameState.currentLevel >= 10 && !currentAchievements.includes('level_10')) {
+        achievements.push('level_10');
+      }
+
+      if (achievements.length > 0) {
+        const newAchievements = [...currentAchievements, ...achievements];
+        await TaxiGameState.update(
+          { achievements: newAchievements },
+          { where: { userId } }
+        );
+      }
+
+      return achievements;
+    } catch (error) {
+      console.error('Error checking achievements:', error);
+      return [];
+    }
+  }
+}
+
+export default TaxiService;

backend/utils/initializeTaxi.js

@@ -0,0 +1,29 @@
+// initializeTaxi.js
+
+import TaxiMapService from '../services/taxiMapService.js';
+
+const initializeTaxi = async () => {
+    try {
+        console.log('Initializing Taxi game data...');
+        
+        const taxiMapService = new TaxiMapService();
+        
+        // Initialisiere Map-Typen
+        console.log('Initializing taxi map types...');
+        await taxiMapService.initializeMapTypes();
+        
+        // Prüfe ob bereits eine Standard-Map existiert
+        const existingDefaultMap = await taxiMapService.getDefaultMap();
+        if (!existingDefaultMap) {
+            console.log('Creating default taxi map...');
+            await taxiMapService.createDefaultMap();
+        }
+        
+        console.log('Taxi game initialization complete.');
+    } catch (error) {
+        console.error('Error initializing Taxi game:', error);
+        throw error;
+    }
+};
+
+export default initializeTaxi;

backend/utils/sequelize.js

@@ -40,6 +40,7 @@ const createSchemas = async () => {
     await sequelize.query('CREATE SCHEMA IF NOT EXISTS falukant_log');
     await sequelize.query('CREATE SCHEMA IF NOT EXISTS chat');
     await sequelize.query('CREATE SCHEMA IF NOT EXISTS match3');
+    await sequelize.query('CREATE SCHEMA IF NOT EXISTS taxi');
 };
 
 const initializeDatabase = async () => {

backend/utils/syncDatabase.js

@@ -13,6 +13,7 @@ import initializeForum from './initializeForum.js';
 import initializeChat from './initializeChat.js';
 import initializeMatch3Data from './initializeMatch3.js';
 import updateExistingMatch3Levels from './updateExistingMatch3Levels.js';
+import initializeTaxi from './initializeTaxi.js';
 
 // Normale Synchronisation (nur bei STAGE=dev Schema-Updates)
 const syncDatabase = async () => {
@@ -70,6 +71,9 @@ const syncDatabase = async () => {
         console.log("Updating existing Match3 levels...");
         await updateExistingMatch3Levels();
 
+        console.log("Initializing Taxi...");
+        await initializeTaxi();
+
         console.log('Database synchronization complete.');
     } catch (error) {
         console.error('Unable to synchronize the database:', error);
@@ -85,19 +89,7 @@ const syncDatabaseForDeployment = async () => {
         console.log('✅ Deployment-Modus: Schema-Updates sind immer aktiviert');
 
         console.log("Initializing database schemas...");
-        // Nur Schemas erstellen, keine Model-Synchronisation
+        await initializeDatabase();
-        const { sequelize } = await import('./sequelize.js');
-        await sequelize.query('CREATE SCHEMA IF NOT EXISTS community');
-        await sequelize.query('CREATE SCHEMA IF NOT EXISTS logs');
-        await sequelize.query('CREATE SCHEMA IF NOT EXISTS type');
-        await sequelize.query('CREATE SCHEMA IF NOT EXISTS service');
-        await sequelize.query('CREATE SCHEMA IF NOT EXISTS forum');
-        await sequelize.query('CREATE SCHEMA IF NOT EXISTS falukant_data');
-        await sequelize.query('CREATE SCHEMA IF NOT EXISTS falukant_type');
-        await sequelize.query('CREATE SCHEMA IF NOT EXISTS falukant_predefine');
-        await sequelize.query('CREATE SCHEMA IF NOT EXISTS falukant_log');
-        await sequelize.query('CREATE SCHEMA IF NOT EXISTS chat');
-        await sequelize.query('CREATE SCHEMA IF NOT EXISTS match3');
 
         console.log("Synchronizing models with schema updates...");
         await syncModelsAlways(models);
@@ -137,6 +129,9 @@ const syncDatabaseForDeployment = async () => {
         console.log("Updating existing Match3 levels...");
         await updateExistingMatch3Levels();
 
+        console.log("Initializing Taxi...");
+        await initializeTaxi();
+
         console.log('Database synchronization for deployment complete.');
     } catch (error) {
         console.error('Unable to synchronize the database for deployment:', error);

frontend/public/images/taxi/car_blue.svg

@@ -0,0 +1,66 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="66.542mm"
+   height="131.97301mm"
+   viewBox="0 0 66.542 131.97301"
+   version="1.1"
+   id="svg957"
+   inkscape:version="1.1.1 (3bf5ae0d25, 2021-09-20)"
+   sodipodi:docname="car_blue.svg"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <sodipodi:namedview
+     id="namedview959"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:document-units="mm"
+     showgrid="false"
+     inkscape:zoom="0.56123737"
+     inkscape:cx="-285.97525"
+     inkscape:cy="560.36896"
+     inkscape:window-width="1920"
+     inkscape:window-height="1007"
+     inkscape:window-x="0"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer1" />
+  <defs
+     id="defs954" />
+  <g
+     inkscape:label="Ebene 1"
+     inkscape:groupmode="layer"
+     id="layer1">
+    <rect
+       style="fill:#2666ff;fill-opacity:1;fill-rule:evenodd;stroke:#000000;stroke-width:0.465391;stroke-miterlimit:3.3"
+       id="rect846"
+       width="131.50793"
+       height="66.076797"
+       x="-131.74063"
+       y="0.2326965"
+       transform="rotate(-90)" />
+    <rect
+       style="fill:#000000;fill-opacity:1;fill-rule:evenodd;stroke:#000000;stroke-width:0.479108;stroke-miterlimit:3.3"
+       id="rect1016"
+       width="15.774606"
+       height="66.096329"
+       x="-110.37288"
+       y="0.44752184"
+       transform="rotate(-90)" />
+    <rect
+       style="fill:#000000;fill-opacity:1;fill-rule:evenodd;stroke:#000000;stroke-width:0.480999;stroke-miterlimit:3.3"
+       id="rect1018"
+       width="22.247723"
+       height="65.980431"
+       x="-44.058758"
+       y="0.61777174"
+       transform="rotate(-90)" />
+  </g>
+</svg>

frontend/public/images/taxi/car_green.svg

@@ -0,0 +1,66 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="66.542mm"
+   height="131.97301mm"
+   viewBox="0 0 66.542 131.97301"
+   version="1.1"
+   id="svg957"
+   inkscape:version="1.1.1 (3bf5ae0d25, 2021-09-20)"
+   sodipodi:docname="car_green.svg"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <sodipodi:namedview
+     id="namedview959"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:document-units="mm"
+     showgrid="false"
+     inkscape:zoom="0.56123737"
+     inkscape:cx="-285.97525"
+     inkscape:cy="560.36896"
+     inkscape:window-width="1920"
+     inkscape:window-height="1009"
+     inkscape:window-x="1920"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer1" />
+  <defs
+     id="defs954" />
+  <g
+     inkscape:label="Ebene 1"
+     inkscape:groupmode="layer"
+     id="layer1">
+    <rect
+       style="fill:#008545;fill-opacity:1;fill-rule:evenodd;stroke:#000000;stroke-width:0.465391;stroke-miterlimit:3.3"
+       id="rect846"
+       width="131.50793"
+       height="66.076797"
+       x="-131.74063"
+       y="0.2326965"
+       transform="rotate(-90)" />
+    <rect
+       style="fill:#000000;fill-opacity:1;fill-rule:evenodd;stroke:#000000;stroke-width:0.479108;stroke-miterlimit:3.3"
+       id="rect1016"
+       width="15.774606"
+       height="66.096329"
+       x="-110.37288"
+       y="0.44752184"
+       transform="rotate(-90)" />
+    <rect
+       style="fill:#000000;fill-opacity:1;fill-rule:evenodd;stroke:#000000;stroke-width:0.480999;stroke-miterlimit:3.3"
+       id="rect1018"
+       width="22.247723"
+       height="65.980431"
+       x="-44.058758"
+       y="0.61777174"
+       transform="rotate(-90)" />
+  </g>
+</svg>

frontend/public/images/taxi/car_pink.svg

@@ -0,0 +1,66 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="66.542mm"
+   height="131.97301mm"
+   viewBox="0 0 66.542 131.97301"
+   version="1.1"
+   id="svg957"
+   inkscape:version="1.1.1 (3bf5ae0d25, 2021-09-20)"
+   sodipodi:docname="car_pink.svg"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <sodipodi:namedview
+     id="namedview959"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:document-units="mm"
+     showgrid="false"
+     inkscape:zoom="0.56123737"
+     inkscape:cx="-179.06862"
+     inkscape:cy="560.36896"
+     inkscape:window-width="1920"
+     inkscape:window-height="1009"
+     inkscape:window-x="1920"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer1" />
+  <defs
+     id="defs954" />
+  <g
+     inkscape:label="Ebene 1"
+     inkscape:groupmode="layer"
+     id="layer1">
+    <rect
+       style="fill:#ff469d;fill-opacity:1;fill-rule:evenodd;stroke:#000000;stroke-width:0.465391;stroke-miterlimit:3.3"
+       id="rect846"
+       width="131.50793"
+       height="66.076797"
+       x="-131.74063"
+       y="0.2326965"
+       transform="rotate(-90)" />
+    <rect
+       style="fill:#000000;fill-opacity:1;fill-rule:evenodd;stroke:#000000;stroke-width:0.479108;stroke-miterlimit:3.3"
+       id="rect1016"
+       width="15.774606"
+       height="66.096329"
+       x="-110.37288"
+       y="0.44752184"
+       transform="rotate(-90)" />
+    <rect
+       style="fill:#000000;fill-opacity:1;fill-rule:evenodd;stroke:#000000;stroke-width:0.480999;stroke-miterlimit:3.3"
+       id="rect1018"
+       width="22.247723"
+       height="65.980431"
+       x="-44.058758"
+       y="0.61777174"
+       transform="rotate(-90)" />
+  </g>
+</svg>

frontend/public/images/taxi/car_red.svg

@@ -0,0 +1,66 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="66.542mm"
+   height="131.97301mm"
+   viewBox="0 0 66.542 131.97301"
+   version="1.1"
+   id="svg957"
+   inkscape:version="1.1.1 (3bf5ae0d25, 2021-09-20)"
+   sodipodi:docname="car_red.svg"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <sodipodi:namedview
+     id="namedview959"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:document-units="mm"
+     showgrid="false"
+     inkscape:zoom="0.56123737"
+     inkscape:cx="-179.06862"
+     inkscape:cy="560.36896"
+     inkscape:window-width="1920"
+     inkscape:window-height="1009"
+     inkscape:window-x="1920"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer1" />
+  <defs
+     id="defs954" />
+  <g
+     inkscape:label="Ebene 1"
+     inkscape:groupmode="layer"
+     id="layer1">
+    <rect
+       style="fill:#cd0000;fill-opacity:1;fill-rule:evenodd;stroke:#000000;stroke-width:0.465391;stroke-miterlimit:3.3"
+       id="rect846"
+       width="131.50793"
+       height="66.076797"
+       x="-131.74063"
+       y="0.2326965"
+       transform="rotate(-90)" />
+    <rect
+       style="fill:#000000;fill-opacity:1;fill-rule:evenodd;stroke:#000000;stroke-width:0.479108;stroke-miterlimit:3.3"
+       id="rect1016"
+       width="15.774606"
+       height="66.096329"
+       x="-110.37288"
+       y="0.44752184"
+       transform="rotate(-90)" />
+    <rect
+       style="fill:#000000;fill-opacity:1;fill-rule:evenodd;stroke:#000000;stroke-width:0.480999;stroke-miterlimit:3.3"
+       id="rect1018"
+       width="22.247723"
+       height="65.980431"
+       x="-44.058758"
+       y="0.61777174"
+       transform="rotate(-90)" />
+  </g>
+</svg>

frontend/public/images/taxi/car_turquise.svg

@@ -0,0 +1,66 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="66.542mm"
+   height="131.97301mm"
+   viewBox="0 0 66.542 131.97301"
+   version="1.1"
+   id="svg957"
+   inkscape:version="1.1.1 (3bf5ae0d25, 2021-09-20)"
+   sodipodi:docname="car_turquise.svg"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <sodipodi:namedview
+     id="namedview959"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:document-units="mm"
+     showgrid="false"
+     inkscape:zoom="0.56123737"
+     inkscape:cx="-179.06862"
+     inkscape:cy="560.36896"
+     inkscape:window-width="1920"
+     inkscape:window-height="1009"
+     inkscape:window-x="1920"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer1" />
+  <defs
+     id="defs954" />
+  <g
+     inkscape:label="Ebene 1"
+     inkscape:groupmode="layer"
+     id="layer1">
+    <rect
+       style="fill:#1b8a80;fill-opacity:1;fill-rule:evenodd;stroke:#000000;stroke-width:0.465391;stroke-miterlimit:3.3"
+       id="rect846"
+       width="131.50793"
+       height="66.076797"
+       x="-131.74063"
+       y="0.2326965"
+       transform="rotate(-90)" />
+    <rect
+       style="fill:#000000;fill-opacity:1;fill-rule:evenodd;stroke:#000000;stroke-width:0.479108;stroke-miterlimit:3.3"
+       id="rect1016"
+       width="15.774606"
+       height="66.096329"
+       x="-110.37288"
+       y="0.44752184"
+       transform="rotate(-90)" />
+    <rect
+       style="fill:#000000;fill-opacity:1;fill-rule:evenodd;stroke:#000000;stroke-width:0.480999;stroke-miterlimit:3.3"
+       id="rect1018"
+       width="22.247723"
+       height="65.980431"
+       x="-44.058758"
+       y="0.61777174"
+       transform="rotate(-90)" />
+  </g>
+</svg>

frontend/public/images/taxi/cornerbottomleft.svg

@@ -0,0 +1,130 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="200mm"
+   height="200mm"
+   viewBox="0 0 200 200"
+   version="1.1"
+   id="svg5"
+   inkscape:version="1.1.1 (3bf5ae0d25, 2021-09-20)"
+   sodipodi:docname="cornerbottomleft.svg"
+   inkscape:export-filename="/home/torsten/Bilder/your-part/backgrounds/taxi/bottomright.png"
+   inkscape:export-xdpi="63.5"
+   inkscape:export-ydpi="63.5"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <sodipodi:namedview
+     id="namedview7"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:document-units="mm"
+     showgrid="false"
+     inkscape:zoom="1.1224747"
+     inkscape:cx="338.09225"
+     inkscape:cy="284.63893"
+     inkscape:window-width="1920"
+     inkscape:window-height="1009"
+     inkscape:window-x="1920"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer1" />
+  <defs
+     id="defs2" />
+  <g
+     inkscape:label="Ebene 1"
+     inkscape:groupmode="layer"
+     id="layer1">
+    <rect
+       style="fill:#008000;fill-rule:evenodd;stroke:none;stroke-width:0.698168;stroke-miterlimit:3.3"
+       id="rect846"
+       width="200"
+       height="200"
+       x="-200"
+       y="0"
+       transform="scale(-1,1)"
+       inkscape:export-filename="/home/torsten/Bilder/your-part/backgrounds/taxi/topleft.png"
+       inkscape:export-xdpi="63.5"
+       inkscape:export-ydpi="63.5" />
+    <rect
+       style="fill:#1a1a1a;fill-rule:evenodd;stroke:none;stroke-width:0.522164;stroke-miterlimit:3.3"
+       id="rect986"
+       width="125"
+       height="125"
+       x="-125"
+       y="74.999992"
+       ry="11.094693"
+       transform="scale(-1,1)"
+       inkscape:export-filename="/home/torsten/Bilder/your-part/backgrounds/taxi/topleft.png"
+       inkscape:export-xdpi="63.5"
+       inkscape:export-ydpi="63.5" />
+    <rect
+       style="fill:#1a1a1a;fill-rule:evenodd;stroke:none;stroke-width:1.22379;stroke-miterlimit:3.3"
+       id="rect1221"
+       width="42.689159"
+       height="30.09281"
+       x="-125"
+       y="169.9072"
+       ry="15.046405"
+       rx="0.23571429"
+       transform="scale(-1,1)"
+       inkscape:export-filename="/home/torsten/Bilder/your-part/backgrounds/taxi/topleft.png"
+       inkscape:export-xdpi="63.5"
+       inkscape:export-ydpi="63.5" />
+    <rect
+       style="fill:#1a1a1a;fill-rule:evenodd;stroke:none;stroke-width:1.35144;stroke-miterlimit:3.3"
+       id="rect1221-6"
+       width="42.689159"
+       height="36.697521"
+       x="-42.689163"
+       y="74.999992"
+       ry="18.348761"
+       rx="0.23571429"
+       transform="scale(-1,1)"
+       inkscape:export-filename="/home/torsten/Bilder/your-part/backgrounds/taxi/topleft.png"
+       inkscape:export-xdpi="63.5"
+       inkscape:export-ydpi="63.5" />
+    <rect
+       style="fill:#008000;fill-rule:evenodd;stroke:none;stroke-width:0.316859;stroke-miterlimit:3.3"
+       id="rect846-3-3"
+       width="46.820621"
+       height="43.675076"
+       x="-46.820633"
+       y="124.99999"
+       ry="0"
+       transform="scale(-1,1)"
+       inkscape:export-filename="/home/torsten/Bilder/your-part/backgrounds/taxi/topleft.png"
+       inkscape:export-xdpi="63.5"
+       inkscape:export-ydpi="63.5" />
+    <rect
+       style="fill:#008000;fill-rule:evenodd;stroke:none;stroke-width:0.315493;stroke-miterlimit:3.3"
+       id="rect846-3-3-5"
+       width="46.820621"
+       height="43.299355"
+       x="-75"
+       y="156.70062"
+       ry="0"
+       transform="scale(-1,1)"
+       inkscape:export-filename="/home/torsten/Bilder/your-part/backgrounds/taxi/topleft.png"
+       inkscape:export-xdpi="63.5"
+       inkscape:export-ydpi="63.5" />
+    <rect
+       style="fill:#008000;fill-rule:evenodd;stroke:none;stroke-width:0.261811;stroke-miterlimit:3.3"
+       id="rect846-3"
+       width="75"
+       height="75"
+       x="-75"
+       y="124.99999"
+       ry="8.2145042"
+       transform="scale(-1,1)"
+       inkscape:export-filename="/home/torsten/Bilder/your-part/backgrounds/taxi/topleft.png"
+       inkscape:export-xdpi="63.5"
+       inkscape:export-ydpi="63.5" />
+  </g>
+</svg>

frontend/public/images/taxi/cornerbottomright.svg

@@ -0,0 +1,99 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="200mm"
+   height="200mm"
+   viewBox="0 0 200 200"
+   version="1.1"
+   id="svg5"
+   inkscape:version="1.1.1 (3bf5ae0d25, 2021-09-20)"
+   sodipodi:docname="cornerbottomright.svg"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <sodipodi:namedview
+     id="namedview7"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:document-units="mm"
+     showgrid="false"
+     inkscape:zoom="1.1224747"
+     inkscape:cx="391.54557"
+     inkscape:cy="498.45221"
+     inkscape:window-width="1920"
+     inkscape:window-height="1009"
+     inkscape:window-x="1920"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer1" />
+  <defs
+     id="defs2" />
+  <g
+     inkscape:label="Ebene 1"
+     inkscape:groupmode="layer"
+     id="layer1">
+    <rect
+       style="fill:#008000;fill-rule:evenodd;stroke:none;stroke-width:0.698168;stroke-miterlimit:3.3"
+       id="rect846"
+       width="200"
+       height="200"
+       x="2.7755576e-17"
+       y="0" />
+    <rect
+       style="fill:#1a1a1a;fill-rule:evenodd;stroke:none;stroke-width:0.522164;stroke-miterlimit:3.3"
+       id="rect986"
+       width="125"
+       height="125"
+       x="75"
+       y="75"
+       ry="11.094693" />
+    <rect
+       style="fill:#1a1a1a;fill-rule:evenodd;stroke:none;stroke-width:1.22379;stroke-miterlimit:3.3"
+       id="rect1221"
+       width="42.689159"
+       height="30.09281"
+       x="75"
+       y="169.9072"
+       ry="15.046405"
+       rx="0.23571429" />
+    <rect
+       style="fill:#1a1a1a;fill-rule:evenodd;stroke:none;stroke-width:1.35144;stroke-miterlimit:3.3"
+       id="rect1221-6"
+       width="42.689159"
+       height="36.697521"
+       x="157.31084"
+       y="75"
+       ry="18.348761"
+       rx="0.23571429" />
+    <rect
+       style="fill:#008000;fill-rule:evenodd;stroke:none;stroke-width:0.316859;stroke-miterlimit:3.3"
+       id="rect846-3-3"
+       width="46.820621"
+       height="43.675076"
+       x="153.17937"
+       y="125"
+       ry="0" />
+    <rect
+       style="fill:#008000;fill-rule:evenodd;stroke:none;stroke-width:0.315493;stroke-miterlimit:3.3"
+       id="rect846-3-3-5"
+       width="46.820621"
+       height="43.299355"
+       x="125"
+       y="156.70064"
+       ry="0" />
+    <rect
+       style="fill:#008000;fill-rule:evenodd;stroke:none;stroke-width:0.261811;stroke-miterlimit:3.3"
+       id="rect846-3"
+       width="75"
+       height="75"
+       x="125"
+       y="125"
+       ry="8.2145042" />
+  </g>
+</svg>

frontend/public/images/taxi/cornertopleft.svg

@@ -0,0 +1,130 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="200mm"
+   height="200mm"
+   viewBox="0 0 200 200"
+   version="1.1"
+   id="svg5"
+   inkscape:version="1.1.1 (3bf5ae0d25, 2021-09-20)"
+   sodipodi:docname="cornertopleft.svg"
+   inkscape:export-filename="/home/torsten/Bilder/your-part/backgrounds/taxi/bottomright.png"
+   inkscape:export-xdpi="63.5"
+   inkscape:export-ydpi="63.5"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <sodipodi:namedview
+     id="namedview7"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:document-units="mm"
+     showgrid="false"
+     inkscape:zoom="1.1224747"
+     inkscape:cx="391.54557"
+     inkscape:cy="498.45221"
+     inkscape:window-width="1920"
+     inkscape:window-height="1009"
+     inkscape:window-x="1920"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer1" />
+  <defs
+     id="defs2" />
+  <g
+     inkscape:label="Ebene 1"
+     inkscape:groupmode="layer"
+     id="layer1">
+    <rect
+       style="fill:#008000;fill-rule:evenodd;stroke:none;stroke-width:0.698168;stroke-miterlimit:3.3"
+       id="rect846"
+       width="200"
+       height="200"
+       x="-200"
+       y="-200"
+       transform="scale(-1)"
+       inkscape:export-filename="/home/torsten/Bilder/your-part/backgrounds/taxi/topright.png"
+       inkscape:export-xdpi="63.5"
+       inkscape:export-ydpi="63.5" />
+    <rect
+       style="fill:#1a1a1a;fill-rule:evenodd;stroke:none;stroke-width:0.522164;stroke-miterlimit:3.3"
+       id="rect986"
+       width="125"
+       height="125"
+       x="-125"
+       y="-125.00001"
+       ry="11.094693"
+       transform="scale(-1)"
+       inkscape:export-filename="/home/torsten/Bilder/your-part/backgrounds/taxi/topright.png"
+       inkscape:export-xdpi="63.5"
+       inkscape:export-ydpi="63.5" />
+    <rect
+       style="fill:#1a1a1a;fill-rule:evenodd;stroke:none;stroke-width:1.22379;stroke-miterlimit:3.3"
+       id="rect1221"
+       width="42.689159"
+       height="30.09281"
+       x="-125"
+       y="-30.09281"
+       ry="15.046405"
+       rx="0.23571429"
+       transform="scale(-1)"
+       inkscape:export-filename="/home/torsten/Bilder/your-part/backgrounds/taxi/topright.png"
+       inkscape:export-xdpi="63.5"
+       inkscape:export-ydpi="63.5" />
+    <rect
+       style="fill:#1a1a1a;fill-rule:evenodd;stroke:none;stroke-width:1.35144;stroke-miterlimit:3.3"
+       id="rect1221-6"
+       width="42.689159"
+       height="36.697521"
+       x="-42.689163"
+       y="-125.00001"
+       ry="18.348761"
+       rx="0.23571429"
+       transform="scale(-1)"
+       inkscape:export-filename="/home/torsten/Bilder/your-part/backgrounds/taxi/topright.png"
+       inkscape:export-xdpi="63.5"
+       inkscape:export-ydpi="63.5" />
+    <rect
+       style="fill:#008000;fill-rule:evenodd;stroke:none;stroke-width:0.316859;stroke-miterlimit:3.3"
+       id="rect846-3-3"
+       width="46.820621"
+       height="43.675076"
+       x="-46.820633"
+       y="-75.000008"
+       ry="0"
+       transform="scale(-1)"
+       inkscape:export-filename="/home/torsten/Bilder/your-part/backgrounds/taxi/topright.png"
+       inkscape:export-xdpi="63.5"
+       inkscape:export-ydpi="63.5" />
+    <rect
+       style="fill:#008000;fill-rule:evenodd;stroke:none;stroke-width:0.315493;stroke-miterlimit:3.3"
+       id="rect846-3-3-5"
+       width="46.820621"
+       height="43.299355"
+       x="-75"
+       y="-43.29937"
+       ry="0"
+       transform="scale(-1)"
+       inkscape:export-filename="/home/torsten/Bilder/your-part/backgrounds/taxi/topright.png"
+       inkscape:export-xdpi="63.5"
+       inkscape:export-ydpi="63.5" />
+    <rect
+       style="fill:#008000;fill-rule:evenodd;stroke:none;stroke-width:0.261811;stroke-miterlimit:3.3"
+       id="rect846-3"
+       width="75"
+       height="75"
+       x="-75"
+       y="-75.000008"
+       ry="8.2145042"
+       transform="scale(-1)"
+       inkscape:export-filename="/home/torsten/Bilder/your-part/backgrounds/taxi/topright.png"
+       inkscape:export-xdpi="63.5"
+       inkscape:export-ydpi="63.5" />
+  </g>
+</svg>

frontend/public/images/taxi/cornertopright.svg

@@ -0,0 +1,109 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="200mm"
+   height="200mm"
+   viewBox="0 0 200 200"
+   version="1.1"
+   id="svg5"
+   inkscape:version="1.1.1 (3bf5ae0d25, 2021-09-20)"
+   sodipodi:docname="cornertopright.svg"
+   inkscape:export-filename="/home/torsten/Bilder/your-part/backgrounds/taxi/bottomright.png"
+   inkscape:export-xdpi="63.5"
+   inkscape:export-ydpi="63.5"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <sodipodi:namedview
+     id="namedview7"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:document-units="mm"
+     showgrid="false"
+     inkscape:zoom="1.1224747"
+     inkscape:cx="391.54557"
+     inkscape:cy="498.45221"
+     inkscape:window-width="1920"
+     inkscape:window-height="1009"
+     inkscape:window-x="1920"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer1" />
+  <defs
+     id="defs2" />
+  <g
+     inkscape:label="Ebene 1"
+     inkscape:groupmode="layer"
+     id="layer1">
+    <rect
+       style="fill:#008000;fill-rule:evenodd;stroke:none;stroke-width:0.698168;stroke-miterlimit:3.3"
+       id="rect846"
+       width="200"
+       height="200"
+       x="2.7755576e-17"
+       y="-200"
+       transform="scale(1,-1)" />
+    <rect
+       style="fill:#1a1a1a;fill-rule:evenodd;stroke:none;stroke-width:0.522164;stroke-miterlimit:3.3"
+       id="rect986"
+       width="125"
+       height="125"
+       x="75"
+       y="-125.00001"
+       ry="11.094693"
+       transform="scale(1,-1)" />
+    <rect
+       style="fill:#1a1a1a;fill-rule:evenodd;stroke:none;stroke-width:1.22379;stroke-miterlimit:3.3"
+       id="rect1221"
+       width="42.689159"
+       height="30.09281"
+       x="75"
+       y="-30.09281"
+       ry="15.046405"
+       rx="0.23571429"
+       transform="scale(1,-1)" />
+    <rect
+       style="fill:#1a1a1a;fill-rule:evenodd;stroke:none;stroke-width:1.35144;stroke-miterlimit:3.3"
+       id="rect1221-6"
+       width="42.689159"
+       height="36.697521"
+       x="157.31084"
+       y="-125.00001"
+       ry="18.348761"
+       rx="0.23571429"
+       transform="scale(1,-1)" />
+    <rect
+       style="fill:#008000;fill-rule:evenodd;stroke:none;stroke-width:0.316859;stroke-miterlimit:3.3"
+       id="rect846-3-3"
+       width="46.820621"
+       height="43.675076"
+       x="153.17937"
+       y="-75.000008"
+       ry="0"
+       transform="scale(1,-1)" />
+    <rect
+       style="fill:#008000;fill-rule:evenodd;stroke:none;stroke-width:0.315493;stroke-miterlimit:3.3"
+       id="rect846-3-3-5"
+       width="46.820621"
+       height="43.299355"
+       x="125"
+       y="-43.29937"
+       ry="0"
+       transform="scale(1,-1)" />
+    <rect
+       style="fill:#008000;fill-rule:evenodd;stroke:none;stroke-width:0.261811;stroke-miterlimit:3.3"
+       id="rect846-3"
+       width="75"
+       height="75"
+       x="125"
+       y="-75.000008"
+       ry="8.2145042"
+       transform="scale(1,-1)" />
+  </g>
+</svg>

frontend/public/images/taxi/cross.svg

@@ -0,0 +1,80 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="200mm"
+   height="200mm"
+   viewBox="0 0 200 200"
+   version="1.1"
+   id="svg5"
+   inkscape:version="1.1.1 (3bf5ae0d25, 2021-09-20)"
+   sodipodi:docname="cross.svg"
+   inkscape:export-filename="/home/torsten/Bilder/your-part/backgrounds/taxi/vertical.png"
+   inkscape:export-xdpi="63.5"
+   inkscape:export-ydpi="63.5"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <sodipodi:namedview
+     id="namedview7"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:document-units="mm"
+     showgrid="false"
+     inkscape:zoom="1.1224747"
+     inkscape:cx="391.54557"
+     inkscape:cy="427.18112"
+     inkscape:window-width="1920"
+     inkscape:window-height="1009"
+     inkscape:window-x="1920"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer1" />
+  <defs
+     id="defs2" />
+  <g
+     inkscape:label="Ebene 1"
+     inkscape:groupmode="layer"
+     id="layer1">
+    <rect
+       style="fill:#008000;fill-rule:evenodd;stroke:none;stroke-width:0.698168;stroke-miterlimit:3.3"
+       id="rect846"
+       width="200"
+       height="200"
+       x="-200"
+       y="-200"
+       transform="matrix(0,-1,-1,0,0,0)"
+       inkscape:export-filename="/home/torsten/Bilder/your-part/backgrounds/taxi/topleft.png"
+       inkscape:export-xdpi="63.5"
+       inkscape:export-ydpi="63.5" />
+    <rect
+       style="fill:#1a1a1a;fill-rule:evenodd;stroke:none;stroke-width:0.417731;stroke-miterlimit:3.3"
+       id="rect986"
+       width="200"
+       height="50"
+       x="-200"
+       y="-125"
+       ry="0"
+       transform="matrix(0,-1,-1,0,0,0)"
+       inkscape:export-filename="/home/torsten/Bilder/your-part/backgrounds/taxi/topleft.png"
+       inkscape:export-xdpi="63.5"
+       inkscape:export-ydpi="63.5" />
+    <rect
+       style="fill:#1a1a1a;fill-rule:evenodd;stroke:none;stroke-width:0.417731;stroke-miterlimit:3.3"
+       id="rect986-6"
+       width="200"
+       height="50"
+       x="0"
+       y="-125"
+       ry="0"
+       transform="scale(1,-1)"
+       inkscape:export-filename="/home/torsten/Bilder/your-part/backgrounds/taxi/topleft.png"
+       inkscape:export-xdpi="63.5"
+       inkscape:export-ydpi="63.5" />
+  </g>
+</svg>

frontend/public/images/taxi/fuelhorizontal.svg

@@ -0,0 +1,166 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="200mm"
+   height="200mm"
+   viewBox="0 0 200 200"
+   version="1.1"
+   id="svg5"
+   inkscape:version="1.1.1 (3bf5ae0d25, 2021-09-20)"
+   sodipodi:docname="fuelhorizontal.svg"
+   inkscape:export-filename="/home/torsten/Bilder/your-part/backgrounds/taxi/ttop.png"
+   inkscape:export-xdpi="63.5"
+   inkscape:export-ydpi="63.5"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <sodipodi:namedview
+     id="namedview7"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:document-units="mm"
+     showgrid="false"
+     inkscape:zoom="0.79370947"
+     inkscape:cx="299.22788"
+     inkscape:cy="403.80015"
+     inkscape:window-width="1920"
+     inkscape:window-height="1009"
+     inkscape:window-x="1920"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="g14769"
+     width="200mm" />
+  <defs
+     id="defs2" />
+  <g
+     inkscape:label="Ebene 1"
+     inkscape:groupmode="layer"
+     id="layer1">
+    <g
+       id="g15000">
+      <rect
+         style="fill:#008000;fill-rule:evenodd;stroke:none;stroke-width:0.698168;stroke-miterlimit:3.3"
+         id="rect846"
+         width="200"
+         height="200"
+         x="-200"
+         y="0"
+         inkscape:export-filename="/home/torsten/Bilder/your-part/backgrounds/taxi/topleft.png"
+         inkscape:export-xdpi="63.5"
+         inkscape:export-ydpi="63.5"
+         transform="rotate(-90)" />
+      <rect
+         style="fill:#1a1a1a;fill-rule:evenodd;stroke:none;stroke-width:0.157815;stroke-miterlimit:3.3"
+         id="rect986"
+         width="78.26664"
+         height="18.236031"
+         x="-45.734962"
+         y="73.212212"
+         ry="0"
+         inkscape:export-filename="/home/torsten/Bilder/your-part/backgrounds/taxi/tbottom.png"
+         inkscape:export-xdpi="63.5"
+         inkscape:export-ydpi="63.5"
+         transform="matrix(0.86824353,-0.49613826,0.66053269,0.75079729,0,0)" />
+      <rect
+         style="fill:#1a1a1a;fill-rule:evenodd;stroke:none;stroke-width:0.157816;stroke-miterlimit:3.3"
+         id="rect986-2"
+         width="78.266777"
+         height="18.236101"
+         x="-197.8062"
+         y="-27.279419"
+         ry="0"
+         inkscape:export-filename="/home/torsten/Bilder/your-part/backgrounds/taxi/tbottom.png"
+         inkscape:export-xdpi="63.5"
+         inkscape:export-ydpi="63.5"
+         transform="matrix(-0.86824205,-0.49614084,-0.66053013,0.75079954,0,0)" />
+      <rect
+         style="fill:#1a1a1a;fill-rule:evenodd;stroke:none;stroke-width:0.417732;stroke-miterlimit:3.3"
+         id="rect986-6"
+         width="200"
+         height="50"
+         x="-200"
+         y="-125"
+         ry="0"
+         transform="scale(-1)"
+         inkscape:export-filename="/home/torsten/Bilder/your-part/backgrounds/taxi/topleft.png"
+         inkscape:export-xdpi="63.5"
+         inkscape:export-ydpi="63.5" />
+      <rect
+         style="fill:#1a1a1a;fill-rule:evenodd;stroke:none;stroke-width:0.127179;stroke-miterlimit:3.3"
+         id="rect986-6-1"
+         width="45.189426"
+         height="20.511456"
+         x="-121.78027"
+         y="-59.338455"
+         ry="0"
+         transform="scale(-1)"
+         inkscape:export-filename="/home/torsten/Bilder/your-part/backgrounds/taxi/topleft.png"
+         inkscape:export-xdpi="63.5"
+         inkscape:export-ydpi="63.5" />
+      <g
+         id="g14862">
+        <path
+           style="fill:none;fill-rule:evenodd;stroke:#000000;stroke-width:0.194838px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+           d="m 130.33628,11.426511 c 0,0 0.33707,0.512496 0.50155,0.771355 0.13496,0.212401 0.27766,0.420492 0.39816,0.641417 0.14074,0.258031 0.24505,0.53449 0.37805,0.796591 0.12995,0.256086 0.28028,0.501493 0.41005,0.757668 0.11219,0.221453 0.21972,0.445458 0.31839,0.673254 0.1137,0.262489 0.22318,0.527348 0.31494,0.798289 0.0953,0.28146 0.18104,0.567026 0.24405,0.857432 0.0697,0.321297 0.14741,0.97524 0.14741,0.97524 v 0 c 0,0 -0.0508,0.623767 -0.0987,0.932723 -0.058,0.374029 -0.13406,0.745697 -0.22788,1.11238 -0.089,0.34795 -0.20736,0.687775 -0.31727,1.029702 -0.13665,0.425112 -0.27816,0.848705 -0.42537,1.270275 -0.15727,0.450359 -0.31167,0.90211 -0.48911,1.344908 -0.15378,0.383734 -0.32793,0.759028 -0.4983,1.135687 -0.19915,0.440274 -0.61235,1.313977 -0.61235,1.313977"
+           id="path11082"
+           sodipodi:nodetypes="caaaaaaacaaaaaaac" />
+        <path
+           id="rect848"
+           style="fill:#808000;fill-rule:evenodd;stroke:#000000;stroke-width:0.1;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+           d="m 120.62148,7.9679532 h 7.80968 c 1.11877,0 2.02017,0.9006707 2.01944,2.0194407 l -0.0659,24.6965811 -1.95357,0.03899 h -7.80968 c -1.11877,0 -2.01944,-0.01573 -2.01944,-0.01573 V 9.9873939 c 0,-1.1187702 0.90067,-2.0194407 2.01944,-2.0194407 z"
+           sodipodi:nodetypes="sssccscsss" />
+      </g>
+      <g
+         id="g14764">
+        <g
+           id="g14820">
+          <rect
+             style="fill:#000000;fill-rule:evenodd;stroke:#000000;stroke-width:0.1;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+             id="rect2409"
+             width="7.9378052"
+             height="2.4928758"
+             x="119.64509"
+             y="10.18909" />
+          <text
+             xml:space="preserve"
+             style="font-style:normal;font-weight:normal;font-size:2.82222px;line-height:125%;font-family:sans-serif;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;stroke-width:0.264583px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+             x="121.62167"
+             y="12.491911"
+             id="text4107"><tspan
+               sodipodi:role="line"
+               id="tspan4105"
+               style="font-size:2.82222px;fill:#ffffff;stroke-width:0.264583px"
+               x="121.62167"
+               y="12.491911">58,2</tspan></text>
+        </g>
+      </g>
+      <g
+         id="g14769">
+        <rect
+           style="fill:#000000;fill-rule:evenodd;stroke:#000000;stroke-width:0.1;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+           id="rect2409-3"
+           width="7.9378052"
+           height="2.4928758"
+           x="119.64509"
+           y="14.269464" />
+        <text
+           xml:space="preserve"
+           style="font-style:normal;font-weight:normal;font-size:2.82222px;line-height:125%;font-family:sans-serif;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;stroke-width:0.264583px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+           x="121.62168"
+           y="16.572287"
+           id="text4107-6"><tspan
+             sodipodi:role="line"
+             id="tspan4105-7"
+             style="font-size:2.82222px;fill:#ffffff;stroke-width:0.264583px"
+             x="121.62168"
+             y="16.572287">47,3</tspan></text>
+      </g>
+    </g>
+  </g>
+</svg>

frontend/public/images/taxi/fuelvertical.svg

@@ -0,0 +1,183 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="200mm"
+   height="200mm"
+   viewBox="0 0 200 200"
+   version="1.1"
+   id="svg5"
+   inkscape:version="1.1.1 (3bf5ae0d25, 2021-09-20)"
+   sodipodi:docname="fuelvertical.svg"
+   inkscape:export-filename="/home/torsten/Bilder/your-part/backgrounds/taxi/ttop.png"
+   inkscape:export-xdpi="63.5"
+   inkscape:export-ydpi="63.5"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <sodipodi:namedview
+     id="namedview7"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:document-units="mm"
+     showgrid="false"
+     inkscape:zoom="3.1748379"
+     inkscape:cx="654.99407"
+     inkscape:cy="374.34982"
+     inkscape:window-width="1920"
+     inkscape:window-height="1009"
+     inkscape:window-x="1920"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="g15167"
+     width="200mm" />
+  <defs
+     id="defs2" />
+  <g
+     inkscape:label="Ebene 1"
+     inkscape:groupmode="layer"
+     id="layer1">
+    <g
+       id="g15000"
+       transform="rotate(90,100,100)">
+      <rect
+         style="fill:#008000;fill-rule:evenodd;stroke:none;stroke-width:0.698168;stroke-miterlimit:3.3"
+         id="rect846"
+         width="200"
+         height="200"
+         x="-200"
+         y="0"
+         inkscape:export-filename="/home/torsten/Bilder/your-part/backgrounds/taxi/topleft.png"
+         inkscape:export-xdpi="63.5"
+         inkscape:export-ydpi="63.5"
+         transform="rotate(-90)" />
+      <rect
+         style="fill:#1a1a1a;fill-rule:evenodd;stroke:none;stroke-width:0.157815;stroke-miterlimit:3.3"
+         id="rect986"
+         width="78.26664"
+         height="18.236031"
+         x="-45.734962"
+         y="73.212212"
+         ry="0"
+         inkscape:export-filename="/home/torsten/Bilder/your-part/backgrounds/taxi/tbottom.png"
+         inkscape:export-xdpi="63.5"
+         inkscape:export-ydpi="63.5"
+         transform="matrix(0.86824353,-0.49613826,0.66053269,0.75079729,0,0)" />
+      <rect
+         style="fill:#1a1a1a;fill-rule:evenodd;stroke:none;stroke-width:0.157816;stroke-miterlimit:3.3"
+         id="rect986-2"
+         width="78.266777"
+         height="18.236101"
+         x="-197.8062"
+         y="-27.279419"
+         ry="0"
+         inkscape:export-filename="/home/torsten/Bilder/your-part/backgrounds/taxi/tbottom.png"
+         inkscape:export-xdpi="63.5"
+         inkscape:export-ydpi="63.5"
+         transform="matrix(-0.86824205,-0.49614084,-0.66053013,0.75079954,0,0)" />
+      <rect
+         style="fill:#1a1a1a;fill-rule:evenodd;stroke:none;stroke-width:0.417732;stroke-miterlimit:3.3"
+         id="rect986-6"
+         width="200"
+         height="50"
+         x="-200"
+         y="-125"
+         ry="0"
+         transform="scale(-1)"
+         inkscape:export-filename="/home/torsten/Bilder/your-part/backgrounds/taxi/topleft.png"
+         inkscape:export-xdpi="63.5"
+         inkscape:export-ydpi="63.5" />
+      <rect
+         style="fill:#1a1a1a;fill-rule:evenodd;stroke:none;stroke-width:0.127179;stroke-miterlimit:3.3"
+         id="rect986-6-1"
+         width="45.189426"
+         height="20.511456"
+         x="-121.78027"
+         y="-59.338455"
+         ry="0"
+         transform="scale(-1)"
+         inkscape:export-filename="/home/torsten/Bilder/your-part/backgrounds/taxi/topleft.png"
+         inkscape:export-xdpi="63.5"
+         inkscape:export-ydpi="63.5" />
+      <g
+         id="g14862" />
+      <g
+         id="g14764">
+        <g
+           id="g14820" />
+      </g>
+      <g
+         id="g14769">
+        <g
+           id="g15167">
+          <g
+             id="g14862-3"
+             transform="rotate(-90,113.96513,37.337594)">
+            <path
+               style="fill:none;fill-rule:evenodd;stroke:#000000;stroke-width:0.194838px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+               d="m 130.33628,11.426511 c 0,0 0.33707,0.512496 0.50155,0.771355 0.13496,0.212401 0.27766,0.420492 0.39816,0.641417 0.14074,0.258031 0.24505,0.53449 0.37805,0.796591 0.12995,0.256086 0.28028,0.501493 0.41005,0.757668 0.11219,0.221453 0.21972,0.445458 0.31839,0.673254 0.1137,0.262489 0.22318,0.527348 0.31494,0.798289 0.0953,0.28146 0.18104,0.567026 0.24405,0.857432 0.0697,0.321297 0.14741,0.97524 0.14741,0.97524 v 0 c 0,0 -0.0508,0.623767 -0.0987,0.932723 -0.058,0.374029 -0.13406,0.745697 -0.22788,1.11238 -0.089,0.34795 -0.20736,0.687775 -0.31727,1.029702 -0.13665,0.425112 -0.27816,0.848705 -0.42537,1.270275 -0.15727,0.450359 -0.31167,0.90211 -0.48911,1.344908 -0.15378,0.383734 -0.32793,0.759028 -0.4983,1.135687 -0.19915,0.440274 -0.61235,1.313977 -0.61235,1.313977"
+               id="path11082"
+               sodipodi:nodetypes="caaaaaaacaaaaaaac" />
+            <path
+               id="rect848"
+               style="fill:#808000;fill-rule:evenodd;stroke:#000000;stroke-width:0.1;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+               d="m 120.62148,7.9679532 h 7.80968 c 1.11877,0 2.02017,0.9006707 2.01944,2.0194407 l -0.0659,24.6965811 -1.95357,0.03899 h -7.80968 c -1.11877,0 -2.01944,-0.01573 -2.01944,-0.01573 V 9.9873939 c 0,-1.1187702 0.90067,-2.0194407 2.01944,-2.0194407 z"
+               sodipodi:nodetypes="sssccscsss" />
+          </g>
+          <g
+             id="g14764-6"
+             transform="rotate(-90,113.96513,37.337594)">
+            <g
+               id="g14820-7">
+              <rect
+                 style="fill:#000000;fill-rule:evenodd;stroke:#000000;stroke-width:0.1;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+                 id="rect2409"
+                 width="7.9378052"
+                 height="2.4928758"
+                 x="119.64509"
+                 y="10.18909" />
+              <text
+                 xml:space="preserve"
+                 style="font-style:normal;font-weight:normal;font-size:2.82222px;line-height:125%;font-family:sans-serif;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;stroke-width:0.264583px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+                 x="121.62167"
+                 y="12.491911"
+                 id="text4107"><tspan
+                   sodipodi:role="line"
+                   id="tspan4105"
+                   style="font-size:2.82222px;fill:#ffffff;stroke-width:0.264583px"
+                   x="121.62167"
+                   y="12.491911">58,2</tspan></text>
+            </g>
+          </g>
+          <g
+             id="g14769-5"
+             transform="rotate(-90,113.96513,37.337594)">
+            <rect
+               style="fill:#000000;fill-rule:evenodd;stroke:#000000;stroke-width:0.1;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+               id="rect2409-3"
+               width="7.9378052"
+               height="2.4928758"
+               x="119.64509"
+               y="14.269464" />
+            <text
+               xml:space="preserve"
+               style="font-style:normal;font-weight:normal;font-size:2.82222px;line-height:125%;font-family:sans-serif;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;stroke-width:0.264583px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+               x="121.62168"
+               y="16.572287"
+               id="text4107-6"><tspan
+                 sodipodi:role="line"
+                 id="tspan4105-7"
+                 style="font-size:2.82222px;fill:#ffffff;stroke-width:0.264583px"
+                 x="121.62168"
+                 y="16.572287">47,3</tspan></text>
+          </g>
+        </g>
+      </g>
+    </g>
+  </g>
+</svg>

frontend/public/images/taxi/horizontal.svg

@@ -0,0 +1,69 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="200mm"
+   height="200mm"
+   viewBox="0 0 200 200"
+   version="1.1"
+   id="svg5"
+   inkscape:version="1.1.1 (3bf5ae0d25, 2021-09-20)"
+   sodipodi:docname="horizontal.svg"
+   inkscape:export-filename="/home/torsten/Bilder/your-part/backgrounds/taxi/bottomright.png"
+   inkscape:export-xdpi="63.5"
+   inkscape:export-ydpi="63.5"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <sodipodi:namedview
+     id="namedview7"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:document-units="mm"
+     showgrid="false"
+     inkscape:zoom="1.1224747"
+     inkscape:cx="391.54557"
+     inkscape:cy="498.45221"
+     inkscape:window-width="1920"
+     inkscape:window-height="1009"
+     inkscape:window-x="1920"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer1"
+     width="200mm" />
+  <defs
+     id="defs2" />
+  <g
+     inkscape:label="Ebene 1"
+     inkscape:groupmode="layer"
+     id="layer1">
+    <rect
+       style="fill:#008000;fill-rule:evenodd;stroke:none;stroke-width:0.698168;stroke-miterlimit:3.3"
+       id="rect846"
+       width="200"
+       height="200"
+       x="-200"
+       y="0"
+       transform="scale(-1,1)"
+       inkscape:export-filename="/home/torsten/Bilder/your-part/backgrounds/taxi/topleft.png"
+       inkscape:export-xdpi="63.5"
+       inkscape:export-ydpi="63.5" />
+    <rect
+       style="fill:#1a1a1a;fill-rule:evenodd;stroke:none;stroke-width:0.417731;stroke-miterlimit:3.3"
+       id="rect986"
+       width="200"
+       height="50"
+       x="-200"
+       y="74.999992"
+       ry="0"
+       transform="scale(-1,1)"
+       inkscape:export-filename="/home/torsten/Bilder/your-part/backgrounds/taxi/topleft.png"
+       inkscape:export-xdpi="63.5"
+       inkscape:export-ydpi="63.5" />
+  </g>
+</svg>

frontend/public/images/taxi/house.svg

@@ -0,0 +1,110 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="172.62199mm"
+   height="127.52mm"
+   viewBox="0 0 172.62199 127.52"
+   version="1.1"
+   id="svg3326"
+   inkscape:version="1.1.1 (3bf5ae0d25, 2021-09-20)"
+   sodipodi:docname="house.svg"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <sodipodi:namedview
+     id="namedview3328"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:document-units="mm"
+     showgrid="false"
+     inkscape:zoom="0.56123737"
+     inkscape:cx="396.44545"
+     inkscape:cy="560.36896"
+     inkscape:window-width="1920"
+     inkscape:window-height="1009"
+     inkscape:window-x="1920"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer1" />
+  <defs
+     id="defs3323">
+    <inkscape:path-effect
+       effect="perspective-envelope"
+       up_left_point="8.320787,0.25230885"
+       up_right_point="166.09079,0.24051385"
+       down_left_point="0.32078701,27.642309"
+       down_right_point="172.32079,27.652309"
+       id="path-effect3698"
+       is_visible="true"
+       lpeversion="1"
+       deform_type="perspective"
+       horizontal_mirror="false"
+       vertical_mirror="false"
+       overflow_perspective="false" />
+  </defs>
+  <g
+     inkscape:label="Ebene 1"
+     inkscape:groupmode="layer"
+     id="layer1">
+    <rect
+       style="fill:#e3dbde;fill-rule:evenodd;stroke:#000000;stroke-width:0.494778;stroke-miterlimit:3.3;stroke-dasharray:none;stroke-opacity:1"
+       id="rect3409"
+       width="159.50522"
+       height="99.505219"
+       x="6.5681777"
+       y="-127.14492"
+       transform="scale(1,-1)" />
+    <path
+       style="fill:#ac595e;fill-opacity:1;fill-rule:evenodd;stroke:#000000;stroke-width:0.480999;stroke-miterlimit:3.3;stroke-dasharray:none;stroke-opacity:1"
+       id="rect3597"
+       width="157.72784"
+       height="27.411638"
+       x="8.3635254"
+       y="0.24051346"
+       ry="0"
+       inkscape:path-effect="#path-effect3698"
+       d="m 8.320787,0.25230885 157.770003,-0.011795 6.23,27.41179515 -172.00000299,-0.01 z"
+       sodipodi:type="rect" />
+    <rect
+       style="fill:#241c1c;fill-opacity:1;fill-rule:evenodd;stroke:#000000;stroke-width:0.357629;stroke-miterlimit:3.3;stroke-dasharray:none;stroke-opacity:1"
+       id="rect7790"
+       width="20.724756"
+       height="46.306629"
+       x="124.69867"
+       y="81.034317" />
+    <rect
+       style="fill:#241c1c;fill-opacity:1;fill-rule:evenodd;stroke:#000000;stroke-width:0.480999;stroke-miterlimit:3.3;stroke-dasharray:none;stroke-opacity:1"
+       id="rect7894"
+       width="41.166904"
+       height="17.668142"
+       x="107.70421"
+       y="42.471615" />
+    <rect
+       style="fill:#241c1c;fill-opacity:1;fill-rule:evenodd;stroke:#000000;stroke-width:0.480999;stroke-miterlimit:3.3;stroke-dasharray:none;stroke-opacity:1"
+       id="rect7896"
+       width="59.978352"
+       height="17.419277"
+       x="11.827881"
+       y="42.471615" />
+    <rect
+       style="fill:#241c1c;fill-opacity:1;fill-rule:evenodd;stroke:#000000;stroke-width:0.480999;stroke-miterlimit:3.3;stroke-dasharray:none;stroke-opacity:1"
+       id="rect7898"
+       width="41.76862"
+       height="18.292213"
+       x="11.827881"
+       y="81.096001" />
+    <rect
+       style="fill:#241c1c;fill-opacity:1;fill-rule:evenodd;stroke:#000000;stroke-width:0.480999;stroke-miterlimit:3.3;stroke-dasharray:none;stroke-opacity:1"
+       id="rect7900"
+       width="28.363632"
+       height="18.870781"
+       x="76.911842"
+       y="81.096001" />
+  </g>
+</svg>

frontend/public/images/taxi/map-cornerbottomleft.svg

@@ -0,0 +1,72 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="50"
+   height="50"
+   viewBox="0 0 13.229167 13.229167"
+   version="1.1"
+   id="svg5"
+   sodipodi:docname="map-bornerbottomleft.svg"
+   inkscape:version="1.1.1 (3bf5ae0d25, 2021-09-20)"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <sodipodi:namedview
+     id="namedview7"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:document-units="mm"
+     showgrid="false"
+     width="50mm"
+     units="px"
+     inkscape:zoom="8.979798"
+     inkscape:cx="48.163667"
+     inkscape:cy="39.477503"
+     inkscape:window-width="1920"
+     inkscape:window-height="1009"
+     inkscape:window-x="1920"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer1" />
+  <defs
+     id="defs2" />
+  <g
+     inkscape:label="Ebene 1"
+     inkscape:groupmode="layer"
+     id="layer1">
+    <rect
+       style="fill:#000000;fill-rule:evenodd;stroke:#000000;stroke-width:0.140806"
+       id="rect13257"
+       width="13.088361"
+       height="4.8862772"
+       x="0.07040292"
+       y="0.07040292" />
+    <rect
+       style="fill:#000000;fill-rule:evenodd;stroke:#000000;stroke-width:0.0869811"
+       id="rect13257-6"
+       width="4.9401021"
+       height="4.9401021"
+       x="0.043490551"
+       y="8.245574" />
+    <rect
+       style="fill:#000000;fill-rule:evenodd;stroke:#000000;stroke-width:0.140806"
+       id="rect13257-7"
+       width="4.8862777"
+       height="13.088361"
+       x="8.2724867"
+       y="0.043944586" />
+    <rect
+       style="fill:#000000;fill-rule:evenodd;stroke:#000000;stroke-width:0.0869811"
+       id="rect13257-5"
+       width="4.9401021"
+       height="4.9401021"
+       x="8.245574"
+       y="0.043490551" />
+  </g>
+</svg>

frontend/public/images/taxi/map-cornerbottomright.svg

@@ -0,0 +1,72 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="50"
+   height="50"
+   viewBox="0 0 13.229167 13.229167"
+   version="1.1"
+   id="svg5"
+   sodipodi:docname="map-bornerbottomrigh.svg"
+   inkscape:version="1.1.1 (3bf5ae0d25, 2021-09-20)"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <sodipodi:namedview
+     id="namedview7"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:document-units="mm"
+     showgrid="false"
+     width="50mm"
+     units="px"
+     inkscape:zoom="8.979798"
+     inkscape:cx="48.163667"
+     inkscape:cy="39.477503"
+     inkscape:window-width="1920"
+     inkscape:window-height="1009"
+     inkscape:window-x="1920"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer1" />
+  <defs
+     id="defs2" />
+  <g
+     inkscape:label="Ebene 1"
+     inkscape:groupmode="layer"
+     id="layer1">
+    <rect
+       style="fill:#000000;fill-rule:evenodd;stroke:#000000;stroke-width:0.140806"
+       id="rect13257"
+       width="13.088361"
+       height="4.8862772"
+       x="0.07040292"
+       y="0.07040292" />
+    <rect
+       style="fill:#000000;fill-rule:evenodd;stroke:#000000;stroke-width:0.140806"
+       id="rect13257-6"
+       width="4.8862777"
+       height="13.088361"
+       x="0.07040292"
+       y="0.07040292" />
+    <rect
+       style="fill:#000000;fill-rule:evenodd;stroke:#000000;stroke-width:0.0869811"
+       id="rect13257-7"
+       width="4.9401021"
+       height="4.9401021"
+       x="8.245574"
+       y="8.245574" />
+    <rect
+       style="fill:#000000;fill-rule:evenodd;stroke:#000000;stroke-width:0.0869811"
+       id="rect13257-5"
+       width="4.9401021"
+       height="4.9401021"
+       x="8.245574"
+       y="0.043490551" />
+  </g>
+</svg>

frontend/public/images/taxi/map-cornertopleft.svg

@@ -0,0 +1,72 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="50"
+   height="50"
+   viewBox="0 0 13.229167 13.229167"
+   version="1.1"
+   id="svg5"
+   sodipodi:docname="map-bornertopleft.svg"
+   inkscape:version="1.1.1 (3bf5ae0d25, 2021-09-20)"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <sodipodi:namedview
+     id="namedview7"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:document-units="mm"
+     showgrid="false"
+     width="50mm"
+     units="px"
+     inkscape:zoom="8.979798"
+     inkscape:cx="48.163667"
+     inkscape:cy="39.477503"
+     inkscape:window-width="1920"
+     inkscape:window-height="1009"
+     inkscape:window-x="1920"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer1" />
+  <defs
+     id="defs2" />
+  <g
+     inkscape:label="Ebene 1"
+     inkscape:groupmode="layer"
+     id="layer1">
+    <rect
+       style="fill:#000000;fill-rule:evenodd;stroke:#000000;stroke-width:0.0869811"
+       id="rect13257"
+       width="4.9401021"
+       height="4.9401021"
+       x="0.043490551"
+       y="0.043490551" />
+    <rect
+       style="fill:#000000;fill-rule:evenodd;stroke:#000000;stroke-width:0.140806"
+       id="rect13257-6"
+       width="13.088361"
+       height="4.8862772"
+       x="0.07040292"
+       y="8.2724867" />
+    <rect
+       style="fill:#000000;fill-rule:evenodd;stroke:#000000;stroke-width:0.0869811"
+       id="rect13257-7"
+       width="4.9401021"
+       height="4.9401021"
+       x="8.245574"
+       y="8.245574" />
+    <rect
+       style="fill:#000000;fill-rule:evenodd;stroke:#000000;stroke-width:0.140806"
+       id="rect13257-5"
+       width="4.8862772"
+       height="13.088361"
+       x="8.2724867"
+       y="0.07040292" />
+  </g>
+</svg>

frontend/public/images/taxi/map-cornertopright.svg

@@ -0,0 +1,72 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="50"
+   height="50"
+   viewBox="0 0 13.229167 13.229167"
+   version="1.1"
+   id="svg5"
+   sodipodi:docname="map-bornertopright.svg"
+   inkscape:version="1.1.1 (3bf5ae0d25, 2021-09-20)"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <sodipodi:namedview
+     id="namedview7"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:document-units="mm"
+     showgrid="false"
+     width="50mm"
+     units="px"
+     inkscape:zoom="8.979798"
+     inkscape:cx="48.163667"
+     inkscape:cy="39.477503"
+     inkscape:window-width="1920"
+     inkscape:window-height="1009"
+     inkscape:window-x="1920"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer1" />
+  <defs
+     id="defs2" />
+  <g
+     inkscape:label="Ebene 1"
+     inkscape:groupmode="layer"
+     id="layer1">
+    <rect
+       style="fill:#000000;fill-rule:evenodd;stroke:#000000;stroke-width:0.140806"
+       id="rect13257"
+       width="4.8862772"
+       height="13.088361"
+       x="0.07040292"
+       y="0.07040292" />
+    <rect
+       style="fill:#000000;fill-rule:evenodd;stroke:#000000;stroke-width:0.140806"
+       id="rect13257-6"
+       width="13.088361"
+       height="4.8862772"
+       x="0.07040292"
+       y="8.2724867" />
+    <rect
+       style="fill:#000000;fill-rule:evenodd;stroke:#000000;stroke-width:0.0869811"
+       id="rect13257-7"
+       width="4.9401021"
+       height="4.9401021"
+       x="8.245574"
+       y="8.245574" />
+    <rect
+       style="fill:#000000;fill-rule:evenodd;stroke:#000000;stroke-width:0.0869811"
+       id="rect13257-5"
+       width="4.9401021"
+       height="4.9401021"
+       x="8.245574"
+       y="0.043490551" />
+  </g>
+</svg>

frontend/public/images/taxi/map-cross.svg

@@ -0,0 +1,72 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="50"
+   height="50"
+   viewBox="0 0 13.229167 13.229167"
+   version="1.1"
+   id="svg5"
+   sodipodi:docname="map-cross.svg"
+   inkscape:version="1.1.1 (3bf5ae0d25, 2021-09-20)"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <sodipodi:namedview
+     id="namedview7"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:document-units="mm"
+     showgrid="false"
+     width="50mm"
+     units="px"
+     inkscape:zoom="8.979798"
+     inkscape:cx="48.163667"
+     inkscape:cy="39.477503"
+     inkscape:window-width="1920"
+     inkscape:window-height="1009"
+     inkscape:window-x="1920"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer1" />
+  <defs
+     id="defs2" />
+  <g
+     inkscape:label="Ebene 1"
+     inkscape:groupmode="layer"
+     id="layer1">
+    <rect
+       style="fill:#000000;fill-rule:evenodd;stroke:#000000;stroke-width:0.0869811"
+       id="rect13257"
+       width="4.9401021"
+       height="4.9401021"
+       x="0.043490551"
+       y="0.043490551" />
+    <rect
+       style="fill:#000000;fill-rule:evenodd;stroke:#000000;stroke-width:0.0869811"
+       id="rect13257-6"
+       width="4.9401021"
+       height="4.9401021"
+       x="0.043490551"
+       y="8.245574" />
+    <rect
+       style="fill:#000000;fill-rule:evenodd;stroke:#000000;stroke-width:0.0869811"
+       id="rect13257-7"
+       width="4.9401021"
+       height="4.9401021"
+       x="8.245574"
+       y="8.245574" />
+    <rect
+       style="fill:#000000;fill-rule:evenodd;stroke:#000000;stroke-width:0.0869811"
+       id="rect13257-5"
+       width="4.9401021"
+       height="4.9401021"
+       x="8.245574"
+       y="0.043490551" />
+  </g>
+</svg>

frontend/public/images/taxi/map-fuelhorizontal.svg

@@ -0,0 +1,82 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="50"
+   height="50"
+   viewBox="0 0 13.229167 13.229167"
+   version="1.1"
+   id="svg5"
+   sodipodi:docname="map-fuelhorizontal.svg"
+   inkscape:version="1.1.1 (3bf5ae0d25, 2021-09-20)"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <sodipodi:namedview
+     id="namedview7"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:document-units="mm"
+     showgrid="false"
+     width="50mm"
+     units="px"
+     inkscape:zoom="8.979798"
+     inkscape:cx="48.163667"
+     inkscape:cy="23.107424"
+     inkscape:window-width="1920"
+     inkscape:window-height="1009"
+     inkscape:window-x="1920"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer1" />
+  <defs
+     id="defs2" />
+  <g
+     inkscape:label="Ebene 1"
+     inkscape:groupmode="layer"
+     id="layer1">
+    <rect
+       style="fill:#000000;fill-rule:evenodd;stroke:#000000;stroke-width:0.140806"
+       id="rect13257"
+       width="13.088361"
+       height="4.8862772"
+       x="0.07040292"
+       y="0.07040292" />
+    <rect
+       style="fill:#000000;fill-rule:evenodd;stroke:#000000;stroke-width:0.140806"
+       id="rect13257-6"
+       width="13.088361"
+       height="4.8862772"
+       x="0.07040292"
+       y="8.2724867" />
+    <rect
+       style="fill:#000000;fill-rule:evenodd;stroke:#000000;stroke-width:0.0869811"
+       id="rect13257-7"
+       width="4.9401021"
+       height="4.9401021"
+       x="8.245574"
+       y="8.245574" />
+    <rect
+       style="fill:#000000;fill-rule:evenodd;stroke:#000000;stroke-width:0.0869811"
+       id="rect13257-5"
+       width="4.9401021"
+       height="4.9401021"
+       x="8.245574"
+       y="0.043490551" />
+    <path
+       style="fill:#000000;fill-rule:evenodd;stroke:#ffffff;stroke-width:0.233;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;stroke-miterlimit:4;stroke-dasharray:none"
+       d="m 7.3761776,0.79399793 c 0,0 0.057215,0.0869939 0.085136,0.13093373 0.022906,0.0360539 0.04713,0.0713765 0.067586,0.10887734 0.023893,0.0438 0.041594,0.090727 0.064168,0.1352174 0.022062,0.04347 0.04757,0.085126 0.069605,0.1286105 0.019039,0.037591 0.037297,0.075614 0.054039,0.1142815 0.019299,0.044556 0.03788,0.089515 0.053456,0.1355056 0.016177,0.047776 0.030729,0.09625 0.041424,0.1455449 0.011834,0.054539 0.025023,0.1655422 0.025023,0.1655422 v 0 c 0,0 -0.00861,0.1058814 -0.016751,0.1583251 -0.00984,0.06349 -0.022753,0.1265784 -0.038678,0.188821 -0.015109,0.059063 -0.035197,0.1167465 -0.05385,0.1747869 -0.023193,0.072161 -0.047211,0.1440635 -0.072198,0.215623 -0.026692,0.076446 -0.052899,0.1531287 -0.083018,0.2282915 -0.0261,0.065137 -0.055663,0.1288412 -0.08458,0.1927773 C 7.4537321,3.0918698 7.3836002,3.240177 7.3836002,3.240177"
+       id="path11082"
+       sodipodi:nodetypes="caaaaaaacaaaaaaac" />
+    <path
+       id="rect848"
+       style="fill:#ffffff;fill-rule:evenodd;stroke:#000000;stroke-width:0.0169741;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+       d="m 5.7272047,0.20692473 h 1.3256019 c 0.1898981,0 0.3428996,0.15288449 0.3427758,0.34279017 l -0.011188,4.1921232 -0.3315957,0.00662 h -1.325599 c -0.1898982,0 -0.3427764,-0.00267 -0.3427764,-0.00267 v -4.196071 c 0,-0.18990577 0.1528782,-0.34279017 0.3427764,-0.34279017 z"
+       sodipodi:nodetypes="sssccscsss" />
+  </g>
+</svg>

frontend/public/images/taxi/map-fuelvertical.svg

@@ -0,0 +1,82 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="50"
+   height="50"
+   viewBox="0 0 13.229167 13.229167"
+   version="1.1"
+   id="svg5"
+   sodipodi:docname="map-fuelvertical.svg"
+   inkscape:version="1.1.1 (3bf5ae0d25, 2021-09-20)"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <sodipodi:namedview
+     id="namedview7"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:document-units="mm"
+     showgrid="false"
+     width="50mm"
+     units="px"
+     inkscape:zoom="8.979798"
+     inkscape:cx="48.275028"
+     inkscape:cy="19.766592"
+     inkscape:window-width="1920"
+     inkscape:window-height="1009"
+     inkscape:window-x="1920"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer1" />
+  <defs
+     id="defs2" />
+  <g
+     inkscape:label="Ebene 1"
+     inkscape:groupmode="layer"
+     id="layer1">
+    <rect
+       style="fill:#000000;fill-rule:evenodd;stroke:#000000;stroke-width:0.140806"
+       id="rect13257"
+       width="4.8862772"
+       height="13.088361"
+       x="0.07040292"
+       y="0.07040292" />
+    <rect
+       style="fill:#000000;fill-rule:evenodd;stroke:#000000;stroke-width:0.0869811"
+       id="rect13257-6"
+       width="4.9401021"
+       height="4.9401021"
+       x="0.043490551"
+       y="8.245574" />
+    <rect
+       style="fill:#000000;fill-rule:evenodd;stroke:#000000;stroke-width:0.0869811"
+       id="rect13257-7"
+       width="4.9401021"
+       height="4.9401021"
+       x="8.245574"
+       y="8.245574" />
+    <rect
+       style="fill:#000000;fill-rule:evenodd;stroke:#000000;stroke-width:0.140806"
+       id="rect13257-5"
+       width="4.8862772"
+       height="13.088361"
+       x="8.2724867"
+       y="0.07040292" />
+    <path
+       style="fill:#000000;fill-rule:evenodd;stroke:#ffffff;stroke-width:0.259;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;stroke-miterlimit:4;stroke-dasharray:none"
+       d="m 12.08964,3.8328653 c 0,0 0.101248,0.1539388 0.150657,0.2316919 0.04053,0.063799 0.0834,0.1263033 0.119602,0.1926624 0.04228,0.077505 0.0736,0.1605447 0.113552,0.239272 0.03904,0.076921 0.08418,0.1506332 0.123174,0.2275807 0.03369,0.066518 0.066,0.133802 0.09563,0.2022253 0.03415,0.078844 0.06703,0.1584002 0.09459,0.239782 0.02863,0.084542 0.05438,0.1703175 0.0733,0.2575468 0.02094,0.096508 0.04428,0.2929328 0.04428,0.2929328 v 0 c 0,0 -0.01524,0.1873609 -0.02964,0.2801619 -0.01742,0.1123474 -0.04026,0.223985 -0.06845,0.3341255 -0.02674,0.1045136 -0.06228,0.206587 -0.09529,0.3092916 -0.04104,0.1276909 -0.08354,0.2549255 -0.127762,0.3815525 -0.04723,0.1352738 -0.09361,0.2709667 -0.14691,0.4039699 -0.04619,0.1152624 -0.0985,0.2279892 -0.149673,0.3411263 -0.05982,0.1322444 -0.18393,0.3946791 -0.18393,0.3946791"
+       id="path11082"
+       sodipodi:nodetypes="caaaaaaacaaaaaaac" />
+    <path
+       id="rect848"
+       style="fill:#ffffff;fill-rule:evenodd;stroke:#000000;stroke-width:0.0300369;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+       d="M 9.1716066,2.7940185 H 11.5174 c 0.336045,0 0.606798,0.2705345 0.606579,0.6065793 l -0.0198,7.4181112 -0.586794,0.01172 H 9.1715977 c -0.336045,0 -0.6065792,-0.0047 -0.6065792,-0.0047 V 3.4005978 c 0,-0.336045 0.2705342,-0.6065793 0.6065792,-0.6065793 z"
+       sodipodi:nodetypes="sssccscsss" />
+  </g>
+</svg>

frontend/public/images/taxi/map-horizontal.svg

@@ -0,0 +1,72 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="50"
+   height="50"
+   viewBox="0 0 13.229167 13.229167"
+   version="1.1"
+   id="svg5"
+   sodipodi:docname="map-horizontal.svg"
+   inkscape:version="1.1.1 (3bf5ae0d25, 2021-09-20)"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <sodipodi:namedview
+     id="namedview7"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:document-units="mm"
+     showgrid="false"
+     width="50mm"
+     units="px"
+     inkscape:zoom="8.979798"
+     inkscape:cx="48.163667"
+     inkscape:cy="39.477503"
+     inkscape:window-width="1920"
+     inkscape:window-height="1009"
+     inkscape:window-x="1920"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer1" />
+  <defs
+     id="defs2" />
+  <g
+     inkscape:label="Ebene 1"
+     inkscape:groupmode="layer"
+     id="layer1">
+    <rect
+       style="fill:#000000;fill-rule:evenodd;stroke:#000000;stroke-width:0.140806"
+       id="rect13257"
+       width="13.088361"
+       height="4.8862772"
+       x="0.07040292"
+       y="0.07040292" />
+    <rect
+       style="fill:#000000;fill-rule:evenodd;stroke:#000000;stroke-width:0.140806"
+       id="rect13257-6"
+       width="13.088361"
+       height="4.8862772"
+       x="0.07040292"
+       y="8.2724867" />
+    <rect
+       style="fill:#000000;fill-rule:evenodd;stroke:#000000;stroke-width:0.0869811"
+       id="rect13257-7"
+       width="4.9401021"
+       height="4.9401021"
+       x="8.245574"
+       y="8.245574" />
+    <rect
+       style="fill:#000000;fill-rule:evenodd;stroke:#000000;stroke-width:0.0869811"
+       id="rect13257-5"
+       width="4.9401021"
+       height="4.9401021"
+       x="8.245574"
+       y="0.043490551" />
+  </g>
+</svg>

frontend/public/images/taxi/map-tdown.svg

@@ -0,0 +1,72 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="50"
+   height="50"
+   viewBox="0 0 13.229167 13.229167"
+   version="1.1"
+   id="svg5"
+   sodipodi:docname="map-tbottom.svg"
+   inkscape:version="1.1.1 (3bf5ae0d25, 2021-09-20)"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <sodipodi:namedview
+     id="namedview7"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:document-units="mm"
+     showgrid="false"
+     width="50mm"
+     units="px"
+     inkscape:zoom="8.979798"
+     inkscape:cx="48.163667"
+     inkscape:cy="39.477503"
+     inkscape:window-width="1920"
+     inkscape:window-height="1009"
+     inkscape:window-x="1920"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer1" />
+  <defs
+     id="defs2" />
+  <g
+     inkscape:label="Ebene 1"
+     inkscape:groupmode="layer"
+     id="layer1">
+    <rect
+       style="fill:#000000;fill-rule:evenodd;stroke:#000000;stroke-width:0.140806"
+       id="rect13257"
+       width="13.088361"
+       height="4.8862772"
+       x="0.07040292"
+       y="0.07040292" />
+    <rect
+       style="fill:#000000;fill-rule:evenodd;stroke:#000000;stroke-width:0.0869811"
+       id="rect13257-6"
+       width="4.9401021"
+       height="4.9401021"
+       x="0.043490551"
+       y="8.245574" />
+    <rect
+       style="fill:#000000;fill-rule:evenodd;stroke:#000000;stroke-width:0.0869811"
+       id="rect13257-7"
+       width="4.9401021"
+       height="4.9401021"
+       x="8.245574"
+       y="8.245574" />
+    <rect
+       style="fill:#000000;fill-rule:evenodd;stroke:#000000;stroke-width:0.0869811"
+       id="rect13257-5"
+       width="4.9401021"
+       height="4.9401021"
+       x="8.245574"
+       y="0.043490551" />
+  </g>
+</svg>

frontend/public/images/taxi/map-tleft.svg

@@ -0,0 +1,72 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="50"
+   height="50"
+   viewBox="0 0 13.229167 13.229167"
+   version="1.1"
+   id="svg5"
+   sodipodi:docname="map-tleft.svg"
+   inkscape:version="1.1.1 (3bf5ae0d25, 2021-09-20)"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <sodipodi:namedview
+     id="namedview7"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:document-units="mm"
+     showgrid="false"
+     width="50mm"
+     units="px"
+     inkscape:zoom="8.979798"
+     inkscape:cx="48.163667"
+     inkscape:cy="39.477503"
+     inkscape:window-width="1920"
+     inkscape:window-height="1009"
+     inkscape:window-x="1920"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer1" />
+  <defs
+     id="defs2" />
+  <g
+     inkscape:label="Ebene 1"
+     inkscape:groupmode="layer"
+     id="layer1">
+    <rect
+       style="fill:#000000;fill-rule:evenodd;stroke:#000000;stroke-width:0.0869811"
+       id="rect13257"
+       width="4.9401021"
+       height="4.9401021"
+       x="0.043490551"
+       y="0.043490551" />
+    <rect
+       style="fill:#000000;fill-rule:evenodd;stroke:#000000;stroke-width:0.0869811"
+       id="rect13257-6"
+       width="4.9401021"
+       height="4.9401021"
+       x="0.043490551"
+       y="8.245574" />
+    <rect
+       style="fill:#000000;fill-rule:evenodd;stroke:#000000;stroke-width:0.0869811"
+       id="rect13257-7"
+       width="4.9401021"
+       height="4.9401021"
+       x="8.245574"
+       y="8.245574" />
+    <rect
+       style="fill:#000000;fill-rule:evenodd;stroke:#000000;stroke-width:0.140806"
+       id="rect13257-5"
+       width="4.8862772"
+       height="13.088361"
+       x="8.2724867"
+       y="0.07040292" />
+  </g>
+</svg>

frontend/public/images/taxi/map-tright.svg

@@ -0,0 +1,72 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="50"
+   height="50"
+   viewBox="0 0 13.229167 13.229167"
+   version="1.1"
+   id="svg5"
+   sodipodi:docname="map-tright.svg"
+   inkscape:version="1.1.1 (3bf5ae0d25, 2021-09-20)"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <sodipodi:namedview
+     id="namedview7"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:document-units="mm"
+     showgrid="false"
+     width="50mm"
+     units="px"
+     inkscape:zoom="8.979798"
+     inkscape:cx="48.163667"
+     inkscape:cy="39.477503"
+     inkscape:window-width="1920"
+     inkscape:window-height="1009"
+     inkscape:window-x="1920"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer1" />
+  <defs
+     id="defs2" />
+  <g
+     inkscape:label="Ebene 1"
+     inkscape:groupmode="layer"
+     id="layer1">
+    <rect
+       style="fill:#000000;fill-rule:evenodd;stroke:#000000;stroke-width:0.140806"
+       id="rect13257"
+       width="4.8862772"
+       height="13.088361"
+       x="0.07040292"
+       y="0.07040292" />
+    <rect
+       style="fill:#000000;fill-rule:evenodd;stroke:#000000;stroke-width:0.0869811"
+       id="rect13257-6"
+       width="4.9401021"
+       height="4.9401021"
+       x="0.043490551"
+       y="8.245574" />
+    <rect
+       style="fill:#000000;fill-rule:evenodd;stroke:#000000;stroke-width:0.0869811"
+       id="rect13257-7"
+       width="4.9401021"
+       height="4.9401021"
+       x="8.245574"
+       y="8.245574" />
+    <rect
+       style="fill:#000000;fill-rule:evenodd;stroke:#000000;stroke-width:0.0869811"
+       id="rect13257-5"
+       width="4.9401021"
+       height="4.9401021"
+       x="8.245574"
+       y="0.043490551" />
+  </g>
+</svg>

frontend/public/images/taxi/map-tup.svg

@@ -0,0 +1,72 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="50"
+   height="50"
+   viewBox="0 0 13.229167 13.229167"
+   version="1.1"
+   id="svg5"
+   sodipodi:docname="map-tup.svg"
+   inkscape:version="1.1.1 (3bf5ae0d25, 2021-09-20)"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <sodipodi:namedview
+     id="namedview7"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:document-units="mm"
+     showgrid="false"
+     width="50mm"
+     units="px"
+     inkscape:zoom="8.979798"
+     inkscape:cx="48.163667"
+     inkscape:cy="39.477503"
+     inkscape:window-width="1920"
+     inkscape:window-height="1009"
+     inkscape:window-x="1920"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer1" />
+  <defs
+     id="defs2" />
+  <g
+     inkscape:label="Ebene 1"
+     inkscape:groupmode="layer"
+     id="layer1">
+    <rect
+       style="fill:#000000;fill-rule:evenodd;stroke:#000000;stroke-width:0.0869811"
+       id="rect13257"
+       width="4.9401021"
+       height="4.9401021"
+       x="0.043490551"
+       y="0.043490551" />
+    <rect
+       style="fill:#000000;fill-rule:evenodd;stroke:#000000;stroke-width:0.140806"
+       id="rect13257-6"
+       width="13.088361"
+       height="4.8862772"
+       x="0.07040292"
+       y="8.2724867" />
+    <rect
+       style="fill:#000000;fill-rule:evenodd;stroke:#000000;stroke-width:0.0869811"
+       id="rect13257-7"
+       width="4.9401021"
+       height="4.9401021"
+       x="8.245574"
+       y="8.245574" />
+    <rect
+       style="fill:#000000;fill-rule:evenodd;stroke:#000000;stroke-width:0.0869811"
+       id="rect13257-5"
+       width="4.9401021"
+       height="4.9401021"
+       x="8.245574"
+       y="0.043490551" />
+  </g>
+</svg>

frontend/public/images/taxi/map-vertical.svg

@@ -0,0 +1,72 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="50"
+   height="50"
+   viewBox="0 0 13.229167 13.229167"
+   version="1.1"
+   id="svg5"
+   sodipodi:docname="map-vertical.svg"
+   inkscape:version="1.1.1 (3bf5ae0d25, 2021-09-20)"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <sodipodi:namedview
+     id="namedview7"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:document-units="mm"
+     showgrid="false"
+     width="50mm"
+     units="px"
+     inkscape:zoom="8.979798"
+     inkscape:cx="48.163667"
+     inkscape:cy="39.477503"
+     inkscape:window-width="1920"
+     inkscape:window-height="1009"
+     inkscape:window-x="1920"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer1" />
+  <defs
+     id="defs2" />
+  <g
+     inkscape:label="Ebene 1"
+     inkscape:groupmode="layer"
+     id="layer1">
+    <rect
+       style="fill:#000000;fill-rule:evenodd;stroke:#000000;stroke-width:0.140806"
+       id="rect13257"
+       width="4.8862772"
+       height="13.088361"
+       x="0.07040292"
+       y="0.07040292" />
+    <rect
+       style="fill:#000000;fill-rule:evenodd;stroke:#000000;stroke-width:0.0869811"
+       id="rect13257-6"
+       width="4.9401021"
+       height="4.9401021"
+       x="0.043490551"
+       y="8.245574" />
+    <rect
+       style="fill:#000000;fill-rule:evenodd;stroke:#000000;stroke-width:0.0869811"
+       id="rect13257-7"
+       width="4.9401021"
+       height="4.9401021"
+       x="8.245574"
+       y="8.245574" />
+    <rect
+       style="fill:#000000;fill-rule:evenodd;stroke:#000000;stroke-width:0.140806"
+       id="rect13257-5"
+       width="4.8862772"
+       height="13.088361"
+       x="8.2724867"
+       y="0.07040292" />
+  </g>
+</svg>

frontend/public/images/taxi/person.svg

@@ -0,0 +1,105 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="130mm"
+   height="297mm"
+   viewBox="0 0 130 297"
+   version="1.1"
+   id="svg5"
+   inkscape:version="1.1.1 (3bf5ae0d25, 2021-09-20)"
+   sodipodi:docname="person.svg"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <sodipodi:namedview
+     id="namedview7"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:document-units="mm"
+     showgrid="false"
+     inkscape:zoom="0.56123738"
+     inkscape:cx="218.26772"
+     inkscape:cy="407.13611"
+     inkscape:window-width="1920"
+     inkscape:window-height="1009"
+     inkscape:window-x="1920"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer1" />
+  <defs
+     id="defs2" />
+  <g
+     inkscape:label="Ebene 1"
+     inkscape:groupmode="layer"
+     id="layer1">
+    <g
+       id="g841"
+       transform="matrix(1.7109573,0,0,1.7109573,-49.007973,-145.44907)">
+      <path
+         id="rect864"
+         style="fill:#803300;fill-rule:evenodd;stroke:#000000;stroke-width:0.480999;stroke-miterlimit:3.3"
+         d="M 55.096026,182.19109 H 66.769062 L 41.25794,258.53351 H 29.584904 Z"
+         sodipodi:nodetypes="ccccc" />
+      <path
+         id="rect864-3"
+         style="fill:#803300;fill-rule:evenodd;stroke:#000000;stroke-width:0.480999;stroke-miterlimit:3.3"
+         d="M 78.442095,182.19109 H 66.769062 l 25.511119,76.34242 h 11.673039 z"
+         sodipodi:nodetypes="ccccc" />
+      <rect
+         style="fill:#d3bc5f;fill-rule:evenodd;stroke:#000000;stroke-width:0.480999;stroke-miterlimit:3.3"
+         id="rect1296"
+         width="23.094477"
+         height="71.230904"
+         x="55.096027"
+         y="110.96018"
+         ry="0" />
+      <path
+         id="rect1300"
+         style="fill:#d3bc5f;fill-rule:evenodd;stroke:#000000;stroke-width:0.480999;stroke-miterlimit:3.3"
+         d="m 78.190506,110.96018 h 7.673717 l 9.540904,64.23331 H 87.73141 Z"
+         sodipodi:nodetypes="ccccc" />
+      <path
+         id="rect1300-6"
+         style="fill:#d3bc5f;fill-rule:evenodd;stroke:#000000;stroke-width:0.480999;stroke-miterlimit:3.3"
+         d="M 55.096027,110.96018 H 47.42231 l -9.540904,64.2333 h 7.673717 z"
+         sodipodi:nodetypes="ccccc" />
+      <ellipse
+         style="fill:#ffe6d5;fill-rule:evenodd;stroke:#000000;stroke-width:0.556395;stroke-miterlimit:3.3"
+         id="path1860"
+         cx="66.643265"
+         cy="98.193443"
+         rx="12.722526"
+         ry="12.729039" />
+      <circle
+         style="fill:#008000;fill-rule:evenodd;stroke:#000000;stroke-width:0.480999;stroke-miterlimit:3.3"
+         id="path2018"
+         cx="61.15995"
+         cy="93.070518"
+         r="1.6208154" />
+      <circle
+         style="fill:#008000;fill-rule:evenodd;stroke:#000000;stroke-width:0.412626;stroke-miterlimit:3.3"
+         id="path2018-7"
+         cx="71.804031"
+         cy="92.805939"
+         r="1.3904188" />
+      <ellipse
+         style="fill:#ffccaa;fill-rule:evenodd;stroke:#000000;stroke-width:0.480999;stroke-miterlimit:3.3"
+         id="path2172"
+         cx="66.603874"
+         cy="99.576675"
+         rx="1.3070318"
+         ry="1.0586804" />
+      <path
+         id="path2196"
+         style="fill:#ffccaa;fill-rule:evenodd;stroke:#000000;stroke-width:0.601609;stroke-miterlimit:3.3"
+         d="m 74.437708,102.79926 c 4e-6,1.4069 -3.456697,2.54741 -7.720743,2.54741 -4.264046,0 -7.720748,-1.14051 -7.720744,-2.54741 3e-6,-0.90337 1.187738,0.0717 3.181242,0.83353 1.694697,0.6476 2.573313,0.49344 4.099408,0.49344 1.692122,0 3.447143,-0.10081 4.803025,-0.53224 2.06086,-0.65575 3.357809,-1.64332 3.357812,-0.79473 z"
+         sodipodi:nodetypes="sssssss" />
+    </g>
+  </g>
+</svg>

frontend/public/images/taxi/radar.svg

@@ -0,0 +1,67 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="210mm"
+   height="210mm"
+   viewBox="0 0 210 210"
+   version="1.1"
+   id="svg5"
+   inkscape:version="1.1.1 (3bf5ae0d25, 2021-09-20)"
+   sodipodi:docname="radar.svg"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <sodipodi:namedview
+     id="namedview7"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:document-units="mm"
+     showgrid="false"
+     inkscape:zoom="0.56123737"
+     inkscape:cx="396.44544"
+     inkscape:cy="560.36895"
+     inkscape:window-width="1920"
+     inkscape:window-height="1009"
+     inkscape:window-x="1920"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer1" />
+  <defs
+     id="defs2" />
+  <g
+     inkscape:label="Ebene 1"
+     inkscape:groupmode="layer"
+     id="layer1">
+    <g
+       id="g1444"
+       transform="matrix(3.2401803,0,0,3.2401803,-256.36921,-306.88579)">
+      <rect
+         style="fill:#786721;fill-rule:evenodd;stroke:#000000;stroke-width:0.5;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+         id="rect868"
+         width="62.955742"
+         height="49.764977"
+         x="80.049629"
+         y="95.024445" />
+      <path
+         style="fill:none;fill-rule:evenodd;stroke:#000000;stroke-width:0.274529px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+         d="M 79.901845,159.5435 93.34906,144.54032"
+         id="path1200" />
+      <path
+         style="fill:none;fill-rule:evenodd;stroke:#000000;stroke-width:0.264583px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+         d="M 143.16022,159.08456 129.70597,145.15607"
+         id="path1200-3" />
+      <circle
+         style="fill:#000000;fill-rule:evenodd;stroke:#000000;stroke-width:0.499999;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+         id="path1358"
+         cx="131.23929"
+         cy="116.87977"
+         r="8.3879414" />
+    </g>
+  </g>
+</svg>

frontend/public/images/taxi/redlight.svg

@@ -0,0 +1,73 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="210mm"
+   height="210mm"
+   viewBox="0 0 210 210"
+   version="1.1"
+   id="svg2844"
+   inkscape:version="1.1.1 (3bf5ae0d25, 2021-09-20)"
+   sodipodi:docname="redlight.svg"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <sodipodi:namedview
+     id="namedview2846"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:document-units="mm"
+     showgrid="false"
+     inkscape:zoom="0.56123737"
+     inkscape:cx="109.5793"
+     inkscape:cy="560.36896"
+     inkscape:window-width="1920"
+     inkscape:window-height="1009"
+     inkscape:window-x="1920"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer1"
+     height="210mm" />
+  <defs
+     id="defs2841" />
+  <g
+     inkscape:label="Ebene 1"
+     inkscape:groupmode="layer"
+     id="layer1">
+    <g
+       id="g829"
+       transform="matrix(2.1908531,0,0,2.1908531,-130.48541,-182.47651)">
+      <rect
+         style="fill:#333333;fill-rule:evenodd;stroke:#000000;stroke-width:0.480999;stroke-miterlimit:3.3"
+         id="rect846"
+         width="30.798695"
+         height="95.249992"
+         x="92.086365"
+         y="83.903572"
+         ry="3.6688216" />
+      <circle
+         style="fill:#d40000;fill-rule:evenodd;stroke:#000000;stroke-width:0.434597;stroke-miterlimit:3.3"
+         id="path927"
+         cx="107.48571"
+         cy="99.990768"
+         r="12.388993" />
+      <circle
+         style="fill:#422c00;fill-opacity:1;fill-rule:evenodd;stroke:#000000;stroke-width:0.434597;stroke-miterlimit:3.3"
+         id="path927-3"
+         cx="107.48571"
+         cy="130.1545"
+         r="12.388993" />
+      <circle
+         style="fill:#002800;fill-opacity:1;fill-rule:evenodd;stroke:#000000;stroke-width:0.434597;stroke-miterlimit:3.3"
+         id="path927-6"
+         cx="107.48571"
+         cy="161.45821"
+         r="12.388993" />
+    </g>
+  </g>
+</svg>

frontend/public/images/taxi/taxi.svg

@@ -0,0 +1,74 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="66.542mm"
+   height="131.97301mm"
+   viewBox="0 0 66.542 131.97301"
+   version="1.1"
+   id="svg957"
+   inkscape:version="1.1.1 (3bf5ae0d25, 2021-09-20)"
+   sodipodi:docname="taxi.svg"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <sodipodi:namedview
+     id="namedview959"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:document-units="mm"
+     showgrid="false"
+     inkscape:zoom="0.56123737"
+     inkscape:cx="-179.06862"
+     inkscape:cy="560.36896"
+     inkscape:window-width="1920"
+     inkscape:window-height="1009"
+     inkscape:window-x="1920"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer1" />
+  <defs
+     id="defs954" />
+  <g
+     inkscape:label="Ebene 1"
+     inkscape:groupmode="layer"
+     id="layer1">
+    <rect
+       style="fill:#e6d690;fill-opacity:1;fill-rule:evenodd;stroke:#000000;stroke-width:0.465391;stroke-miterlimit:3.3"
+       id="rect846"
+       width="131.50793"
+       height="66.076797"
+       x="-131.74063"
+       y="0.2326965"
+       transform="rotate(-90)" />
+    <rect
+       style="fill:#000000;fill-opacity:1;fill-rule:evenodd;stroke:#000000;stroke-width:0.479108;stroke-miterlimit:3.3"
+       id="rect1016"
+       width="15.774606"
+       height="66.096329"
+       x="-110.37288"
+       y="0.44752184"
+       transform="rotate(-90)" />
+    <rect
+       style="fill:#000000;fill-opacity:1;fill-rule:evenodd;stroke:#000000;stroke-width:0.480999;stroke-miterlimit:3.3"
+       id="rect1018"
+       width="22.247723"
+       height="65.980431"
+       x="-44.058758"
+       y="0.61777174"
+       transform="rotate(-90)" />
+    <rect
+       style="fill:#000000;fill-opacity:1;fill-rule:evenodd;stroke:#000000;stroke-width:0.480999;stroke-miterlimit:3.3"
+       id="rect1176"
+       width="3.3279102"
+       height="12.234275"
+       x="-55.588726"
+       y="27.564478"
+       transform="rotate(-90)" />
+  </g>
+</svg>

frontend/public/images/taxi/tdown.svg

@@ -0,0 +1,81 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="200mm"
+   height="200mm"
+   viewBox="0 0 200 200"
+   version="1.1"
+   id="svg5"
+   inkscape:version="1.1.1 (3bf5ae0d25, 2021-09-20)"
+   sodipodi:docname="tdown.svg"
+   inkscape:export-filename="/home/torsten/Bilder/your-part/backgrounds/taxi/tright.png"
+   inkscape:export-xdpi="63.5"
+   inkscape:export-ydpi="63.5"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <sodipodi:namedview
+     id="namedview7"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:document-units="mm"
+     showgrid="false"
+     inkscape:zoom="1.1224747"
+     inkscape:cx="391.54557"
+     inkscape:cy="427.18112"
+     inkscape:window-width="1920"
+     inkscape:window-height="1009"
+     inkscape:window-x="1920"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer1"
+     width="200mm" />
+  <defs
+     id="defs2" />
+  <g
+     inkscape:label="Ebene 1"
+     inkscape:groupmode="layer"
+     id="layer1">
+    <rect
+       style="fill:#008000;fill-rule:evenodd;stroke:none;stroke-width:0.698168;stroke-miterlimit:3.3"
+       id="rect846"
+       width="200"
+       height="200"
+       x="-200"
+       y="0"
+       inkscape:export-filename="/home/torsten/Bilder/your-part/backgrounds/taxi/topleft.png"
+       inkscape:export-xdpi="63.5"
+       inkscape:export-ydpi="63.5"
+       transform="rotate(-90)" />
+    <rect
+       style="fill:#1a1a1a;fill-rule:evenodd;stroke:none;stroke-width:0.29538;stroke-miterlimit:3.3"
+       id="rect986"
+       width="100"
+       height="50"
+       x="-200"
+       y="75"
+       ry="0"
+       inkscape:export-filename="/home/torsten/Bilder/your-part/backgrounds/taxi/topleft.png"
+       inkscape:export-xdpi="63.5"
+       inkscape:export-ydpi="63.5"
+       transform="rotate(-90)" />
+    <rect
+       style="fill:#1a1a1a;fill-rule:evenodd;stroke:none;stroke-width:0.417732;stroke-miterlimit:3.3"
+       id="rect986-6"
+       width="200"
+       height="50"
+       x="-200"
+       y="-125"
+       ry="0"
+       transform="scale(-1)"
+       inkscape:export-filename="/home/torsten/Bilder/your-part/backgrounds/taxi/topleft.png"
+       inkscape:export-xdpi="63.5"
+       inkscape:export-ydpi="63.5" />
+  </g>
+</svg>

frontend/public/images/taxi/ticket.svg

@@ -0,0 +1,82 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="210mm"
+   height="210mm"
+   viewBox="0 0 210 210"
+   version="1.1"
+   id="svg5"
+   inkscape:version="1.1.1 (3bf5ae0d25, 2021-09-20)"
+   sodipodi:docname="ticket.svg"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <sodipodi:namedview
+     id="namedview7"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:document-units="mm"
+     showgrid="false"
+     inkscape:zoom="0.56123737"
+     inkscape:cx="56.125985"
+     inkscape:cy="560.36896"
+     inkscape:window-width="1920"
+     inkscape:window-height="1009"
+     inkscape:window-x="1920"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer1"
+     height="210mm" />
+  <defs
+     id="defs2" />
+  <g
+     inkscape:label="Ebene 1"
+     inkscape:groupmode="layer"
+     id="layer1">
+    <g
+       id="g837"
+       transform="matrix(1.3293508,0,0,1.3293508,-33.154799,-73.565064)">
+      <rect
+         style="fill:#fffff4;fill-opacity:1;fill-rule:evenodd;stroke:#000000;stroke-width:0.480999;stroke-miterlimit:3.3"
+         id="rect846"
+         width="111.00117"
+         height="157.49057"
+         x="48.425934"
+         y="55.833076" />
+      <path
+         style="fill:none;fill-rule:evenodd;stroke:#000000;stroke-width:8.365;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+         d="M 58.281391,74.318408 H 145.0201"
+         id="path2168" />
+      <path
+         style="fill:none;fill-rule:evenodd;stroke:#000000;stroke-width:8.365;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+         d="M 58.281405,94.269281 H 145.02009"
+         id="path2168-3" />
+      <path
+         style="fill:none;fill-rule:evenodd;stroke:#000000;stroke-width:8.365;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+         d="M 58.281404,114.22015 H 145.02009"
+         id="path2168-3-6" />
+      <path
+         style="fill:none;fill-rule:evenodd;stroke:#000000;stroke-width:8.365;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+         d="M 58.281392,134.17101 H 145.0201"
+         id="path2168-7" />
+      <path
+         style="fill:none;fill-rule:evenodd;stroke:#000000;stroke-width:8.365;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+         d="M 58.281406,154.12188 H 145.02009"
+         id="path2168-3-5" />
+      <path
+         style="fill:none;fill-rule:evenodd;stroke:#000000;stroke-width:8.365;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+         d="M 58.281405,174.07274 H 145.02009"
+         id="path2168-3-6-3" />
+      <path
+         style="fill:#ff0000;fill-rule:evenodd;stroke:#f00000;stroke-width:8.365;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+         d="M 58.281406,194.02361 H 145.02009"
+         id="path2168-3-6-3-5" />
+    </g>
+  </g>
+</svg>

frontend/public/images/taxi/tleft.svg

@@ -0,0 +1,81 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="200mm"
+   height="200mm"
+   viewBox="0 0 200 200"
+   version="1.1"
+   id="svg5"
+   inkscape:version="1.1.1 (3bf5ae0d25, 2021-09-20)"
+   sodipodi:docname="tleft.svg"
+   inkscape:export-filename="/home/torsten/Bilder/your-part/backgrounds/taxi/cross.png"
+   inkscape:export-xdpi="63.5"
+   inkscape:export-ydpi="63.5"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <sodipodi:namedview
+     id="namedview7"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:document-units="mm"
+     showgrid="false"
+     inkscape:zoom="1.1224747"
+     inkscape:cx="391.54557"
+     inkscape:cy="427.18112"
+     inkscape:window-width="1920"
+     inkscape:window-height="1009"
+     inkscape:window-x="1920"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer1"
+     width="200mm" />
+  <defs
+     id="defs2" />
+  <g
+     inkscape:label="Ebene 1"
+     inkscape:groupmode="layer"
+     id="layer1">
+    <rect
+       style="fill:#008000;fill-rule:evenodd;stroke:none;stroke-width:0.698168;stroke-miterlimit:3.3"
+       id="rect846"
+       width="200"
+       height="200"
+       x="-200"
+       y="-200"
+       transform="matrix(0,-1,-1,0,0,0)"
+       inkscape:export-filename="/home/torsten/Bilder/your-part/backgrounds/taxi/topleft.png"
+       inkscape:export-xdpi="63.5"
+       inkscape:export-ydpi="63.5" />
+    <rect
+       style="fill:#1a1a1a;fill-rule:evenodd;stroke:none;stroke-width:0.417731;stroke-miterlimit:3.3"
+       id="rect986"
+       width="200"
+       height="50"
+       x="-200"
+       y="-125"
+       ry="0"
+       transform="matrix(0,-1,-1,0,0,0)"
+       inkscape:export-filename="/home/torsten/Bilder/your-part/backgrounds/taxi/topleft.png"
+       inkscape:export-xdpi="63.5"
+       inkscape:export-ydpi="63.5" />
+    <rect
+       style="fill:#1a1a1a;fill-rule:evenodd;stroke:none;stroke-width:0.295381;stroke-miterlimit:3.3"
+       id="rect986-6"
+       width="100"
+       height="50"
+       x="0"
+       y="-125"
+       ry="0"
+       transform="scale(1,-1)"
+       inkscape:export-filename="/home/torsten/Bilder/your-part/backgrounds/taxi/topleft.png"
+       inkscape:export-xdpi="63.5"
+       inkscape:export-ydpi="63.5" />
+  </g>
+</svg>

frontend/public/images/taxi/trafficlight-green.svg

@@ -0,0 +1,75 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="210mm"
+   height="297mm"
+   viewBox="0 0 210 297"
+   version="1.1"
+   id="svg5"
+   inkscape:version="1.1.1 (3bf5ae0d25, 2021-09-20)"
+   sodipodi:docname="trafficlight-green.svg"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <sodipodi:namedview
+     id="namedview7"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:document-units="mm"
+     showgrid="false"
+     inkscape:zoom="0.56123737"
+     inkscape:cx="396.44545"
+     inkscape:cy="560.36896"
+     inkscape:window-width="1920"
+     inkscape:window-height="1009"
+     inkscape:window-x="1920"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer1" />
+  <defs
+     id="defs2" />
+  <g
+     inkscape:label="Ebene 1"
+     inkscape:groupmode="layer"
+     id="layer1">
+    <rect
+       style="fill:#333333;fill-opacity:1;fill-rule:evenodd;stroke:#000000;stroke-width:0.483677;stroke-miterlimit:3.3"
+       id="rect2066"
+       width="9.8816996"
+       height="142.79434"
+       x="77.262375"
+       y="122.88019" />
+    <rect
+       style="fill:#333333;fill-rule:evenodd;stroke:#000000;stroke-width:0.480999;stroke-miterlimit:3.3"
+       id="rect846"
+       width="30.798695"
+       height="95.249992"
+       x="66.939056"
+       y="28.724499"
+       ry="3.6688216" />
+    <circle
+       style="fill:#5a0000;fill-rule:evenodd;stroke:#000000;stroke-width:0.434597;stroke-miterlimit:3.3;fill-opacity:1"
+       id="path927"
+       cx="82.338402"
+       cy="44.811695"
+       r="12.388993" />
+    <circle
+       style="fill:#422c00;fill-opacity:1;fill-rule:evenodd;stroke:#000000;stroke-width:0.434597;stroke-miterlimit:3.3"
+       id="path927-3"
+       cx="82.338402"
+       cy="74.975426"
+       r="12.388993" />
+    <circle
+       style="fill:#008000;fill-rule:evenodd;stroke:#000000;stroke-width:0.434597;stroke-miterlimit:3.3;fill-opacity:1"
+       id="path927-6"
+       cx="82.338402"
+       cy="106.27913"
+       r="12.388993" />
+  </g>
+</svg>

frontend/public/images/taxi/trafficlight-red.svg

@@ -0,0 +1,75 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="210mm"
+   height="297mm"
+   viewBox="0 0 210 297"
+   version="1.1"
+   id="svg5"
+   inkscape:version="1.1.1 (3bf5ae0d25, 2021-09-20)"
+   sodipodi:docname="trafficlight-red.svg"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <sodipodi:namedview
+     id="namedview7"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:document-units="mm"
+     showgrid="false"
+     inkscape:zoom="0.56123737"
+     inkscape:cx="396.44545"
+     inkscape:cy="560.36896"
+     inkscape:window-width="1920"
+     inkscape:window-height="1009"
+     inkscape:window-x="1920"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer1" />
+  <defs
+     id="defs2" />
+  <g
+     inkscape:label="Ebene 1"
+     inkscape:groupmode="layer"
+     id="layer1">
+    <rect
+       style="fill:#333333;fill-opacity:1;fill-rule:evenodd;stroke:#000000;stroke-width:0.483677;stroke-miterlimit:3.3"
+       id="rect2066"
+       width="9.8816996"
+       height="142.79434"
+       x="77.262375"
+       y="122.88019" />
+    <rect
+       style="fill:#333333;fill-rule:evenodd;stroke:#000000;stroke-width:0.480999;stroke-miterlimit:3.3"
+       id="rect846"
+       width="30.798695"
+       height="95.249992"
+       x="66.939056"
+       y="28.724499"
+       ry="3.6688216" />
+    <circle
+       style="fill:#d40000;fill-rule:evenodd;stroke:#000000;stroke-width:0.434597;stroke-miterlimit:3.3"
+       id="path927"
+       cx="82.338402"
+       cy="44.811695"
+       r="12.388993" />
+    <circle
+       style="fill:#422c00;fill-opacity:1;fill-rule:evenodd;stroke:#000000;stroke-width:0.434597;stroke-miterlimit:3.3"
+       id="path927-3"
+       cx="82.338402"
+       cy="74.975426"
+       r="12.388993" />
+    <circle
+       style="fill:#002800;fill-rule:evenodd;stroke:#000000;stroke-width:0.434597;stroke-miterlimit:3.3;fill-opacity:1"
+       id="path927-6"
+       cx="82.338402"
+       cy="106.27913"
+       r="12.388993" />
+  </g>
+</svg>

frontend/public/images/taxi/trafficlight-redyellow.svg

@@ -0,0 +1,75 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="210mm"
+   height="297mm"
+   viewBox="0 0 210 297"
+   version="1.1"
+   id="svg5"
+   inkscape:version="1.1.1 (3bf5ae0d25, 2021-09-20)"
+   sodipodi:docname="trafficlight-redyellow.svg"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <sodipodi:namedview
+     id="namedview7"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:document-units="mm"
+     showgrid="false"
+     inkscape:zoom="0.56123737"
+     inkscape:cx="396.44545"
+     inkscape:cy="560.36896"
+     inkscape:window-width="1920"
+     inkscape:window-height="1009"
+     inkscape:window-x="1920"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer1" />
+  <defs
+     id="defs2" />
+  <g
+     inkscape:label="Ebene 1"
+     inkscape:groupmode="layer"
+     id="layer1">
+    <rect
+       style="fill:#333333;fill-opacity:1;fill-rule:evenodd;stroke:#000000;stroke-width:0.483677;stroke-miterlimit:3.3"
+       id="rect2066"
+       width="9.8816996"
+       height="142.79434"
+       x="77.262375"
+       y="122.88019" />
+    <rect
+       style="fill:#333333;fill-rule:evenodd;stroke:#000000;stroke-width:0.480999;stroke-miterlimit:3.3"
+       id="rect846"
+       width="30.798695"
+       height="95.249992"
+       x="66.939056"
+       y="28.724499"
+       ry="3.6688216" />
+    <circle
+       style="fill:#d40000;fill-rule:evenodd;stroke:#000000;stroke-width:0.434597;stroke-miterlimit:3.3"
+       id="path927"
+       cx="82.338402"
+       cy="44.811695"
+       r="12.388993" />
+    <circle
+       style="fill:#d48c00;fill-opacity:1;fill-rule:evenodd;stroke:#000000;stroke-width:0.434597;stroke-miterlimit:3.3"
+       id="path927-3"
+       cx="82.338402"
+       cy="74.975426"
+       r="12.388993" />
+    <circle
+       style="fill:#002800;fill-rule:evenodd;stroke:#000000;stroke-width:0.434597;stroke-miterlimit:3.3;fill-opacity:1"
+       id="path927-6"
+       cx="82.338402"
+       cy="106.27913"
+       r="12.388993" />
+  </g>
+</svg>

frontend/public/images/taxi/trafficlight-yellow.svg

@@ -0,0 +1,75 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="210mm"
+   height="297mm"
+   viewBox="0 0 210 297"
+   version="1.1"
+   id="svg5"
+   inkscape:version="1.1.1 (3bf5ae0d25, 2021-09-20)"
+   sodipodi:docname="trafficlight-yellow.svg"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <sodipodi:namedview
+     id="namedview7"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:document-units="mm"
+     showgrid="false"
+     inkscape:zoom="0.56123737"
+     inkscape:cx="396.44545"
+     inkscape:cy="560.36896"
+     inkscape:window-width="1920"
+     inkscape:window-height="1009"
+     inkscape:window-x="1920"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer1" />
+  <defs
+     id="defs2" />
+  <g
+     inkscape:label="Ebene 1"
+     inkscape:groupmode="layer"
+     id="layer1">
+    <rect
+       style="fill:#333333;fill-opacity:1;fill-rule:evenodd;stroke:#000000;stroke-width:0.483677;stroke-miterlimit:3.3"
+       id="rect2066"
+       width="9.8816996"
+       height="142.79434"
+       x="77.262375"
+       y="122.88019" />
+    <rect
+       style="fill:#333333;fill-rule:evenodd;stroke:#000000;stroke-width:0.480999;stroke-miterlimit:3.3"
+       id="rect846"
+       width="30.798695"
+       height="95.249992"
+       x="66.939056"
+       y="28.724499"
+       ry="3.6688216" />
+    <circle
+       style="fill:#5a0000;fill-rule:evenodd;stroke:#000000;stroke-width:0.434597;stroke-miterlimit:3.3;fill-opacity:1"
+       id="path927"
+       cx="82.338402"
+       cy="44.811695"
+       r="12.388993" />
+    <circle
+       style="fill:#d48c00;fill-opacity:1;fill-rule:evenodd;stroke:#000000;stroke-width:0.434597;stroke-miterlimit:3.3"
+       id="path927-3"
+       cx="82.338402"
+       cy="74.975426"
+       r="12.388993" />
+    <circle
+       style="fill:#002800;fill-rule:evenodd;stroke:#000000;stroke-width:0.434597;stroke-miterlimit:3.3;fill-opacity:1"
+       id="path927-6"
+       cx="82.338402"
+       cy="106.27913"
+       r="12.388993" />
+  </g>
+</svg>

frontend/public/images/taxi/tright.svg

@@ -0,0 +1,81 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="200mm"
+   height="200mm"
+   viewBox="0 0 200 200"
+   version="1.1"
+   id="svg5"
+   inkscape:version="1.1.1 (3bf5ae0d25, 2021-09-20)"
+   sodipodi:docname="tright.svg"
+   inkscape:export-filename="/home/torsten/Bilder/your-part/backgrounds/taxi/tleft.png"
+   inkscape:export-xdpi="63.5"
+   inkscape:export-ydpi="63.5"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <sodipodi:namedview
+     id="namedview7"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:document-units="mm"
+     showgrid="false"
+     inkscape:zoom="1.1224747"
+     inkscape:cx="391.54557"
+     inkscape:cy="427.18112"
+     inkscape:window-width="1920"
+     inkscape:window-height="1009"
+     inkscape:window-x="1920"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer1"
+     width="200mm" />
+  <defs
+     id="defs2" />
+  <g
+     inkscape:label="Ebene 1"
+     inkscape:groupmode="layer"
+     id="layer1">
+    <rect
+       style="fill:#008000;fill-rule:evenodd;stroke:none;stroke-width:0.698168;stroke-miterlimit:3.3"
+       id="rect846"
+       width="200"
+       height="200"
+       x="-200"
+       y="0"
+       transform="rotate(-90)"
+       inkscape:export-filename="/home/torsten/Bilder/your-part/backgrounds/taxi/topleft.png"
+       inkscape:export-xdpi="63.5"
+       inkscape:export-ydpi="63.5" />
+    <rect
+       style="fill:#1a1a1a;fill-rule:evenodd;stroke:none;stroke-width:0.417731;stroke-miterlimit:3.3"
+       id="rect986"
+       width="200"
+       height="50"
+       x="-200"
+       y="75"
+       ry="0"
+       transform="rotate(-90)"
+       inkscape:export-filename="/home/torsten/Bilder/your-part/backgrounds/taxi/topleft.png"
+       inkscape:export-xdpi="63.5"
+       inkscape:export-ydpi="63.5" />
+    <rect
+       style="fill:#1a1a1a;fill-rule:evenodd;stroke:none;stroke-width:0.295381;stroke-miterlimit:3.3"
+       id="rect986-6"
+       width="100"
+       height="50"
+       x="-200"
+       y="-125"
+       ry="0"
+       transform="scale(-1)"
+       inkscape:export-filename="/home/torsten/Bilder/your-part/backgrounds/taxi/topleft.png"
+       inkscape:export-xdpi="63.5"
+       inkscape:export-ydpi="63.5" />
+  </g>
+</svg>

frontend/public/images/taxi/tup.svg

@@ -0,0 +1,81 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="200mm"
+   height="200mm"
+   viewBox="0 0 200 200"
+   version="1.1"
+   id="svg5"
+   inkscape:version="1.1.1 (3bf5ae0d25, 2021-09-20)"
+   sodipodi:docname="tup.svg"
+   inkscape:export-filename="/home/torsten/Bilder/your-part/backgrounds/taxi/tright.png"
+   inkscape:export-xdpi="63.5"
+   inkscape:export-ydpi="63.5"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <sodipodi:namedview
+     id="namedview7"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:document-units="mm"
+     showgrid="false"
+     inkscape:zoom="1.1224747"
+     inkscape:cx="391.54557"
+     inkscape:cy="427.18112"
+     inkscape:window-width="1920"
+     inkscape:window-height="1009"
+     inkscape:window-x="1920"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer1"
+     width="200mm" />
+  <defs
+     id="defs2" />
+  <g
+     inkscape:label="Ebene 1"
+     inkscape:groupmode="layer"
+     id="layer1">
+    <rect
+       style="fill:#008000;fill-rule:evenodd;stroke:none;stroke-width:0.698168;stroke-miterlimit:3.3"
+       id="rect846"
+       width="200"
+       height="200"
+       x="-200"
+       y="0"
+       inkscape:export-filename="/home/torsten/Bilder/your-part/backgrounds/taxi/topleft.png"
+       inkscape:export-xdpi="63.5"
+       inkscape:export-ydpi="63.5"
+       transform="rotate(-90)" />
+    <rect
+       style="fill:#1a1a1a;fill-rule:evenodd;stroke:none;stroke-width:0.29538;stroke-miterlimit:3.3"
+       id="rect986"
+       width="100"
+       height="50"
+       x="-100"
+       y="75"
+       ry="0"
+       inkscape:export-filename="/home/torsten/Bilder/your-part/backgrounds/taxi/tbottom.png"
+       inkscape:export-xdpi="63.5"
+       inkscape:export-ydpi="63.5"
+       transform="rotate(-90)" />
+    <rect
+       style="fill:#1a1a1a;fill-rule:evenodd;stroke:none;stroke-width:0.417732;stroke-miterlimit:3.3"
+       id="rect986-6"
+       width="200"
+       height="50"
+       x="-200"
+       y="-125"
+       ry="0"
+       transform="scale(-1)"
+       inkscape:export-filename="/home/torsten/Bilder/your-part/backgrounds/taxi/topleft.png"
+       inkscape:export-xdpi="63.5"
+       inkscape:export-ydpi="63.5" />
+  </g>
+</svg>

frontend/public/images/taxi/vertical.svg

@@ -0,0 +1,69 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="200mm"
+   height="200mm"
+   viewBox="0 0 200 200"
+   version="1.1"
+   id="svg5"
+   inkscape:version="1.1.1 (3bf5ae0d25, 2021-09-20)"
+   sodipodi:docname="vertical.svg"
+   inkscape:export-filename="/home/torsten/Bilder/your-part/backgrounds/taxi/horizontal.png"
+   inkscape:export-xdpi="63.5"
+   inkscape:export-ydpi="63.5"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <sodipodi:namedview
+     id="namedview7"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:document-units="mm"
+     showgrid="false"
+     inkscape:zoom="1.1224747"
+     inkscape:cx="391.54557"
+     inkscape:cy="498.45221"
+     inkscape:window-width="1920"
+     inkscape:window-height="1009"
+     inkscape:window-x="1920"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer1"
+     width="200mm" />
+  <defs
+     id="defs2" />
+  <g
+     inkscape:label="Ebene 1"
+     inkscape:groupmode="layer"
+     id="layer1">
+    <rect
+       style="fill:#008000;fill-rule:evenodd;stroke:none;stroke-width:0.698168;stroke-miterlimit:3.3"
+       id="rect846"
+       width="200"
+       height="200"
+       x="-200"
+       y="-200"
+       transform="matrix(0,-1,-1,0,0,0)"
+       inkscape:export-filename="/home/torsten/Bilder/your-part/backgrounds/taxi/topleft.png"
+       inkscape:export-xdpi="63.5"
+       inkscape:export-ydpi="63.5" />
+    <rect
+       style="fill:#1a1a1a;fill-rule:evenodd;stroke:none;stroke-width:0.417731;stroke-miterlimit:3.3"
+       id="rect986"
+       width="200"
+       height="50"
+       x="-200"
+       y="-125"
+       ry="0"
+       transform="matrix(0,-1,-1,0,0,0)"
+       inkscape:export-filename="/home/torsten/Bilder/your-part/backgrounds/taxi/topleft.png"
+       inkscape:export-xdpi="63.5"
+       inkscape:export-ydpi="63.5" />
+  </g>
+</svg>

frontend/src/data/streetCoordinates.json

@@ -0,0 +1,323 @@
+{
+  "tileSize": 640,
+  "tiles": {
+    "cornerBottomRight": {
+      "regions": [
+        [
+          {"x": 0, "y": 0},
+          {"x": 0, "y": 1},
+          {"x": 0.375, "y": 1},
+          {"x": 0.375, "y": 0.427},
+          {"x": 0.38, "y": 0.409},
+          {"x": 0.389, "y": 0.397},
+          {"x": 0.4, "y": 0.388},
+          {"x": 0.408, "y": 0.397},
+          {"x": 0.417, "y": 0.38},
+          {"x": 0.434, "y": 0.375},
+          {"x": 1, "y": 0.375},
+          {"x": 1, "y": 0}
+        ],
+        [
+          {"x": 0.625, "y": 1},
+          {"x": 0.625, "y": 0.663},
+          {"x": 0.629, "y": 0.651},
+          {"x": 0.632, "y": 0.647},
+          {"x": 0.634, "y": 0.642},
+          {"x": 0.641, "y": 0.636},
+          {"x": 0.648, "y": 0.632},
+          {"x": 0.656, "y": 0.625},
+          {"x": 1, "y": 0.625},
+          {"x": 1, "y": 1}
+        ]
+      ]
+    },
+    "cornerBottomLeft": {
+      "regions": [
+        [
+          {"x": 0, "y": 0.375},
+          {"x": 0.575, "y": 0.375},
+          {"x": 0.588, "y": 0.38},
+          {"x": 0.6, "y": 0.386},
+          {"x": 0.611, "y": 0.395},
+          {"x": 0.619, "y": 0.406},
+          {"x": 0.625, "y": 0.422},
+          {"x": 0.625, "y": 1},
+          {"x": 1, "y": 1},
+          {"x": 1, "y": 0},
+          {"x": 0, "y": 0}
+        ],
+        [
+          {"x": 0, "y": 0.625},
+          {"x": 0.336, "y": 0.625},
+          {"x": 0.35, "y": 0.629},
+          {"x": 0.359, "y": 0.636},
+          {"x": 0.366, "y": 0.642},
+          {"x": 0.373, "y": 0.651},
+          {"x": 0.375, "y": 0.659},
+          {"x": 0.375, "y": 1},
+          {"x": 0, "y": 1}
+        ]
+      ]
+    },
+    "cornerTopLeft": {
+      "regions": [
+        [
+          {"x": 0.375, "y": 0},
+          {"x": 0.375, "y": 0.339},
+          {"x": 0.372, "y": 0.353},
+          {"x": 0.366, "y": 0.363},
+          {"x": 0.361, "y": 0.367},
+          {"x": 0.356, "y": 0.37},
+          {"x": 0.348, "y": 0.373},
+          {"x": 0.336, "y": 0.375},
+          {"x": 0, "y": 0.375},
+          {"x": 0, "y": 0}
+        ],
+        [
+          {"x": 0.625, "y": 0},
+          {"x": 0.625, "y": 0.583},
+          {"x": 0.62, "y": 0.594},
+          {"x": 0.615, "y": 0.605},
+          {"x": 0.605, "y": 0.614},
+          {"x": 0.594, "y": 0.621},
+          {"x": 0.584, "y": 0.625},
+          {"x": 0, "y": 0.625},
+          {"x": 0, "y": 1},
+          {"x": 1, "y": 1},
+          {"x": 1, "y": 0}
+        ]
+      ]
+    },
+    "cornerTopRight": {
+      "regions": [
+        [
+          {"x": 0.375, "y": 0},
+          {"x": 0.375, "y": 0.583},
+          {"x": 0.38, "y": 0.594},
+          {"x": 0.384, "y": 0.605},
+          {"x": 0.395, "y": 0.614},
+          {"x": 0.406, "y": 0.621},
+          {"x": 0.416, "y": 0.625},
+          {"x": 1, "y": 0.625},
+          {"x": 1, "y": 1},
+          {"x": 0, "y": 1},
+          {"x": 0, "y": 0}
+        ],
+        [
+          {"x": 0.625, "y": 0},
+          {"x": 0.625, "y": 0.339},
+          {"x": 0.628, "y": 0.353},
+          {"x": 0.634, "y": 0.363},
+          {"x": 0.639, "y": 0.367},
+          {"x": 0.644, "y": 0.37},
+          {"x": 0.652, "y": 0.373},
+          {"x": 0.664, "y": 0.375},
+          {"x": 1, "y": 0.375},
+          {"x": 1, "y": 0}
+        ]
+      ]
+    },
+    "horizontal": {
+      "regions": [
+        [
+          {"x": 0, "y": 0.375},
+          {"x": 1, "y": 0.375},
+          {"x": 1, "y": 0},
+          {"x": 0, "y": 0}
+        ],
+        [
+          {"x": 0, "y": 0.625},
+          {"x": 1, "y": 0.625},
+          {"x": 1, "y": 1},
+          {"x": 0, "y": 1}
+        ]
+      ]
+    },
+    "vertical": {
+      "regions": [
+        [
+          {"x": 0.375, "y": 0},
+          {"x": 0.375, "y": 1},
+          {"x": 0, "y": 1},
+          {"x": 0, "y": 0}
+        ],
+        [
+          {"x": 0.625, "y": 0},
+          {"x": 0.625, "y": 1},
+          {"x": 1, "y": 1},
+          {"x": 1, "y": 0}
+        ]
+      ]
+    },
+    "cross": {
+      "regions": [
+        [
+          {"x": 0.375, "y": 0},
+          {"x": 0.375, "y": 0.375},
+          {"x": 0, "y": 0.375},
+          {"x": 0, "y": 0}
+        ],
+        [
+          {"x": 0.625, "y": 0},
+          {"x": 0.625, "y": 0.375},
+          {"x": 1, "y": 0.375},
+          {"x": 1, "y": 0}
+        ],
+        [
+          {"x": 0.375, "y": 1},
+          {"x": 0.375, "y": 0.625},
+          {"x": 0, "y": 0.625},
+          {"x": 0, "y": 1}
+        ],
+        [
+          {"x": 0.625, "y": 1},
+          {"x": 0.625, "y": 0.625},
+          {"x": 1, "y": 0.625},
+          {"x": 1, "y": 1}
+        ]
+      ]
+    },
+    "fuelHorizontal": {
+      "regions": [
+        [
+          {"x": 0, "y": 0.375},
+          {"x": 0.075, "y": 0.375},
+          {"x": 0.384, "y": 0.195},
+          {"x": 0.615, "y": 0.195},
+          {"x": 0.925, "y": 0.375},
+          {"x": 1, "y": 0.375},
+          {"x": 1, "y": 0},
+          {"x": 0, "y": 0}
+        ],
+        [
+          {"x": 0.25, "y": 0.375},
+          {"x": 0.384, "y": 0.299},
+          {"x": 0.615, "y": 0.299},
+          {"x": 0.75, "y": 0.375},
+          {"x": 0.25, "y": 0.375}
+        ],
+        [
+          {"x": 0, "y": 0.625},
+          {"x": 1, "y": 0.625},
+          {"x": 1, "y": 1},
+          {"x": 0, "y": 1}
+        ]
+      ]
+    },
+    "fuelVertical": {
+      "regions": [
+        [
+          {"x": 0.625, "y": 0},
+          {"x": 0.625, "y": 0.075},
+          {"x": 0.805, "y": 0.384},
+          {"x": 0.805, "y": 0.615},
+          {"x": 0.625, "y": 0.925},
+          {"x": 0.625, "y": 1},
+          {"x": 1, "y": 1},
+          {"x": 1, "y": 0}
+        ],
+        [
+          {"x": 0.625, "y": 0.25},
+          {"x": 0.701, "y": 0.384},
+          {"x": 0.701, "y": 0.615},
+          {"x": 0.625, "y": 0.75},
+          {"x": 0.625, "y": 0.25}
+        ],
+        [
+          {"x": 0.375, "y": 0},
+          {"x": 0.375, "y": 1},
+          {"x": 0, "y": 1},
+          {"x": 0, "y": 0}
+        ]
+      ]
+    },
+    "tLeft": {
+      "regions": [
+        [
+          {"x": 0, "y": 0.375},
+          {"x": 0.375, "y": 0.375},
+          {"x": 0.375, "y": 0},
+          {"x": 0, "y": 0}
+        ],
+        [
+          {"x": 0, "y": 0.625},
+          {"x": 0.375, "y": 0.625},
+          {"x": 0.375, "y": 1},
+          {"x": 0, "y": 1}
+        ],
+        [
+          {"x": 0.625, "y": 0},
+          {"x": 0.625, "y": 1},
+          {"x": 1, "y": 1},
+          {"x": 1, "y": 0}
+        ]
+      ]
+    },
+    "tRight": {
+      "regions": [
+        [
+          {"x": 0.375, "y": 0},
+          {"x": 0.375, "y": 1},
+          {"x": 0, "y": 1},
+          {"x": 0, "y": 0}
+        ],
+        [
+          {"x": 0.625, "y": 0},
+          {"x": 0.625, "y": 0.375},
+          {"x": 1, "y": 0.375},
+          {"x": 1, "y": 0}
+        ],
+        [
+          {"x": 0.625, "y": 1},
+          {"x": 0.625, "y": 0.625},
+          {"x": 1, "y": 0.625},
+          {"x": 1, "y": 1}
+        ]
+      ]
+    },
+    "tUp": {
+      "regions": [
+        [
+          {"x": 0, "y": 0.375},
+          {"x": 0.375, "y": 0.375},
+          {"x": 0.375, "y": 0},
+          {"x": 0, "y": 0}
+        ],
+        [
+          {"x": 1, "y": 0.375},
+          {"x": 0.625, "y": 0.375},
+          {"x": 0.625, "y": 0},
+          {"x": 1, "y": 0}
+        ],
+        [
+          {"x": 0, "y": 0.625},
+          {"x": 1, "y": 0.625},
+          {"x": 1, "y": 1},
+          {"x": 0, "y": 1}
+        ]
+      ]
+    },
+    "tDown": {
+      "regions": [
+        [
+          {"x": 0, "y": 0.375},
+          {"x": 1, "y": 0.375},
+          {"x": 1, "y": 0},
+          {"x": 0, "y": 0}
+        ],
+        [
+          {"x": 0, "y": 0.625},
+          {"x": 0.375, "y": 0.625},
+          {"x": 0.375, "y": 1},
+          {"x": 0, "y": 1}
+        ],
+        [
+          {"x": 1, "y": 0.625},
+          {"x": 0.625, "y": 0.625},
+          {"x": 0.625, "y": 1},
+          {"x": 1, "y": 1}
+        ]
+      ]
+    }
+  }
+}

frontend/src/i18n/locales/de/admin.json

@@ -192,6 +192,34 @@
             "totalUsers": "Gesamtanzahl Benutzer",
             "genderDistribution": "Geschlechterverteilung",
             "ageDistribution": "Altersverteilung"
+        },
+        "taxiTools": {
+            "title": "Taxi-Tools",
+            "description": "Verwalte Taxi-Maps, Level und Konfigurationen",
+            "mapEditor": {
+                "title": "Map bearbeiten",
+                "availableMaps": "Verfügbare Maps: {count}",
+                "newMap": "Neue Map erstellen",
+                "mapFormat": "{name} (Position: {x},{y})",
+                "mapName": "Map-Name",
+                "mapDescription": "Beschreibung",
+                "mapWidth": "Breite",
+                "mapHeight": "Höhe",
+                "tileSize": "Tile-Größe",
+                "positionX": "X-Position",
+                "positionY": "Y-Position",
+                "mapType": "Map-Typ",
+                "mapLayout": "Map-Layout",
+                "tilePalette": "Tile-Palette",
+                "position": "Position",
+                "fillAllRoads": "Alle Straßen",
+                "clearAll": "Alle löschen",
+                "generateRandom": "Zufällig generieren",
+                "delete": "Löschen",
+                "update": "Aktualisieren",
+                "cancel": "Abbrechen",
+                "create": "Erstellen"
+            }
         }
     }
 }

frontend/src/i18n/locales/de/minigames.json

@@ -33,6 +33,37 @@
       "totalStars": "Gesamtsterne",
       "levelsCompleted": "Abgeschlossene Level",
       "restartCampaign": "Kampagne neu starten"
+    },
+    "taxi": {
+      "title": "Taxi Simulator",
+      "description": "Fahre Passagiere durch die Stadt und verdiene Geld!",
+      "gameStats": "Spiel-Statistiken",
+      "score": "Punkte",
+      "money": "Geld",
+      "passengers": "Passagiere",
+      "currentLevel": "Aktueller Level",
+      "level": "Level",
+      "fuel": "Treibstoff",
+      "fuelLeft": "Verbleibender Treibstoff",
+      "restartLevel": "Level neu starten",
+      "pause": "Pause",
+      "resume": "Weiterspielen",
+      "paused": "Spiel pausiert",
+      "levelComplete": "Level abgeschlossen!",
+      "levelScore": "Level-Punktzahl",
+      "moneyEarned": "Verdientes Geld",
+      "passengersDelivered": "Beförderte Passagiere",
+      "nextLevel": "Nächster Level",
+      "campaignComplete": "Kampagne abgeschlossen!",
+      "totalScore": "Gesamtpunktzahl",
+      "totalMoney": "Gesamtgeld",
+      "levelsCompleted": "Abgeschlossene Level",
+      "restartCampaign": "Kampagne neu starten",
+      "pickupPassenger": "Passagier aufnehmen",
+      "deliverPassenger": "Passagier abliefern",
+      "refuel": "Tanken",
+      "startEngine": "Motor starten",
+      "stopEngine": "Motor stoppen"
     }
   }
 }

frontend/src/i18n/locales/de/navigation.json

@@ -30,7 +30,8 @@
             }
         },
         "m-minigames": {
-            "match3": "Match 3 - Juwelen"
+            "match3": "Match 3 - Juwelen",
+            "taxi": "Taxi Simulator"
         },
         "m-settings": {
             "homepage": "Startseite",
@@ -60,7 +61,8 @@
             },
             "minigames": "Minispiele",
             "m-minigames": {
-                "match3": "Match3 Level"
+                "match3": "Match3 Level",
+                "taxiTools": "Taxi-Tools"
             },
             "chatrooms": "Chaträume"
         },

frontend/src/i18n/locales/en/admin.json

@@ -192,6 +192,34 @@
             "totalUsers": "Total Users",
             "genderDistribution": "Gender Distribution",
             "ageDistribution": "Age Distribution"
+        },
+        "taxiTools": {
+            "title": "Taxi Tools",
+            "description": "Manage Taxi maps, levels and configurations",
+            "mapEditor": {
+                "title": "Edit Map",
+                "availableMaps": "Available Maps: {count}",
+                "newMap": "Create New Map",
+                "mapFormat": "{name} (Position: {x},{y})",
+                "mapName": "Map Name",
+                "mapDescription": "Description",
+                "mapWidth": "Width",
+                "mapHeight": "Height",
+                "tileSize": "Tile Size",
+                "positionX": "X Position",
+                "positionY": "Y Position",
+                "mapType": "Map Type",
+                "mapLayout": "Map Layout",
+                "tilePalette": "Tile Palette",
+                "position": "Position",
+                "fillAllRoads": "All Roads",
+                "clearAll": "Clear All",
+                "generateRandom": "Generate Random",
+                "delete": "Delete",
+                "update": "Update",
+                "cancel": "Cancel",
+                "create": "Create"
+            }
         }
     }
 }

frontend/src/i18n/locales/en/minigames.json

@@ -33,6 +33,37 @@
       "totalStars": "Total Stars",
       "levelsCompleted": "Levels Completed",
       "restartCampaign": "Restart Campaign"
+    },
+    "taxi": {
+      "title": "Taxi Simulator",
+      "description": "Drive passengers through the city and earn money!",
+      "gameStats": "Game Statistics",
+      "score": "Score",
+      "money": "Money",
+      "passengers": "Passengers",
+      "currentLevel": "Current Level",
+      "level": "Level",
+      "fuel": "Fuel",
+      "fuelLeft": "Fuel Left",
+      "restartLevel": "Restart Level",
+      "pause": "Pause",
+      "resume": "Resume",
+      "paused": "Game Paused",
+      "levelComplete": "Level Complete!",
+      "levelScore": "Level Score",
+      "moneyEarned": "Money Earned",
+      "passengersDelivered": "Passengers Delivered",
+      "nextLevel": "Next Level",
+      "campaignComplete": "Campaign Complete!",
+      "totalScore": "Total Score",
+      "totalMoney": "Total Money",
+      "levelsCompleted": "Levels Completed",
+      "restartCampaign": "Restart Campaign",
+      "pickupPassenger": "Pick up Passenger",
+      "deliverPassenger": "Deliver Passenger",
+      "refuel": "Refuel",
+      "startEngine": "Start Engine",
+      "stopEngine": "Stop Engine"
     }
   }
 }

frontend/src/i18n/locales/en/navigation.json

@@ -30,7 +30,8 @@
             }
         },
         "m-minigames": {
-            "match3": "Match 3 - Jewels"
+            "match3": "Match 3 - Jewels",
+            "taxi": "Taxi Simulator"
         },
         "m-settings": {
             "homepage": "Homepage",
@@ -60,7 +61,8 @@
             },
             "minigames": "Mini games",
             "m-minigames": {
-                "match3": "Match3 Levels"
+                "match3": "Match3 Levels",
+                "taxiTools": "Taxi Tools"
             },
             "chatrooms": "Chat rooms"
         },

frontend/src/router/adminRoutes.js

@@ -5,6 +5,7 @@ import UserRightsView from '../views/admin/UserRightsView.vue';
 import ForumAdminView from '../dialogues/admin/ForumAdminView.vue';
 import AdminFalukantEditUserView from '../views/admin/falukant/EditUserView.vue';
 import AdminMinigamesView from '../views/admin/MinigamesView.vue';
+import AdminTaxiToolsView from '../views/admin/TaxiToolsView.vue';
 import AdminUsersView from '../views/admin/UsersView.vue';
 import UserStatisticsView from '../views/admin/UserStatisticsView.vue';
 
@@ -62,6 +63,12 @@ const adminRoutes = [
         name: 'AdminMinigames',
         component: AdminMinigamesView,
         meta: { requiresAuth: true }
+    },
+    {
+        path: '/admin/minigames/taxi-tools',
+        name: 'AdminTaxiTools',
+        component: AdminTaxiToolsView,
+        meta: { requiresAuth: true }
     }
 ];
 

frontend/src/router/minigamesRoutes.js

@@ -1,4 +1,5 @@
 import Match3Game from '../views/minigames/Match3Game.vue';
+import TaxiGame from '../views/minigames/TaxiGame.vue';
 
 const minigamesRoutes = [
   {
@@ -6,6 +7,12 @@ const minigamesRoutes = [
     name: 'Match3Game',
     component: Match3Game,
     meta: { requiresAuth: true }
+  },
+  {
+    path: '/minigames/taxi',
+    name: 'TaxiGame',
+    component: TaxiGame,
+    meta: { requiresAuth: true }
   }
 ];
 

frontend/src/utils/streetCoordinates.js

@@ -0,0 +1,141 @@
+import streetData from '../data/streetCoordinates.json';
+
+class StreetCoordinates {
+  constructor() {
+    this.data = streetData;
+  }
+
+  /**
+   * Konvertiert relative Koordinaten (0-1) zu absoluten Koordinaten
+   * @param {number} relativeX - Relative X-Koordinate (0-1)
+   * @param {number} relativeY - Relative Y-Koordinate (0-1)
+   * @param {number} tileSize - Größe des Tiles in Pixeln
+   * @returns {Object} Absolute Koordinaten {x, y}
+   */
+  toAbsolute(relativeX, relativeY, tileSize) {
+    return {
+      x: Math.round(relativeX * tileSize),
+      y: Math.round(relativeY * tileSize)
+    };
+  }
+
+  /**
+   * Konvertiert absolute Koordinaten zu relativen Koordinaten (0-1)
+   * @param {number} absoluteX - Absolute X-Koordinate
+   * @param {number} absoluteY - Absolute Y-Koordinate
+   * @param {number} tileSize - Größe des Tiles in Pixeln
+   * @returns {Object} Relative Koordinaten {x, y}
+   */
+  toRelative(absoluteX, absoluteY, tileSize) {
+    return {
+      x: absoluteX / tileSize,
+      y: absoluteY / tileSize
+    };
+  }
+
+  /**
+   * Gibt die Straßenregionen für einen Tile-Typ zurück
+   * @param {string} tileType - Typ des Tiles (z.B. 'cornerBottomRight')
+   * @param {number} tileSize - Größe des Tiles in Pixeln
+   * @returns {Array} Array von Polygonen mit absoluten Koordinaten
+   */
+  getDriveableRegions(tileType, tileSize) {
+    const tile = this.data.tiles[tileType];
+    if (!tile) {
+      console.warn(`Tile type '${tileType}' not found`);
+      return [];
+    }
+
+    return tile.regions.map(region => 
+      region.map(point => this.toAbsolute(point.x, point.y, tileSize))
+    );
+  }
+
+  /**
+   * Prüft, ob ein Punkt innerhalb der fahrbaren Bereiche liegt
+   * @param {number} x - X-Koordinate des Punktes
+   * @param {number} y - Y-Koordinate des Punktes
+   * @param {string} tileType - Typ des Tiles
+   * @param {number} tileSize - Größe des Tiles in Pixeln
+   * @returns {boolean} True wenn der Punkt fahrbar ist
+   */
+  isPointDriveable(x, y, tileType, tileSize) {
+    const regions = this.getDriveableRegions(tileType, tileSize);
+    
+    for (const region of regions) {
+      if (this.isPointInPolygon(x, y, region)) {
+        return true;
+      }
+    }
+    
+    return false;
+  }
+
+  /**
+   * Prüft, ob ein Punkt innerhalb eines Polygons liegt (Ray Casting Algorithm)
+   * @param {number} x - X-Koordinate des Punktes
+   * @param {number} y - Y-Koordinate des Punktes
+   * @param {Array} polygon - Array von {x, y} Punkten
+   * @returns {boolean} True wenn der Punkt im Polygon liegt
+   */
+  isPointInPolygon(x, y, polygon) {
+    let inside = false;
+    for (let i = 0, j = polygon.length - 1; i < polygon.length; j = i++) {
+      if (((polygon[i].y > y) !== (polygon[j].y > y)) &&
+          (x < (polygon[j].x - polygon[i].x) * (y - polygon[i].y) / (polygon[j].y - polygon[i].y) + polygon[i].x)) {
+        inside = !inside;
+      }
+    }
+    return inside;
+  }
+
+  /**
+   * Zeichnet die Straßenregionen auf einem Canvas
+   * @param {CanvasRenderingContext2D} ctx - Canvas 2D Context
+   * @param {string} tileType - Typ des Tiles
+   * @param {number} tileSize - Größe des Tiles in Pixeln
+   * @param {number} offsetX - X-Offset für das Tile
+   * @param {number} offsetY - Y-Offset für das Tile
+   */
+  drawDriveableRegions(ctx, tileType, tileSize, offsetX = 0, offsetY = 0) {
+    const regions = this.getDriveableRegions(tileType, tileSize);
+    
+    ctx.fillStyle = '#f0f0f0'; // Straßenfarbe
+    ctx.strokeStyle = '#333';
+    ctx.lineWidth = 1;
+    
+    for (const region of regions) {
+      ctx.beginPath();
+      ctx.moveTo(region[0].x + offsetX, region[0].y + offsetY);
+      
+      for (let i = 1; i < region.length; i++) {
+        ctx.lineTo(region[i].x + offsetX, region[i].y + offsetY);
+      }
+      
+      ctx.closePath();
+      ctx.fill();
+      ctx.stroke();
+    }
+  }
+
+  /**
+   * Gibt alle verfügbaren Tile-Typen zurück
+   * @returns {Array} Array von Tile-Typen
+   */
+  getAvailableTileTypes() {
+    return Object.keys(this.data.tiles);
+  }
+
+  /**
+   * Gibt die ursprüngliche Tile-Größe zurück
+   * @returns {number} Ursprüngliche Tile-Größe in Pixeln
+   */
+  getOriginalTileSize() {
+    return this.data.tileSize;
+  }
+}
+
+// Singleton-Instanz
+const streetCoordinates = new StreetCoordinates();
+
+export default streetCoordinates;

frontend/src/views/minigames/MinigamesView.vue

@@ -1,116 +0,0 @@
-<template>
-  <div class="minigames-view">
-    <v-container>
-      <v-row>
-        <v-col cols="12">
-          <h1 class="text-h3 mb-6">{{ $t('minigames.title') }}</h1>
-          <p class="text-body-1 mb-8">{{ $t('minigames.description') }}</p>
-        </v-col>
-      </v-row>
-      
-      <v-row>
-        <v-col cols="12" md="6" lg="4">
-          <v-card 
-            class="game-card" 
-            @click="navigateToGame('match3')"
-            hover
-            elevation="4"
-          >
-            <v-img
-              src="/images/icons/game.png"
-              height="200"
-              cover
-              class="game-image"
-            ></v-img>
-            <v-card-title class="text-h5">
-              {{ $t('minigames.match3.title') }}
-            </v-card-title>
-            <v-card-text>
-              {{ $t('minigames.match3.description') }}
-            </v-card-text>
-            <v-card-actions>
-              <v-btn 
-                color="primary" 
-                variant="elevated"
-                @click="navigateToGame('match3')"
-              >
-                {{ $t('minigames.play') }}
-              </v-btn>
-            </v-card-actions>
-          </v-card>
-        </v-col>
-        
-        <!-- Platzhalter für weitere Spiele -->
-        <v-col cols="12" md="6" lg="4">
-          <v-card class="game-card coming-soon" disabled>
-            <v-img
-              src="/images/icons/coming-soon.png"
-              height="200"
-              cover
-              class="game-image"
-            ></v-img>
-            <v-card-title class="text-h5">
-              {{ $t('minigames.comingSoon.title') }}
-            </v-card-title>
-            <v-card-text>
-              {{ $t('minigames.comingSoon.description') }}
-            </v-card-text>
-            <v-card-actions>
-              <v-btn disabled>
-                {{ $t('minigames.comingSoon') }}
-              </v-btn>
-            </v-card-actions>
-          </v-card>
-        </v-col>
-      </v-row>
-    </v-container>
-  </div>
-</template>
-
-<script>
-export default {
-  name: 'MinigamesView',
-  methods: {
-    navigateToGame(game) {
-      this.$router.push(`/minigames/${game}`);
-    }
-  }
-}
-</script>
-
-<style scoped>
-.minigames-view {
-  min-height: 100vh;
-  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
-  padding: 20px 0;
-}
-
-.game-card {
-  transition: transform 0.3s ease, box-shadow 0.3s ease;
-  cursor: pointer;
-  border-radius: 16px;
-  overflow: hidden;
-}
-
-.game-card:hover:not(.coming-soon) {
-  transform: translateY(-8px);
-  box-shadow: 0 12px 24px rgba(0,0,0,0.3);
-}
-
-.game-image {
-  background: linear-gradient(45deg, #ff6b6b, #4ecdc4);
-}
-
-.coming-soon {
-  opacity: 0.7;
-}
-
-h1 {
-  color: white;
-  text-shadow: 2px 2px 4px rgba(0,0,0,0.3);
-}
-
-p {
-  color: rgba(255,255,255,0.9);
-}
-</style>