From d3c3d4b0480bd697be9705709ed4b21d0f2fcb75 Mon Sep 17 00:00:00 2001
From: Bill <billsonnn@live.com>
Date: Wed, 16 Feb 2022 11:55:37 -0500
Subject: [PATCH] Fix avatar spotlight

---
 src/components/avatar-editor/AvatarEditorView.scss            | 4 +++-
 src/components/avatar-editor/AvatarEditorView.tsx             | 2 +-
 .../views/figure-preview/AvatarEditorFigurePreviewView.tsx    | 2 +-
 3 files changed, 5 insertions(+), 3 deletions(-)

diff --git a/src/components/avatar-editor/AvatarEditorView.scss b/src/components/avatar-editor/AvatarEditorView.scss
index 493cda3d..71ae6a9b 100644
--- a/src/components/avatar-editor/AvatarEditorView.scss
+++ b/src/components/avatar-editor/AvatarEditorView.scss
@@ -251,9 +251,11 @@
             z-index: 4;
         }
 
-        .spotlight {
+        .avatar-spotlight {
             position: absolute;
             top: -10px;
+            left: 0;
+            right: 0;
             margin: 0 auto;
             opacity: 0.3;
             pointer-events: none;
diff --git a/src/components/avatar-editor/AvatarEditorView.tsx b/src/components/avatar-editor/AvatarEditorView.tsx
index 829ff05d..a0cb113e 100644
--- a/src/components/avatar-editor/AvatarEditorView.tsx
+++ b/src/components/avatar-editor/AvatarEditorView.tsx
@@ -293,7 +293,7 @@ export const AvatarEditorView: FC<{}> = props =>
                     </Column>
                     <Column size={ 3 } overflow="hidden">
                         <AvatarEditorFigurePreviewView figureData={ figureData } />
-                        <Column grow gap={ 2 }>
+                        <Column grow gap={ 1 }>
                             <ButtonGroup>
                                 <Button variant="secondary" size="sm" onClick={ event => processAction(AvatarEditorAction.ACTION_RESET) }>
                                     <FontAwesomeIcon icon="undo" />
diff --git a/src/components/avatar-editor/views/figure-preview/AvatarEditorFigurePreviewView.tsx b/src/components/avatar-editor/views/figure-preview/AvatarEditorFigurePreviewView.tsx
index bc57b52b..fcf1fe4e 100644
--- a/src/components/avatar-editor/views/figure-preview/AvatarEditorFigurePreviewView.tsx
+++ b/src/components/avatar-editor/views/figure-preview/AvatarEditorFigurePreviewView.tsx
@@ -51,7 +51,7 @@ export const AvatarEditorFigurePreviewView: FC<AvatarEditorFigurePreviewViewProp
     return (
         <Column className="figure-preview-container" overflow="hidden" position="relative">
             <AvatarImageView figure={ figureData.getFigureString() } direction={ figureData.direction } scale={ 2 } />
-            <AvatarEditorIcon icon="spotlight" />
+            <AvatarEditorIcon className="avatar-spotlight" icon="spotlight" />
             <Base className="avatar-shadow" />
             <Base className="arrow-container">
                 <AvatarEditorIcon pointer icon="arrow-left" onClick={ event => rotateFigure(figureData.direction + 1) } />