Set appbar color on light theme

This commit is contained in:
schroda
2024-09-06 16:59:27 +02:00
parent 0a4124062b
commit 1423ca23be
16 changed files with 80 additions and 26 deletions

View File

@@ -139,13 +139,13 @@ export const DownloadQueue: React.FC = () => {
setAction(
<>
<Tooltip title={t('download.queue.label.delete_all')}>
<IconButton onClick={clearQueue} size="large">
<IconButton onClick={clearQueue} size="large" color="inherit">
<DeleteSweepIcon />
</IconButton>
</Tooltip>
<Tooltip title={t(status === 'STOPPED' ? 'global.button.start' : 'global.button.stop')}>
<IconButton onClick={toggleQueueStatus} size="large" disabled={isQueueEmpty}>
<IconButton onClick={toggleQueueStatus} size="large" disabled={isQueueEmpty} color="inherit">
{status === 'STOPPED' ? <PlayArrowIcon /> : <PauseIcon />}
</IconButton>
</Tooltip>

View File

@@ -179,7 +179,7 @@ export function Extensions({ tabsMenuHeight }: { tabsMenuHeight: number }) {
<>
<AppbarSearch />
<Tooltip title={t('extension.action.label.install_external')}>
<IconButton onClick={() => inputRef.current?.click()} size="large">
<IconButton onClick={() => inputRef.current?.click()} size="large" color="inherit">
<AddIcon />
</IconButton>
</Tooltip>

View File

@@ -6,10 +6,10 @@
* file, You can obtain one at https://mozilla.org/MPL/2.0/.
*/
import Chip from '@mui/material/Chip';
import Chip, { ChipProps } from '@mui/material/Chip';
import Tab from '@mui/material/Tab';
import { styled } from '@mui/material/styles';
import React, { useCallback, useContext, useEffect, useMemo, useState } from 'react';
import { useCallback, useContext, useEffect, useMemo, useState } from 'react';
import { useQueryParam, NumberParam } from 'use-query-params';
import { useTranslation } from 'react-i18next';
import { requestManager } from '@/lib/requests/RequestManager.ts';
@@ -45,8 +45,8 @@ const TitleWithSizeTag = styled('span')({
alignItems: 'center',
});
const TitleSizeTag = (props: React.ComponentProps<typeof Chip>) => (
<Chip {...props} size="small" sx={{ marginLeft: '5px' }} />
const TitleSizeTag = ({ sx, ...props }: ChipProps) => (
<Chip {...props} size="small" sx={{ ...sx, marginLeft: '5px' }} />
);
export function Library() {
@@ -152,7 +152,7 @@ export function Library() {
const navBarTitle = (
<TitleWithSizeTag>
{title}
{options.showTabSize && <TitleSizeTag label={librarySize} />}
{options.showTabSize && <TitleSizeTag sx={{ color: 'inherit' }} label={librarySize} />}
</TitleWithSizeTag>
);
setTitle(navBarTitle, title);

View File

@@ -96,7 +96,7 @@ export function Sources() {
setAction(
<>
<Tooltip title={t('search.title.global_search')}>
<IconButton onClick={() => navigate('/sources/all/search/')} size="large">
<IconButton onClick={() => navigate('/sources/all/search/')} size="large" color="inherit">
<TravelExploreIcon />
</IconButton>
</Tooltip>

View File

@@ -126,7 +126,7 @@ export const LibraryDuplicates = () => {
<PopupState variant="popover" popupId="library-dupliactes-settings">
{(popupState) => (
<>
<IconButton {...bindTrigger(popupState)}>
<IconButton {...bindTrigger(popupState)} color="inherit">
<SettingsIcon />
</IconButton>
<Menu {...bindMenu(popupState)}>