diff --git a/src/components/comment/CommentForm/index.tsx b/src/components/comment/CommentForm/index.tsx index b8dc9d5c..6de3219f 100644 --- a/src/components/comment/CommentForm/index.tsx +++ b/src/components/comment/CommentForm/index.tsx @@ -92,8 +92,6 @@ const CommentForm: FC = observer(({ comment, nodeId, saveComment, onCanc
- {isLoading && } - {isEditing && ( diff --git a/src/components/input/Button/index.tsx b/src/components/input/Button/index.tsx index 6c29f43a..ed7a8f5e 100644 --- a/src/components/input/Button/index.tsx +++ b/src/components/input/Button/index.tsx @@ -68,15 +68,25 @@ const Button: FC = memo( ] ); + const loaderSize = useMemo(() => { + if (['small', 'micro', 'mini'].includes(size)) { + return 16; + } + + return 24; + }, []); + return ( ); diff --git a/src/components/input/Button/styles.module.scss b/src/components/input/Button/styles.module.scss index 6ed0268b..9ccb0db7 100644 --- a/src/components/input/Button/styles.module.scss +++ b/src/components/input/Button/styles.module.scss @@ -48,7 +48,7 @@ opacity: 0; } - svg { + svg.icon { fill: white; stroke: white; } @@ -174,7 +174,7 @@ .small { height: 32px; - svg { + svg.icon { width: 24px; height: 24px; } diff --git a/src/components/input/LoaderCircle/index.tsx b/src/components/input/LoaderCircle/index.tsx index 29a5c2ed..dc5c7568 100644 --- a/src/components/input/LoaderCircle/index.tsx +++ b/src/components/input/LoaderCircle/index.tsx @@ -12,8 +12,8 @@ interface IProps extends SVGProps { className?: string; } -export const LoaderCircle: FC = ({ size = 24, ...rest }) => ( -
- +export const LoaderCircle: FC = ({ size = 24, className }) => ( +
+
); diff --git a/src/components/input/LoaderCircle/styles.module.scss b/src/components/input/LoaderCircle/styles.module.scss index 8f782f6d..18986d3f 100644 --- a/src/components/input/LoaderCircle/styles.module.scss +++ b/src/components/input/LoaderCircle/styles.module.scss @@ -21,6 +21,9 @@ } .wrap { - //animation: spin infinite 1s linear; + animation: spin infinite 0.75s linear; display: inline-flex; + transform-origin: 50% 50%; + align-items: center; + justify-content: center; } diff --git a/src/components/input/LoaderCircleInner/styles.module.scss b/src/components/input/LoaderCircleInner/styles.module.scss index c780abc4..8de5c814 100644 --- a/src/components/input/LoaderCircleInner/styles.module.scss +++ b/src/components/input/LoaderCircleInner/styles.module.scss @@ -1,16 +1,6 @@ @import "src/styles/variables"; -@keyframes spin { - 0% { - transform: rotate(0); - } - 100% { - transform: rotate(360deg); - } -} - .icon { fill: currentColor; stroke: none; - animation: spin 0.75s infinite linear; }