ChoChoX/suwayomi-material-you-webui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Reduce manga page button sizes on small screens

Browse Source 
Partially closes #1049
This commit is contained in:
schroda
2026-01-18 19:16:41 +01:00
parent 9e621edbf4
commit 19b31528da
2 changed files with 4 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
src/features/manga/components/TrackMangaButton.tsx
View File

@@ -22,6 +22,7 @@ import { GetTrackersSettingsQuery, MangaType } from '@/lib/graphql/generated/gra
import { GET_TRACKERS_SETTINGS } from '@/lib/graphql/tracker/TrackerQuery.ts'; import { GET_TRACKERS_SETTINGS } from '@/lib/graphql/tracker/TrackerQuery.ts';
import { MangaTrackRecordInfo } from '@/features/manga/Manga.types.ts'; import { MangaTrackRecordInfo } from '@/features/manga/Manga.types.ts';
import { AppRoutes } from '@/base/AppRoute.constants.ts'; import { AppRoutes } from '@/base/AppRoute.constants.ts';
import { MediaQuery } from '@/base/utils/MediaQuery.tsx';
export const TrackMangaButton = ({ manga }: { manga: MangaTrackRecordInfo & Pick<MangaType, 'title'> }) => { export const TrackMangaButton = ({ manga }: { manga: MangaTrackRecordInfo & Pick<MangaType, 'title'> }) => {
const { t } = useLingui(); const { t } = useLingui();
@@ -54,7 +55,7 @@ export const TrackMangaButton = ({ manga }: { manga: MangaTrackRecordInfo & Pick
<> <>
<CustomButton <CustomButton
{...bindTrigger(popupState)} {...bindTrigger(popupState)}
size="medium" size={MediaQuery.useIsMobileWidth() ? 'small' : 'medium'}
disabled={trackerList.loading || !!trackerList.error} disabled={trackerList.loading || !!trackerList.error}
onClick={() => handleClick(popupState.open)} onClick={() => handleClick(popupState.open)}
variant={trackersInUse.length ? 'contained' : 'outlined'} variant={trackersInUse.length ? 'contained' : 'outlined'}

3
src/features/manga/components/details/MangaDetails.tsx
View File

@@ -54,6 +54,7 @@ import { SearchLink } from '@/features/manga/components/details/SearchLink.tsx';
import { requestManager } from '@/lib/requests/RequestManager.ts'; import { requestManager } from '@/lib/requests/RequestManager.ts';
import { IconBrowser } from '@/assets/icons/IconBrowser.tsx'; import { IconBrowser } from '@/assets/icons/IconBrowser.tsx';
import { IconWebView } from '@/assets/icons/IconWebView.tsx'; import { IconWebView } from '@/assets/icons/IconWebView.tsx';
import { MediaQuery } from '@/base/utils/MediaQuery.tsx';
const DetailsWrapper = styled('div')(({ theme }) => ({ const DetailsWrapper = styled('div')(({ theme }) => ({
display: 'flex', display: 'flex',
@@ -274,7 +275,7 @@ export const MangaDetails = ({
</ThumbnailMetadataWrapper> </ThumbnailMetadataWrapper>
<MangaButtonsContainer> <MangaButtonsContainer>
<CustomButton <CustomButton
size="medium" size={MediaQuery.useIsMobileWidth() ? 'small' : 'medium'}
onClick={updateLibraryState} onClick={updateLibraryState}
variant={manga.inLibrary ? 'contained' : 'outlined'} variant={manga.inLibrary ? 'contained' : 'outlined'}
> >