diff --git a/next.config.js b/next.config.js index 306a0017..fe80bc2b 100644 --- a/next.config.js +++ b/next.config.js @@ -22,5 +22,14 @@ module.exports = withBundleAnalyzer( /** don't try to optimize fonts */ optimizeFonts: false, + images: { + remotePatterns: [ + { + protocol: 'https', + hostname: '*.vault48.org', + pathname: '/**', + }, + ], + }, }) ); diff --git a/src/components/flow/FlowCell/index.tsx b/src/components/flow/FlowCell/index.tsx index db3c3f9c..cf0308fe 100644 --- a/src/components/flow/FlowCell/index.tsx +++ b/src/components/flow/FlowCell/index.tsx @@ -119,7 +119,6 @@ const FlowCell: FC = ({ {image && ( diff --git a/src/components/flow/FlowCellImage/index.tsx b/src/components/flow/FlowCellImage/index.tsx index e05bfc48..3d49b4f4 100644 --- a/src/components/flow/FlowCellImage/index.tsx +++ b/src/components/flow/FlowCellImage/index.tsx @@ -1,6 +1,7 @@ import React, { FC } from 'react'; import classNames from 'classnames'; +import Image from 'next/image'; import { IMGProps } from '~/utils/types'; @@ -10,9 +11,15 @@ interface Props extends IMGProps { height?: number; } -const FlowCellImage: FC = ({ className, children, ...rest }) => ( +const FlowCellImage: FC = ({ + className, + children, + src, + alt, + ...rest +}) => (
- + {alt} {children}
); diff --git a/src/components/flow/FlowCellImage/styles.module.scss b/src/components/flow/FlowCellImage/styles.module.scss index 442206b1..0bbdbccc 100644 --- a/src/components/flow/FlowCellImage/styles.module.scss +++ b/src/components/flow/FlowCellImage/styles.module.scss @@ -2,14 +2,4 @@ width: 100%; height: 100%; position: relative; - - img { - position: absolute; - top: 50%; - left: 50%; - width: 100%; - height: 100%; - transform: translate(-50%, -50%); - object-fit: cover; - } }