From df70628427c051e8510210b32a864fb39171f67e Mon Sep 17 00:00:00 2001
From: Albin Henriksson <albhe428@student.liu.se>
Date: Mon, 17 May 2021 18:26:09 +0200
Subject: [PATCH] Improve styling of quit button
---
client/src/pages/views/OperatorViewPage.tsx | 4 ++--
client/src/pages/views/styled.tsx | 7 ++-----
2 files changed, 4 insertions(+), 7 deletions(-)
diff --git a/client/src/pages/views/OperatorViewPage.tsx b/client/src/pages/views/OperatorViewPage.tsx
index 488d2ee9..dff030a5 100644
--- a/client/src/pages/views/OperatorViewPage.tsx
+++ b/client/src/pages/views/OperatorViewPage.tsx
@@ -16,9 +16,9 @@ import {
Typography,
} from '@material-ui/core'
import AssignmentIcon from '@material-ui/icons/Assignment'
-import BackspaceIcon from '@material-ui/icons/Backspace'
import ChevronLeftIcon from '@material-ui/icons/ChevronLeft'
import ChevronRightIcon from '@material-ui/icons/ChevronRight'
+import CloseIcon from '@material-ui/icons/Close'
import FileCopyIcon from '@material-ui/icons/FileCopy'
import LinkIcon from '@material-ui/icons/Link'
import SupervisorAccountIcon from '@material-ui/icons/SupervisorAccount'
@@ -249,7 +249,7 @@ const OperatorViewPage: React.FC = () => {
<OperatorHeader color="primary" position="fixed">
<Tooltip title="Avsluta tävling" arrow>
<OperatorQuitButton onClick={handleVerifyExit} variant="contained" color="secondary">
- <BackspaceIcon fontSize="small" />
+ <CloseIcon fontSize="large" />
</OperatorQuitButton>
</Tooltip>
diff --git a/client/src/pages/views/styled.tsx b/client/src/pages/views/styled.tsx
index d02f3f9b..47b9f683 100644
--- a/client/src/pages/views/styled.tsx
+++ b/client/src/pages/views/styled.tsx
@@ -57,11 +57,8 @@ export const OperatorFooter = styled(AppBar)`
`
export const OperatorQuitButton = styled(Button)`
- min-width: 48px;
- min-height: 48px;
- padding-top: 16px;
- padding-bottom: 16px;
- margin-left: 8px;
+ height: 100%;
+ padding: 0;
`
export const OperatorButton = styled(Button)`
--
GitLab