Plantilla web Pink Bouquet Shop
Resumen
La comunidad del server BIyyy anunció el lanzamiento de una "Plantilla web Pink Bouquet Shop". Este anuncio detalla la estructura de la plantilla, incluyendo estilos CSS enfocados en tonos rosas, funcionalidad básica en JavaScript y un marcador de posición para la página de inicio. Este lanzamiento ofrece a los miembros una base de diseño temática lista para usar para una tienda de flores o ramos en línea.
public/css/style.css**
/* Warna tema pink */
:root {
- -primary-color: #FF69B4; /* Pink cerah */
- -secondary-color: #FFB6C1; /* Pink muda */
- -text-color: #333;
- -bg-color: #F8BBD0;
}
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
background-color: var(--bg-color);
color: var(--text-color);
}
/* Header */
header {
background-color: var(--secondary-color);
color: white;
padding: 20px;
text-align: center;
}
nav ul {
list-style-type: none;
padding: 0;
}
nav ul li {
display: inline;
margin: 0 10px;
}
nav a {
color: var(--primary-color);
text-decoration: none;
}
/* Banner */
.banner {
background-image: url('images/banner.jpg'); /* Ganti dengan gambar buket pink */
background-size: cover;
height: 400px;
display: flex;
justify-content: center;
align-items: center;
color: white;
text-align: center;
}
.banner h1 {
font-size: 3em;
color: var(--primary-color);
}
/* Kategori Populer */
.categories {
padding: 20px;
text-align: center;
}
.category {
display: inline-block;
margin: 10px;
padding: 15px;
background-color: white;
border-radius: 5px;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}
/* Produk Unggulan */
.featured-products {
padding: 20px;
text-align: center;
}
.product {
display: inline-block;
margin: 10px;
padding: 15px;
background-color: white;
border-radius: 5px;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}
/* Footer */
footer {
background-color: var(--secondary-color);
color: white;
text-align: center;
padding: 10px;
position: fixed;
bottom: 0;
width: 100%;
}
2. public/js/script.js
// Contoh sederhana: menampilkan alert saat halaman dimuat
window.onload = function() {
alert("Selamat datang di toko buket bunga pink kami!");
};
3. views/pages/homepage.blade.php (Si usa Laravel, o homepage.html si no)
```html
16 views
