Commit cd114d46 authored by André  Porto's avatar André Porto 🤘

Merge branch '3-fotos' into 'develop'

Resolve "adicionar fotos das motos"

See merge request !5
parents cf35f905 e4e5b618
assets/moto1.png

748 KB

assets/moto2.png

369 KB

* {
padding: 0px;
margin: 0px;
}
.body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
}
.header {
background-color: #333;
color: #fff;
padding: 20px;
text-align: center;
}
.nav {
background-color: #444;
color: #fff;
padding: 10px;
text-align: center;
}
.nav > ul {
list-style-type: none;
margin: 0;
padding: 0;
}
.nav > ul > li {
display: inline;
margin-right: 20px;
}
.nav > a {
color: #fff;
text-decoration: none;
}
.nav-search {
display: inline-block;
}
.nav .search input[type="text"] {
padding: 5px;
border-radius: 3px;
border: 1px solid #ccc;
margin-right: 5px;
}
.nav .search button {
padding: 5px 10px;
border-radius: 3px;
background-color: #007bff;
border: none;
color: #fff;
cursor: pointer;
}
.section {
padding: 20px;
}
.moto {
margin-bottom: 20px;
}
.moto img {
max-width: 100%;
}
.footer {
background-color: #333;
color: #fff;
text-align: center;
padding: 10px;
position: fixed;
bottom: 0;
width: 100%;
}
......@@ -2,9 +2,8 @@
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Concessionária de Motos</title>
<link rel="stylesheet" href="styles.css">
<link rel="stylesheet" href="assets/styles.css">
</head>
<body>
<header>
......@@ -16,6 +15,10 @@
<li><a href="#motos-novas">Motos Novas</a></li>
<li><a href="#motos-usadas">Motos Usadas</a></li>
<li><a href="#contato">Contato</a></li>
<li class="search">
<input type="text" class="nav-search" placeholder="Pesquisar...">
<button type="submit">Buscar</button>
</li>
</ul>
</nav>
<section id="inicio">
......@@ -25,12 +28,12 @@
<section id="motos-novas">
<h2>Motos Novas</h2>
<div class="moto">
<img src="moto1.jpg" alt="Moto Nova 1">
<img src="assets/moto1.png" alt="Moto Nova 1">
<h3>Modelo 1 - 2024</h3>
<p>Descrição do modelo 1.</p>
</div>
<div class="moto">
<img src="moto2.jpg" alt="Moto Nova 2">
<img src="assets/moto1.png" alt="Moto Nova 1">
<h3>Modelo 2 - 2024</h3>
<p>Descrição do modelo 2.</p>
</div>
......@@ -39,12 +42,12 @@
<section id="motos-usadas">
<h2>Motos Usadas</h2>
<div class="moto">
<img src="moto3.jpg" alt="Moto Usada 1">
<img src="assets/moto2.png" alt="Moto usada 2">
<h3>Modelo 1 - 2022</h3>
<p>Descrição do modelo 1 usado.</p>
</div>
<div class="moto">
<img src="moto4.jpg" alt="Moto Usada 2">
<img src="assets/moto2.png" alt="Moto usada 2">
<h3>Modelo 2 - 2021</h3>
<p>Descrição do modelo 2 usado.</p>
</div>
......
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
}
header {
background-color: #333;
color: #fff;
padding: 20px;
text-align: center;
}
nav {
background-color: #444;
color: #fff;
padding: 10px;
text-align: center;
}
nav ul {
list-style-type: none;
margin: 0;
padding: 0;
}
nav ul li {
display: inline;
margin-right: 20px;
}
nav a {
color: #fff;
text-decoration: none;
}
nav .search {
display: inline-block;
}
nav .search input[type="text"] {
padding: 5px;
border-radius: 3px;
border: 1px solid #ccc;
margin-right: 5px;
}
nav .search button {
padding: 5px 10px;
border-radius: 3px;
background-color: #007bff; /* Cor azul para o botão */
border: none;
color: #fff;
cursor: pointer;
}
section {
padding: 20px;
}
.moto {
margin-bottom: 20px;
}
.moto img {
max-width: 100%;
}
footer {
background-color: #333;
color: #fff;
text-align: center;
padding: 10px;
position: fixed;
bottom: 0;
width: 100%;
}
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 to comment