componenets standardization 1

This commit is contained in:
IGNY8 VPS (Salman)
2026-01-01 21:42:04 +00:00
parent c880e24fc0
commit a4691ad2da
95 changed files with 3597 additions and 1745 deletions

View File

@@ -10,6 +10,7 @@ import SearchModal from "../components/common/SearchModal";
import SiteAndSectorSelector from "../components/common/SiteAndSectorSelector";
import SingleSiteSelector from "../components/common/SingleSiteSelector";
import SiteWithAllSitesSelector from "../components/common/SiteWithAllSitesSelector";
import IconButton from "../components/ui/button/IconButton";
import React from "react";
// Route patterns for selector visibility
@@ -104,22 +105,26 @@ const AppHeader: React.FC = () => {
</Link>
{/* Mobile Menu Toggle */}
<button
<IconButton
variant="ghost"
onClick={toggleApplicationMenu}
className="flex items-center justify-center w-10 h-10 text-gray-700 rounded-lg z-99999 hover:bg-gray-100 dark:text-gray-400 dark:hover:bg-gray-800 lg:hidden"
className="w-10 h-10 z-99999 lg:hidden"
aria-label="Toggle menu"
>
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fillRule="evenodd" clipRule="evenodd" d="M5.99902 10.4951C6.82745 10.4951 7.49902 11.1667 7.49902 11.9951V12.0051C7.49902 12.8335 6.82745 13.5051 5.99902 13.5051C5.1706 13.5051 4.49902 12.8335 4.49902 12.0051V11.9951C4.49902 11.1667 5.1706 10.4951 5.99902 10.4951ZM17.999 10.4951C18.8275 10.4951 19.499 11.1667 19.499 11.9951V12.0051C19.499 12.8335 18.8275 13.5051 17.999 13.5051C17.1706 13.5051 16.499 12.8335 16.499 12.0051V11.9951C16.499 11.1667 17.1706 10.4951 17.999 10.4951ZM13.499 11.9951C13.499 11.1667 12.8275 10.4951 11.999 10.4951C11.1706 10.4951 10.499 11.1667 10.499 11.9951V12.0051C10.499 12.8335 11.1706 13.5051 11.999 13.5051C12.8275 13.5051 13.499 12.8335 13.499 12.0051V11.9951Z" fill="currentColor" />
</svg>
</button>
</IconButton>
{/* Page Title with Badge - Desktop */}
{pageInfo && (
<div className="hidden lg:flex items-center gap-3">
{/* Sidebar Toggle Button - Always visible on desktop */}
<button
<IconButton
variant="outline"
size="xs"
onClick={toggleSidebar}
className="flex items-center justify-center w-6 h-6 bg-white dark:bg-gray-900 border border-gray-200 dark:border-gray-700 rounded-full shadow-sm hover:bg-gray-50 dark:hover:bg-gray-800 transition-colors"
className="w-6 h-6 rounded-full"
aria-label={isExpanded ? "Collapse Sidebar" : "Expand Sidebar"}
>
<svg
@@ -130,7 +135,7 @@ const AppHeader: React.FC = () => {
>
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M9 5l7 7-7 7" />
</svg>
</button>
</IconButton>
{pageInfo.badge && (
<div className={`flex items-center justify-center w-8 h-8 rounded-lg ${badgeColors[pageInfo.badge.color]?.bg || 'bg-gray-600'} flex-shrink-0`}>
@@ -181,15 +186,17 @@ const AppHeader: React.FC = () => {
)}
{/* Search Icon */}
<button
<IconButton
variant="ghost"
onClick={() => setIsSearchOpen(true)}
className="flex items-center justify-center w-10 h-10 text-gray-500 rounded-lg hover:bg-gray-100 dark:text-gray-400 dark:hover:bg-gray-800 transition-colors"
className="w-10 h-10"
title="Search (⌘K)"
aria-label="Search"
>
<svg className="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z" />
</svg>
</button>
</IconButton>
{/* Dark Mode Toggler */}
<ThemeToggleButton />