Удалить sk1/src/public/vehicles.html
This commit is contained in:
parent
e757af9c65
commit
24a873566d
@ -1,327 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Vehicles - Brabus Premium Automotive</title>
|
||||
<link rel="stylesheet" href="styles.css">
|
||||
<link rel="stylesheet" href="vehicles.css">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<div class="header-container">
|
||||
<div class="logo">
|
||||
<a href="index.html">
|
||||
<img src="images/logo.png" alt="Brabus Logo">
|
||||
</a>
|
||||
</div>
|
||||
<nav>
|
||||
<ul>
|
||||
<li><a href="index.html" class="nav-link">Home</a></li>
|
||||
<li><a href="vehicles.html" class="nav-link active">Vehicles</a></li>
|
||||
<li><a href="index.html#heritage" class="nav-link">Heritage</a></li>
|
||||
<li><a href="index.html#experience" class="nav-link">Experience</a></li>
|
||||
<li><a href="#" class="nav-link" id="cart-link"><i class="fas fa-shopping-cart"></i> <span id="cart-count">0</span></a></li>
|
||||
<li><a href="login.html" class="nav-link" id="login-link">Sign In</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<main class="vehicles-container">
|
||||
<div class="vehicles-hero">
|
||||
<h1>Discover Perfection</h1>
|
||||
<p>Explore our exclusive collection of premium automobiles</p>
|
||||
</div>
|
||||
|
||||
<div class="vehicles-filters">
|
||||
<div class="container">
|
||||
<div class="filter-wrapper">
|
||||
<div class="filter-group">
|
||||
<label for="category-filter">Category</label>
|
||||
<select id="category-filter">
|
||||
<option value="all">All Categories</option>
|
||||
<option value="sport">Sport</option>
|
||||
<option value="luxury">Luxury</option>
|
||||
<option value="offroad">Off-road</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="filter-group">
|
||||
<label for="price-filter">Price Range</label>
|
||||
<select id="price-filter">
|
||||
<option value="all">All Prices</option>
|
||||
<option value="100000-200000">$100,000 - $200,000</option>
|
||||
<option value="200000-300000">$200,000 - $300,000</option>
|
||||
<option value="300000-plus">$300,000+</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="filter-group">
|
||||
<label for="sort-filter">Sort By</label>
|
||||
<select id="sort-filter">
|
||||
<option value="newest">Newest First</option>
|
||||
<option value="price-low">Price: Low to High</option>
|
||||
<option value="price-high">Price: High to Low</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="vehicles-grid">
|
||||
<div class="container">
|
||||
<div class="vehicles-list">
|
||||
<!-- Vehicle Card 1 -->
|
||||
<div class="vehicle-card" data-category="sport" data-price="280000">
|
||||
<div class="vehicle-image">
|
||||
<img src="images/StoreCar1.png" alt="Brabus S Class">
|
||||
<div class="vehicle-badge">New</div>
|
||||
</div>
|
||||
<div class="vehicle-info">
|
||||
<h3>Brabus S Class</h3>
|
||||
<div class="vehicle-specs">
|
||||
<div class="spec">
|
||||
<i class="fas fa-tachometer-alt"></i>
|
||||
<span>800 HP</span>
|
||||
</div>
|
||||
<div class="spec">
|
||||
<i class="fas fa-bolt"></i>
|
||||
<span>3.4s 0-100</span>
|
||||
</div>
|
||||
<div class="spec">
|
||||
<i class="fas fa-gas-pump"></i>
|
||||
<span>Twin-Turbo V8</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="vehicle-price">
|
||||
<span class="price">$280,000</span>
|
||||
<button class="btn-buy add-to-cart" data-id="1" data-name="Brabus S Class" data-price="280000">Add to Cart</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Vehicle Card 2 -->
|
||||
<div class="vehicle-card" data-category="offroad" data-price="320000">
|
||||
<div class="vehicle-image">
|
||||
<img src="images/StoreCar2.png" alt="Brabus G Wagon">
|
||||
</div>
|
||||
<div class="vehicle-info">
|
||||
<h3>Brabus G Wagon</h3>
|
||||
<div class="vehicle-specs">
|
||||
<div class="spec">
|
||||
<i class="fas fa-tachometer-alt"></i>
|
||||
<span>850 HP</span>
|
||||
</div>
|
||||
<div class="spec">
|
||||
<i class="fas fa-bolt"></i>
|
||||
<span>3.8s 0-100</span>
|
||||
</div>
|
||||
<div class="spec">
|
||||
<i class="fas fa-gas-pump"></i>
|
||||
<span>V12 BiTurbo</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="vehicle-price">
|
||||
<span class="price">$320,000</span>
|
||||
<button class="btn-buy add-to-cart" data-id="2" data-name="Brabus G Wagon" data-price="320000">Add to Cart</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Vehicle Card 3 -->
|
||||
<div class="vehicle-card" data-category="luxury" data-price="240000">
|
||||
<div class="vehicle-image">
|
||||
<img src="images/StoreCar3.png" alt="Brabus Maybach">
|
||||
<div class="vehicle-badge">Limited</div>
|
||||
</div>
|
||||
<div class="vehicle-info">
|
||||
<h3>Brabus Maybach</h3>
|
||||
<div class="vehicle-specs">
|
||||
<div class="spec">
|
||||
<i class="fas fa-tachometer-alt"></i>
|
||||
<span>700 HP</span>
|
||||
</div>
|
||||
<div class="spec">
|
||||
<i class="fas fa-bolt"></i>
|
||||
<span>4.2s 0-100</span>
|
||||
</div>
|
||||
<div class="spec">
|
||||
<i class="fas fa-gas-pump"></i>
|
||||
<span>V12</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="vehicle-price">
|
||||
<span class="price">$240,000</span>
|
||||
<button class="btn-buy add-to-cart" data-id="3" data-name="Brabus Maybach" data-price="240000">Add to Cart</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Vehicle Card 4 -->
|
||||
<div class="vehicle-card" data-category="sport" data-price="180000">
|
||||
<div class="vehicle-image">
|
||||
<img src="images/StoreCar4.png" alt="Brabus C63 AMG">
|
||||
</div>
|
||||
<div class="vehicle-info">
|
||||
<h3>Brabus C63 AMG</h3>
|
||||
<div class="vehicle-specs">
|
||||
<div class="spec">
|
||||
<i class="fas fa-tachometer-alt"></i>
|
||||
<span>650 HP</span>
|
||||
</div>
|
||||
<div class="spec">
|
||||
<i class="fas fa-bolt"></i>
|
||||
<span>3.2s 0-100</span>
|
||||
</div>
|
||||
<div class="spec">
|
||||
<i class="fas fa-gas-pump"></i>
|
||||
<span>V8 BiTurbo</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="vehicle-price">
|
||||
<span class="price">$180,000</span>
|
||||
<button class="btn-buy add-to-cart" data-id="4" data-name="Brabus C63 AMG" data-price="180000">Add to Cart</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Vehicle Card 5 -->
|
||||
<div class="vehicle-card" data-category="luxury" data-price="350000">
|
||||
<div class="vehicle-image">
|
||||
<img src="images/StoreCar5.png" alt="Brabus SL Roadster">
|
||||
<div class="vehicle-badge">New</div>
|
||||
</div>
|
||||
<div class="vehicle-info">
|
||||
<h3>Brabus SL Roadster</h3>
|
||||
<div class="vehicle-specs">
|
||||
<div class="spec">
|
||||
<i class="fas fa-tachometer-alt"></i>
|
||||
<span>750 HP</span>
|
||||
</div>
|
||||
<div class="spec">
|
||||
<i class="fas fa-bolt"></i>
|
||||
<span>3.0s 0-100</span>
|
||||
</div>
|
||||
<div class="spec">
|
||||
<i class="fas fa-gas-pump"></i>
|
||||
<span>V8 BiTurbo</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="vehicle-price">
|
||||
<span class="price">$350,000</span>
|
||||
<button class="btn-buy add-to-cart" data-id="5" data-name="Brabus SL Roadster" data-price="350000">Add to Cart</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Vehicle Card 6 -->
|
||||
<div class="vehicle-card" data-category="offroad" data-price="290000">
|
||||
<div class="vehicle-image">
|
||||
<img src="images/StoreCar6.png" alt="Brabus GLS">
|
||||
</div>
|
||||
<div class="vehicle-info">
|
||||
<h3>Brabus GLS</h3>
|
||||
<div class="vehicle-specs">
|
||||
<div class="spec">
|
||||
<i class="fas fa-tachometer-alt"></i>
|
||||
<span>780 HP</span>
|
||||
</div>
|
||||
<div class="spec">
|
||||
<i class="fas fa-bolt"></i>
|
||||
<span>4.1s 0-100</span>
|
||||
</div>
|
||||
<div class="spec">
|
||||
<i class="fas fa-gas-pump"></i>
|
||||
<span>V8 BiTurbo</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="vehicle-price">
|
||||
<span class="price">$290,000</span>
|
||||
<button class="btn-buy add-to-cart" data-id="6" data-name="Brabus GLS" data-price="290000">Add to Cart</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<!-- Cart Overlay -->
|
||||
<div class="cart-overlay" id="cart-overlay">
|
||||
<div class="cart-content">
|
||||
<div class="cart-header">
|
||||
<h2>Your Cart</h2>
|
||||
<button class="close-cart"><i class="fas fa-times"></i></button>
|
||||
</div>
|
||||
<div class="cart-items" id="cart-items">
|
||||
<!-- Cart items will be added here dynamically -->
|
||||
</div>
|
||||
<div class="cart-footer">
|
||||
<div class="cart-total">
|
||||
<span>Total:</span>
|
||||
<span id="cart-total-price">$0</span>
|
||||
</div>
|
||||
<button class="btn-checkout" id="checkout-btn">Proceed to Checkout</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<footer>
|
||||
<div class="container">
|
||||
<div class="footer-content">
|
||||
<div class="footer-column">
|
||||
<h4>Models</h4>
|
||||
<ul>
|
||||
<li><a href="vehicles.html?category=sport">Sport Series</a></li>
|
||||
<li><a href="vehicles.html?category=offroad">Off-road Series</a></li>
|
||||
<li><a href="vehicles.html?category=luxury">Luxury Series</a></li>
|
||||
<li><a href="vehicles.html">Limited Editions</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="footer-column">
|
||||
<h4>Services</h4>
|
||||
<ul>
|
||||
<li><a href="#">Financing</a></li>
|
||||
<li><a href="#">Maintenance</a></li>
|
||||
<li><a href="#">Customization</a></li>
|
||||
<li><a href="#">Warranty</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="footer-column">
|
||||
<h4>Company</h4>
|
||||
<ul>
|
||||
<li><a href="#">About Us</a></li>
|
||||
<li><a href="#">Careers</a></li>
|
||||
<li><a href="#">News</a></li>
|
||||
<li><a href="#">Contact</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="footer-column">
|
||||
<h4>Legal</h4>
|
||||
<ul>
|
||||
<li><a href="#">Privacy Policy</a></li>
|
||||
<li><a href="#">Terms of Service</a></li>
|
||||
<li><a href="#">Cookie Policy</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="footer-bottom">
|
||||
<p>© 2025 Brabus Automotive. All rights reserved.</p>
|
||||
<div class="social-icons">
|
||||
<a href="#" class="social-icon" aria-label="Facebook"><i class="fab fa-facebook-f"></i></a>
|
||||
<a href="#" class="social-icon" aria-label="Instagram"><i class="fab fa-instagram"></i></a>
|
||||
<a href="#" class="social-icon" aria-label="Twitter"><i class="fab fa-twitter"></i></a>
|
||||
<a href="#" class="social-icon" aria-label="YouTube"><i class="fab fa-youtube"></i></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<script src="vehicles.js"></script>
|
||||
<script src="cart.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
Loading…
Reference in New Issue
Block a user