From 9a05c380ccd25692d5beba760e350494995dd8bb Mon Sep 17 00:00:00 2001
From: seriouselly <supriyatinselly@gmail.com>
Date: Sun, 7 Jun 2026 18:22:14 +0700
Subject: [PATCH] feat(ui): add review menu to mobile nav and update card
 styling

- mobile-nav: add 'review' path to NAV_ITEMS array to ensure the menu is accessible on mobile screens.
- scan-page: update background color and border radius of the guidelines card in the right sidebar.
---
 apps/web/src/components/layout/mobile-nav.tsx | 1 +
 apps/web/src/pages/scan-page.tsx              | 8 ++++----
 2 files changed, 5 insertions(+), 4 deletions(-)

diff --git a/apps/web/src/components/layout/mobile-nav.tsx b/apps/web/src/components/layout/mobile-nav.tsx
index 6403345..c5f68dc 100644
--- a/apps/web/src/components/layout/mobile-nav.tsx
+++ b/apps/web/src/components/layout/mobile-nav.tsx
@@ -12,6 +12,7 @@ const NAV_ITEMS = [
   { path: "/scan", label: "Scan Tanaman" },
   { path: "/diagnoses", label: "Diagnosa" },
   { path: "/catalog", label: "Pustaka", altPath: "/library" },
+  { path: "/expert/reviews", label: "Review" },
 ];
 
 export function MobileNav({ open, onClose }: Props) {
diff --git a/apps/web/src/pages/scan-page.tsx b/apps/web/src/pages/scan-page.tsx
index 33c4edc..4bb9e61 100644
--- a/apps/web/src/pages/scan-page.tsx
+++ b/apps/web/src/pages/scan-page.tsx
@@ -263,7 +263,7 @@ export function ScanPage() {
 
               <ul className="space-y-3">
                 <li className="flex items-center gap-3">
-                  <div className="h-9 w-9 rounded-lg bg-emerald-50 flex items-center justify-center shrink-0">
+                  <div className="h-9 w-9 rounded bg-[#ECF4E8] flex items-center justify-center shrink-0">
                     <ZoomIn className="text-emerald-600" size={20} />
                   </div>
                   <div className="text-sm text-slate-700">
@@ -271,7 +271,7 @@ export function ScanPage() {
                   </div>
                 </li>
                 <li className="flex items-center gap-3">
-                  <div className="h-9 w-9 rounded-lg bg-emerald-50 flex items-center justify-center shrink-0">
+                  <div className="h-9 w-9 rounded bg-[#ECF4E8] flex items-center justify-center shrink-0">
                     <Sun className="text-emerald-600" size={20} />
                   </div>
                   <div className="text-sm text-slate-700">
@@ -279,7 +279,7 @@ export function ScanPage() {
                   </div>
                 </li>
                 <li className="flex items-center gap-3">
-                  <div className="h-9 w-9 rounded-lg bg-emerald-50 flex items-center justify-center shrink-0">
+                  <div className="h-9 w-9 rounded bg-[#ECF4E8] flex items-center justify-center shrink-0">
                     <AlignCenter className="text-emerald-600" size={20} />
                   </div>
                   <div className="text-sm text-slate-700">
@@ -287,7 +287,7 @@ export function ScanPage() {
                   </div>
                 </li>
                 <li className="flex items-center gap-3">
-                  <div className="h-9 w-9 rounded-lg bg-emerald-50 flex items-center justify-center shrink-0">
+                  <div className="h-9 w-9 rounded bg-[#ECF4E8] flex items-center justify-center shrink-0">
                     <Camera className="text-emerald-600" size={20} />
                   </div>
                   <div className="text-sm text-slate-700">