Fix reader desktop nav bar page/chapter select rtl styling
This commit is contained in:
@@ -26,6 +26,7 @@ import { ReaderControls } from '@/features/reader/services/ReaderControls.ts';
|
||||
import type { ReaderStateChapters } from '@/features/reader/Reader.types.ts';
|
||||
import { withPropsFrom } from '@/base/hoc/withPropsFrom.tsx';
|
||||
import type { ChapterIdInfo } from '@/features/chapter/Chapter.types.ts';
|
||||
import { useTheme } from '@mui/material/styles';
|
||||
|
||||
const BaseReaderNavBarDesktopChapterNavigation = ({
|
||||
currentChapterId,
|
||||
@@ -43,6 +44,7 @@ const BaseReaderNavBarDesktopChapterNavigation = ({
|
||||
readerThemeDirection: ReturnType<typeof ReaderService.useGetThemeDirection>;
|
||||
}) => {
|
||||
const { t } = useLingui();
|
||||
const theme = useTheme();
|
||||
|
||||
const popupState = usePopupState({ variant: 'popover', popupId: 'reader-nav-bar-desktop-chapter-list' });
|
||||
|
||||
@@ -60,7 +62,7 @@ const BaseReaderNavBarDesktopChapterNavigation = ({
|
||||
}}
|
||||
disabled={getOptionForDirection(!previousChapter, !nextChapter, readerThemeDirection)}
|
||||
/>
|
||||
<FormControl sx={{ flexBasis: '70%', flexGrow: 0, flexShrink: 0 }}>
|
||||
<FormControl sx={{ flexBasis: '70%', flexGrow: 0, flexShrink: 0 }} dir={theme.direction}>
|
||||
<InputLabel id="reader-nav-bar-desktop-chapter-select">{t`Chapter`}</InputLabel>
|
||||
<Select
|
||||
{...bindTrigger(popupState)}
|
||||
|
||||
@@ -19,9 +19,11 @@ import { ReaderNavBarDesktopNextPreviousButton } from '@/features/reader/overlay
|
||||
import { READING_DIRECTION_TO_THEME_DIRECTION } from '@/features/reader/settings/ReaderSettings.constants.tsx';
|
||||
import { useReaderPagesStore, useReaderSettingsStore } from '@/features/reader/stores/ReaderStore.ts';
|
||||
import { ReaderControls } from '@/features/reader/services/ReaderControls.ts';
|
||||
import { useTheme } from '@mui/material/styles';
|
||||
|
||||
const BaseReaderNavBarDesktopPageNavigation = () => {
|
||||
const { t } = useLingui();
|
||||
const theme = useTheme();
|
||||
const getOptionForDirection = useGetOptionForDirection();
|
||||
const { currentPageIndex, pages } = useReaderPagesStore('currentPageIndex', 'pages');
|
||||
const readingDirection = useReaderSettingsStore((state) => state.readingDirection.value);
|
||||
@@ -41,7 +43,7 @@ const BaseReaderNavBarDesktopPageNavigation = () => {
|
||||
)}
|
||||
onClick={() => ReaderControls.openPage('previous', undefined, false)}
|
||||
/>
|
||||
<FormControl sx={{ flexBasis: '70%', flexGrow: 0, flexShrink: 0 }}>
|
||||
<FormControl sx={{ flexBasis: '70%', flexGrow: 0, flexShrink: 0 }} dir={theme.direction}>
|
||||
<InputLabel id="reader-nav-bar-desktop-page-select">{t`Page`}</InputLabel>
|
||||
<Select
|
||||
labelId="reader-nav-bar-desktop-page-select"
|
||||
|
||||
Reference in New Issue
Block a user