From 0df13abfeed2da7e931e4bb81146fa7ac019c12f Mon Sep 17 00:00:00 2001
From: fahed <fahed@softhouse.io>
Date: Wed, 25 Mar 2026 18:28:34 +0300
Subject: [PATCH] Polish + Optimize: Clean metadata, remove !important, prune
 unused CSS

- Update theme-color to match brand (#f8fafc), fix stale CRA description
- Remove manifest.json and logo192.png references (not used)
- Replace !important on chart export buttons with higher specificity selectors
- Remove unused .skeleton-text and .skeleton-loading CSS classes
- Remove duplicate skeleton animation keyframes

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 index.html  |  9 ++-------
 src/App.css | 39 ++++++++++-----------------------------
 2 files changed, 12 insertions(+), 36 deletions(-)

diff --git a/index.html b/index.html
index 811bed7..08f37c7 100644
--- a/index.html
+++ b/index.html
@@ -4,13 +4,8 @@
     <meta charset="utf-8" />
     <link rel="icon" href="/favicon.ico" />
     <meta name="viewport" content="width=device-width, initial-scale=1" />
-    <meta name="theme-color" content="#000000" />
-    <meta
-      name="description"
-      content="Web site created using create-react-app"
-    />
-    <link rel="apple-touch-icon" href="/logo192.png" />
-    <link rel="manifest" href="/manifest.json" />
+    <meta name="theme-color" content="#f8fafc" />
+    <meta name="description" content="HiHala Data Dashboard — Museum analytics, visitor tracking, and revenue insights" />
     <link rel="preconnect" href="https://fonts.googleapis.com">
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
     <link href="https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600&family=IBM+Plex+Sans+Arabic:wght@400;500;600;700&display=swap" rel="stylesheet">
diff --git a/src/App.css b/src/App.css
index f4ea189..e9fb7f2 100644
--- a/src/App.css
+++ b/src/App.css
@@ -153,26 +153,7 @@ html[dir="rtl"] {
   background: var(--accent-hover);
 }
 
-/* Skeleton Loader */
-.skeleton {
-  background: linear-gradient(90deg, var(--border) 25%, var(--bg) 50%, var(--border) 75%);
-  background-size: 200% 100%;
-  animation: skeleton-loading 1.5s infinite;
-  border-radius: 4px;
-}
 
-@keyframes skeleton-loading {
-  0% { background-position: 200% 0; }
-  100% { background-position: -200% 0; }
-}
-
-.skeleton-text {
-  height: 1em;
-  margin-bottom: 0.5em;
-}
-
-.skeleton-text.lg { height: 2em; width: 60%; }
-.skeleton-text.sm { height: 0.75em; width: 40%; }
 
 /* Navigation */
 .nav-bar {
@@ -1968,12 +1949,12 @@ html[dir="rtl"] .chart-header-with-export {
 }
 
 /* Download button - always top corner, outside normal flow */
-.chart-export-btn,
-.chart-export-btn.visible {
-  position: absolute !important;
-  top: 0 !important;
-  right: 0 !important;
-  left: auto !important;
+.exportable-chart-wrapper .chart-export-btn,
+.exportable-chart-wrapper .chart-export-btn.visible {
+  position: absolute;
+  top: 0;
+  right: 0;
+  left: auto;
   z-index: 10;
   width: 32px;
   height: 32px;
@@ -1990,10 +1971,10 @@ html[dir="rtl"] .chart-header-with-export {
   flex-shrink: 0;
 }
 
-html[dir="rtl"] .chart-export-btn,
-html[dir="rtl"] .chart-export-btn.visible {
-  right: auto !important;
-  left: 0 !important;
+html[dir="rtl"] .exportable-chart-wrapper .chart-export-btn,
+html[dir="rtl"] .exportable-chart-wrapper .chart-export-btn.visible {
+  right: auto;
+  left: 0;
 }
 
 .chart-export-btn:hover {