diff --git a/assets/css/main.css b/assets/css/main.css index 53101402..bf32c5d2 100644 --- a/assets/css/main.css +++ b/assets/css/main.css @@ -763,3 +763,47 @@ footer { .order-confirmation .btn:hover { background-color: #ff4f4f; } + +/* Search and Filter */ +.search-form { + display: flex; + gap: 1rem; + align-items: center; +} + +.search-bar, +.cuisine-filter { + padding: 1rem; + font-size: 1rem; + border-radius: 50px; + border: none; + box-shadow: var(--shadow-soft); +} + +.search-bar { + flex-grow: 1; + padding-left: 3rem; + background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23767676' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-search'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E"); + background-repeat: no-repeat; + background-position: 1rem center; +} + +.cuisine-filter { + background-color: var(--white); +} + +.search-button { + background-color: var(--coral); + color: white; + border: none; + padding: 1rem 2rem; + border-radius: 50px; + cursor: pointer; + font-size: 1rem; + font-weight: 600; + transition: background-color 0.3s; +} + +.search-button:hover { + background-color: #ff4f4f; +} diff --git a/checkout.php b/checkout.php index 1b2ab7a5..25478a26 100644 --- a/checkout.php +++ b/checkout.php @@ -1,6 +1,7 @@ + +
No restaurants found matching your criteria.
'; + } else { foreach ($restaurants as $restaurant) { - echo ''; + echo ''; echo 'Error: Could not fetch restaurants from the database.
'; } ?>