diff --git a/src/components/common/SkeletonCommon/SkeletonImage/SkeletonImage.module.scss b/src/components/common/SkeletonCommon/SkeletonImage/SkeletonImage.module.scss index 57fdf3ebc..d9607adec 100644 --- a/src/components/common/SkeletonCommon/SkeletonImage/SkeletonImage.module.scss +++ b/src/components/common/SkeletonCommon/SkeletonImage/SkeletonImage.module.scss @@ -1,6 +1,6 @@ @import '../../../../styles/utilities'; -.skeletonImage:empty { +.skeletonImage { @apply relative; background: #DDDBDD; diff --git a/src/components/common/SkeletonCommon/SkeletonImage/SkeletonImage.tsx b/src/components/common/SkeletonCommon/SkeletonImage/SkeletonImage.tsx index 7ab20b037..e2c7c5e0f 100644 --- a/src/components/common/SkeletonCommon/SkeletonImage/SkeletonImage.tsx +++ b/src/components/common/SkeletonCommon/SkeletonImage/SkeletonImage.tsx @@ -5,16 +5,14 @@ import s from './SkeletonImage.module.scss' interface SkeletonImageProps { align?: "left" | "center" size?: "small" | "default" | "large" - children?: React.ReactNode } -const SkeletonImage = ({ align="center", size="default", children }: SkeletonImageProps) => { +const SkeletonImage = ({ align="center", size="default" }: SkeletonImageProps) => { return (
- {children}
) } diff --git a/src/components/common/SkeletonCommon/SkeletonParagraph/SkeletonParagraph.module.scss b/src/components/common/SkeletonCommon/SkeletonParagraph/SkeletonParagraph.module.scss index 2c98d00e5..1ebd6e413 100644 --- a/src/components/common/SkeletonCommon/SkeletonParagraph/SkeletonParagraph.module.scss +++ b/src/components/common/SkeletonCommon/SkeletonParagraph/SkeletonParagraph.module.scss @@ -1,6 +1,8 @@ @import '../../../../styles/utilities'; -.skeletonParagraph { +.skeletonParagraph { + margin: 0 1.6rem; + .row { display: inline-block; height: 2rem; diff --git a/src/components/common/SkeletonCommon/SkeletonParagraph/SkeletonParagraph.tsx b/src/components/common/SkeletonCommon/SkeletonParagraph/SkeletonParagraph.tsx index 4baa35a52..eadcff724 100644 --- a/src/components/common/SkeletonCommon/SkeletonParagraph/SkeletonParagraph.tsx +++ b/src/components/common/SkeletonCommon/SkeletonParagraph/SkeletonParagraph.tsx @@ -1,23 +1,15 @@ -import React, { useEffect, useState } from "react"; +import React from "react"; import s from './SkeletonParagraph.module.scss' interface SkeletonParagraphProps { rows?: number // number of rows in paragraph - children?: React.ReactNode } -const SkeletonParagraph = ({ rows=2, children }: SkeletonParagraphProps) => { - - const [isChildLoaded, setIsChildLoaded] = useState(false) - - useEffect(() => { - setIsChildLoaded(true); - }, []) - +const SkeletonParagraph = ({ rows=2 }: SkeletonParagraphProps) => { return (
{ - isChildLoaded ? children : [...Array(rows)].map((e, i) => { + [...Array(rows)].map((e, i) => { if (i === rows-1) { return
}