From 685a898d0a55736d47e242a66412b963f8c8e4ef Mon Sep 17 00:00:00 2001 From: Yan Kasabutski Date: Tue, 13 May 2025 04:08:00 +0000 Subject: [PATCH] =?UTF-8?q?=D0=A3=D0=B4=D0=B0=D0=BB=D0=B8=D1=82=D1=8C=20sk?= =?UTF-8?q?1/src/public/vehicles.css?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- sk1/src/public/vehicles.css | 475 ------------------------------------ 1 file changed, 475 deletions(-) delete mode 100644 sk1/src/public/vehicles.css diff --git a/sk1/src/public/vehicles.css b/sk1/src/public/vehicles.css deleted file mode 100644 index b9e84e6..0000000 --- a/sk1/src/public/vehicles.css +++ /dev/null @@ -1,475 +0,0 @@ -/* Vehicles Page Styles */ - -/* Hero section */ -.vehicles-container { - padding-top: 70px; -} - -.vehicles-hero { - background: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url('images/vehicles-hero.jpg'); - background-size: cover; - background-position: center; - height: 50vh; - display: flex; - flex-direction: column; - justify-content: center; - align-items: center; - color: var(--text-light); - text-align: center; - padding: 0 20px; -} - -.vehicles-hero h1 { - font-size: 56px; - font-weight: 600; - margin-bottom: 20px; - letter-spacing: -0.02em; -} - -.vehicles-hero p { - font-size: 21px; - max-width: 600px; -} - -/* Filters section */ -.vehicles-filters { - background-color: white; - padding: 30px 0; - box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05); - position: sticky; - top: 70px; - z-index: 100; -} - -.filter-wrapper { - display: flex; - gap: 30px; - flex-wrap: wrap; -} - -.filter-group { - flex: 1; - min-width: 200px; -} - -.filter-group label { - display: block; - font-size: 14px; - font-weight: 500; - margin-bottom: 8px; - color: var(--text-dark); -} - -.filter-group select { - width: 100%; - padding: 12px 16px; - font-size: 16px; - border: 1px solid #e0e0e0; - border-radius: 8px; - background-color: #ffffff; - appearance: none; - background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%231d1d1f' viewBox='0 0 16 16'%3E%3Cpath d='M8 11.5l-5-5 1.5-1.5L8 8.5l3.5-3.5L13 6.5l-5 5z'/%3E%3C/svg%3E"); - background-repeat: no-repeat; - background-position: right 16px center; - cursor: pointer; -} - -.filter-group select:focus { - border-color: var(--primary-color); - outline: none; - box-shadow: 0 0 0 3px rgba(0, 113, 227, 0.2); -} - -/* Vehicles grid */ -.vehicles-grid { - padding: 80px 0; - background-color: var(--light-bg); -} - -.vehicles-list { - display: grid; - grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); - gap: 30px; -} - -/* Vehicle cards */ -.vehicle-card { - background-color: white; - border-radius: 20px; - overflow: hidden; - box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05); - transition: var(--transition); - position: relative; -} - -.vehicle-card:hover { - transform: translateY(-10px); - box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1); -} - -.vehicle-image { - height: 220px; - position: relative; - overflow: hidden; -} - -.vehicle-image img { - width: 100%; - height: 100%; - object-fit: cover; - transition: var(--transition); -} - -.vehicle-card:hover .vehicle-image img { - transform: scale(1.05); -} - -.vehicle-badge { - position: absolute; - top: 20px; - right: 20px; - background-color: var(--primary-color); - color: white; - padding: 6px 12px; - font-size: 12px; - font-weight: 500; - border-radius: 30px; - text-transform: uppercase; - letter-spacing: 0.05em; -} - -.vehicle-info { - padding: 25px; -} - -.vehicle-info h3 { - font-size: 22px; - font-weight: 600; - margin-bottom: 15px; - letter-spacing: -0.01em; -} - -.vehicle-specs { - display: flex; - justify-content: space-between; - margin-bottom: 20px; - flex-wrap: wrap; -} - -.spec { - display: flex; - flex-direction: column; - align-items: center; - gap: 5px; - padding: 5px; -} - -.spec i { - color: var(--primary-color); - font-size: 18px; -} - -.spec span { - font-size: 14px; - color: var(--secondary-text); -} - -.vehicle-price { - display: flex; - justify-content: space-between; - align-items: center; - margin-top: 20px; - border-top: 1px solid #f0f0f0; - padding-top: 20px; -} - -.price { - font-size: 24px; - font-weight: 600; - color: var(--text-dark); -} - -.add-to-cart { - font-size: 15px; - padding: 10px 20px; -} - -/* Cart overlay */ -.cart-overlay { - position: fixed; - top: 0; - right: -400px; - width: 400px; - height: 100vh; - background-color: white; - box-shadow: -5px 0 30px rgba(0, 0, 0, 0.1); - z-index: 1001; - transition: right 0.4s cubic-bezier(0.4, 0, 0.2, 1); - display: flex; - flex-direction: column; -} - -.cart-overlay.open { - right: 0; -} - -.cart-header { - display: flex; - justify-content: space-between; - align-items: center; - padding: 30px; - border-bottom: 1px solid #f0f0f0; -} - -.cart-header h2 { - font-size: 24px; - font-weight: 600; -} - -.close-cart { - background: none; - border: none; - font-size: 20px; - cursor: pointer; - color: var(--secondary-text); - transition: var(--transition); -} - -.close-cart:hover { - color: var(--text-dark); -} - -.cart-items { - flex: 1; - overflow-y: auto; - padding: 20px 30px; -} - -.cart-item { - display: flex; - gap: 15px; - margin-bottom: 20px; - padding-bottom: 20px; - border-bottom: 1px solid #f0f0f0; -} - -.cart-item-image { - width: 80px; - height: 80px; - flex-shrink: 0; - border-radius: 10px; - overflow: hidden; -} - -.cart-item-image img { - width: 100%; - height: 100%; - object-fit: cover; -} - -.cart-item-details { - flex: 1; -} - -.cart-item-name { - font-weight: 500; - margin-bottom: 5px; -} - -.cart-item-price { - color: var(--secondary-text); - font-size: 14px; -} - -.cart-item-controls { - display: flex; - align-items: center; - gap: 10px; - margin-top: 10px; -} - -.quantity-control { - display: flex; - align-items: center; - gap: 5px; -} - -.quantity-btn { - width: 24px; - height: 24px; - display: flex; - align-items: center; - justify-content: center; - background-color: #f5f5f7; - border: none; - border-radius: 4px; - cursor: pointer; - font-size: 14px; - transition: var(--transition); -} - -.quantity-btn:hover { - background-color: #e0e0e0; -} - -.quantity-value { - width: 30px; - text-align: center; - font-size: 14px; -} - -.remove-btn { - background: none; - border: none; - color: #ff3b30; - cursor: pointer; - font-size: 14px; - transition: var(--transition); -} - -.remove-btn:hover { - color: #d70015; -} - -.cart-footer { - padding: 20px 30px; - background-color: #f5f5f7; - border-top: 1px solid #e0e0e0; -} - -.cart-total { - display: flex; - justify-content: space-between; - font-size: 18px; - font-weight: 600; - margin-bottom: 20px; -} - -.btn-checkout { - width: 100%; - padding: 14px; - background-color: var(--primary-color); - color: white; - border: none; - border-radius: 8px; - font-size: 16px; - font-weight: 500; - cursor: pointer; - transition: var(--transition); -} - -.btn-checkout:hover { - background-color: var(--primary-hover); - transform: translateY(-2px); - box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1); -} - -.empty-cart { - text-align: center; - padding: 40px 0; - color: var(--secondary-text); -} - -.empty-cart i { - font-size: 50px; - margin-bottom: 20px; - opacity: 0.3; -} - -.continue-shopping { - margin-top: 20px; - display: inline-block; - color: var(--primary-color); - text-decoration: none; -} - -.continue-shopping:hover { - text-decoration: underline; -} - -/* Responsive adjustments */ -@media (max-width: 992px) { - .vehicles-hero h1 { - font-size: 42px; - } - - .vehicles-hero p { - font-size: 18px; - } -} - -@media (max-width: 768px) { - .vehicles-hero h1 { - font-size: 36px; - } - - .cart-overlay { - width: 100%; - right: -100%; - } -} - -@media (max-width: 576px) { - .vehicles-hero h1 { - font-size: 32px; - } - - .filter-wrapper { - flex-direction: column; - gap: 20px; - } - - .vehicle-price { - flex-direction: column; - gap: 15px; - align-items: flex-start; - } - - .add-to-cart { - width: 100%; - } -} - -/* Animation for cart items */ -@keyframes slideIn { - from { - opacity: 0; - transform: translateX(20px); - } - to { - opacity: 1; - transform: translateX(0); - } -} - -.cart-item { - animation: slideIn 0.3s ease forwards; -} - -/* Fade overlay when cart is open */ -.overlay-bg { - position: fixed; - top: 0; - left: 0; - width: 100%; - height: 100%; - background-color: rgba(0, 0, 0, 0.5); - z-index: 1000; - opacity: 0; - visibility: hidden; - transition: opacity 0.3s ease, visibility 0.3s ease; -} - -.overlay-bg.active { - opacity: 1; - visibility: visible; -} - -/* Active nav link */ -.nav-link.active { - color: var(--primary-color); -} - -.nav-link.active::after { - width: 100%; -} \ No newline at end of file