138 lines
5.5 KiB
HTML
138 lines
5.5 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<link rel="stylesheet" href="./css/style.css">
|
|
<title>Practica 4 Formularios</title>
|
|
</head>
|
|
|
|
<body>
|
|
|
|
<form class="form_citas" action="../gracias.html" method="get">
|
|
|
|
<div class="form_title">
|
|
<h1>Pide Cita</h1>
|
|
</div>
|
|
|
|
<div class="form_main">
|
|
<fieldset>
|
|
<legend>Datos Cliente</legend>
|
|
<div class="flex_responsive">
|
|
<label for="nombre">* Nombre</label>
|
|
<input type="text" name="nombre" id="nombre" required>
|
|
</div>
|
|
<div class="flex_responsive">
|
|
<label for="apellidos">* Apellidos</label>
|
|
<input type="text" name="apellidos" id="apellidos" required>
|
|
</div>
|
|
<div class="flex_responsive">
|
|
<label for="telefono">* Telefono</label>
|
|
<input type="tel" name="telefono" id="telefono" required>
|
|
</div>
|
|
<div class="flex_responsive">
|
|
<label for="email">* Email</label>
|
|
<input type="email" name="email" id="email" autocomplete="on" required>
|
|
</div>
|
|
</fieldset>
|
|
<fieldset>
|
|
<legend>Datos de reserva</legend>
|
|
<h4>* Tarjeta de descuento</h4>
|
|
<div class="flex_responsive">
|
|
<div>
|
|
<input type="radio" name="tarjetadesc" id="tarjeta10" value="10">
|
|
<label for="tarjeta10">10%</label>
|
|
</div>
|
|
<div>
|
|
<input type="radio" name="tarjetadesc" id="tarjeta20" value="20">
|
|
<label for="tarjeta20">20%</label>
|
|
</div>
|
|
<div>
|
|
<input type="radio" name="tarjetadesc" id="sintarjeta" value="0" checked>
|
|
<label for="sintarjeta">Ninguna</label>
|
|
</div>
|
|
</div>
|
|
|
|
<h4>* Marca del vehiculo</h4>
|
|
<input class="input_std" id="marcavehiculo" list="marcas" required>
|
|
<datalist id="marcas">
|
|
<option value="Ford">
|
|
<option value="Audi">
|
|
<option value="Seat">
|
|
<option value="Mazda">
|
|
<option value="Toyota">
|
|
</datalist>
|
|
|
|
<h4>* Tipo de reparacion</h4>
|
|
<div class="flex_responsive">
|
|
<div>
|
|
<input type="radio" name="tiporeparacion" id="mecanica" value="mecanica" required>
|
|
<label for="mecanica">Mecanica</label>
|
|
</div>
|
|
<div>
|
|
<input type="radio" name="tiporeparacion" id="chapa" value="chapa">
|
|
<label for="chapa">Chapa</label>
|
|
</div>
|
|
<div>
|
|
<input type="radio" name="tiporeparacion" id="mecanicachapa" value="mecanicachapa">
|
|
<label style="width: auto;" for="mecanicachapa">Mecanica & Chapa</label>
|
|
</div>
|
|
</div>
|
|
|
|
<h4>* Vehiculo de sustitucion</h4>
|
|
<div class="flex_responsive">
|
|
<div>
|
|
<input type="radio" name="vehiculosus" id="sinvehiculo" value="sinvehiculo" required>
|
|
<label for="sinvehiculo">No necesita</label>
|
|
</div>
|
|
<div>
|
|
<input type="radio" name="vehiculosus" id="turismo" value="turismo">
|
|
<label for="turismo">Turismo</label>
|
|
</div>
|
|
<div>
|
|
<input type="radio" name="vehiculosus" id="furgoneta" value="furgoneta">
|
|
<label style="width: auto;" for="furgoneta">Furgoneta</label>
|
|
</div>
|
|
</div>
|
|
|
|
<h4>* Preferencia de horario de entrega</h4>
|
|
<div class="flex_responsive">
|
|
<div>
|
|
<input type="radio" name="horarioentrega" id="manana" value="mañana" required>
|
|
<label for="manana">Mañanas</label>
|
|
</div>
|
|
<div>
|
|
<input type="radio" name="horarioentrega" id="tarde" value="tarde">
|
|
<label for="tarde">Tarde</label>
|
|
</div>
|
|
</div>
|
|
|
|
<h4>* Fecha de entrega</h4>
|
|
|
|
<label class="label_std" style="width:auto;" for="fechaentrega">Las entregas de vehiculos se realizaran
|
|
los lunes, Seleccione una fecha</label>
|
|
<input type="date" min="2024-01-01" max="2024-12-31" step="7" id="fechaentrega" name="fechaentrega"
|
|
required>
|
|
|
|
<div>
|
|
<input type="checkbox" name="cesiondatos" id="cesiondatos" required>
|
|
<label style="width: auto;" for="cesiondatos">Acepto la politica de cesion de datos</label>
|
|
</div>
|
|
</fieldset>
|
|
<p style="color: white; font-size: small;">* Los campos marcados con asterisco son obligatorios</p>
|
|
<div style="text-align: right;">
|
|
<input class="btn" type="submit" value="Reservar">
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
</form>
|
|
|
|
|
|
|
|
|
|
</body>
|
|
|
|
</html> |