diff --git a/frontend/src/pages/EntityReviewPage.css b/frontend/src/pages/EntityReviewPage.css
index 356b9e25e7..416ff0efe2 100644
--- a/frontend/src/pages/EntityReviewPage.css
+++ b/frontend/src/pages/EntityReviewPage.css
@@ -36,7 +36,21 @@
.header-actions {
display: flex;
align-items: center;
- gap: 0.5rem;
+ gap: 0.75rem;
+}
+
+.header-actions button svg {
+ width: 20px;
+ height: 20px;
+ stroke: #333 !important;
+}
+
+.dark .header-actions button svg {
+ stroke: #e0e0e0 !important;
+}
+
+.header-actions button:hover svg {
+ stroke: white !important;
}
.dark .review-header {
@@ -69,18 +83,34 @@
display: flex;
align-items: center;
justify-content: center;
- width: 40px;
- height: 40px;
- border: none;
+ width: 42px;
+ height: 42px;
+ border: 1px solid var(--border-color, #d0d0d0);
border-radius: 8px;
- background: var(--bg-secondary, #f5f5f5);
- color: var(--text-secondary, #666);
+ background: var(--bg-primary, #ffffff);
+ color: var(--text-primary, #333);
cursor: pointer;
transition: all 0.2s;
+ box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}
.refresh-btn:hover {
background: var(--primary-color, #3b82f6);
+ border-color: var(--primary-color, #3b82f6);
+ color: white;
+ box-shadow: 0 2px 6px rgba(59, 130, 246, 0.3);
+}
+
+.dark .refresh-btn {
+ background: var(--bg-secondary, #1e1e3f);
+ border-color: var(--border-color, #3a3a5a);
+ color: var(--text-primary, #e0e0e0);
+ box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
+}
+
+.dark .refresh-btn:hover {
+ background: var(--primary-color, #3b82f6);
+ border-color: var(--primary-color, #3b82f6);
color: white;
}
@@ -94,30 +124,50 @@
display: flex;
align-items: center;
justify-content: center;
- width: 32px;
- height: 32px;
- border: none;
- border-radius: 6px;
- background: var(--bg-secondary, #f5f5f5);
- color: var(--text-secondary, #666);
+ width: 42px;
+ height: 42px;
+ border: 1px solid var(--border-color, #d0d0d0);
+ border-radius: 8px;
+ background: var(--bg-primary, #ffffff);
+ color: var(--text-primary, #333);
cursor: pointer;
transition: all 0.2s;
+ box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}
.filter-btn:hover,
.logout-btn:hover {
background: var(--primary-color, #3b82f6);
+ border-color: var(--primary-color, #3b82f6);
color: white;
+ box-shadow: 0 2px 6px rgba(59, 130, 246, 0.3);
}
.filter-btn.active {
background: var(--primary-color, #3b82f6);
+ border-color: var(--primary-color, #3b82f6);
color: white;
}
.dark .filter-btn,
.dark .logout-btn {
- background: var(--bg-tertiary, #2a2a4a);
+ background: var(--bg-secondary, #1e1e3f);
+ border-color: var(--border-color, #3a3a5a);
+ color: var(--text-primary, #e0e0e0);
+ box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
+}
+
+.dark .filter-btn:hover,
+.dark .logout-btn:hover {
+ background: var(--primary-color, #3b82f6);
+ border-color: var(--primary-color, #3b82f6);
+ color: white;
+}
+
+.dark .filter-btn.active {
+ background: var(--primary-color, #3b82f6);
+ border-color: var(--primary-color, #3b82f6);
+ color: white;
}
/* Filter Panel */
diff --git a/frontend/src/pages/EntityReviewPage.tsx b/frontend/src/pages/EntityReviewPage.tsx
index 4e80421c0c..0dbd5c9569 100644
--- a/frontend/src/pages/EntityReviewPage.tsx
+++ b/frontend/src/pages/EntityReviewPage.tsx
@@ -297,6 +297,46 @@ export default function EntityReviewPage() {
);
});
+ // DEBUG: Log icon visibility info
+ useEffect(() => {
+ const debugIcons = () => {
+ const buttons = document.querySelectorAll('.header-actions button');
+
+ console.log('=== ICON DEBUG INFO ===');
+ console.log('Buttons found:', buttons.length);
+
+ buttons.forEach((btn, i) => {
+ const svg = btn.querySelector('svg');
+ const computedStyle = window.getComputedStyle(btn);
+ const svgStyle = svg ? window.getComputedStyle(svg) : null;
+
+ console.log(`--- Button ${i} (${btn.className}) ---`);
+ console.log(` btn color: ${computedStyle.color}`);
+ console.log(` btn background: ${computedStyle.backgroundColor}`);
+
+ if (svg && svgStyle) {
+ console.log(` svg stroke attr: ${svg.getAttribute('stroke')}`);
+ console.log(` svg style.stroke: ${svg.style.stroke}`);
+ console.log(` svg computed stroke: ${svgStyle.stroke}`);
+ console.log(` svg computed fill: ${svgStyle.fill}`);
+ console.log(` svg computed color: ${svgStyle.color}`);
+
+ // Check first path element
+ const path = svg.querySelector('path, line, circle, polyline, polygon');
+ if (path) {
+ const pathStyle = window.getComputedStyle(path);
+ console.log(` path stroke: ${pathStyle.stroke}`);
+ console.log(` path fill: ${pathStyle.fill}`);
+ console.log(` path strokeWidth: ${pathStyle.strokeWidth}`);
+ }
+ }
+ });
+ };
+
+ const timer = setTimeout(debugIcons, 1000);
+ return () => clearTimeout(timer);
+ }, [isAuthenticated]);
+
// Fetch available signal types
const fetchSignalTypes = useCallback(async () => {
try {
@@ -670,21 +710,21 @@ export default function EntityReviewPage() {
onClick={() => setShowFilters(!showFilters)}
title="Toggle filters"
>
-
+