✨ add console-opening button on bottom bar

Author: ghalestrilo

client/common/icons.jsx

@@ -12,6 +12,8 @@ import Exit from '../images/exit.svg';
 import DropdownArrow from '../images/down-filled-triangle.svg';
 import Preferences from '../images/preferences.svg';
 import Play from '../images/triangle-arrow-right.svg';
+import Code from '../images/code.svg';
+
 
 // HOC that adds the right web accessibility props
 // https://www.scottohara.me/blog/2019/05/22/contextual-images-svgs-and-a11y.html
@@ -74,3 +76,4 @@ export const ExitIcon = withLabel(Exit);
 export const DropdownArrowIcon = withLabel(DropdownArrow);
 export const PreferencesIcon = withLabel(Preferences);
 export const PlayIcon = withLabel(Play);
+export const CodeIcon = withLabel(Code);

client/components/mobile/ActionStrip.jsx

@@ -4,25 +4,25 @@ import { bindActionCreators } from 'redux';
 import { useDispatch } from 'react-redux';
 import { prop, remSize } from '../../theme';
 import IconButton from './IconButton';
-import { ExitIcon } from '../../common/icons';
+import { CodeIcon } from '../../common/icons';
 import * as IDEActions from '../../modules/IDE/actions/ide';
 
 const background = prop('MobilePanel.default.background');
 const textColor = prop('primaryTextColor');
 
 const BottomBarContent = styled.h2`
-  padding: ${remSize(12)};
+  padding: ${remSize(8)};
   
   svg {
     max-height: ${remSize(32)};
-    padding: ${remSize(4)}
+    /* padding: ${remSize(4)} */
   }
 `;
 
 export default () => {
   const { expandConsole } = bindActionCreators(IDEActions, useDispatch());
 
-  const actions = [{ icon: ExitIcon, aria: 'Say Something', action: expandConsole }];
+  const actions = [{ icon: CodeIcon, aria: 'Say Something', action: expandConsole }];
 
   return (
     <BottomBarContent>