add loding style

This commit is contained in:
DiamondThree
2022-08-04 19:01:04 +08:00
parent 9708f0dc0d
commit fc1377bcfb

View File

@@ -135,10 +135,27 @@ const LazyIframe = ({
>
<iframe src={src} onLoad={onLoad} />
</div>
{show ? '' : fallback}
</>
);
};
const Loading = styled('div')(() => {
return {
width: '100%',
height: '100%',
display: 'flex',
lineHeight: '100%',
alignItems: 'center',
justifyContent: 'center',
border: '1px solid #EAEEF2',
};
});
const LoadingContiner = () => {
return <Loading>loading...</Loading>;
};
export const SourceView: FC<Props> = props => {
const { link, isSelected, block, editorElement } = props;
const src = formatUrl(link);
@@ -151,7 +168,10 @@ export const SourceView: FC<Props> = props => {
<SourceViewContainer isSelected={isSelected} scene={type}>
<MouseMaskContainer />
<LazyIframe src={src} fallback={'Loading……'}></LazyIframe>
<LazyIframe
src={src}
fallback={LoadingContiner()}
></LazyIframe>
</SourceViewContainer>
</div>
);