Añadimos archivos y tenemos problema para visualizar

parent f413df62
Showing with 6 additions and 4939 deletions
# CHANGELOG F1-Experience
# Iteración 0
## 11/02/2023
**Álvaro Ordoñez:**: Implementó junto con su compañero el storyboard principal y se encargó del storyboard de "Crear cuenta".
Detalló el fichero README.md y el propio documento entregable. Se encargó de realizar el diagrama entidad-relación junto con
su compañero. Implementó una versión básica en HTML de la creación de cuentas.
**Álvaro Herrera:**: Implementó junto con su compañero el storyboard principal y se encargó del storyboard de "Venta de tickets".
Creó los diferentes archivos del repositorio y se encargó de realizar el diagrama entidad-relación junto con su compañero.
Implementó una versión básica en HTML de la página principal.
## 15/02/2023
**Álvaro Ordoñez:**: Implementó la interacción entre storyboards.
**Álvaro Herrera:**: Detalló las diferentes historias de usuario y corrigió algunos fallos revisados sobre los storyboard.
## 16/02/2023
**Álvaro Herrera:**: Añadió en el respositorio los archivos iniciarSesion.html y registro.html.
## 21/02/2023
**Álvaro Ordóñez:**: Añadió carpetas para organización del repositorio y modificó el archivo .gitignore
## 27/02/2023
**Álvaro Ordóñez:**: Modificó archivos iniciarSesion.html, registro.html y añadió registro.css
**Álvaro Herrera:**: Modificó index.html y añadión bootstrap.css y index.css
# Iteración 1
## 1/03/2023
**Álvaro Ordóñez:**: Adición de circuitos
**Álvaro Herrera:**: Apartado de compras corregido el problema con los circuitos, añade más logos,
avance en circuitos y en datos de compra.
## 3/03/2023
**Álvaro Ordóñez:**: Añade pago online con pago.html
**Álvaro Herrera:**: Añado fechas de circuitos y margen para adecuada visualización en circuitos.html
## 14/03/2023
**Álvaro Ordóñez:**: Cambio total a proyecto Jakarta para implementar Servlet. Añade .gitignore de la forma correcta.
Añade a error.jsp y usuarioInformacion.jsp
**Álvaro Herrera:**: Presenta problemas con Jakarta en el IDE y escribe código de Servlet inicial. Añade forma de plantilla para
head, header y footer.
## Iteración 2
## 22/03/2023
**Álvaro Ordóñez:**: Implementa vistas en .xhtml.
## 24/03/2023
**Álvaro Herrera:**:
## 25/03/2023
**Álvaro Ordóñez:**: Implementa funcionamiento de CircuitosDAO. Todas las funcionalidades (crear, visualizar, editar y borrar) funcionan adecuandamente.
<h1 align="center"> F1-Experience </h1>
#### Descripción del proyecto
Portal comercial relacionado con la compra de productos exclusivos de la Fórmula 1. Compra de tickets para tours de circuitos o para ver carreras.
[![f1-fanatics-logo-990-x-495.jpg](https://i.postimg.cc/SQW5k6Fr/f1-fanatics-logo-990-x-495.jpg)](https://postimg.cc/9zQ1BqfR)
# Participantes
- Álvaro Herrera Arjonilla - aha00026@red.ujaen.es
- Álvaro Ordóñez Romero - aor00039@red.ujaen.es
......@@ -22,6 +22,11 @@
<artifactId>spark-core</artifactId>
<version>2.9.4</version>
</dependency>
<dependency>
<groupId>com.sparkjava</groupId>
<artifactId>spark-template-freemarker</artifactId>
<version>2.7.1</version>
</dependency>
</dependencies>
<build>
......
......@@ -7,4 +7,5 @@ public class AppConfig {
public static void main(String[] args) {
get("/hello", (req, res) -> "Hello World");
}
}
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html
xmlns:h="http://xmlns.jcp.org/jsf/html"
xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
>
<h:head>
<!-- Basic -->
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!-- Mobile Metas -->
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
<!-- Site Metas -->
<meta name="keywords" content="" />
<meta name="description" content="" />
<meta name="author" content="" />
<title>F1 Store</title>
<!-- slider stylesheet -->
<link rel="stylesheet" type="text/css"
href="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.1.3/assets/owl.carousel.min.css" ></link>
<!-- font awesome style -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"></link>
<!-- bootstrap core css -->
<link rel="stylesheet" type="text/css" href="css/bootstrap.css" ></link>
<!-- fonts style -->
<link href="https://fonts.googleapis.com/css?family=Poppins:400,600,700|Roboto:400,700; display=swap" rel="stylesheet"> </link>
<!-- Custom styles for this template -->
<link href="css/style.css" rel="stylesheet" ></link>
<!-- responsive style -->
<link href="css/responsive.css" rel="stylesheet"></link>
</h:head>
</html>
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html
xmlns:h="jakarta.faces.html"
xmlns:ui="jakarta.faces.facelets"
xmlns:c="jakarta.tags.core">
<h:head>
<!-- Basic -->
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!-- Mobile Metas -->
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
<!-- Site Metas -->
<meta name="keywords" content="" />
<meta name="description" content="" />
<meta name="author" content="" />
<title>F1 Store</title>
<!-- slider stylesheet -->
<link rel="stylesheet" type="text/css"
href="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.1.3/assets/owl.carousel.min.css" ></link>
<!-- font awesome style -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"></link>
<!-- bootstrap core css -->
<link rel="stylesheet" type="text/css" href="css/bootstrap.css" ></link>
<!-- fonts style -->
<link href="https://fonts.googleapis.com/css?family=Poppins:400,600,700|Roboto:400,700; display=swap" rel="stylesheet"> </link>
<!-- Custom styles for this template -->
<link href="css/style.scss" rel="stylesheet" ></link>
<link href="css/style.css" rel="stylesheet" ></link>
<!-- responsive style -->
<link href="css/responsive.css" rel="stylesheet"></link>
</h:head>
<h:body>
<div id="header" class="header_section">
<ui:insert name="cabecera">
</ui:insert>
</div>
<div id="info" class="hero_area">
<ui:insert name="info"></ui:insert>
</div>
<section id="masinfo" class="about_section layout_padding">
<ui:insert name="masinfo"></ui:insert>
</section>
<section id="pie" class="container-fluid footer_section">
<ui:insert name="pie"></ui:insert>
</section>
</h:body>
</html>
\ No newline at end of file
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html
xmlns:h="jakarta.faces.html"
xmlns:ui="jakarta.faces.facelets"
xmlns:c="jakarta.tags.core">
<h:head>
<!-- Basic -->
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!-- Mobile Metas -->
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
<!-- Site Metas -->
<meta name="keywords" content="" />
<meta name="description" content="" />
<meta name="author" content="" />
<title>F1 Store</title>
<!-- slider stylesheet -->
<link rel="stylesheet" type="text/css"
href="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.1.3/assets/owl.carousel.min.css" ></link>
<!-- font awesome style -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"></link>
<!-- bootstrap core css -->
<link rel="stylesheet" type="text/css" href="css/bootstrap.css" ></link>
<!-- fonts style -->
<link href="https://fonts.googleapis.com/css?family=Poppins:400,600,700|Roboto:400,700; display=swap" rel="stylesheet"> </link>
<!-- Custom styles for this template -->
<link href="css/style.scss" rel="stylesheet" ></link>
<link href="css/style.css" rel="stylesheet" ></link>
<!-- responsive style -->
<link href="css/responsive.css" rel="stylesheet"></link>
<link href="css/circuitos.css" rel="stylesheet"></link>
</h:head>
<h:body>
<div id="header" class="header_section">
<ui:insert name="cabecera">
</ui:insert>
</div>
<ui:insert name="left"><!--left content--></ui:insert>
<ui:insert name="metadata"/>
<section id="content" class="col-md-10">
<ui:insert name="content"></ui:insert>
</section>
<div id="info" class="hero_area">
<ui:insert name="info"></ui:insert>
</div>
<section id="pie" class="container-fluid footer_section">
<ui:insert name="pie"></ui:insert>
</section>
</h:body>
</html>
\ No newline at end of file
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html
xmlns:h="jakarta.faces.html"
xmlns:ui="jakarta.faces.facelets"
xmlns:c="jakarta.tags.core">
<h:head>
<!-- Basic -->
<!-- Basic -->
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<!-- Mobile Metas -->
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
<!-- Site Metas -->
<meta name="keywords" content="" />
<meta name="description" content="" />
<meta name="author" content="" />
<title>Entradas</title>
<!-- slider stylesheet -->
<link rel="stylesheet" type="text/css"
href="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.1.3/assets/owl.carousel.min.css" ></link>
<!-- font awesome style -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"></link>
<!-- bootstrap core css -->
<link rel="stylesheet" type="text/css" href="css/bootstrap.css" ></link>
<!-- fonts style -->
<link href="https://fonts.googleapis.com/css?family=Poppins:400,600,700|Roboto:400,700; display=swap" rel="stylesheet"> </link>
<!-- Custom styles for this template -->
<link href="css/style.scss" rel="stylesheet" ></link>
<link href="css/style.css" rel="stylesheet" ></link>
<!-- responsive style -->
<link href="css/responsive.css" rel="stylesheet"></link>
<link href="css/circuitos.css" rel="stylesheet"></link>
</h:head>
<h:body class="sub_page">
<div id="header" class="header_section">
<ui:insert name="cabecera">
</ui:insert>
</div>
<section class="health_section layout_padding">
<div class="health_carousel-container">
<h2 class="text-uppercase">
Fechas de GP disponibles
</h2>
<div class="carousel-wrap layout_padding2">
<div class="owl-carousel">
<div class="item">
<div class="box">
<div class="btn_container">
<a href="">
Comprar ahora
</a>
</div>
<div class="img-box">
<img src="images/australia.jpg" alt=""></img>
</div>
<div class="detail-box">
<div class="text">
<h6 class="price">
7-9 julio
</h6>
<h6>
GP Gran Bretaña
</h6>
<h6 class="price">
65€-320€
</h6>
</div>
</div>
</div>
<div class="box">
<div class="btn_container">
<a href="">
Comprar ahora
</a>
</div>
<div class="img-box">
<img src="images/italia.jpg" alt=""></img>
</div>
<div class="detail-box">
<div class="text">
<h6 class="price">
1-3 septiembre
</h6>
<h6>
GP Italia
</h6>
<h6 class="price">
50€-450€
</h6>
</div>
</div>
</div>
</div>
<div class="item">
<div class="box">
<div class="btn_container">
<a href="">
Comprar ahora
</a>
</div>
<div class="img-box">
<img src="images/bahrein.jpg" alt=""></img>
</div>
<div class="detail-box">
<div class="text">
<h6 class="price">
3-5 marzo
</h6>
<h6>
GP Bahréin
</h6>
<h6 class="price">
70€-360€
</h6>
</div>
</div>
</div>
<div class="box">
<div class="btn_container">
<a href="">
Comprar ahora
</a>
</div>
<div class="img-box">
<img src="images/españa.jpg" alt=""></img>
</div>
<div class="detail-box">
<div class="text">
<h6 class="price">
7-9 <br/>julio
</h6>
<h6>
GP España
</h6>
<h6 class="price">
67€-290€
</h6>
</div>
</div>
</div>
</div>
<div class="item">
<div class="box">
<div class="btn_container">
<a href="">
Comprar ahora
</a>
</div>
<div class="img-box">
<img src="images/mexico.jfif" alt=""></img>
</div>
<div class="detail-box">
<div class="text">
<h6 class="price">
15-18 julio
</h6>
<h6>
GP México
</h6>
<h6 class="price">
70€-330€
</h6>
</div>
</div>
</div>
<div class="box">
<div class="btn_container">
<a href="">
Comprar ahora
</a>
</div>
<div class="img-box">
<img src="images/azerbaiyan.jpg" alt=""></img>
</div>
<div class="detail-box">
<div class="text">
<h6 class="price">
2-5 septiembre
</h6>
<h6>
GP <br/>Azerbaiyán
</h6>
<h6 class="price">
60€-<br/>250€
</h6>
</div>
</div>
</div>
</div>
<div class="item">
<div class="box">
<div class="btn_container">
<a href="">
Comprar ahora
</a>
</div>
<div class="img-box">
<img src="images/australia.jpg" alt=""></img>
</div>
<div class="detail-box">
<div class="text">
<h6 class="price">
31 marzo - 2 abril
</h6>
<h6>
GP Australia
</h6>
<h6 class="price">
90€-280€
</h6>
</div>
</div>
</div>
<div class="box">
<div class="btn_container">
<a href="">
Comprar ahora
</a>
</div>
<div class="img-box">
<img src="images/canada.webp" alt=""></img>
</div>
<div class="detail-box">
<div class="text">
<h6 class="price">
23-25 junio
</h6>
<h6>
GP Canadá
</h6>
<h6 class="price">
50€-870€
</h6>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<section id="pie" class="container-fluid footer_section">
<ui:insert name="pie"></ui:insert>
</section>
</h:body>
</html>
\ No newline at end of file
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html
xmlns:h="jakarta.faces.html"
xmlns:ui="jakarta.faces.facelets"
xmlns:c="jakarta.tags.core">
<h:head>
<!-- Basic -->
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!-- Mobile Metas -->
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
<!-- Site Metas -->
<meta name="keywords" content="" />
<meta name="description" content="" />
<meta name="author" content="" />
<title>F1 Store</title>
<!-- slider stylesheet -->
<link rel="stylesheet" type="text/css"
href="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.1.3/assets/owl.carousel.min.css" ></link>
<!-- font awesome style -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"></link>
<!-- bootstrap core css -->
<link rel="stylesheet" type="text/css" href="css/bootstrap.css" ></link>
<!-- fonts style -->
<link href="https://fonts.googleapis.com/css?family=Poppins:400,600,700|Roboto:400,700; display=swap" rel="stylesheet"> </link>
<!-- Custom styles for this template -->
<link href="css/style.scss" rel="stylesheet" ></link>
<link href="css/style.css" rel="stylesheet" ></link>
<!-- responsive style -->
<link href="css/responsive.css" rel="stylesheet"></link>
<link href="css/registro.css" rel="stylesheet"></link>
</h:head>
<h:body>
<div id="header" class="header_section">
<ui:insert name="cabecera">
</ui:insert>
</div>
<div id="formulario" class="main-agileinfo">
<ui:insert name="formulario"></ui:insert>
</div>
<div id="inicio" class="main-w3layouts wrapper">
<ui:insert name="inicio"></ui:insert>
</div>
</h:body>
</html>
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html
xmlns:h="jakarta.faces.html"
xmlns:ui="jakarta.faces.facelets"
xmlns:c="jakarta.tags.core">
<h:head>
<!-- Basic -->
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!-- Mobile Metas -->
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
<!-- Site Metas -->
<meta name="keywords" content="" />
<meta name="description" content="" />
<meta name="author" content="" />
<title>F1 Store</title>
<!-- slider stylesheet -->
<link rel="stylesheet" type="text/css"
href="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.1.3/assets/owl.carousel.min.css" ></link>
<!-- font awesome style -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"></link>
<!-- bootstrap core css -->
<link rel="stylesheet" type="text/css" href="../css/bootstrap.css" ></link>
<!-- fonts style -->
<link href="https://fonts.googleapis.com/css?family=Poppins:400,600,700|Roboto:400,700; display=swap" rel="stylesheet"> </link>
<!-- Custom styles for this template -->
<link href="../css/style.scss" rel="stylesheet" ></link>
<link href="../css/style.css" rel="stylesheet" ></link>
<!-- responsive style -->
<link href="../css/responsive.css" rel="stylesheet"></link>
<link href="../css/circuitos.css" rel="stylesheet"></link>
</h:head>
<h:body>
<div id="header" class="header_section">
<ui:insert name="cabecera">
</ui:insert>
</div>
<ui:insert name="left"><!--left content--></ui:insert>
<ui:insert name="metadata"/>
<section id="content" class="col-md-10">
<ui:insert name="content"></ui:insert>
</section>
<div id="info" class="hero_area">
<ui:insert name="info"></ui:insert>
</div>
<section id="pie" class="container-fluid footer_section">
<ui:insert name="pie"></ui:insert>
</section>
</h:body>
</html>
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="jakarta.faces.html"
xmlns:ui="jakarta.faces.facelets">
<ui:composition
xmlns:h="jakarta.faces.html"
xmlns:ui="jakarta.faces.facelets"
template="WEB-INF/layout/layoutEntradas.xhtml">
<ui:define name="cabecera">
<div class="container-fluid">
<div id="nav" class="navbar navbar-expand-lg custom_nav-container pt-3">
<a class="navbar-brand" href="index.xhtml">
<img src="resources/images/logo.png" alt=""> </img>
<span>
STORE
</span>
</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent"
aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<div class="d-flex flex-column flex-lg-row align-items-center w-100 ">
<ul class="navbar-nav ">
<li class="nav-item">
<a class="nav-link" href="buy.xhtml"> Entradas </a>
</li>
<li class="nav-item">
<a class="nav-link" href="circuitos.xhtml"> Circuitos </a>
</li>
</ul>
<div class="login_btn-contanier ml-0 ml-lg-5">
<a href="">
<img src="images/user.png" alt=""> </img>
<span>
<a class="nav-link" href="iniciarSesion.xhtml">Iniciar Sesión</a>
</span>
</a>
</div>
<div class="login_btn-contanier ml-0 ml-lg-5">
<a href="">
<img src="images/user.png" alt=""> </img>
<span>
<a class="nav-link" href="registro.xhtml">Registro</a>
</span>
</a>
</div>
</div>
</div>
</div>
</div>
</ui:define>
<ui:define name="masinfo">
<section class="health_section layout_padding">
<div class="health_carousel-container">
<h2 class="text-uppercase">
Fechas de GP disponibles
</h2>
<div class="carousel-wrap layout_padding2">
<div class="owl-carousel">
<div class="item">
<div class="box">
<div class="btn_container">
<a href="">
Comprar ahora
</a>
</div>
<div class="img-box">
<img src="images/australia.jpg" alt=""></img>
</div>
<div class="detail-box">
<div class="text">
<h6 class="price">
7-9 julio
</h6>
<h6>
GP Gran Bretaña
</h6>
<h6 class="price">
65€-320€
</h6>
</div>
</div>
</div>
<div class="box">
<div class="btn_container">
<a href="">
Comprar ahora
</a>
</div>
<div class="img-box">
<img src="images/italia.jpg" alt=""></img>
</div>
<div class="detail-box">
<div class="text">
<h6 class="price">
1-3 septiembre
</h6>
<h6>
GP Italia
</h6>
<h6 class="price">
50€-450€
</h6>
</div>
</div>
</div>
</div>
<div class="item">
<div class="box">
<div class="btn_container">
<a href="">
Comprar ahora
</a>
</div>
<div class="img-box">
<img src="images/bahrein.jpg" alt=""></img>
</div>
<div class="detail-box">
<div class="text">
<h6 class="price">
3-5 marzo
</h6>
<h6>
GP Bahréin
</h6>
<h6 class="price">
70€-360€
</h6>
</div>
</div>
</div>
<div class="box">
<div class="btn_container">
<a href="">
Comprar ahora
</a>
</div>
<div class="img-box">
<img src="images/españa.jpg" alt=""></img>
</div>
<div class="detail-box">
<div class="text">
<h6 class="price">
7-9 <br/>julio
</h6>
<h6>
GP España
</h6>
<h6 class="price">
67€-290€
</h6>
</div>
</div>
</div>
</div>
<div class="item">
<div class="box">
<div class="btn_container">
<a href="">
Comprar ahora
</a>
</div>
<div class="img-box">
<img src="images/mexico.jfif" alt=""></img>
</div>
<div class="detail-box">
<div class="text">
<h6 class="price">
15-18 julio
</h6>
<h6>
GP México
</h6>
<h6 class="price">
70€-330€
</h6>
</div>
</div>
</div>
<div class="box">
<div class="btn_container">
<a href="">
Comprar ahora
</a>
</div>
<div class="img-box">
<img src="images/azerbaiyan.jpg" alt=""></img>
</div>
<div class="detail-box">
<div class="text">
<h6 class="price">
2-5 septiembre
</h6>
<h6>
GP <br/>Azerbaiyán
</h6>
<h6 class="price">
60€-<br/>250€
</h6>
</div>
</div>
</div>
</div>
<div class="item">
<div class="box">
<div class="btn_container">
<a href="">
Comprar ahora
</a>
</div>
<div class="img-box">
<img src="images/australia.jpg" alt=""></img>
</div>
<div class="detail-box">
<div class="text">
<h6 class="price">
31 marzo - 2 abril
</h6>
<h6>
GP Australia
</h6>
<h6 class="price">
90€-280€
</h6>
</div>
</div>
</div>
<div class="box">
<div class="btn_container">
<a href="">
Comprar ahora
</a>
</div>
<div class="img-box">
<img src="images/canada.webp" alt=""></img>
</div>
<div class="detail-box">
<div class="text">
<h6 class="price">
23-25 junio
</h6>
<h6>
GP Canadá
</h6>
<h6 class="price">
50€-870€
</h6>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
</ui:define>
<ui:define name="pie">
<div class="container">
<div class="top_contact-container">
<div class="tel_container">
<br/>
<a href="">
<img src="images/telephone-symbol-button.png" alt=""/> Llama al : +44 20 3984 9372
</a>
</div>
<div class="social-container" align="right">
<a href="https://www.facebook.com/Formula1/?locale=es_ES">
<img src="images/fb.png" alt="" class="s-1" href="https://www.facebook.com/Formula1/?locale=es_ES"/>
</a>
<a href="https://twitter.com/F1">
<img src="images/twitter.png" alt="" class="s-2" href="https://twitter.com/F1" width="51"/>
</a>
<a href="https://www.instagram.com/f1/?hl=es">
<img src="images/instagram.png" alt="" class="s-3" href="https://www.instagram.com/f1/?hl=es"/>
</a>
</div>
</div>
</div>
<p>
&copy; 2023 All Rights Reserved. Formula One World Championship Limited
</p>
</ui:define>
<script type="text/javascript" src="js/jquery-3.4.1.min.js"></script>
<script type="text/javascript" src="js/bootstrap.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.2.1/owl.carousel.min.js">
</script>
<script type="text/javascript">
$(".owl-carousel").owlCarousel({
loop: true,
margin: 10,
nav: true,
navText: [],
autoplay: true,
responsive: {
0: {
items: 1
},
600: {
items: 2
},
1000: {
items: 4
}
}
});
</script>
<script type="text/javascript">
$(".owl-2").owlCarousel({
loop: true,
margin: 10,
nav: true,
navText: [],
autoplay: true,
responsive: {
0: {
items: 1
},
600: {
items: 2
},
1000: {
items: 4
}
}
});
</script>
</ui:composition>
</html>
<ui:composition
xmlns:h="jakarta.faces.html"
xmlns:f="jakarta.faces.core"
xmlns:ui="jakarta.faces.facelets"
xmlns:p="jakarta.faces.passthrough"
template="../WEB-INF/layout/layoutGestion.xhtml">
<ui:define name="cabecera">
<div class="container-fluid">
<div id="nav" class="navbar navbar-expand-lg custom_nav-container pt-3">
<a class="navbar-brand" href="index.xhtml">
<img src="resources/images/logo.png" alt=""> </img>
<span>
STORE
</span>
</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent"
aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<div class="d-flex flex-column flex-lg-row align-items-center w-100 ">
<ul class="navbar-nav ">
<li class="nav-item">
<a class="nav-link" href="buy.xhtml"> Entradas </a>
</li>
<li class="nav-item">
<a class="nav-link" href="circuitos.xhtml"> Circuitos </a>
</li>
</ul>
<div class="login_btn-contanier ml-0 ml-lg-5">
<a href="">
<img src="images/user.png" alt=""> </img>
<span>
<a class="nav-link" href="iniciarSesion.xhtml">Iniciar Sesión</a>
</span>
</a>
</div>
<div class="login_btn-contanier ml-0 ml-lg-5">
<a href="">
<img src="images/user.png" alt=""> </img>
<span>
<a class="nav-link" href="registro.xhtml">Registro</a>
</span>
</a>
</div>
</div>
</div>
</div>
</div>
</ui:define>
<ui:define name="left">
<br/>
<ul class="nav nav-pills flex-column">
<div class="login_btn-contanier ml-0 ml-lg-5">
<li class="nav-item"><h:link value="Listado" outcome="listado" class="nav-link" /></li>
</div>
<div class="login_btn-contanier ml-0 ml-lg-5">
<li class="nav-item"><h:link value="Listado Editable" outcome="listado_din" class="nav-link"/></li>
</div>
<div class="login_btn-contanier ml-0 ml-lg-5">
<li class="nav-item"><h:link value="Alta" outcome="alta" class="nav-link"/></li>
</div>
<div class="login_btn-contanier ml-0 ml-lg-5">
<li class="nav-item"><h:link value="Alta Ajax" outcome="alta_ajax" class="nav-link"/></li>
</div>
</ul>
</ui:define>
<ui:define name="content">
<br/>
<h1>Alta Circuito</h1>
<h:form styleClass="well" >
<label>Nombre:</label> <h:inputText styleClass="form-control" label="Nombre" id="idNombre"
value="#{circuitoCtrl.circuito.nombre}" required="true">
<!--f:validateLength minimum="4" maximum="25"/-->
</h:inputText>
<p><h:message styleClass="form-text text-danger" for="idNombre" /></p>
<label>País:</label> <h:inputText styleClass="form-control" label="pais" id="paiss"
value="#{circuitoCtrl.circuito.pais}" required="true">
<!--f:validateRegex pattern="\d{7,8}-?[a-zA-Z]" /-->
</h:inputText>
<p><h:message styleClass="form-text text-danger" for="paiss" /></p>
<label>Longitud:</label> <h:inputText styleClass="form-control" label="longitud" id="longitud"
value="#{circuitoCtrl.circuito.longitud}" required="true">
<!--f:validateRegex pattern="\d{7,8}-?[a-zA-Z]" /-->
</h:inputText>
<p><h:message styleClass="form-text text-danger" for="longitud" /></p>
<label>Fecha de celebración:</label>
<!-- force datepicker html5 input box with p:type="date" -->
<h:inputText p:type="date" styleClass="form-control" label="FNac" id="idFNac" value="#{circuitoCtrl.circuito.fechaCelebracion}">
<!-- convert date to input datepicker LocalDate format-->
<f:convertDateTime type="localDate" pattern="yyyy-MM-dd" />
</h:inputText>
<p><h:message styleClass="form-text text-danger" for="idFNac" /></p>
<h:commandButton styleClass="btn btn-primary" value="Guardar" action="#{circuitoCtrl.crea(circuitoCtrl.circuito.longitud)}"/>
<h:button styleClass="btn btn-default" value="Cancelar" outcome="listado" />
</h:form>
</ui:define>
</ui:composition>
\ No newline at end of file
<ui:composition
xmlns:h="jakarta.faces.html"
xmlns:f="jakarta.faces.core"
xmlns:ui="jakarta.faces.facelets" xmlns:p="jakarta.faces.passthrough"
template="../WEB-INF/layout/layoutCircuitos.xhtml">
<ui:define name="content">
<h1>Alta Circuito</h1>
<h:form styleClass="" >
<label>Nombre:</label><h:inputText styleClass="form-control" label="Nombre" id="idNombre"
value="#{circuitoCtrl.circuito.nombre}" required="true">
<!--f:validateLength minimum="4" maximum="25"/-->
</h:inputText>
<p><h:message styleClass="form-text text-danger" for="idNombre" /></p>
<label>País:</label> <h:inputText styleClass="form-control" label="pais" id="paiss"
value="#{circuitoCtrl.circuito.pais}" required="true">
<!--f:validateRegex pattern="\d{7,8}-?[a-zA-Z]" /-->
</h:inputText>
<p><h:message styleClass="form-text text-danger" for="paiss" /></p>
<label>Fecha de celebracion:</label>
<!-- force datepicker html5 input box with p:type="date" -->
<h:inputText p:type="date" styleClass="form-control" label="FNac" id="idFNac" value="#{circuitoCtrl.circuito.fechaCelebracion}">
<!-- convert date to input datepicker LocalDate format-->
<f:convertDateTime type="localDate" pattern="yyyy-MM-dd" />
</h:inputText>
<p><h:message styleClass="form-text text-danger" for="idFNac" /></p>
<p class="form-text">(marcar para acceder a tipo de socio y actualizar vista con AJAX)</p>
<h:commandButton styleClass="btn btn-primary" value="Guardar" action="#{circuitoCtrl.crea(circuitoCtrl.circuito.longitud)}"/>
<h:button styleClass="btn btn-default" value="Cancelar" outcome="listado" />
</h:form>
</ui:define>
</ui:composition>
\ No newline at end of file
<ui:composition
xmlns:h="jakarta.faces.html"
xmlns:ui="jakarta.faces.facelets" xmlns:p="jakarta.faces.passthrough"
template="../WEB-INF/layout/layoutCircuitos.xhtml"
xmlns:f="jakarta.faces.core">
<ui:define name="metadata">
<f:metadata>
<f:viewParam name="longitud" value="#{circuitoCtrl.circuito.longitud}"/>
<f:viewAction action="#{circuitoCtrl.recupera()}" />
</f:metadata>
</ui:define>
<ui:define name="content">
<h1>Edita circuito</h1>
<h:messages class="text-danger"/>
<ui:fragment rendered="#{circuitoCtrl.circuito != null}">
<h3>Longitud (ID): <h:outputText value="#{circuitoCtrl.circuito.longitud}" /></h3><h:inputHidden value="#{circuitoCtrl.circuito.longitud}"/>
<h:form styleClass="" id="formCliente">
<label>Nombre:</label> <h:inputText styleClass="form-control" label="Nombre" id="idNombre" value="#{circuitoCtrl.circuito.nombre}"
required="true" />
<p><h:message styleClass="form-text text-danger" for="idNombre" /></p>
<label>País:</label> <h:inputText styleClass="form-control" label="pais" id="paiss" value="#{circuitoCtrl.circuito.pais}"
required="true" />
<p><h:message styleClass="form-text text-danger" for="paiss" /></p>
<label>Fecha de celebración:</label>
<!-- force datepicker html5 input box with p:type="date" -->
<h:inputText p:type="date" styleClass="form-control" label="FNac" id="idFNac" value="#{circuitoCtrl.circuito.fechaCelebracion}">
<!-- convert date to input datepicker LocalDate format-->
<f:convertDateTime type="localDate" pattern="yyyy-MM-dd" />
</h:inputText>
<p><h:message styleClass="form-text text-danger" for="idFNac" /></p>
<h:commandButton styleClass="btn btn-primary" value="Guardar" action="#{circuitoCtrl.guarda}"/>
<h:button styleClass="btn btn-cancel" value="Cancelar" outcome="listado" />
</h:form>
</ui:fragment>
</ui:define>
<ui:define name="left">
<ul class="nav nav-pills flex-column">
<li class="nav-item"><h:link value="Volver" outcome="principal" class="nav-link "/></li>
</ul>
</ui:define>
</ui:composition>
\ No newline at end of file
<ui:composition
xmlns:h="jakarta.faces.html"
xmlns:ui="jakarta.faces.facelets"
xmlns:f="jakarta.faces.core"
template="../WEB-INF/layout/layoutCircuitos.xhtml">
<ui:define name="content">
<h1>Listado de Circuitos </h1>
<h:form>
<h:dataTable styleClass="table table-striped" var="circuito" value="#{circuitoCtrl.circuitos}">
<h:column>
<f:facet name="header">Nombre</f:facet>
#{circuito.nombre}
</h:column>
<h:column>
<f:facet name="header">País</f:facet>
#{circuito.pais}
</h:column>
<h:column>
<f:facet name="header">Fecha de celebracion</f:facet>
${circuito.fechaCelebracion}
</h:column>
<h:column>
<f:facet name="header">Longitud</f:facet>
#{circuito.longitud}
</h:column>
<h:column>
<f:facet name="header">Opciones</f:facet>
<h:button styleClass="btn btn-light" value="Visualiza" outcome="visualiza">
<f:param name="id" value="#{circuito.longitud}" /></h:button>&#160;
<h:button styleClass="btn btn-light" value="Edita" outcome="edita" >
<f:param name="longitud" value="#{circuito.longitud}" /></h:button>&#160;
<h:commandButton styleClass="btn btn-light" value="Borra" action="#{circuitoCtrl.borra(circuito)}" />
</h:column>
</h:dataTable>
</h:form>
</ui:define>
<ui:define name="left">
<ul class="nav nav-pills flex-column">
<li class="nav-item"><h:link value="Circuitos" outcome="principal" class="nav-link"/></li>
<li class="nav-item"><h:link value='Nuevo Circuito' outcome="alta" class="nav-link active"/></li>
</ul>
</ui:define>
</ui:composition>
\ No newline at end of file
<ui:composition
xmlns:h="jakarta.faces.html"
xmlns:ui="jakarta.faces.facelets"
xmlns:f="jakarta.faces.core"
template="../WEB-INF/layout/layoutCircuitos.xhtml">
<ui:define name="content">
<ui:debug />
<h1>Listado de circuitos editable </h1>
<h:messages class="text-danger"/>
<h:form>
<h:dataTable styleClass="table table-striped" var="circuito" value="#{circuitoCtrl.circuitos}" >
<h:column>
<f:facet name="header">ID</f:facet>
#{circuito.longitud}
</h:column>
<h:column>
<f:facet name="header">Nombre</f:facet>
<h:outputText value="#{circuito.nombre}" rendered="#{circuitoCtrl.circuito.longitud!=circuito.longitud}"/>
<h:inputText value="#{circuitoCtrl.circuito.nombre}" rendered="#{circuitoCtrl.circuito.longitud==circuito.longitud}" class="form-control"/>
</h:column>
<h:column>
<f:facet name="header">PAIS</f:facet>
<h:outputText value="#{circuito.pais}" rendered="#{circuitoCtrl.circuito.longitud!=circuito.longitud}"/>
<h:inputText value="#{circuitoCtrl.circuito.pais}" rendered="#{circuitoCtrl.circuito.longitud==circuito.longitud}" class="form-control"/>
</h:column>
<h:column>
<f:facet name="header">Opciones</f:facet>
<h:panelGroup rendered="#{circuitoCtrl.circuito.longitud!=circuito.longitud}">
<h:button styleClass="btn btn-light" value="Visualiza" outcome="visualiza">
<f:param name="id" value="#{circuito.longitud}" /></h:button>&#160;
<h:commandButton styleClass="btn btn-light" value="Edita" action="#{circuitoCtrl.editRow(circuito)}" />&#160;
<h:commandButton styleClass="btn btn-light" value="Borra" action="#{circuitoCtrl.borra(circuito)}" />
</h:panelGroup>
<h:panelGroup rendered="#{circuitoCtrl.circuito.longitud==circuito.longitud}">
<h:commandButton styleClass="btn btn-light" value="Guarda" action="#{circuitoCtrl.actualizaCircuito()}" />&#160;
<h:commandButton styleClass="btn btn-light" value="Cancela" action="#{circuitoCtrl.cancelEditRow()}" immediate="true" />&#160;
</h:panelGroup>
</h:column>
</h:dataTable>
</h:form>
</ui:define>
<ui:define name="left">
<ul class="nav nav-pills flex-column">
<li class="nav-item"><h:link value='Nuevo circuito' outcome="alta" class="nav-link active" /></li>
</ul>
</ui:define>
</ui:composition>
\ No newline at end of file
<ui:composition
xmlns:h="jakarta.faces.html"
xmlns:ui="jakarta.faces.facelets"
template="../WEB-INF/layout/layoutGestion.xhtml">
<ui:define name="content">
<br/><br/>
<h1>Gestión de Circuitos</h1>
</ui:define>
<ui:define name="cabecera">
<div class="container-fluid">
<div id="nav" class="navbar navbar-expand-lg custom_nav-container pt-3">
<a class="navbar-brand" href="index.xhtml">
<img src="resources/images/logo.png" alt=""> </img>
<span>
STORE
</span>
</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent"
aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<div class="d-flex flex-column flex-lg-row align-items-center w-100 ">
<ul class="navbar-nav ">
<li class="nav-item">
<a class="nav-link" href="buy.xhtml"> Entradas </a>
</li>
<li class="nav-item">
<a class="nav-link" href="circuitos.xhtml"> Circuitos </a>
</li>
</ul>
<div class="login_btn-contanier ml-0 ml-lg-5">
<a href="">
<img src="images/user.png" alt=""> </img>
<span>
<a class="nav-link" href="iniciarSesion.xhtml">Iniciar Sesión</a>
</span>
</a>
</div>
<div class="login_btn-contanier ml-0 ml-lg-5">
<a href="">
<img src="images/user.png" alt=""> </img>
<span>
<a class="nav-link" href="registro.xhtml">Registro</a>
</span>
</a>
</div>
</div>
</div>
</div>
</div>
</ui:define>
<ui:define name="left">
<br/>
<ul class="nav nav-pills flex-column">
<div class="login_btn-contanier ml-0 ml-lg-5">
<li class="nav-item"><h:link value="Listado" outcome="listado" class="nav-link" /></li>
</div>
<div class="login_btn-contanier ml-0 ml-lg-5">
<li class="nav-item"><h:link value="Listado Editable" outcome="listado_din" class="nav-link"/></li>
</div>
<div class="login_btn-contanier ml-0 ml-lg-5">
<li class="nav-item"><h:link value="Alta" outcome="alta" class="nav-link"/></li>
</div>
<div class="login_btn-contanier ml-0 ml-lg-5">
<li class="nav-item"><h:link value="Alta Ajax" outcome="alta_ajax" class="nav-link"/></li>
</div>
</ul>
</ui:define>
</ui:composition>
\ No newline at end of file
<ui:composition
template="../WEB-INF/layout/layoutCircuitos.xhtml"
xmlns:f="jakarta.faces.core"
xmlns:ui="jakarta.faces.facelets"
xmlns:h="jakarta.faces.html"
xmlns:daw="jakarta.faces.composite/dawcomp">
<ui:define name="metadata">
<f:metadata>
<f:viewParam name="id" value="#{circuitoCtrl.circuito.longitud}"/>
<f:viewAction action="#{circuitoCtrl.recupera()}" />
</f:metadata>
</ui:define>
<ui:define name="content">
<div class="panel panel-default">
<h1 class="panel-heading">Visualiza Circuito</h1>
<h:messages class="text-danger"/>
<ui:fragment rendered="#{circuitoCtrl.circuito != null}">
<!-- use custom composite component -->
<daw:Circuito value="#{circuitoCtrl.circuito}"/>
<h:form>
<h:button styleClass="btn btn-primary" value="Editar" outcome="edita">
<f:param name="id" value="#{circuitoCtrl.circuito.nombre}"/>
</h:button>
<h:commandButton styleClass="btn btn-danger" value="Borrar" action="#{circuitoCtrl.borra}"/>
<h:link styleClass="btn btn-default" value="Volver" outcome="listado" />
</h:form>
</ui:fragment>
</div>
</ui:define>
<ui:define name="left">
<ul class="nav nav-pills nav-stacked">
<li class="nav-item"><h:link value="Volver" outcome="principal" class="nav-link "/></li>
</ul>
</ui:define>
</ui:composition>
\ No newline at end of file
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="jakarta.faces.html"
xmlns:ui="jakarta.faces.facelets">
<ui:composition
xmlns:h="jakarta.faces.html"
xmlns:ui="jakarta.faces.facelets"
template="WEB-INF/layout/layoutCircuitos.xhtml">
<ui:define name="cabecera">
<div class="container-fluid">
<div id="nav" class="navbar navbar-expand-lg custom_nav-container pt-3">
<a class="navbar-brand" href="index.xhtml">
<img src="resources/images/logo.png" alt=""> </img>
<span>
STORE
</span>
</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent"
aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<div class="d-flex flex-column flex-lg-row align-items-center w-100 ">
<ul class="navbar-nav ">
<li class="nav-item">
<a class="nav-link" href="buy.xhtml"> Entradas </a>
</li>
<li class="nav-item">
<a class="nav-link" href="circuitos.xhtml"> Circuitos </a>
</li>
<li class="nav-item">
<a class="nav-link" href="circuito/principal.xhtml"> Gestion de circuitos </a>
</li>
</ul>
<div class="login_btn-contanier ml-0 ml-lg-5">
<a href="">
<img src="images/user.png" alt=""> </img>
<span>
<a class="nav-link" href="iniciarSesion.xhtml">Iniciar Sesión</a>
</span>
</a>
</div>
<div class="login_btn-contanier ml-0 ml-lg-5">
<a href="">
<img src="images/user.png" alt=""> </img>
<span>
<a class="nav-link" href="registro.xhtml">Registro</a>
</span>
</a>
</div>
</div>
</div>
</div>
</div>
</ui:define>
<ui:define name="info">
<section>
<input type="radio" id="s-1" name="slider-control" checked="checked"/>
<input type="radio" id="s-2" name="slider-control"/>
<input type="radio" id="s-3" name="slider-control"/>
<input type="radio" id="s-4" name="slider-control"/>
<input type="radio" id="s-5" name="slider-control"/>
<input type="radio" id="s-6" name="slider-control"/>
<input type="radio" id="s-7" name="slider-control"/>
<input type="radio" id="s-8" name="slider-control"/>
<div class="js-slider">
<figure class="js-slider_item img-1">
<div class="js-slider_img">
<img class="c-img-w-full" src="images/australia.jpg" alt=""/>
</div>
<figcaption class="wo-caption">
<h3 class="wo-h3">
<div class="c-label">GP DE AUSTRALIA</div>
<br class="view-sm mb-s"/>Albert Park, Australia</h3>
<ul class="wo-credit">
<li>30 marzo - 2 abril 2023</li>
<li>5,035 Km</li>
<li>16 curvas;
<span class="c-txt-s">Último ganador: Max Verstappen (2022)</span></li>
</ul>
</figcaption>
</figure>
<figure class="js-slider_item img-2">
<div class="js-slider_img">
<img class="c-img-h-full" src="images/italia.jpg" alt=""/></div>
<figcaption class="wo-caption">
<h3 class="wo-h3">
<div class="c-label">GP DE ITALIA</div>
<br class="view-sm mb-s"/>Monza, Italia</h3>
<ul class="wo-credit">
<li>1-3 septiembre 2023</li>
<li>5,793 Km</li>
<li>11 Curvas; Último ganador: Max Verstappen (2022)</li>
</ul>
</figcaption>
</figure>
<figure class="js-slider_item img-3">
<div class="js-slider_img">
<img class="c-img-h-full" src="images/azerbaiyan.jpg" alt=""/></div>
<figcaption class="wo-caption">
<h3 class="wo-h3">
<div class="c-label">GP DE AZERBAYAN</div>
<br class="view-sm mb-s"/>Baku, Azerbaiyan</h3>
<ul class="wo-credit">
<li>28-30 abril 2023</li>
<li>6,003 Km</li>
<li>20 Curvas; Último ganador: Max Verstappen (2022)</li>
</ul>
</figcaption>
</figure>
<figure class="js-slider_item img-4">
<div class="js-slider_img">
<img class="c-img-h-full" src="images/britain.jpg" alt=""/></div>
<figcaption class="wo-caption">
<h3 class="wo-h3">
<div class="c-label">GP DE GRAN BRETAÑA</div>
<br class="view-sm mb-s"/>Silverstone, Reino Unido</h3>
<ul class="wo-credit">
<li>7-9 julio 2023</li>
<li>5,891Km</li>
<li>18 Curvas; Último ganador: Carlos Sainz (2022)</li>
</ul>
</figcaption>
</figure>
<figure class="js-slider_item img-5">
<div class="js-slider_img">
<img class="c-img-h-full" src="images/canada.webp" alt=""/></div>
<figcaption class="wo-caption">
<h3 class="wo-h3">
<div class="c-label">GP DE CANADA</div>
<br class="view-sm mb-s"/>Montreal, Canada</h3>
<ul class="wo-credit">
<li>16-18 junio 2023</li>
<li>4,631Km</li>
<li>14 Curvas; Último ganador: Max Verstappen (2022)</li>
</ul>
</figcaption>
</figure>
<figure class="js-slider_item img-6">
<div class="js-slider_img">
<img class="c-img-h-full" src="images/españa.jpg" alt=""/></div>
<figcaption class="wo-caption">
<h3 class="wo-h3">
<div class="c-label">GP DE ESPAÑA</div>
<br class="view-sm mb-s"/>Barcelona, España</h3>
<ul class="wo-credit">
<li>2-4 junio 2023</li>
<li>4,675Km</li>
<li>16 Curvas; Último ganador: Max Verstappen (2022)</li>
</ul>
</figcaption>
</figure>
<figure class="js-slider_item img-7">
<div class="js-slider_img">
<img class="c-img-h-full" src="images/mexico.jfif" alt=""/></div>
<figcaption class="wo-caption">
<h3 class="wo-h3">
<div class="c-label">GP DE MEXICO</div>
<br class="view-sm mb-s"/>CDM, México</h3>
<ul class="wo-credit">
<li>27-29 octubre 2023</li>
<li>4,304Km</li>
<li>17 Curvas; Último ganador: Max Verstappen (2022)</li>
</ul>
</figcaption>
</figure>
<figure class="js-slider_item img-8">
<div class="js-slider_img">
<img class="c-img-h-full" src="images/bahrein.jpg" alt=""/></div>
<figcaption class="wo-caption">
<h3 class="wo-h3">
<div class="c-label">GP DE BAHREIN</div>
<br class="view-sm mb-s"/>Shakir, Bahrein</h3>
<ul class="wo-credit">
<li>3-5 marzo 2023</li>
<li>5,412Km</li>
<li>15 Curvas; Último ganador: Charles Leclerc (2022)</li>
</ul>
</figcaption>
</figure>
<div class="js-slider_nav">
<label class="js-slider_nav_item s-nav-1 prev" for="s-8"></label>
<label class="js-slider_nav_item s-nav-1 next" for="s-2"></label>
<label class="js-slider_nav_item s-nav-2 prev" for="s-1"></label>
<label class="js-slider_nav_item s-nav-2 next" for="s-3"></label>
<label class="js-slider_nav_item s-nav-3 prev" for="s-2"></label>
<label class="js-slider_nav_item s-nav-3 next" for="s-4"></label>
<label class="js-slider_nav_item s-nav-4 prev" for="s-3"></label>
<label class="js-slider_nav_item s-nav-4 next" for="s-5"></label>
<label class="js-slider_nav_item s-nav-5 prev" for="s-4"></label>
<label class="js-slider_nav_item s-nav-5 next" for="s-6"></label>
<label class="js-slider_nav_item s-nav-6 prev" for="s-5"></label>
<label class="js-slider_nav_item s-nav-6 next" for="s-7"></label>
<label class="js-slider_nav_item s-nav-7 prev" for="s-6"></label>
<label class="js-slider_nav_item s-nav-7 next" for="s-8"></label>
<label class="js-slider_nav_item s-nav-8 prev" for="s-7"></label>
<label class="js-slider_nav_item s-nav-8 next" for="s-1"></label>
</div>
<div class="js-slider_indicator">
<div class="js-slider-indi indi-1"></div>
<div class="js-slider-indi indi-2"></div>
<div class="js-slider-indi indi-3"></div>
<div class="js-slider-indi indi-4"></div>
<div class="js-slider-indi indi-5"></div>
<div class="js-slider-indi indi-6"></div>
<div class="js-slider-indi indi-7"></div>
<div class="js-slider-indi indi-8"></div>
</div>
</div>
</section>
</ui:define>
<ui:define name="pie">
<div class="container">
<div class="top_contact-container">
<div class="tel_container">
<br/>
<a href="">
<img src="images/telephone-symbol-button.png" alt=""/> Llama al : +44 20 3984 9372
</a>
</div>
<div class="social-container" align="right">
<a href="https://www.facebook.com/Formula1/?locale=es_ES">
<img src="images/fb.png" alt="" class="s-1" href="https://www.facebook.com/Formula1/?locale=es_ES"/>
</a>
<a href="https://twitter.com/F1">
<img src="images/twitter.png" alt="" class="s-2" href="https://twitter.com/F1" width="51"/>
</a>
<a href="https://www.instagram.com/f1/?hl=es">
<img src="images/instagram.png" alt="" class="s-3" href="https://www.instagram.com/f1/?hl=es"/>
</a>
</div>
</div>
</div>
<p>
&copy; 2023 All Rights Reserved. Formula One World Championship Limited
</p>
</ui:define>
<script type="text/javascript" src="../js/jquery-3.4.1.min.js"></script>
<script type="text/javascript" src="../js/bootstrap.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.2.1/owl.carousel.min.js">
</script>
<script type="text/javascript">
$(".owl-carousel").owlCarousel({
loop: true,
margin: 10,
nav: true,
navText: [],
autoplay: true,
responsive: {
0: {
items: 1
},
600: {
items: 2
},
1000: {
items: 4
}
}
});
</script>
<script type="text/javascript">
$(".owl-2").owlCarousel({
loop: true,
margin: 10,
nav: true,
navText: [],
autoplay: true,
responsive: {
0: {
items: 1
},
600: {
items: 2
},
1000: {
items: 4
}
}
});
</script>
</ui:composition>
</html>
This diff could not be displayed because it is too large.
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
color: #fff;
background: #000;
}
li {
list-style: none;
}
input[type="radio"] {
display: none;
}
.js-slider {
position: relative;
width: 80%;
height: 100vh;
margin: 0 auto;
}
.js-slider_item {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
padding: 1rem 3rem;
opacity: 0;
visibility: hidden;
transform-origin: right center;
transform: translate3d(0%, 0%, 0) rotateY(30deg) scaleX(0.95);
transition: all 1s ease,transform 1s cubic-bezier(0.43, 0.28, 0.51, 1);
}
#s-1:checked ~ .js-slider .js-slider_item.img-1,
#s-2:checked ~ .js-slider .js-slider_item.img-2,
#s-3:checked ~ .js-slider .js-slider_item.img-3,
#s-4:checked ~ .js-slider .js-slider_item.img-4,
#s-5:checked ~ .js-slider .js-slider_item.img-5,
#s-6:checked ~ .js-slider .js-slider_item.img-6,
#s-7:checked ~ .js-slider .js-slider_item.img-7,
#s-8:checked ~ .js-slider .js-slider_item.img-8{
opacity: 1;
visibility: visible;
transform-origin: left center;
transform: translate3d(0, 0, 0) rotateY(0deg) scaleX(1);
}
.js-slider_img {
width: 100%;
height: 60%;
position: relative;
overflow: hidden;
}
.c-img-w-full {
position: absolute;
top: 50%;
left: 50%;
width: 100%;
height: auto;
transform: translate3d(-50%, -50%, 0);
}
.c-img-h-full {
position: absolute;
top: 50%;
left: 50%;
width: auto;
height: 100%;
transform: translate3d(-50%, -50%, 0);
}
figcaption {
display: block;
}
.wo-h3 {
margin-top: 6rem;
margin-bottom: 2rem;
padding-bottom: 2rem;
border-bottom: 1px solid #000000;
}
.c-label {
display: inline-block;
color: #eee;
background-color: rgba(139,0,10,0.9);
line-height: 1;
padding: 0.2em 0.5em;
margin-right: 0.5em;
font-size: 1.4rem;
font-weight: bold;
}
.view-sm {
display: none;
}
.js-slider_nav {
position: absolute;
left: 0;
top: 50%;
width: 100%;
transform: translate3d(0, -50%, 0);
}
.js-slider_nav_item.prev {
left: 0;
}
.js-slider_nav_item.next {
right: 0;
transform: rotateY(180deg);
}
.js-slider_nav_item {
position: absolute;
display: none;
width: 4rem;
height: 4rem;
border: 1px solid #fdfdfd;
border-radius: 50%;
cursor: pointer;
transition: 1s all cubic-bezier(0.075, 0.82, 0.165, 1);
}
.js-slider_nav_item:before {
content: "";
display: block;
position: absolute;
left: 1rem;
top: 55%;
width: 1rem;
height: 1px;
background-color: #ffffff;
transform-origin: left bottom;
transform: translate3d(0, -50%, 0) rotate(-45deg);
transition: 1s all cubic-bezier(0.075, 0.82, 0.165, 1);
}
.js-slider_nav_item:hover {
transform: translate3d(-30%, 0, 0);
}
.js-slider_nav_item.next:hover {
transform: rotateY(180deg) translate3d(-30%, 0, 0);
}
.js-slider_nav_item:hover:before {
transform: translate3d(0, -50%, 0) rotate(-30deg);
}
.js-slider_nav_item:after {
content: "";
position: absolute;
top: 55%;
left: 50%;
width: 2rem;
height: 1px;
background-color: #ffffff;
transform: translate3d(-50%, -50%, 0);
}
#s-1:checked ~ .js-slider .js-slider_nav .s-nav-1,
#s-2:checked ~ .js-slider .js-slider_nav .s-nav-2,
#s-3:checked ~ .js-slider .js-slider_nav .s-nav-3,
#s-4:checked ~ .js-slider .js-slider_nav .s-nav-4,
#s-5:checked ~ .js-slider .js-slider_nav .s-nav-5,
#s-6:checked ~ .js-slider .js-slider_nav .s-nav-6,
#s-7:checked ~ .js-slider .js-slider_nav .s-nav-7,
#s-8:checked ~ .js-slider .js-slider_nav .s-nav-8{
display: block;
}
.js-slider_indicator {
position: absolute;
left: 0;
top: 63%;
width: 100%;
text-align: center;
}
.js-slider-indi {
position: relative;
display: inline-block;
padding: 2rem;
cursor: pointer;
}
.js-slider-indi:after {
content: "";
position: absolute;
top: 50%;
left: 50%;
width: 1rem;
height: 1rem;
border-radius: 1rem;
background: #ffffff;
transform: translate3d(-50%, -50%, 0);
}
.js-slider-indi:hover:after {
transform: translate3d(-50%, -50%, 0) scale(1.5);
transition: 1s all cubic-bezier(0.075, 0.82, 0.165, 1);
}
#s-1:checked ~ .js-slider .js-slider_indicator .indi-1:after,
#s-2:checked ~ .js-slider .js-slider_indicator .indi-2:after,
#s-3:checked ~ .js-slider .js-slider_indicator .indi-3:after,
#s-4:checked ~ .js-slider .js-slider_indicator .indi-4:after,
#s-5:checked ~ .js-slider .js-slider_indicator .indi-5:after,
#s-6:checked ~ .js-slider .js-slider_indicator .indi-6:after,
#s-7:checked ~ .js-slider .js-slider_indicator .indi-7:after,
#s-8:checked ~ .js-slider .js-slider_indicator .indi-8:after{
transform: translate3d(-50%, -50%, 0) scale(2.5);
}
\ No newline at end of file
/* If you like this, please check my blog at codedgar.com.ve */
@import url('https://fonts.googleapis.com/css?family=Work+Sans');
body{
font-family: 'Work Sans', sans-serif;
background: #ff0000;
background: -webkit-linear-gradient(to right, #ff0000, #000000);
background: linear-gradient(to right, #ff0000, #000000);
/* Thanks to uigradients :) */
}
.card{
background:#16181a; border-radius:14px; max-width: 300px; display:block; margin:auto;
padding:60px; padding-left:20px; padding-right:20px;box-shadow: 2px 10px 40px black; z-index:99;
}
.logo-card{max-width:50px; margin-bottom:15px; margin-top: -19px;}
label{display:flex; font-size:10px; color:white; opacity:.4;}
input{font-family: 'Work Sans', sans-serif;background:transparent; border:none; border-bottom:1px solid transparent; color:#dbdce0; transition: border-bottom .4s;}
input:focus{border-bottom:1px solid #1abc9c; outline:none;}
.cardnumber{display:block; font-size:20px; margin-bottom:8px; }
.name{display:block; font-size:15px; max-width: 200px; float:left; margin-bottom:15px;}
.toleft{float:left;}
.ccv{width:50px; margin-top:-5px; font-size:15px;}
.receipt{background: #dbdce0; border-radius:4px; padding:5%; padding-top:200px; max-width:600px; display:block; margin:auto; margin-top:-180px; z-index:-999; position:relative;}
.col{width:50%; float:left;}
.bought-item{background:#f5f5f5; padding:2px;}
.bought-items{margin-top:-3px;}
.cost{color: #000000;}
.seller{color: #000000;}
.description{font-size: 13px;}
.price{font-size:12px;}
.comprobe{text-align:center;}
.proceed{position:absolute; transform:translate(300px, 10px); width:50px; height:50px; border-radius:50%; background: #ff0000; border:none;color:white; transition: box-shadow .2s, transform .4s; cursor:pointer;}
.proceed:active{outline:none; }
.proceed:focus{outline:none;box-shadow: inset 0px 0px 5px white;}
.sendicon{filter:invert(100%); padding-top:2px;}
@media (max-width: 600px){
.proceed{transform:translate(250px, 10px);}
.col{display:block; margin:auto; width:100%; text-align:center;}
}
\ No newline at end of file
/*--
Author: Colorlib
Author URL: https://colorlib.com
License: Creative Commons Attribution 3.0 Unported
License URL: http://creativecommons.org/licenses/by/3.0/
--*/
/*-- reset --*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, dl, dt, dd, ol, nav ul, nav li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
display: block;
}
ol, ul {
list-style: none;
margin: 0px;
padding: 0px;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after, q:before, q:after {
content: '';
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
/*-- start editing from here --*/
a {
text-decoration: none;
}
.txt-rt {
text-align: right;
}
/* text align right */
.txt-lt {
text-align: left;
}
/* text align left */
.txt-center {
text-align: center;
}
/* text align center */
.float-rt {
float: right;
}
/* float right */
.float-lt {
float: left;
}
/* float left */
.clear {
clear: both;
}
/* clear float */
.pos-relative {
position: relative;
}
/* Position Relative */
.pos-absolute {
position: absolute;
}
/* Position Absolute */
.vertical-base {
vertical-align: baseline;
}
/* vertical align baseline */
.vertical-top {
vertical-align: top;
}
/* vertical align top */
nav.vertical ul li {
display: block;
}
/* vertical menu */
nav.horizontal ul li {
display: inline-block;
}
/* horizontal menu */
img {
max-width: 100%;
}
/*-- end reset --*/
body {
background: #fF0000;;
/* fallback for old browsers */
background: -webkit-linear-gradient(to top, #FF0000, #252525);
background: -moz-linear-gradient(to top, #FF0000, #252525);
background: -o-linear-gradient(to top, #FF0000, #252525);
background: linear-gradient(to top, #FF0000, #252525);
background-size: cover;
background-attachment: fixed;
font-family: 'Roboto', sans-serif;
}
h1 {
font-size: 3em;
text-align: center;
color: #000000;
font-weight: 100;
letter-spacing: 4px;
font-family: 'Roboto', sans-serif;
}
/*-- main --*/
.main-w3layouts {
padding: 3em 0 1em;
}
.main-agileinfo {
width: 35%;
margin: 3em auto;
background: rgba(255, 255, 255, 1);
background-size: cover;
}
.agileits-top {
padding: 3em;
}
input[type="text"], input[type="email"], input[type="password"] {
font-size: 0.9em;
color: #000000;
font-weight: 100;
width: 94.5%;
display: block;
border: none;
padding: 0.8em;
border: solid 1px rgba(0, 0, 0, 0);
-webkit-transition: all 0.3s cubic-bezier(0.64, 0.09, 0.08, 1);
transition: all 0.3s cubic-bezier(0.64, 0.09, 0.08, 1);
background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0) 96%, #ff0000 4%);
background: linear-gradient(to bottom, rgba(255, 0, 0, 0) 96%, #ff0000 4%);
background-position: -800px 0;
background-size: 100%;
background-repeat: no-repeat;
color: #000000;
font-family: 'Roboto', sans-serif;
}
input.email, input.text.w3lpass {
margin: 2em 0;
}
.text:focus, .text:valid {
box-shadow: none;
outline: none;
background-position: 0 0;
}
.text:focus::-webkit-input-placeholder, .text:valid::-webkit-input-placeholder {
color: rgba(0, 0, 0, 0.7);
font-size: .9em;
-webkit-transform: translateY(-30px);
-moz-transform: translateY(-30px);
-o-transform: translateY(-30px);
-ms-transform: translateY(-30px);
transform: translateY(-30px);
visibility: visible !important;
}
::-webkit-input-placeholder {
color: #000000;
font-weight: 100;
}
:-moz-placeholder {
/* Firefox 18- */
color: #000000;
}
::-moz-placeholder {
/* Firefox 19+ */
color: #000000;
}
:-ms-input-placeholder {
color: #000000;
}
input[type="submit"] {
font-size: .9em;
color: #ffffff;
background: #FF0000;
outline: none;
border: 1px solid #FF0000;
cursor: pointer;
padding: 0.9em;
-webkit-appearance: none;
width: 100%;
margin: 2em 0;
letter-spacing: 4px;
}
input[type="submit"]:hover {
-webkit-transition: .5s all;
-moz-transition: .5s all;
-o-transition: .5s all;
-ms-transition: .5s all;
transition: .5s all;
background: #ff0000;
}
.agileits-top p {
font-size: 1em;
color: #000000;
text-align: center;
letter-spacing: 1px;
font-weight: 300;
}
.agileits-top p a {
color: #000000;
-webkit-transition: .5s all;
-moz-transition: .5s all;
transition: .5s all;
font-weight: 400;
}
.agileits-top p a:hover {
color: #ff0000;
}
/*-- //main --*/
/*-- checkbox --*/
.wthree-text label {
font-size: 0.9em;
color: #000000;
font-weight: 200;
cursor: pointer;
position: relative;
}
input.checkbox {
background: #fffafa;
cursor: pointer;
width: 1.2em;
height: 1.2em;
}
input.checkbox:before {
content: "";
position: absolute;
width: 1.2em;
height: 1.2em;
background: inherit;
cursor: pointer;
}
input.checkbox:after {
content: "";
position: absolute;
top: 0px;
left: 0;
z-index: 1;
width: 1.2em;
height: 1.2em;
border: 1px solid #ff0000;
-webkit-transition: .4s ease-in-out;
-moz-transition: .4s ease-in-out;
-o-transition: .4s ease-in-out;
transition: .4s ease-in-out;
}
input.checkbox:checked:after {
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
transform: rotate(-45deg);
height: .5rem;
border-color: #fa0000;
border-top-color: transparent;
border-right-color: transparent;
}
.anim input.checkbox:checked:after {
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
transform: rotate(-45deg);
height: .5rem;
border-color: transparent;
border-right-color: transparent;
animation: .4s rippling .4s ease;
animation-fill-mode: forwards;
}
@keyframes rippling {
50% {
border-left-color: #ff0000;
}
100% {
border-bottom-color: #ff0000;
border-left-color: #ff0000;
}
}
/*-- //checkbox --*/
/*-- copyright --*/
.colorlibcopy-agile {
margin: 2em 0 1em;
text-align: center;
}
.colorlibcopy-agile p {
font-size: .9em;
color: #000000;
line-height: 1.8em;
letter-spacing: 1px;
font-weight: 100;
}
.colorlibcopy-agile p a {
color: #000000;
transition: 0.5s all;
-webkit-transition: 0.5s all;
-moz-transition: 0.5s all;
-o-transition: 0.5s all;
-ms-transition: 0.5s all;
}
.colorlibcopy-agile p a:hover {
color: #000;
}
/*-- //copyright --*/
.wrapper {
position: relative;
overflow: hidden;
}
.colorlib-bubbles {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: -1;
}
.colorlib-bubbles li {
position: absolute;
list-style: none;
display: block;
width: 40px;
height: 40px;
background-color: rgba(255, 255, 255, 0.15);
bottom: -160px;
-webkit-animation: square 20s infinite;
-moz-animation: square 250s infinite;
-o-animation: square 20s infinite;
-ms-animation: square 20s infinite;
animation: square 20s infinite;
-webkit-transition-timing-function: linear;
-moz-transition-timing-function: linear;
-o-transition-timing-function: linear;
-ms-transition-timing-function: linear;
transition-timing-function: linear;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
-o-border-radius: 50%;
-ms-border-radius: 50%;
border-radius: 50%;
}
.colorlib-bubbles li:nth-child(1) {
left: 10%;
}
.colorlib-bubbles li:nth-child(2) {
left: 20%;
width: 80px;
height: 80px;
-webkit-animation-delay: 2s;
-moz-animation-delay: 2s;
-o-animation-delay: 2s;
-ms-animation-delay: 2s;
animation-delay: 2s;
-webkit-animation-duration: 17s;
-moz-animation-duration: 17s;
-o-animation-duration: 17s;
animation-duration: 17s;
}
.colorlib-bubbles li:nth-child(3) {
left: 25%;
-webkit-animation-delay: 4s;
-moz-animation-delay: 4s;
-o-animation-delay: 4s;
-ms-animation-delay: 4s;
animation-delay: 4s;
}
.colorlib-bubbles li:nth-child(4) {
left: 40%;
width: 60px;
height: 60px;
-webkit-animation-duration: 22s;
-moz-animation-duration: 22s;
-o-animation-duration: 22s;
-ms-animation-duration: 22s;
animation-duration: 22s;
background-color: rgba(255, 255, 255, 0.25);
}
.colorlib-bubbles li:nth-child(5) {
left: 70%;
}
.colorlib-bubbles li:nth-child(6) {
left: 80%;
width: 120px;
height: 120px;
-webkit-animation-delay: 3s;
-moz-animation-delay: 3s;
-o-animation-delay: 3s;
-ms-animation-delay: 3s;
animation-delay: 3s;
background-color: rgba(255, 255, 255, 0.2);
}
.colorlib-bubbles li:nth-child(7) {
left: 32%;
width: 160px;
height: 160px;
-webkit-animation-delay: 7s;
-moz-animation-delay: 7s;
-o-animation-delay: 7s;
-ms-animation-delay: 7s;
animation-delay: 7s;
}
.colorlib-bubbles li:nth-child(8) {
left: 55%;
width: 20px;
height: 20px;
-webkit-animation-delay: 15s;
-moz-animation-delay: 15s;
animation-delay: 15s;
-webkit-animation-duration: 40s;
-moz-animation-duration: 40s;
animation-duration: 40s;
}
.colorlib-bubbles li:nth-child(9) {
left: 25%;
width: 10px;
height: 10px;
-webkit-animation-delay: 2s;
animation-delay: 2s;
-webkit-animation-duration: 40s;
animation-duration: 40s;
background-color: rgba(255, 255, 255, 0.3);
}
.colorlib-bubbles li:nth-child(10) {
left: 90%;
width: 160px;
height: 160px;
-webkit-animation-delay: 11s;
animation-delay: 11s;
}
@-webkit-keyframes square {
0% {
-webkit-transform: translateY(0);
-moz-transform: translateY(0);
-o-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
100% {
-webkit-transform: translateY(-700px) rotate(600deg);
-moz-transform: translateY(-700px) rotate(600deg);
-o-transform: translateY(-700px) rotate(600deg);
-ms-transform: translateY(-700px) rotate(600deg);
transform: translateY(-700px) rotate(600deg);
}
}
@keyframes square {
0% {
-webkit-transform: translateY(0);
-moz-transform: translateY(0);
-o-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
100% {
-webkit-transform: translateY(-700px) rotate(600deg);
-moz-transform: translateY(-700px) rotate(600deg);
-o-transform: translateY(-700px) rotate(600deg);
-ms-transform: translateY(-700px) rotate(600deg);
transform: translateY(-700px) rotate(600deg);
}
}
/*-- responsive-design --*/
@media(max-width:1440px) {
input[type="text"], input[type="email"], input[type="password"] {
width: 94%;
}
}
@media(max-width:1366px) {
h1 {
font-size: 2.6em;
}
.agileits-top {
padding: 2.5em;
}
.main-agileinfo {
margin: 2em auto;
}
.main-agileinfo {
width: 36%;
}
}
@media(max-width:1280px) {
.main-agileinfo {
width: 40%;
}
}
@media(max-width:1080px) {
.main-agileinfo {
width: 46%;
}
}
@media(max-width:1024px) {
.main-agileinfo {
width: 49%;
}
}
@media(max-width:991px) {
h1 {
font-size: 2.4em;
}
.main-w3layouts {
padding: 2em 0 1em;
}
}
@media(max-width:900px) {
.main-agileinfo {
width: 58%;
}
input[type="text"], input[type="email"], input[type="password"] {
width: 93%;
}
}
@media(max-width:800px) {
h1 {
font-size: 2.2em;
}
}
@media(max-width:736px) {
.main-agileinfo {
width: 62%;
}
}
@media(max-width:667px) {
.main-agileinfo {
width: 67%;
}
}
@media(max-width:600px) {
.agileits-top {
padding: 2.2em;
}
input.email, input.text.w3lpass {
margin: 1.5em 0;
}
input[type="submit"] {
margin: 2em 0;
}
h1 {
font-size: 2em;
letter-spacing: 3px;
}
}
@media(max-width:568px) {
.main-agileinfo {
width: 75%;
}
.colorlibcopy-agile p {
padding: 0 2em;
}
}
@media(max-width:480px) {
h1 {
font-size: 1.8em;
letter-spacing: 3px;
}
.agileits-top {
padding: 1.8em;
}
input[type="text"], input[type="email"], input[type="password"] {
width: 91%;
}
.agileits-top p {
font-size: 0.9em;
}
}
@media(max-width:414px) {
h1 {
font-size: 1.8em;
letter-spacing: 2px;
}
.main-agileinfo {
width: 85%;
margin: 1.5em auto;
}
.text:focus, .text:valid {
background-position: 0 0px;
}
.wthree-text ul li, .wthree-text ul li:nth-child(2) {
display: block;
float: none;
}
.wthree-text ul li:nth-child(2) {
margin-top: 1.5em;
}
input[type="submit"] {
margin: 2em 0 1.5em;
letter-spacing: 3px;
}
input[type="submit"] {
margin: 2em 0 1.5em;
}
.colorlibcopy-agile {
margin: 1em 0 1em;
}
}
@media(max-width:384px) {
.main-agileinfo {
width: 88%;
}
.colorlibcopy-agile p {
padding: 0 1em;
}
}
@media(max-width:375px) {
.agileits-top p {
letter-spacing: 0px;
}
}
@media(max-width:320px) {
.main-w3layouts {
padding: 1.5em 0 0;
}
.agileits-top {
padding: 1.2em;
}
.colorlibcopy-agile {
margin: 0 0 1em;
}
input[type="text"], input[type="email"], input[type="password"] {
width: 89.5%;
font-size: 0.85em;
}
h1 {
font-size: 1.7em;
letter-spacing: 0px;
}
.main-agileinfo {
width: 92%;
margin: 1em auto;
}
.text:focus, .text:valid {
background-position: 0 0px;
}
input[type="submit"] {
margin: 1.5em 0;
padding: 0.8em;
font-size: .85em;
}
.colorlibcopy-agile p {
font-size: .85em;
}
.wthree-text label {
font-size: 0.85em;
}
.main-w3layouts {
padding: 1em 0 0;
}
}
@media (max-width: 1120px) {
.custom_nav-container .form-inline input {
display: none;
}
}
@media (max-width: 992px) {
.login_btn-contanier {
margin: 15px 0;
}
.hero_area {
height: auto;
}
.slider_section.position-relative {
padding: 120px 0;
}
}
@media (max-width: 768px) {
.slider_section .carousel-control-prev,
.slider_section .carousel-control-next {
display: none;
}
.slider_section .detail-box {
margin-top: 20px;
text-align: center;
}
.discount_section .detail-box {
text-align: center;
}
.client_section .client_container {
width: 95%;
}
.contact_section {
padding-left: 15px;
padding-right: 15px;
}
.contact_section .detail-box {
margin: 0 -15px;
margin-top: 25px;
}
.info_section {
text-align: center;
}
.info_section .row>div {
margin: 25px 0;
}
.info_section .info_contact .box {
justify-content: center;
}
.footer_section p {
width: auto;
}
}
@media (max-width: 576px) {
.health_section .box {
width: auto;
margin-right: 5px;
}
}
@media (max-width: 480px) {}
@media (max-width: 420px) {}
@media (max-width: 360px) {
.top_contact-container {
display: none !important;
}
}
@media (min-width: 1200px) {
.container {
max-width: 1170px;
}
}
\ No newline at end of file
body {
font-family: "Poppins", sans-serif;
color: #000000;
background-color: #ffffff;
}
.layout_padding {
padding: 100px 0;
}
.layout_padding2 {
padding: 55px 0;
}
.layout_padding2-top {
padding-top: 55px;
}
.layout_padding2-bottom {
padding-bottom: 55px;
}
.layout_padding-top {
padding-top: 100px;
}
.layout_padding-bottom {
padding-bottom: 100px;
}
.custom_heading-container {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
.custom_heading-container h2 {
text-transform: uppercase;
position: relative;
}
.custom_heading-container h2::after {
content: "";
position: absolute;
bottom: -5px;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
width: 50px;
height: 5px;
background-color: #FF0000;
}
/*header section*/
.hero_area {
height: 100vh;
background-image: url(../images/fondo.jpg);
}
.sub_page .hero_area {
height: auto;
}
.hero_area.sub_pages {
height: auto;
}
.header_section .top_contact-container {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
padding: 5px 0;
font-family: 'Roboto', sans-serif;
}
.header_section .top_contact-container .tel_container a {
color: #ffffff;
text-transform: uppercase;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.header_section .top_contact-container .tel_container a img {
width: 20px;
margin-right: 10px;
}
.header_section .top_contact-container .social-container img {
margin: 0 5px;
}
.header_section .top_contact-container .social-container img.s-1 {
width: 25px;
}
.header_section .top_contact-container .social-container img.s-2 {
width: 25px;
}
.header_section .top_contact-container .social-container img.s-3 {
width: 25px;
}
.header_section .container-fluid {
background-color: #2c2c2c;
}
.header_section .container-fluid {
padding-right: 25px;
padding-left: 25px;
}
.header_section .nav_container {
margin: 0 auto;
}
.custom_nav-container.navbar-expand-lg .navbar-nav .nav-link {
padding: 10px 25px;
color: #ffffff;
text-align: center;
text-transform: uppercase;
font-family: 'Roboto', sans-serif;
}
a,
a:hover,
a:focus {
text-decoration: none;
}
a:hover,
a:focus {
color: initial;
}
.btn,
.btn:focus {
outline: none !important;
-webkit-box-shadow: none;
box-shadow: none;
}
.navbar-brand,
.navbar-brand:hover {
text-transform: uppercase;
font-weight: bold;
font-size: 24px;
color: #fafcfd;
}
.custom_nav-container .nav_search-btn {
background-image: url(../../images/search-icon.png);
background-size: 18px;
background-repeat: no-repeat;
background-position: center;
width: 35px;
height: 35px;
padding: 0;
border: none;
border-radius: 0;
}
.login_btn-contanier a {
text-transform: uppercase;
color: #ffffff;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
font-family: 'Roboto', sans-serif;
}
.login_btn-contanier a img {
margin-right: 15px;
}
.navbar-brand {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.navbar-brand img {
width: 40px;
margin-right: 5px;
}
.navbar-brand span {
font-size: 20px;
font-weight: 700;
color: #ffffff;
margin-top: 5px;
}
.custom_nav-container {
z-index: 99999;
padding: 10px 0;
}
.custom_nav-container .form-inline {
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
}
.custom_nav-container .form-inline input {
width: 84%;
border: none;
outline: none;
padding: 4px;
padding-left: 15px;
text-transform: uppercase;
height: 35px;
background-color: #ffffff;
}
.custom_nav-container .form-inline button {
background-color: #ffffff;
}
.custom_nav-container .navbar-toggler {
outline: none;
}
.custom_nav-container .navbar-toggler .navbar-toggler-icon {
background-image: url(../../images/menu.png);
background-size: 42px;
}
/*end header section*/
/* slider section */
.slider_section {
height: 100%;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
padding-bottom: 75px;
}
.slider_section .img-box img {
width: 100%;
}
.slider_section .detail-box h1 {
color: #2c2c2c;
}
.slider_section .detail-box h1 span {
font-size: 4rem;
color: #ffffff;
font-weight: bold;
}
.slider_section .detail-box p {
color: #ffffff;
}
.slider_section .detail-box a {
display: inline-block;
padding: 10px 45px;
background-color: #2c2c2c;
border: 1px solid #2c2c2c;
color: #ffffff;
margin-top: 35px;
margin-bottom: 45px;
}
.slider_section .detail-box a:hover {
background-color: transparent;
color: #2c2c2c;
}
.slider_section #carouselExampleIndicators {
width: 100%;
}
.slider_section .carousel-control-prev,
.slider_section .carousel-control-next {
position: absolute;
left: 2.5%;
width: 45px;
height: 45px;
border: none;
border-radius: 100%;
opacity: 1;
background-repeat: no-repeat;
background-size: 12px;
background-position: center;
background-color: #2c2c2c;
-webkit-transform: translateY(-50%) translatex(0);
transform: translateY(-50%) translatex(0);
}
.slider_section .carousel-control-prev:hover,
.slider_section .carousel-control-next:hover {
background-color: #ffffff;
width: 55px;
height: 55px;
-webkit-transform: translateY(-50%) translatex(-5px);
transform: translateY(-50%) translatex(-5px);
}
.slider_section .carousel-control-prev {
top: 47%;
background-image: url(../../images/left-arrow.png);
}
.slider_section .carousel-control-prev:hover {
background-image: url(../../images/left-arrow-blue.png);
}
.slider_section .carousel-control-next {
top: 62%;
background-image: url(../../images/right-arrow.png);
}
.slider_section .carousel-control-next:hover {
background-image: url(../../images/right-arrow-blue.png);
}
.slider_section .carousel-indicators {
bottom: -75px;
}
.slider_section .carousel-indicators li {
margin: 0;
height: 1px;
opacity: 1;
width: 40px;
}
.slider_section .carousel-indicators li.active {
height: 5px;
margin-top: -2px;
width: 45px;
}
.feature_section .feature_container {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
text-align: center;
}
.feature_section .feature_container .box {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
width: 350px;
min-width: 350px;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
margin: 30px auto;
}
.feature_section .feature_container .box .img-box {
border: 1px solid #000000;
width: 85px;
padding: 15px;
border-radius: 3px;
}
.feature_section .feature_container .box .img-box svg {
width: 100%;
height: auto;
}
.feature_section .feature_container .box .detail-box {
margin-top: 15px;
}
.feature_section .feature_container .box .detail-box h5 {
text-transform: uppercase;
font-weight: bold;
}
.feature_section .feature_container .box:hover .img-box {
border: 1px solid #FF0000;
}
.feature_section .feature_container .box:hover .img-box svg {
fill: #FF0000;
}
.discount_section {
background-color: #1e1d1d;
color: #ffffff;
}
.discount_section .row {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.discount_section .row .col-lg-7 {
padding: 0;
}
.discount_section .detail-box {
padding: 45px 0;
}
.discount_section .detail-box h2 {
text-transform: uppercase;
font-size: 2.5rem;
font-weight: bold;
}
.discount_section .detail-box h2 span {
color: #FF0000;
}
.discount_section .detail-box p {
margin-top: 25px;
}
.discount_section .detail-box a {
display: inline-block;
padding: 10px 45px;
background-color: #FF0000;
border: 1px solid #FF0000;
color: #ffffff;
margin-top: 35px;
}
.discount_section .detail-box a:hover {
background-color: transparent;
color: #FF0000;
}
.discount_section .img-box img {
width: 100%;
}
.health_section .health_carousel-container {
width: 90%;
margin: 0 auto;
}
.health_section a {
display: inline-block;
padding: 10px 45px;
background-color: #2c2c2c;
border: 1px solid #2c2c2c;
color: #ffffff;
margin-top: 30px;
}
.health_section a:hover {
background-color: transparent;
color: #2c2c2c;
}
.health_section .box {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
width: 300px;
height: 360px;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
border: 1px solid #a6a6a6;
margin: 20px 0;
font-family: 'Roboto', sans-serif;
}
.health_section .box .img-box img {
width: 100%;
}
.health_section .box .btn_container {
width: 100%;
}
.health_section .box .btn_container a {
display: inline-block;
padding: 8px 15px;
background-color: #2c2c2c;
border: 1px solid #2c2c2c;
color: #ffffff;
margin: -0.5px 0 0 -0.5px;
}
.health_section .box .btn_container a:hover {
background-color: transparent;
color: #2c2c2c;
}
.health_section .box .btn_container a:hover {
background-color: #FF0000;
color: #ffffff;
border-color: transparent;
}
.health_section .box .detail-box {
width: 100%;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
padding: 0 15px;
}
.health_section .box .detail-box .star_container {
color: #f5c608;
}
.health_section .box .detail-box .text {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
.health_section .box .detail-box .text h6 {
text-transform: uppercase;
}
.health_section .box .detail-box .text h6.price {
font-weight: bold;
margin-left: 15px;
}
.health_section .box .detail-box .text h6.price span {
color: #FF0000;
}
.health_section .owl-carousel .owl-nav.disabled {
display: block;
}
.health_section .owl-carousel .owl-nav.disabled > div {
position: absolute;
top: -65px;
background-color: #2c2c2c;
width: 50px;
height: 50px;
background-size: 10px;
background-position: center;
background-repeat: no-repeat;
}
.health_section .owl-carousel .owl-nav.disabled > div:hover {
background-color: #FF0000;
}
.health_section .owl-carousel .owl-nav.disabled .owl-prev {
background-image: url(../../images/prev.png);
right: 95px;
}
.health_section .owl-carousel .owl-nav.disabled .owl-next {
background-image: url(../../images/next.png);
right: 35px;
}
.about_section {
background-color: #f9f9f9;
text-align: center;
}
.about_section .container {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.about_section .container .img-box {
margin: 45px 0;
margin-left: 40px;
}
.about_section .container .img-box img {
width: 100%;
}
.about_section .container .detail-box a {
display: inline-block;
padding: 10px 45px;
background-color: #2c2c2c;
border: 1px solid #2c2c2c;
color: #ffffff;
margin-top: 35px;
}
.about_section .container .detail-box a:hover {
background-color: transparent;
color: #2c2c2c;
}
.client_section .client_container {
width: 550px;
margin: 0 auto;
text-align: center;
}
.client_section .client_container .client_detail {
border: 1px solid #000000;
padding: 25px 20px;
}
.client_section .client_container .client_detail p {
margin: 0;
}
.client_section .client_container .client_box {
margin-top: 35px;
}
.client_section .client_container .client_box .name {
margin-top: 25px;
}
.client_section .client_container .client_box .name h5 {
text-transform: uppercase;
}
.client_section .client_container .client_box .name h6 {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
color: #FF0000;
}
.client_section .client_container .client_box .name h6 img {
margin-top: 5px;
}
.client_section .carousel-indicators {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
bottom: -25px;
}
.client_section .carousel-indicators li {
margin: 3px;
width: 20px;
height: 20px;
opacity: 1;
background-color: #FF0000;
border-radius: 100%;
position: relative;
}
.client_section .carousel-indicators li::before {
content: "";
width: 35%;
height: 35%;
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
background-color: #ffffff;
border-radius: 100%;
}
.client_section .carousel-indicators li.active {
background-color: #161616;
width: 15px;
height: 15px;
}
.client_section .carousel-indicators li.active::before {
display: none;
}
.contact_section .custom_heading-container {
-webkit-box-pack: start;
-ms-flex-pack: start;
justify-content: start;
}
.contact_section .custom_heading-container h2::after {
left: 0;
-webkit-transform: none;
transform: none;
}
.contact_section .form_contaier form .form-group {
margin-bottom: 20px;
}
.contact_section .form_contaier form .form-control {
border-radius: 0;
height: 35px;
-webkit-box-shadow: none;
box-shadow: none;
}
.contact_section .form_contaier form .form-control#exampleInputMessage {
height: 100px;
}
.contact_section .form_contaier form button {
display: inline-block;
padding: 10px 50px;
background-color: #121313;
border: 1px solid #121313;
color: #ffffff;
border-radius: 5px;
margin-top: 15px;
}
.contact_section .form_contaier form button:hover {
background-color: transparent;
color: #121313;
}
.contact_section .detail-box {
background-image: url(../../images/contact-bg.jpg);
color: #ffffff;
padding: 140px 15%;
text-align: center;
margin-top: 30px;
}
.contact_section .detail-box h3 {
font-weight: bold;
font-size: 32px;
}
.contact_section .detail-box p {
margin-top: 25px;
}
.info_section {
background-color: #121111;
color: #ffffff;
}
.info_section h4 {
text-transform: uppercase;
font-weight: bold;
}
.info_section .info_contact .box {
margin: 10px 0;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
.info_section .info_contact .box .img-box {
margin-right: 15px;
}
.info_section .info_contact .box .img-box img {
width: 25px;
}
.info_section .info_menu .navbar-nav .nav-item .nav-link {
color: #ffffff;
}
.info_section .info_news form input {
width: 100%;
padding: 3px 10px;
}
.info_section .info_news form button {
display: inline-block;
padding: 7px 60px;
background-color: #FF0000;
border: 1px solid #FF0000;
color: #ffffff;
}
.info_section .info_news form button:hover {
background-color: transparent;
color: #FF0000;
}
/* footer section*/
.footer_section {
background-color: #121111;
font-weight: 500;
}
.footer_section p {
color: #fbfcfd;
margin: 0;
text-align: center;
padding: 20px;
border-top: 1px solid #9b9b9b;
width: 65%;
margin: 0 auto;
}
.footer_section a {
color: #fbfcfd;
}
/* end footer section*/
/*# sourceMappingURL=style.css.map */
\ No newline at end of file
{
"version": 3,
"mappings": "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",
"sources": [
"style.scss"
],
"names": [],
"file": "style.css"
}
\ No newline at end of file
$btnBlack: #252525;
$cream: #f2d8b9;
$blue: #f2d8b9;
$white: #ffffff;
$black: #000000;
$primary: #FF0000;
@mixin main-font {
font-family: "Poppins", sans-serif;
}
@mixin secondary-font {
font-family: 'Roboto', sans-serif;
}
@mixin hero_btn($col1, $col2, $pad1, $pad2) {
display: inline-block;
padding: $pad1 $pad2;
background-color: $col1;
border: 1px solid $col1;
color: $col2;
&:hover {
background-color: transparent;
color: $col1;
}
}
@mixin upperBold {
text-transform: uppercase;
font-weight: bold;
}
body {
@include main-font;
color: $black;
background-color: #ffffff;
}
.layout_padding {
padding: 100px 0;
}
.layout_padding2 {
padding: 55px 0;
}
.layout_padding2-top {
padding-top: 55px;
}
.layout_padding2-bottom {
padding-bottom: 55px;
}
.layout_padding-top {
padding-top: 100px;
}
.layout_padding-bottom {
padding-bottom: 100px;
}
.custom_heading-container {
display: flex;
justify-content: center;
h2 {
text-transform: uppercase;
position: relative;
&::after {
content: "";
position: absolute;
bottom: -5px;
left: 50%;
transform: translateX(-50%);
width: 50px;
height: 5px;
background-color: $primary;
}
}
}
/*header section*/
.hero_area {
height: 100vh;
background-image: src="../images/bahreinbandera.png";
}
.sub_page {
.hero_area {
height: auto;
}
}
.hero_area.sub_pages {
height: auto;
}
.header_section {
.top_contact-container {
display: flex;
justify-content: space-between;
padding: 5px 0;
@include secondary-font();
.tel_container {
a {
color: $white;
text-transform: uppercase;
display: flex;
align-items: center;
img {
width: 20px;
margin-right: 10px;
}
}
}
.social-container {
img {
margin: 0 5px;
&.s-1 {
width: 25px;
}
&.s-2 {
width: 25px;
}
&.s-3 {
width: 25px;
}
}
}
}
.container-fluid {
background-color: #2c2c2c;
}
}
.header_section .container-fluid {
padding-right: 25px;
padding-left: 25px;
}
.header_section .nav_container {
margin: 0 auto;
}
.custom_nav-container.navbar-expand-lg .navbar-nav .nav-link {
padding: 10px 25px;
color: #ffffff;
text-align: center;
text-transform: uppercase;
@include secondary-font();
}
a,
a:hover,
a:focus {
text-decoration: none;
}
a:hover,
a:focus {
color: initial;
}
.btn,
.btn:focus {
outline: none !important;
box-shadow: none;
}
.navbar-brand,
.navbar-brand:hover {
@include upperBold;
font-size: 24px;
color: #fafcfd;
}
.custom_nav-container .nav_search-btn {
background-image: url(../../images/search-icon.png);
background-size: 18px;
background-repeat: no-repeat;
background-position: center;
width: 35px;
height: 35px;
padding: 0;
border: none;
border-radius: 0;
}
.login_btn-contanier {
a {
text-transform: uppercase;
color: $white;
display: flex;
align-items: center;
@include secondary-font();
img {
margin-right: 15px;
}
}
}
.navbar-brand {
display: flex;
align-items: center;
}
.navbar-brand img {
width: 40px;
margin-right: 5px;
}
.navbar-brand span {
font-size: 20px;
font-weight: 700;
color: $white;
margin-top: 5px;
}
.custom_nav-container {
z-index: 99999;
padding: 10px 0;
.form-inline {
flex-grow: 1;
flex-wrap: nowrap;
input {
width: 84%;
border: none;
outline: none;
padding: 4px;
padding-left: 15px;
text-transform: uppercase;
height: 35px;
background-color: $white;
}
button {
background-color: $white;
}
}
}
.custom_nav-container .navbar-toggler {
outline: none;
}
.custom_nav-container .navbar-toggler .navbar-toggler-icon {
background-image: url(../images/menu.png);
background-size: 42px;
}
/*end header section*/
/* slider section */
.slider_section {
height: 100%;
display: flex;
align-items: center;
padding-bottom: 75px;
.img-box {
img {
width: 100%;
}
}
.detail-box {
h1 {
color: #2c2c2c;
span {
font-size: 4rem;
color: $white;
font-weight: bold;
}
}
p {
color: $white;
}
a {
@include hero_btn(#2c2c2c, $white, 10px, 45px);
margin-top: 35px;
margin-bottom: 45px;
}
}
#carouselExampleIndicators {
width: 100%;
}
.carousel-control-prev,
.carousel-control-next {
position: absolute;
left: 2.5%;
width: 45px;
height: 45px;
border: none;
border-radius: 100%;
opacity: 1;
background-repeat: no-repeat;
background-size: 12px;
background-position: center;
background-color: #2c2c2c;
transform: translateY(-50%)translatex(0);
&:hover {
background-color: $white;
width: 55px;
height: 55px;
transform: translateY(-50%)translatex(-5px);
}
}
.carousel-control-prev {
top: 47%;
background-image: url(../../images/left-arrow.png);
&:hover {
background-image: url(../../images/left-arrow-blue.png);
}
}
.carousel-control-next {
top: 62%;
background-image: url(../../images/right-arrow.png);
&:hover {
background-image: url(../../images/right-arrow-blue.png);
}
}
.carousel-indicators {
bottom: -75px;
li {
margin: 0;
height: 1px;
opacity: 1;
width: 40px;
&.active {
height: 5px;
margin-top: -2px;
width: 45px;
}
}
}
}
// end slider section
// feature section
.feature_section {
.feature_container {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
text-align: center;
.box {
display: flex;
width: 350px;
min-width: 350px;
flex-direction: column;
align-items: center;
margin: 30px auto;
.img-box {
border: 1px solid $black;
width: 85px;
padding: 15px;
border-radius: 3px;
svg {
width: 100%;
height: auto;
}
}
.detail-box {
margin-top: 15px;
h5 {
text-transform: uppercase;
font-weight: bold;
}
}
&:hover {
.img-box {
border: 1px solid $primary;
svg {
fill: $primary;
}
}
}
}
}
}
// end feature section
// discount section
.discount_section {
background-color: #1e1d1d;
color: $white;
.row {
align-items: center;
.col-lg-7 {
padding: 0;
}
}
.detail-box {
padding: 45px 0;
h2 {
text-transform: uppercase;
font-size: 2.5rem;
font-weight: bold;
span {
color: $primary;
}
}
p {
margin-top: 25px;
}
a {
@include hero_btn($primary, $white, 10px, 45px);
margin-top: 35px;
}
}
.img-box {
img {
width: 100%;
}
}
}
// end discount section
// health section
.health_section {
.health_carousel-container {
width: 90%;
margin: 0 auto;
}
a {
@include hero_btn(#2c2c2c, $white, 10px, 45px);
margin-top: 30px;
}
.box {
display: flex;
flex-direction: column;
align-items: center;
width: 300px;
height: 360px;
justify-content: space-between;
border: 1px solid #a6a6a6;
margin: 20px 0;
@include secondary-font();
.img-box {
img {
width: 100%;
}
}
.btn_container {
width: 100%;
a {
@include hero_btn(#2c2c2c, $white, 8px, 15px);
margin: -0.5px 0 0 -0.5px;
&:hover {
background-color: $primary;
color: $white;
border-color: transparent;
}
}
}
.detail-box {
width: 100%;
display: flex;
justify-content: space-between;
padding: 0 15px;
.star_container {
color: #f5c608;
}
.text {
display: flex;
h6 {
text-transform: uppercase;
&.price {
font-weight: bold;
margin-left: 15px;
span {
color: $primary;
}
}
}
}
}
}
.owl-carousel .owl-nav.disabled {
display: block;
&>div {
position: absolute;
top: -65px;
background-color: #2c2c2c;
width: 50px;
height: 50px;
background-size: 10px;
background-position: center;
background-repeat: no-repeat;
&:hover {
background-color: $primary;
}
}
.owl-prev {
background-image: url(../../images/prev.png);
right: 95px;
}
.owl-next {
background-image: url(../../images/next.png);
right: 35px;
}
}
}
// end health section
// about section
.about_section {
background-color: #f9f9f9;
text-align: center;
.container {
display: flex;
flex-direction: column;
align-items: center;
.img-box {
margin: 45px 0;
margin-left: 40px;
img {
width: 100%;
}
}
.detail-box {
a {
@include hero_btn(#2c2c2c, $white, 10px, 45px);
margin-top: 35px;
}
}
}
}
// end about section
// client section
.client_section {
.client_container {
width: 550px;
margin: 0 auto;
text-align: center;
.client_detail {
border: 1px solid $black;
padding: 25px 20px;
p {
margin: 0;
}
}
.client_box {
margin-top: 35px;
.name {
margin-top: 25px;
h5 {
text-transform: uppercase;
}
h6 {
display: flex;
flex-direction: column;
align-items: center;
color: #FF0000;
img {
margin-top: 5px;
}
}
}
}
}
.carousel-indicators {
align-items: center;
bottom: -25px;
li {
margin: 3px;
width: 20px;
height: 20px;
opacity: 1;
background-color: $primary;
border-radius: 100%;
position: relative;
&::before {
content: "";
width: 35%;
height: 35%;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
background-color: $white;
border-radius: 100%;
}
&.active {
background-color: #161616;
width: 15px;
height: 15px;
&::before {
display: none;
}
}
}
}
}
// end client section
// contact section
.contact_section {
.custom_heading-container {
justify-content: start;
h2 {
&::after {
left: 0;
transform: none;
}
}
}
.form_contaier {
form {
.form-group {
margin-bottom: 20px;
}
.form-control {
border-radius: 0;
height: 35px;
box-shadow: none;
&#exampleInputMessage {
height: 100px;
}
}
button {
@include hero_btn(#121313, $white, 10px, 50px);
border-radius: 5px;
margin-top: 15px;
}
}
}
.detail-box {
background-image: url(../../images/contact-bg.jpg);
color: $white;
padding: 140px 15%;
text-align: center;
margin-top: 30px;
h3 {
font-weight: bold;
font-size: 32px;
}
p {
margin-top: 25px;
}
}
}
// end contact section
// info section
.info_section {
background-color: #121111;
color: $white;
h4 {
text-transform: uppercase;
font-weight: bold;
}
.info_contact {
.box {
margin: 10px 0;
display: flex;
.img-box {
margin-right: 15px;
img {
width: 25px;
}
}
}
}
.info_menu {
.navbar-nav {
.nav-item {
.nav-link {
color: $white;
}
}
}
}
.info_news {
form {
input {
width: 100%;
padding: 3px 10px;
}
button {
@include hero_btn($primary, $white, 7px, 60px);
}
}
}
}
// end info section
/* footer section*/
.footer_section {
background-color: #121111;
font-weight: 500;
}
.footer_section p {
color: #fbfcfd;
margin: 0;
text-align: center;
padding: 20px;
border-top: 1px solid #9b9b9b;
width: 65%;
margin: 0 auto;
}
.footer_section a {
color: #fbfcfd;
}
/* end footer section*/
\ No newline at end of file
No preview for this file type
No preview for this file type
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="jakarta.faces.html"
xmlns:ui="jakarta.faces.facelets">
<ui:composition
xmlns:h="jakarta.faces.html"
xmlns:ui="jakarta.faces.facelets"
template="WEB-INF/layout/layout.xhtml">
<ui:define name="cabecera">
<div class="container-fluid">
<div id="nav" class="navbar navbar-expand-lg custom_nav-container pt-3">
<a class="navbar-brand" href="index.xhtml">
<img src="resources/images/logo.png" alt=""> </img>
<span>
STORE
</span>
</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent"
aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<div class="d-flex flex-column flex-lg-row align-items-center w-100 ">
<ul class="navbar-nav ">
<li class="nav-item">
<a class="nav-link" href="buy.xhtml"> Entradas </a>
</li>
<li class="nav-item">
<a class="nav-link" href="circuitos.xhtml"> Circuitos </a>
</li>
</ul>
<div class="login_btn-contanier ml-0 ml-lg-5">
<a href="">
<img src="images/user.png" alt=""> </img>
<span>
<a class="nav-link" href="iniciarSesion.xhtml">Iniciar Sesión</a>
</span>
</a>
</div>
<div class="login_btn-contanier ml-0 ml-lg-5">
<a href="">
<img src="images/user.png" alt=""> </img>
<span>
<a class="nav-link" href="registro.xhtml">Registro</a>
</span>
</a>
</div>
</div>
</div>
</div>
</div>
</ui:define>
<ui:define name="info">
<section class=" slider_section position-relative">
<div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel">
<ol class="carousel-indicators">
<li data-target="#carouselExampleIndicators" data-slide-to="0" class="active"/>
<li data-target="#carouselExampleIndicators" data-slide-to="1"/>
</ol>
<div class="carousel-inner">
<div class="carousel-item active">
<div class="container">
<div class="row">
<div class="col-md-4">
<div class="img-box">
<img src="images/calendariof1.jpg" alt=""/>
</div>
</div>
<div class="col-md-8">
<div class="detail-box">
<h1>
<span>
Presentado el nuevo <br/>
calendario de 2023
</span>
</h1>
<p>
La temporada 2023 de Fórmula 1 será la 74.ª temporada del Campeonato Mundial de Fórmula 1 de la historia. Será organizada por la Federación Internacional del Automóvil (FIA).
</p>
<div>
<a href="buy.xhtml">
Comprar ahora
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="carousel-item">
<div class="container">
<div class="row">
<div class="col-md-4">
<div class="img-box">
<img src="images/bahreinbandera.png" alt=""/>
</div>
</div>
<div class="col-md-8">
<div class="detail-box">
<h1>
<span>
Próximo GP <br/>
Bahréin - Circuito de Sakhir
</span>
</h1>
<p>
Situado en el corazón del desierto de Sakhir, el Circuito Internacional de Bahréin es una instalación única y contemporánea, sinónimo de los más altos niveles del automovilismo mundial. Con cinco trazados diferentes, el circuito vio la luz por primera vez en 2004, cuando se celebró el primer Gran Premio de Fórmula 1 de la historia en el país, convirtiéndose en el primer trazado de Oriente Próximo en albergar el Campeonato del Mundo de Fórmula 1. El Circuito Internacional de Bahréin sigue albergando multitudes asombrosas y una amplia gama de eventos y actividades, y sirve de plataforma que fomenta los deportes de motor en el país.
</p>
<div>
<a class="nav-link" href="buy.xhtml">
Ver más
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<a class="carousel-control-prev" href="#carouselExampleIndicators" role="button" data-slide="prev">
<span class="sr-only">Previous</span>
</a>
<a class="carousel-control-next" href="#carouselExampleIndicators" role="button" data-slide="next">
<span class="sr-only">Next</span>
</a>
</div>
</section>
</ui:define>
<ui:define name="masinfo">
<div class="container">
<div class="custom_heading-container ">
<h2>
About Us
</h2>
</div>
<div class="img-box">
<img src="images/logo2.png" alt="" style="width:256px;height:64px;"/>
</div>
<div class="detail-box">
<p>
El Campeonato Mundial de Fórmula 1 de la FIA, más conocido como Fórmula 1, F1 o Fórmula Uno, es la principal competición de automovilismo internacional y el campeonato de deportes de motor más popular y prestigioso del mundo. La entidad que la dirige es la Federación Internacional del Automóvil (FIA). Desde septiembre del 2016, tras la adquisición de Formula One Group, la empresa estadounidense Liberty Media es la responsable de gestionar y operar el campeonato.
<br/><br/>
El inicio de la Fórmula 1 moderna se remonta al año 1950, en el que participaron escuderías como Ferrari, Alfa Romeo y Maserati. Algunas fueron reemplazadas por otras nuevas como McLaren, Williams, Red Bull y otras que volvieron como Mercedes que se han alzado varias veces con el Campeonato Mundial de Constructores. Por su parte, los pilotos deben contar con la superlicencia de la FIA para competir, que se obtiene por los resultados en otros campeonatos.</p>
<div class="d-flex justify-content-center">
<a href="https://es.wikipedia.org/wiki/F%C3%B3rmula_1">
Leer más
</a>
</div>
</div>
</div>
</ui:define>
<ui:define name="pie">
<div class="container">
<div class="top_contact-container">
<div class="tel_container">
<br/>
<a href="">
<img src="images/telephone-symbol-button.png" alt=""/> Llama al : +44 20 3984 9372
</a>
</div>
<div class="social-container" align="right">
<a href="https://www.facebook.com/Formula1/?locale=es_ES">
<img src="images/fb.png" alt="" class="s-1" href="https://www.facebook.com/Formula1/?locale=es_ES"/>
</a>
<a href="https://twitter.com/F1">
<img src="images/twitter.png" alt="" class="s-2" href="https://twitter.com/F1" width="51"/>
</a>
<a href="https://www.instagram.com/f1/?hl=es">
<img src="images/instagram.png" alt="" class="s-3" href="https://www.instagram.com/f1/?hl=es"/>
</a>
</div>
</div>
</div>
<p>
&copy; 2023 All Rights Reserved. Formula One World Championship Limited
</p>
</ui:define>
<script type="text/javascript" src="js/jquery-3.4.1.min.js"></script>
<script type="text/javascript" src="js/bootstrap.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.2.1/owl.carousel.min.js">
</script>
<script type="text/javascript">
$(".owl-carousel").owlCarousel({
loop: true,
margin: 10,
nav: true,
navText: [],
autoplay: true,
responsive: {
0: {
items: 1
},
600: {
items: 2
},
1000: {
items: 4
}
}
});
</script>
<script type="text/javascript">
$(".owl-2").owlCarousel({
loop: true,
margin: 10,
nav: true,
navText: [],
autoplay: true,
responsive: {
0: {
items: 1
},
600: {
items: 2
},
1000: {
items: 4
}
}
});
</script>
</ui:composition>
</html>
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="jakarta.faces.html"
xmlns:ui="jakarta.faces.facelets">
<ui:composition
xmlns:h="jakarta.faces.html"
xmlns:ui="jakarta.faces.facelets"
template="WEB-INF/layout/layoutFormularios.xhtml">
<ui:define name="cabecera">
<div class="container-fluid">
<div id="nav" class="navbar navbar-expand-lg custom_nav-container pt-3">
<a class="navbar-brand" href="index.xhtml">
<img src="resources/images/logo.png" alt=""> </img>
<span>
STORE
</span>
</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent"
aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<div class="d-flex flex-column flex-lg-row align-items-center w-100 ">
<ul class="navbar-nav ">
<li class="nav-item">
<a class="nav-link" href="buy.xhtml"> Entradas </a>
</li>
<li class="nav-item">
<a class="nav-link" href="circuitos.xhtml"> Circuitos </a>
</li>
</ul>
<div class="login_btn-contanier ml-0 ml-lg-5">
<a href="">
<img src="images/user.png" alt=""> </img>
<span>
<a class="nav-link" href="iniciarSesion.xhtml">Iniciar Sesión</a>
</span>
</a>
</div>
<div class="login_btn-contanier ml-0 ml-lg-5">
<a href="">
<img src="images/user.png" alt=""> </img>
<span>
<a class="nav-link" href="registro.xhtml">Registro</a>
</span>
</a>
</div>
</div>
</div>
</div>
</div>
</ui:define>
<ui:define name="inicio">
<h1>Iniciar Sesión</h1>
<div class="main-agileinfo">
<div class="agileits-top">
<h:form action="#" method="post">
<input class="text email" type="email" name="email" placeholder="Email" required=""/>
<input class="text" type="password" name="password" placeholder="Password" required=""/>
<input type="submit" value="INICIAR SESION"/>
</h:form>
<p>¿No tienes una cuenta? <h:link outcome="/registro.xhtml"> Regístrese</h:link></p>
</div>
</div>
</ui:define>
</ui:composition>
</html>
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="jakarta.faces.html"
xmlns:ui="jakarta.faces.facelets">
<h:head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1"/>
<title>Pago de entrada</title>
<link href="css/style.css" rel="stylesheet" > </link>
<link href="css/pago.css" rel="stylesheet" ></link>
</h:head>
<h:body>
<div class="container">
<div class="card">
<a href="index.xhtml">
<button class="proceed" type="submit"><svg class="sendicon" width="24" height="24" viewBox="0 0 24 24">
<path d="M4,11V13H16L10.5,18.5L11.92,19.92L19.84,12L11.92,4.08L10.5,5.5L16,11H4Z"></path>
</svg></button>
</a>
<img src="https://seeklogo.com/images/V/VISA-logo-62D5B26FE1-seeklogo.com.png" class="logo-card" alt=""/>
<h:form>
<label>Card number:</label>
<input id="user" class="input cardnumber" placeholder="1234 5678 9101 1121"> </input>
<label>Name:</label>
<input class="input name" placeholder="Example"> </input>
<label class="toleft">CCV:</label>
<input class="input toleft ccv" placeholder="321"> </input>
</h:form>
</div>
<div class="receipt">
<div class="col"><p>Coste:</p>
<h2 class="cost">250€</h2><br/>
</div>
<div class="col">
<p>Items a comprar:</p>
<h3 class="bought-items">ENTRADA F1</h3>
<p class="bought-items description">Entrada normal F1</p>
<p class="bought-items price">175€ (50% descuento)</p><br/>
</div>
<p class="comprobe">La información del pago se mandará a su email justo cuando se pulse el boton rojo.</p>
</div>
</div>
</h:body>
</html>
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:f="http://xmlns.jcp.org/jsf/core"
xmlns:h="jakarta.faces.html"
xmlns:ui="jakarta.faces.facelets">
<ui:composition
xmlns:h="jakarta.faces.html"
xmlns:ui="jakarta.faces.facelets"
template="WEB-INF/layout/layoutFormularios.xhtml">
<ui:define name="cabecera">
<div class="container-fluid">
<div id="nav" class="navbar navbar-expand-lg custom_nav-container pt-3">
<a class="navbar-brand" href="index.xhtml">
<img src="resources/images/logo.png" alt=""> </img>
<span>
STORE
</span>
</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent"
aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<div class="d-flex flex-column flex-lg-row align-items-center w-100 ">
<ul class="navbar-nav ">
<li class="nav-item">
<a class="nav-link" href="buy.xhtml"> Entradas </a>
</li>
<li class="nav-item">
<a class="nav-link" href="circuitos.xhtml"> Circuitos </a>
</li>
</ul>
<div class="login_btn-contanier ml-0 ml-lg-5">
<a href="">
<img src="images/user.png" alt=""> </img>
<span>
<a class="nav-link" href="iniciarSesion.xhtml">Iniciar Sesión</a>
</span>
</a>
</div>
<div class="login_btn-contanier ml-0 ml-lg-5">
<a href="">
<img src="images/user.png" alt=""> </img>
<span>
<a class="nav-link" href="registro.xhtml">Registro</a>
</span>
</a>
</div>
</div>
</div>
</div>
</div>
</ui:define>
<ui:define name="formulario">
<div class="agileits-top">
<h:form method="POST" action="usuario">
<input class="text" type="text" name="Username" placeholder="Username" required=""/>
<input class="text email" type="email" name="email" placeholder="Email" required="true"/>
<input class="text" type="password" name="password1" placeholder="Password" required="true" alt="strongPass"/>
<input class="text w3lpass" type="password" name="password2" placeholder="Confirm Password" required="true"/>
<input class="text" type="radio" name="gender" value="male" required="true"/> Male <input type="radio" name="gender" value="female" required="true"/> Female
<div class="wthree-text">
<label class="anim">
<h:selectBooleanCheckbox type="checkbox" class="checkbox" required="true"></h:selectBooleanCheckbox>
<span>I Agree To The Terms and Conditions</span>
</label>
<div class="clear"> </div>
</div>
<input type="submit" value="REGISTRARSE"/>
</h:form>
<p>¿Tienes ya una cuenta? <a href="pago.xhtml"> Inicia Sesión</a></p>
</div>
</ui:define>
</ui:composition>
</html>
<!DOCTYPE html>
<html
xmlns:cc="jakarta.faces.composite" xmlns:h="jakarta.faces.html"
xmlns:f="jakarta.faces.core">
<!-- Sample Composite component for rendering a entity -->
<!-- INTERFACE -->
<cc:interface>
<cc:attribute name="value" class="com.example.demo.model.Circuito"/>
</cc:interface>
<!-- IMPLEMENTATION -->
<cc:implementation>
<ul class="panel-body list-group">
<li class="list-group-item"><strong>Nombre:</strong> #{cc.attrs.value.nombre}</li>
<li class="list-group-item"><strong>País:</strong> #{cc.attrs.value.pais}</li>
<li class="list-group-item"><strong>Fecha celebración: </strong>
<h:outputText value="#{cc.attrs.value.fechaCelebracion}">
<f:convertDateTime type="localDate" dateStyle="long" />
</h:outputText>
</li>
<li class="list-group-item"><strong>Longitud:</strong> #{cc.attrs.value.longitud}</li>
</ul>
</cc:implementation>
</html>
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment