From 4f419f8b0427c1e36296baa7b065aecc96ec04bc Mon Sep 17 00:00:00 2001
From: Usman Baig <mubaig@pm.me>
Date: Mon, 16 Mar 2026 12:40:01 +0100
Subject: [PATCH] fix: increase inline bar chart opacity for better brand
 visibility
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Light mode: 5% → 15%, dark mode: 10% → 25%
---
 components/behavior/FrustrationByPageTable.tsx | 2 +-
 components/dashboard/Campaigns.tsx             | 2 +-
 components/dashboard/ContentStats.tsx          | 2 +-
 components/dashboard/Locations.tsx             | 2 +-
 components/dashboard/TechSpecs.tsx             | 2 +-
 components/dashboard/TopReferrers.tsx          | 2 +-
 components/journeys/TopPathsTable.tsx          | 2 +-
 7 files changed, 7 insertions(+), 7 deletions(-)

diff --git a/components/behavior/FrustrationByPageTable.tsx b/components/behavior/FrustrationByPageTable.tsx
index 249da82..d8e3515 100644
--- a/components/behavior/FrustrationByPageTable.tsx
+++ b/components/behavior/FrustrationByPageTable.tsx
@@ -68,7 +68,7 @@ export default function FrustrationByPageTable({ pages, loading }: FrustrationBy
                 >
                   {/* Background bar */}
                   <div
-                    className="absolute inset-y-0 left-0 bg-brand-orange/5 dark:bg-brand-orange/10 rounded-lg transition-all"
+                    className="absolute inset-y-0 left-0 bg-brand-orange/15 dark:bg-brand-orange/25 rounded-lg transition-all"
                     style={{ width: `${barWidth}%` }}
                   />
                   <span
diff --git a/components/dashboard/Campaigns.tsx b/components/dashboard/Campaigns.tsx
index 02bf7c5..91e925e 100644
--- a/components/dashboard/Campaigns.tsx
+++ b/components/dashboard/Campaigns.tsx
@@ -164,7 +164,7 @@ export default function Campaigns({ siteId, dateRange, filters, onFilter }: Camp
                     className={`relative flex items-center justify-between py-1.5 group hover:bg-neutral-50/50 dark:hover:bg-neutral-800/50 rounded-lg px-2 -mx-2 transition-colors${onFilter ? ' cursor-pointer' : ''}`}
                   >
                     <div
-                      className="absolute inset-y-0.5 left-0.5 bg-brand-orange/5 dark:bg-brand-orange/10 rounded-md transition-all"
+                      className="absolute inset-y-0.5 left-0.5 bg-brand-orange/15 dark:bg-brand-orange/25 rounded-md transition-all"
                       style={{ width: `${barWidth}%` }}
                     />
                     <div className="relative flex-1 text-neutral-900 dark:text-white flex items-center gap-3 min-w-0">
diff --git a/components/dashboard/ContentStats.tsx b/components/dashboard/ContentStats.tsx
index 38e7209..4f37eaa 100644
--- a/components/dashboard/ContentStats.tsx
+++ b/components/dashboard/ContentStats.tsx
@@ -159,7 +159,7 @@ export default function ContentStats({ topPages, entryPages, exitPages, domain,
                     className={`relative flex items-center justify-between h-9 group hover:bg-neutral-50/50 dark:hover:bg-neutral-800/50 rounded-lg px-2 -mx-2 transition-colors${onFilter ? ' cursor-pointer' : ''}`}
                   >
                     <div
-                      className="absolute inset-y-0.5 left-0.5 bg-brand-orange/5 dark:bg-brand-orange/10 rounded-md transition-all"
+                      className="absolute inset-y-0.5 left-0.5 bg-brand-orange/15 dark:bg-brand-orange/25 rounded-md transition-all"
                       style={{ width: `${barWidth}%` }}
                     />
                     <div className="relative flex-1 truncate text-neutral-900 dark:text-white flex items-center">
diff --git a/components/dashboard/Locations.tsx b/components/dashboard/Locations.tsx
index 147963f..aad4c17 100644
--- a/components/dashboard/Locations.tsx
+++ b/components/dashboard/Locations.tsx
@@ -306,7 +306,7 @@ export default function Locations({ countries, cities, regions, geoDataLevel = '
                       className={`relative flex items-center justify-between h-9 group hover:bg-neutral-50/50 dark:hover:bg-neutral-800/50 rounded-lg px-2 -mx-2 transition-colors${canFilter ? ' cursor-pointer' : ''}`}
                     >
                       <div
-                        className="absolute inset-y-0.5 left-0.5 bg-brand-orange/5 dark:bg-brand-orange/10 rounded-md transition-all"
+                        className="absolute inset-y-0.5 left-0.5 bg-brand-orange/15 dark:bg-brand-orange/25 rounded-md transition-all"
                         style={{ width: `${barWidth}%` }}
                       />
                       <div className="relative flex-1 truncate text-neutral-900 dark:text-white flex items-center gap-3">
diff --git a/components/dashboard/TechSpecs.tsx b/components/dashboard/TechSpecs.tsx
index d40f0ef..f18920e 100644
--- a/components/dashboard/TechSpecs.tsx
+++ b/components/dashboard/TechSpecs.tsx
@@ -191,7 +191,7 @@ export default function TechSpecs({ browsers, os, devices, screenResolutions, co
                     className={`relative flex items-center justify-between h-9 group hover:bg-neutral-50/50 dark:hover:bg-neutral-800/50 rounded-lg px-2 -mx-2 transition-colors${canFilter ? ' cursor-pointer' : ''}`}
                   >
                     <div
-                      className="absolute inset-y-0.5 left-0.5 bg-brand-orange/5 dark:bg-brand-orange/10 rounded-md transition-all"
+                      className="absolute inset-y-0.5 left-0.5 bg-brand-orange/15 dark:bg-brand-orange/25 rounded-md transition-all"
                       style={{ width: `${barWidth}%` }}
                     />
                     <div className="relative flex-1 truncate text-neutral-900 dark:text-white flex items-center gap-3">
diff --git a/components/dashboard/TopReferrers.tsx b/components/dashboard/TopReferrers.tsx
index c8f5ce2..d7b5330 100644
--- a/components/dashboard/TopReferrers.tsx
+++ b/components/dashboard/TopReferrers.tsx
@@ -123,7 +123,7 @@ export default function TopReferrers({ referrers, collectReferrers = true, siteI
                     className={`relative flex items-center justify-between h-9 group hover:bg-neutral-50/50 dark:hover:bg-neutral-800/50 rounded-lg px-2 -mx-2 transition-colors${onFilter ? ' cursor-pointer' : ''}`}
                   >
                     <div
-                      className="absolute inset-y-0.5 left-0.5 bg-brand-orange/5 dark:bg-brand-orange/10 rounded-md transition-all"
+                      className="absolute inset-y-0.5 left-0.5 bg-brand-orange/15 dark:bg-brand-orange/25 rounded-md transition-all"
                       style={{ width: `${barWidth}%` }}
                     />
                     <div className="relative flex-1 truncate text-neutral-900 dark:text-white flex items-center gap-3">
diff --git a/components/journeys/TopPathsTable.tsx b/components/journeys/TopPathsTable.tsx
index 72bdcd1..50660bb 100644
--- a/components/journeys/TopPathsTable.tsx
+++ b/components/journeys/TopPathsTable.tsx
@@ -61,7 +61,7 @@ export default function TopPathsTable({ paths, loading }: TopPathsTableProps) {
               >
                 {/* Background bar */}
                 <div
-                  className="absolute inset-y-0.5 left-0.5 bg-brand-orange/5 dark:bg-brand-orange/10 rounded-md transition-all"
+                  className="absolute inset-y-0.5 left-0.5 bg-brand-orange/15 dark:bg-brand-orange/25 rounded-md transition-all"
                   style={{ width: `${barWidth}%` }}
                 />