fix nav and color theme
This commit is contained in:
@@ -224,7 +224,7 @@ body {
|
||||
.title-decoration {
|
||||
width: 100px;
|
||||
height: 4px;
|
||||
background: orange;
|
||||
background: #e68672;
|
||||
margin: 2rem auto 0;
|
||||
border-radius: 2px;
|
||||
}
|
||||
@@ -281,12 +281,12 @@ body {
|
||||
}
|
||||
|
||||
.adopt-search-input:focus {
|
||||
border-color: orange;
|
||||
border-color: #e68672;
|
||||
}
|
||||
|
||||
.adopt-search-btn {
|
||||
padding: 0.6rem 1.4rem;
|
||||
background: orange;
|
||||
background: #e68672;
|
||||
color: white;
|
||||
border: none;
|
||||
border-radius: 6px;
|
||||
@@ -297,7 +297,7 @@ body {
|
||||
}
|
||||
|
||||
.adopt-search-btn:hover {
|
||||
background: #e69500;
|
||||
background: #d4705e;
|
||||
}
|
||||
|
||||
.adopt-clear-btn {
|
||||
@@ -440,7 +440,7 @@ body {
|
||||
|
||||
.pagination-btn {
|
||||
padding: 0.5rem 1.2rem;
|
||||
background: orange;
|
||||
background: #e68672;
|
||||
color: white;
|
||||
border: none;
|
||||
border-radius: 6px;
|
||||
@@ -451,7 +451,7 @@ body {
|
||||
}
|
||||
|
||||
.pagination-btn:hover:not(:disabled) {
|
||||
background: #e69500;
|
||||
background: #d4705e;
|
||||
}
|
||||
|
||||
.pagination-btn:disabled {
|
||||
@@ -480,7 +480,7 @@ body {
|
||||
.pet-detail-back {
|
||||
display: inline-block;
|
||||
margin-bottom: 2rem;
|
||||
color: orange;
|
||||
color: #e68672;
|
||||
text-decoration: none;
|
||||
font-size: 1rem;
|
||||
font-weight: 600;
|
||||
@@ -488,7 +488,7 @@ body {
|
||||
}
|
||||
|
||||
.pet-detail-back:hover {
|
||||
color: #e69500;
|
||||
color: #d4705e;
|
||||
}
|
||||
|
||||
.pet-detail-card {
|
||||
@@ -663,7 +663,7 @@ body {
|
||||
.pet-detail-cta-btn {
|
||||
display: inline-block;
|
||||
padding: 0.65rem 1.5rem;
|
||||
background: orange;
|
||||
background: #e68672;
|
||||
color: white;
|
||||
text-decoration: none;
|
||||
border-radius: 8px;
|
||||
@@ -673,7 +673,7 @@ body {
|
||||
}
|
||||
|
||||
.pet-detail-cta-btn:hover {
|
||||
background: #e69500;
|
||||
background: #d4705e;
|
||||
}
|
||||
|
||||
/* Products Page */
|
||||
@@ -965,7 +965,7 @@ body {
|
||||
}
|
||||
|
||||
.adopt-filter-select:focus {
|
||||
border-color: orange;
|
||||
border-color: #e68672;
|
||||
}
|
||||
|
||||
.adopt-filter-select:disabled {
|
||||
@@ -1116,14 +1116,14 @@ body {
|
||||
}
|
||||
|
||||
.auth-input:focus {
|
||||
border-color: orange;
|
||||
box-shadow: 0 0 0 3px rgba(255, 165, 0, 0.2);
|
||||
border-color: #e68672;
|
||||
box-shadow: 0 0 0 3px rgba(230, 134, 114, 0.2);
|
||||
}
|
||||
|
||||
.auth-submit-btn {
|
||||
margin-top: 0.5rem;
|
||||
padding: 0.75rem;
|
||||
background: orange;
|
||||
background: #e68672;
|
||||
color: white;
|
||||
border: none;
|
||||
border-radius: 8px;
|
||||
@@ -1134,7 +1134,7 @@ body {
|
||||
}
|
||||
|
||||
.auth-submit-btn:hover:not(:disabled) {
|
||||
background: #e69500;
|
||||
background: #d4705e;
|
||||
}
|
||||
|
||||
.auth-submit-btn:active:not(:disabled) {
|
||||
@@ -1164,7 +1164,7 @@ body {
|
||||
}
|
||||
|
||||
.auth-switch-link {
|
||||
color: orange;
|
||||
color: #e68672;
|
||||
font-weight: 600;
|
||||
text-decoration: none;
|
||||
}
|
||||
@@ -1192,7 +1192,7 @@ body {
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
border-radius: 50%;
|
||||
background: orange;
|
||||
background: #e68672;
|
||||
color: white;
|
||||
font-size: 2rem;
|
||||
font-weight: 700;
|
||||
@@ -1373,8 +1373,8 @@ body {
|
||||
|
||||
.appt-select:focus,
|
||||
.appt-input:focus {
|
||||
border-color: orange;
|
||||
box-shadow: 0 0 0 3px rgba(255, 165, 0, 0.2);
|
||||
border-color: #e68672;
|
||||
box-shadow: 0 0 0 3px rgba(230, 134, 114, 0.2);
|
||||
}
|
||||
|
||||
.appt-locked-field {
|
||||
@@ -1419,18 +1419,18 @@ body {
|
||||
}
|
||||
|
||||
.appt-slot-btn:hover {
|
||||
border-color: orange;
|
||||
border-color: #e68672;
|
||||
background: #fff8f0;
|
||||
}
|
||||
|
||||
.appt-slot-btn--selected {
|
||||
background: orange;
|
||||
background: #e68672;
|
||||
color: white;
|
||||
border-color: orange;
|
||||
border-color: #e68672;
|
||||
}
|
||||
|
||||
.appt-slot-btn--selected:hover {
|
||||
background: #e69500;
|
||||
background: #d4705e;
|
||||
}
|
||||
|
||||
.appt-slots-loading,
|
||||
@@ -1473,13 +1473,13 @@ body {
|
||||
}
|
||||
|
||||
.appt-pet-chip:hover {
|
||||
border-color: orange;
|
||||
border-color: #e68672;
|
||||
background: #fff8f0;
|
||||
}
|
||||
|
||||
.appt-pet-chip--selected {
|
||||
background: #fff3e0;
|
||||
border-color: orange;
|
||||
border-color: #e68672;
|
||||
color: #c47600;
|
||||
}
|
||||
|
||||
@@ -1493,7 +1493,7 @@ body {
|
||||
}
|
||||
|
||||
.appt-pet-checkbox {
|
||||
accent-color: orange;
|
||||
accent-color: #e68672;
|
||||
}
|
||||
|
||||
.appt-add-pet-btn {
|
||||
@@ -1501,9 +1501,9 @@ body {
|
||||
margin-top: 0.5rem;
|
||||
padding: 0.4rem 0.85rem;
|
||||
background: none;
|
||||
border: 1.5px solid orange;
|
||||
border: 1.5px solid #e68672;
|
||||
border-radius: 6px;
|
||||
color: orange;
|
||||
color: #e68672;
|
||||
font-size: 0.875rem;
|
||||
font-weight: 600;
|
||||
cursor: pointer;
|
||||
@@ -1511,7 +1511,7 @@ body {
|
||||
}
|
||||
|
||||
.appt-add-pet-btn:hover {
|
||||
background: orange;
|
||||
background: #e68672;
|
||||
color: white;
|
||||
}
|
||||
|
||||
@@ -1535,7 +1535,7 @@ body {
|
||||
}
|
||||
|
||||
.appt-link {
|
||||
color: orange;
|
||||
color: #e68672;
|
||||
font-weight: 600;
|
||||
text-decoration: none;
|
||||
}
|
||||
@@ -1547,7 +1547,7 @@ body {
|
||||
.appt-submit-btn {
|
||||
margin-top: 0.5rem;
|
||||
padding: 0.75rem;
|
||||
background: orange;
|
||||
background: #e68672;
|
||||
color: white;
|
||||
border: none;
|
||||
border-radius: 8px;
|
||||
@@ -1558,7 +1558,7 @@ body {
|
||||
}
|
||||
|
||||
.appt-submit-btn:hover:not(:disabled) {
|
||||
background: #e69500;
|
||||
background: #d4705e;
|
||||
}
|
||||
|
||||
.appt-submit-btn:active:not(:disabled) {
|
||||
@@ -1726,12 +1726,12 @@ body {
|
||||
}
|
||||
|
||||
.appt-adopt-card:hover {
|
||||
border-color: orange;
|
||||
border-color: #e68672;
|
||||
background: #fffaf5;
|
||||
}
|
||||
|
||||
.appt-adopt-card--selected {
|
||||
border-color: orange;
|
||||
border-color: #e68672;
|
||||
background: #fff3e0;
|
||||
}
|
||||
|
||||
@@ -1835,7 +1835,7 @@ body {
|
||||
}
|
||||
|
||||
.profile-pets-add-btn {
|
||||
background: orange;
|
||||
background: #e68672;
|
||||
color: white;
|
||||
border: none;
|
||||
border-radius: 20px;
|
||||
@@ -1847,7 +1847,7 @@ body {
|
||||
}
|
||||
|
||||
.profile-pets-add-btn:hover {
|
||||
background: #e69500;
|
||||
background: #d4705e;
|
||||
}
|
||||
|
||||
.profile-pets-empty {
|
||||
@@ -1920,7 +1920,7 @@ body {
|
||||
}
|
||||
|
||||
.profile-pet-upload-label:hover {
|
||||
border-color: orange;
|
||||
border-color: #e68672;
|
||||
}
|
||||
|
||||
.profile-pet-upload-input {
|
||||
@@ -1965,8 +1965,8 @@ body {
|
||||
}
|
||||
|
||||
.profile-pet-edit-btn:hover {
|
||||
border-color: orange;
|
||||
color: orange;
|
||||
border-color: #e68672;
|
||||
color: #e68672;
|
||||
}
|
||||
|
||||
.profile-pet-delete-btn:hover {
|
||||
@@ -2124,7 +2124,7 @@ body {
|
||||
}
|
||||
|
||||
.product-card-qty-btn:hover:not(:disabled) {
|
||||
border-color: orange;
|
||||
border-color: #e68672;
|
||||
}
|
||||
|
||||
.product-card-qty-val {
|
||||
@@ -2137,7 +2137,7 @@ body {
|
||||
.product-card-add-btn {
|
||||
width: 100%;
|
||||
padding: 0.45rem;
|
||||
background: orange;
|
||||
background: #e68672;
|
||||
color: white;
|
||||
border: none;
|
||||
border-radius: 8px;
|
||||
@@ -2148,7 +2148,7 @@ body {
|
||||
}
|
||||
|
||||
.product-card-add-btn:hover:not(:disabled) {
|
||||
background: #e69500;
|
||||
background: #d4705e;
|
||||
}
|
||||
|
||||
.product-card-add-btn:disabled {
|
||||
@@ -2205,7 +2205,7 @@ body {
|
||||
}
|
||||
|
||||
.cart-continue-btn {
|
||||
background: orange;
|
||||
background: #e68672;
|
||||
color: white;
|
||||
border: none;
|
||||
border-radius: 8px;
|
||||
@@ -2217,7 +2217,7 @@ body {
|
||||
}
|
||||
|
||||
.cart-continue-btn:hover {
|
||||
background: #e69500;
|
||||
background: #d4705e;
|
||||
}
|
||||
|
||||
.cart-layout {
|
||||
@@ -2296,7 +2296,7 @@ body {
|
||||
}
|
||||
|
||||
.cart-qty-btn:hover {
|
||||
border-color: orange;
|
||||
border-color: #e68672;
|
||||
}
|
||||
|
||||
.cart-qty-val {
|
||||
@@ -2549,7 +2549,7 @@ body {
|
||||
}
|
||||
|
||||
.cart-coupon-input:focus {
|
||||
border-color: orange;
|
||||
border-color: #e68672;
|
||||
}
|
||||
|
||||
.cart-coupon-btn {
|
||||
@@ -2597,7 +2597,7 @@ body {
|
||||
.cart-checkout-btn {
|
||||
width: 100%;
|
||||
padding: 0.85rem;
|
||||
background: orange;
|
||||
background: #e68672;
|
||||
color: white;
|
||||
border: none;
|
||||
border-radius: 10px;
|
||||
@@ -2609,7 +2609,7 @@ body {
|
||||
}
|
||||
|
||||
.cart-checkout-btn:hover:not(:disabled) {
|
||||
background: #e69500;
|
||||
background: #d4705e;
|
||||
}
|
||||
|
||||
.cart-checkout-btn:disabled {
|
||||
|
||||
@@ -8,7 +8,7 @@ import { useAuth } from "@/context/AuthContext";
|
||||
import { useCart } from "@/context/CartContext";
|
||||
|
||||
export default function DisplayNav() {
|
||||
const { user, token, logout, loading } = useAuth();
|
||||
const { user, logout, loading } = useAuth();
|
||||
const { itemCount, selectedStoreId, setStoreId } = useCart();
|
||||
const router = useRouter();
|
||||
const [stores, setStores] = useState([]);
|
||||
@@ -56,7 +56,7 @@ export default function DisplayNav() {
|
||||
</div>
|
||||
|
||||
<div className="nav-auth">
|
||||
{stores.length > 0 && (
|
||||
{user && stores.length > 0 && (
|
||||
<select
|
||||
className="nav-store-select"
|
||||
value={selectedStoreId ?? ""}
|
||||
@@ -132,7 +132,7 @@ export default function DisplayNav() {
|
||||
|
||||
<div className="nav-drawer-divider" />
|
||||
|
||||
{stores.length > 0 && (
|
||||
{user && stores.length > 0 && (
|
||||
<select
|
||||
className="nav-store-select nav-store-select--drawer"
|
||||
value={selectedStoreId ?? ""}
|
||||
|
||||
Reference in New Issue
Block a user