From 1e17c1967b92ec68f03d0497f3bec9d08f0ea444 Mon Sep 17 00:00:00 2001
From: David Luzar <luzar.david@gmail.com>
Date: Thu, 4 Feb 2021 16:52:16 +0100
Subject: [PATCH] fix: toolbar unnecessarily eats too much width (#2924)

---
 src/components/MobileMenu.tsx | 4 ++--
 src/css/styles.scss           | 2 ++
 2 files changed, 4 insertions(+), 2 deletions(-)

diff --git a/src/components/MobileMenu.tsx b/src/components/MobileMenu.tsx
index 16f1c5a5..fafdaa4c 100644
--- a/src/components/MobileMenu.tsx
+++ b/src/components/MobileMenu.tsx
@@ -46,7 +46,7 @@ export const MobileMenu = ({
   renderCustomFooter,
   viewModeEnabled,
 }: MobileMenuProps) => {
-  const renderFixedSideContainer = () => {
+  const renderToolbar = () => {
     return (
       <FixedSideContainer side="top" className="App-top-bar">
         <Section heading="shapes">
@@ -136,7 +136,7 @@ export const MobileMenu = ({
   };
   return (
     <>
-      {!viewModeEnabled && renderFixedSideContainer()}
+      {!viewModeEnabled && renderToolbar()}
       <div
         className="App-bottom-bar"
         style={{
diff --git a/src/css/styles.scss b/src/css/styles.scss
index 04d9a7c9..c32a2366 100644
--- a/src/css/styles.scss
+++ b/src/css/styles.scss
@@ -226,6 +226,8 @@
 
   .App-top-bar {
     z-index: var(--zIndex-layerUI);
+    display: flex;
+    justify-content: center;
   }
 
   .App-bottom-bar {