Boek een Luxe Taxi
body {
font-family: ‘Inter’, sans-serif;
background: linear-gradient(135deg, #1e1e2f, #2c3e50);
color: white;
margin: 0;
padding: 40px 20px;
}
.container {
max-width: 600px;
margin: auto;
background: rgba(255, 255, 255, 0.05);
backdrop-filter: blur(12px);
padding: 30px;
border-radius: 16px;
box-shadow: 0 20px 50px rgba(0, 0, 0, 0.4);
}
h1 {
text-align: center;
margin-bottom: 30px;
font-size: 28px;
font-weight: 600;
}
label {
display: block;
margin-top: 15px;
font-weight: 600;
}
input {
width: 100%;
padding: 12px;
margin-top: 6px;
border-radius: 8px;
border: none;
background: rgba(255, 255, 255, 0.1);
color: white;
}
input::placeholder {
color: #ccc;
}
.btn {
margin-top: 20px;
padding: 14px;
width: 100%;
background: #00c896;
border: none;
border-radius: 10px;
font-size: 16px;
font-weight: 600;
color: white;
cursor: pointer;
transition: background 0.3s;
}
.btn:hover {
background: #00a97a;
}
#prijs {
margin-top: 20px;
font-size: 18px;
color: #00e6b0;
font-weight: bold;
text-align: center;
}
.btn-secondary {
background: #2d2d44;
margin-top: 10px;
}
@media (max-width: 500px) {
.container {
padding: 20px;
}
}
🚖 Luxe Taxi Boeking
👤 Naam
📧 E-mailadres
📍 Ophaallocatie
🏁 Bestemming
📅 Datum
⏰ Tijd
Prijs: €0,00
💰 Bereken Prijs
✅ Boek Nu
https://maps.googleapis.com/maps/api/js?key=JOUW_GOOGLE_API_KEY&libraries=places
function berekenPrijs() {
const startTarief = 4.00;
const prijsPerKm = 3.00;
const prijsPerMinuut = 0.50;
const origin = document.getElementById(“ophaal”).value;
const destination = document.getElementById(“bestemming”).value;
if (!origin || !destination) {
alert(“Vul zowel ophaal- als bestemmingslocatie in.”);
return;
}
const service = new google.maps.DistanceMatrixService();
service.getDistanceMatrix({
origins: [origin],
destinations: [destination],
travelMode: ‘DRIVING’,
unitSystem: google.maps.UnitSystem.METRIC,
}, function(response, status) {
if (status !== ‘OK’) {
alert(‘Fout bij berekening: ‘ + status);
} else {
const result = response.rows[0].elements[0];
if (result.status === “ZERO_RESULTS”) {
alert(“Geen route gevonden.”);
return;
}
const afstandKm = result.distance.value / 1000;
const duurMin = result.duration.value / 60;
const totaalPrijs = startTarief + (afstandKm * prijsPerKm) + (duurMin * prijsPerMinuut);
document.getElementById(“prijs”).innerText =
`Prijs: €${totaalPrijs.toFixed(2)} (±${afstandKm.toFixed(1)} km, ${duurMin.toFixed(0)} min)`;
document.getElementById(“afstand”).value = afstandKm.toFixed(2);
document.getElementById(“duur”).value = duurMin.toFixed(0);
}
});
}