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

Make minimized standard progress bar gaps transparent

Browse Source
This commit is contained in:
schroda
2025-01-02 14:43:01 +01:00
parent 87a1a67880
commit 4aa144cb25
2 changed files with 4 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
src/modules/reader/components/overlay/progress-bar/desktop/ReaderProgressBarSlotDesktop.tsx
View File

@@ -12,7 +12,6 @@ import { memo } from 'react';
import { applyStyles } from '@/modules/core/utils/ApplyStyles.ts';
import { ReaderProgressBarSlot } from '@/modules/reader/components/overlay/progress-bar/ReaderProgressBarSlot.tsx';
import { IReaderSettings } from '@/modules/reader/types/Reader.types.ts';
import { getProgressBarPositionInfo } from '@/modules/reader/utils/ReaderProgressBar.utils.tsx';
export const ReaderProgressBarSlotDesktop = memo(
({
@@ -22,8 +21,6 @@ export const ReaderProgressBarSlotDesktop = memo(
secondaryPageLoadState,
progressBarPosition,
isCurrentPage,
isFirstPage,
isLastPage,
isLeadingPage,
showDraggingStyle,
}: Pick<IReaderSettings, 'progressBarPosition'> & {
@@ -32,15 +29,11 @@ export const ReaderProgressBarSlotDesktop = memo(
primaryPageLoadState: boolean;
secondaryPageLoadState?: boolean;
isCurrentPage: boolean;
isFirstPage: boolean;
isLastPage: boolean;
isLeadingPage: boolean;
showDraggingStyle: boolean;
}) => {
const theme = useTheme();
const { isVertical, isHorizontal } = getProgressBarPositionInfo(progressBarPosition);
return (
<ReaderProgressBarSlot
key={pageUrl}
@@ -51,16 +44,6 @@ export const ReaderProgressBarSlotDesktop = memo(
sx: {
cursor: 'pointer',
backgroundColor: darken(theme.palette.background.paper, 0.2),
...applyStyles(isHorizontal, {
borderLeftWidth: 2,
borderLeftColor: 'background.paper',
borderLeftStyle: 'solid',
}),
...applyStyles(isVertical, {
borderTopWidth: 2,
borderTopColor: 'background.paper',
borderTopStyle: 'solid',
}),
...theme.applyStyles('dark', {
backgroundColor: lighten(theme.palette.background.paper, 0.1),
}),
@@ -73,8 +56,6 @@ export const ReaderProgressBarSlotDesktop = memo(
}),
},
),
borderLeftWidth: isFirstPage ? 0 : undefined,
borderRightWidth: isLastPage ? 0 : undefined,
},
},
tooltip: {

9
src/modules/reader/components/overlay/progress-bar/variants/StandardReaderProgressBar.tsx
View File

@@ -59,13 +59,13 @@ const BaseStandardReaderProgressBar = ({
createProgressBarSlot={useCallback(
(
page,
pagesIndex,
_pagesIndex,
primaryPageLoadState,
secondaryPageLoadState,
isCurrentPage,
isLeadingPage,
_,
totalPages_,
_isTrailingPage,
_totalPages,
showDraggingStyle,
) => (
<ReaderProgressBarSlotDesktop
@@ -75,8 +75,6 @@ const BaseStandardReaderProgressBar = ({
secondaryPageLoadState={secondaryPageLoadState}
progressBarPosition={progressBarPosition}
isCurrentPage={isCurrentPage}
isFirstPage={pagesIndex === 0}
isLastPage={pagesIndex === totalPages_ - 1}
isLeadingPage={isLeadingPage}
showDraggingStyle={showDraggingStyle}
/>
@@ -182,6 +180,7 @@ const BaseStandardReaderProgressBar = ({
},
progressBarSlotsContainer: {
sx: {
gap: 0.25,
borderRadius: 2,
transition: 'height 0.1s ease-in-out',
...applyStyles(isHorizontal, {