/* PROJECT: Van Boxel "Rabbit Style" Archive
DOEL: Full width layout + Strakke Sidebar Links
*/
/* 1. MAAK DE PAGINA BREED (96% van scherm) */
.archive.woocommerce-page .container {
max-width: 96% !important;
padding: 0 20px !important;
width: 96% !important;
}
/* 2. DE VERDELING (20% Sidebar - 80% Producten) */
.archive.woocommerce-page .content {
width: 78% !important;
float: right !important; /* Producten rechts */
border: none !important;
padding-top: 20px !important;
}
.archive.woocommerce-page .sidebar {
width: 20% !important;
float: left !important; /* Sidebar links */
border: none !important;
padding-top: 30px !important;
background: transparent !important;
}
/* 3. SIDEBAR STYLING (Net als Rabbit) */
.archive.woocommerce-page .sidebar .widget {
margin-bottom: 40px !important;
padding: 0 !important;
}
/* Titels van filters (bijv. "Merk", "Prijs") */
.archive.woocommerce-page .sidebar .widgettitle {
font-family: 'Segoe UI', sans-serif !important;
font-weight: 800 !important;
text-transform: uppercase !important;
font-size: 14px !important;
color: #1a1a1a !important;
margin-bottom: 15px !important;
border: none !important;
}
/* Linkjes in de sidebar */
.archive.woocommerce-page .sidebar a {
color: #555 !important;
font-size: 14px !important;
text-decoration: none !important;
line-height: 2 !important;
}
.archive.woocommerce-page .sidebar a:hover {
color: #008a88 !important; /* Van Boxel Groen */
padding-left: 5px;
transition: 0.2s;
}
/* Verberg die lelijke puntjes voor de lijsten */
.archive.woocommerce-page .sidebar ul {
list-style: none !important;
margin: 0 !important;
padding: 0 !important;
}
.archive.woocommerce-page .sidebar li {
padding: 2px 0 !important;
border: none !important;
}
/* 4. PRODUCT GRID OPFRISSEN */
.archive.woocommerce-page ul.products li.product {
width: 23% !important; /* 4 op een rij */
margin-right: 2% !important;
margin-bottom: 40px !important;
border: 1px solid #eee !important;
border-radius: 4px !important;
background: #fff !important;
padding-bottom: 10px !important;
transition: 0.3s;
}
/* Laatste in de rij fix */
.archive.woocommerce-page ul.products li.product:nth-child(4n) {
margin-right: 0 !important;
}
/* Hover effect op productkaart */
.archive.woocommerce-page ul.products li.product:hover {
box-shadow: 0 10px 30px rgba(0,0,0,0.08);
transform: translateY(-5px);
border-color: #008a88 !important;
}
/* RESPONSIVE: Op mobiel alles onder elkaar */
@media only screen and (max-width: 900px) {
.archive.woocommerce-page .sidebar { display: none !important; } /* Verberg sidebar op mobiel voor rust */
.archive.woocommerce-page .content { width: 100% !important; border: none !important; }
.archive.woocommerce-page ul.products li.product { width: 48% !important; margin-right: 4% !important; }
.archive.woocommerce-page ul.products li.product:nth-child(2n) { margin-right: 0 !important; }
}
Archief van de maand: maart, 2020
https://vanboxel.eu/wp-content/uploads/2020/03/Schermafbeelding-2020-03-24-om-16.57.28.png
958
1920
ceesenco
ceesenco 2020-03-24 15:11:25 2020-03-24 16:58:51 Wahoo!
https://vanboxel.eu/wp-content/uploads/2020/03/Schermafbeelding-2020-03-24-om-16.59.09.png
994
1724
ceesenco
ceesenco 2020-03-24 15:11:05 2020-03-24 17:01:24 Haal en breng service
https://vanboxel.eu/wp-content/uploads/2020/03/Schermafbeelding-2020-03-24-om-17.01.40.png
984
1492
ceesenco
ceesenco 2020-03-24 15:10:51 2020-03-24 17:04:01 Plan uw reparatie online!
https://vanboxel.eu/wp-content/uploads/2020/03/Schermafbeelding-2020-03-24-om-16.52.25.png
930
1722
ceesenco
ceesenco 2020-03-24 15:10:12 2020-03-24 16:56:35 Fietsen maakt gelukkig en dit is waarom
https://vanboxel.eu/wp-content/uploads/2020/03/Schermafbeelding-2020-03-24-om-16.49.52.png
982
1450
ceesenco
ceesenco 2020-03-24 15:09:55 2020-03-24 16:52:03 Hoe bepaal je de maat van een kinderfiets?
https://vanboxel.eu/wp-content/uploads/2020/03/Schermafbeelding-2020-03-24-om-15.08.27.png
866
1736
ceesenco
ceesenco 2020-03-24 15:07:25 2023-05-23 08:39:14 Veilig de weg op!
