button and icon color fixes

This commit is contained in:
Novattz
2025-12-22 20:20:38 +01:00
parent 9397e1508f
commit cbf791a348
4 changed files with 20 additions and 13 deletions

View File

@@ -41,7 +41,7 @@ const SettingsDialog: React.FC<SettingsDialogProps> = ({ visible, onClose }) =>
<Dialog visible={visible} onClose={onClose} size="medium">
<DialogHeader onClose={onClose} hideCloseButton={true}>
<div className="settings-header">
<Icon name={settings} variant="bold" size="md" />
<Icon name={settings} variant="solid" size="md" />
<h3>Settings</h3>
</div>
</DialogHeader>
@@ -55,7 +55,7 @@ const SettingsDialog: React.FC<SettingsDialogProps> = ({ visible, onClose }) =>
</p>
<div className="settings-placeholder">
<div className="placeholder-icon"> <Icon name={settings} variant="bold" size="xl" /> </div>
<div className="placeholder-icon"> <Icon name={settings} variant="solid" size="xl" /> </div>
<div className="placeholder-text">
<h5>Settings Coming Soon</h5>
<p>

View File

@@ -152,9 +152,9 @@ const GameItem = ({ game, onAction, onEdit }: GameItemProps) => {
disabled={!game.cream_installed || !!game.installing}
title="Manage DLCs"
className="edit-button settings-icon-button"
>
<Icon name="Settings" size="md" />
</Button>
leftIcon={<Icon name="Settings" variant="solid" size="md" />}
iconOnly
/>
)}
</div>
</div>

View File

@@ -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>

View File

@@ -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>
)