button and icon color fixes

src/components/layout/Header.tsx

@@ -16,7 +16,7 @@ const Header = ({ onRefresh, refreshDisabled = false, onSearch, searchQuery }: H
   return (
     <header className="app-header">
       <div className="app-title">
-        <Icon name={diamond} variant="bold" size="lg" className="app-logo-icon" />
+        <Icon name={diamond} variant="solid" size="lg" className="app-logo-icon" />
         <h1>CreamLinux</h1>
       </div>
       <div className="header-controls">
@@ -25,7 +25,7 @@ const Header = ({ onRefresh, refreshDisabled = false, onSearch, searchQuery }: H
           onClick={onRefresh}
           disabled={refreshDisabled}
           className="refresh-button"
-          leftIcon={<Icon name={refresh} variant="bold" size="md" />}
+          leftIcon={<Icon name={refresh} variant="solid" size="md" />}
         >
           Refresh
         </Button>
@@ -37,7 +37,7 @@ const Header = ({ onRefresh, refreshDisabled = false, onSearch, searchQuery }: H
             value={searchQuery}
             onChange={(e) => onSearch(e.target.value)}
           />
-          <Icon name={search} variant="bold" size="md" className="search-icon" />
+          <Icon name={search} variant="solid" size="md" className="search-icon" />
         </div>
       </div>
     </header>

src/components/layout/Sidebar.tsx

@@ -1,4 +1,5 @@
 import { Icon, layers, linux, proton, settings } from '@/components/icons'
+import { Button } from '@/components/buttons'
 
 interface SidebarProps {
   setFilter: (filter: string) => void
@@ -21,7 +22,7 @@ type FilterItem = {
 const Sidebar = ({ setFilter, currentFilter, onSettingsClick }: SidebarProps) => {
   // Available filter options with icons
   const filters: FilterItem[] = [
-    { id: 'all', label: 'All Games', icon: layers, variant: 'bold' },
+    { id: 'all', label: 'All Games', icon: layers, variant: 'solid' },
     { id: 'native', label: 'Native', icon: linux, variant: 'brand' },
     { id: 'proton', label: 'Proton Required', icon: proton, variant: 'brand' },
   ]
@@ -47,10 +48,16 @@ const Sidebar = ({ setFilter, currentFilter, onSettingsClick }: SidebarProps) =>
         ))}
       </ul>
 
-      <div className="settings-button" onClick={onSettingsClick}>
-        <Icon name={settings} variant="bold" size="md" className="settings-icon" />
-        <span>Settings</span>
-      </div>
+      <Button
+        variant="secondary"
+        size="medium"
+        onClick={onSettingsClick}
+        className="settings-button"
+        leftIcon={<Icon name={settings} variant="solid" size="md" className="settings-icon" />}
+        fullWidth
+      >
+        Settings
+      </Button>
 
     </div>
   )