From be7d12ed1dda1c18b67416d720486a37f2e07f64 Mon Sep 17 00:00:00 2001
From: Josue <josue.quilon-barrios@senecacollege.ca>
Date: Fri, 27 Aug 2021 15:52:26 -0400
Subject: [PATCH] style(front-end): fix issue with preview placeholder fitting
 the container

---
 striker-ui/components/Display/Preview.tsx | 11 ++++++-----
 1 file changed, 6 insertions(+), 5 deletions(-)

diff --git a/striker-ui/components/Display/Preview.tsx b/striker-ui/components/Display/Preview.tsx
index 00a79213..3326e1e2 100644
--- a/striker-ui/components/Display/Preview.tsx
+++ b/striker-ui/components/Display/Preview.tsx
@@ -3,7 +3,7 @@ import { Box } from '@material-ui/core';
 import { makeStyles } from '@material-ui/core/styles';
 import IconButton from '@material-ui/core/IconButton';
 import DesktopWindowsIcon from '@material-ui/icons/DesktopWindows';
-import CropOriginal from '@material-ui/icons/Image';
+import PowerOffOutlinedIcon from '@material-ui/icons/PowerOffOutlined';
 import { Panel } from '../Panels';
 import { BLACK, GREY, TEXT } from '../../lib/consts/DEFAULT_THEME';
 import { HeaderText } from '../Text';
@@ -35,11 +35,12 @@ const useStyles = makeStyles(() => ({
     padding: 0,
     color: TEXT,
   },
-  imageIcon: {
+  powerOffIcon: {
     borderRadius: 8,
     padding: 0,
-    backgroundColor: GREY,
-    fontSize: '8em',
+    color: GREY,
+    width: '100%',
+    height: '100%',
   },
   previewImage: {
     width: '100%',
@@ -85,7 +86,7 @@ const Preview = ({ setMode, uuid, serverName }: PreviewProps): JSX.Element => {
             onClick={() => setMode(false)}
           >
             {!preview ? (
-              <CropOriginal className={classes.imageIcon} />
+              <PowerOffOutlinedIcon className={classes.powerOffIcon} />
             ) : (
               <img
                 alt=""