muerwre/vault-frontend
1
0
Fork 0
mirror of https://github.com/muerwre/vault-frontend.git synced 2025-04-24 20:36:40 +07:00
Code Packages Activity Actions

change photoswipe icons

Browse source
This commit is contained in:
Fedor Katurov 2025-02-12 19:59:06 +07:00
parent bf1382af0b
commit 5e71294e71
1 changed files with 12 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

16
src/containers/dialogs/PhotoSwipe/index.tsx
View file

@ -1,10 +1,12 @@
import { useEffect } from 'react'; import { useEffect } from 'react';
import { observer } from 'mobx-react-lite';
import { SlideData } from 'photoswipe/dist/types/slide/slide';
import 'photoswipe/style.css'; import 'photoswipe/style.css';
import { observer } from 'mobx-react-lite';
import { SlideData } from 'photoswipe/dist/types/slide/slide';
import { renderToStaticMarkup } from 'react-dom/server';
import { Icon } from '~/components/common/Icon';
import { imagePresets } from '~/constants/urls'; import { imagePresets } from '~/constants/urls';
import { useWindowSize } from '~/hooks/dom/useWindowSize'; import { useWindowSize } from '~/hooks/dom/useWindowSize';
import { useModal } from '~/hooks/modal/useModal'; import { useModal } from '~/hooks/modal/useModal';
@ -13,12 +15,15 @@ import { DialogComponentProps } from '~/types/modal';
import { getURL } from '~/utils/dom'; import { getURL } from '~/utils/dom';
import styles from './styles.module.scss'; import styles from './styles.module.scss';
export interface Props extends DialogComponentProps { export interface Props extends DialogComponentProps {
items: IFile[]; items: IFile[];
index: number; index: number;
} }
const arrowNextSVG = renderToStaticMarkup(<Icon icon="right" size={40} />);
const arrowPrevSVG = renderToStaticMarkup(<Icon icon="left" size={40} />);
const closeSVG = renderToStaticMarkup(<Icon icon="close" size={32} />);
const padding = { top: 10, left: 10, right: 10, bottom: 10 } as const; const padding = { top: 10, left: 10, right: 10, bottom: 10 } as const;
const PhotoSwipe = observer(({ index, items }: Props) => { const PhotoSwipe = observer(({ index, items }: Props) => {
@ -74,6 +79,9 @@ const PhotoSwipe = observer(({ index, items }: Props) => {
zoom: false, zoom: false,
counter: false, counter: false,
bgOpacity: 0.1, bgOpacity: 0.1,
arrowNextSVG,
arrowPrevSVG,
closeSVG,
}); });
ps.on('destroy', hideModal); ps.on('destroy', hideModal);