diff --git a/editors/editoria/src/layout/EditoriaLayout.js b/editors/editoria/src/layout/EditoriaLayout.js
index 272c38f706156bfed191cebdd6f1dc6df17cc1e4..05cb128f3e672feefbe305865aab9763e7428ef8 100644
--- a/editors/editoria/src/layout/EditoriaLayout.js
+++ b/editors/editoria/src/layout/EditoriaLayout.js
@@ -160,19 +160,15 @@ const NotesContainer = styled.div`
   height: 100%;
   width: 65%;
 `;
-const WaxBottomRightInfo= styled.div`
-
-`;
-const InfoContainer= styled.div`
-display:flex;
-position:fixed !important;
-bottom:1px;
-right:21px;
-z-index:1;
-`;
-const InfoArea=styled.div`
-
+const WaxBottomRightInfo = styled.div``;
+const InfoContainer = styled.div`
+  display: flex;
+  position: fixed !important;
+  bottom: 1px;
+  right: 21px;
+  z-index: 1;
 `;
+const InfoArea = styled.div``;
 let surfaceHeight = 600;
 let notesHeight = 200;
 
@@ -196,12 +192,29 @@ const NotesArea = ComponentPlugin('notesArea');
 const RightArea = ComponentPlugin('rightArea');
 const CommentTrackToolBar = ComponentPlugin('commentTrackToolBar');
 const WaxOverlays = ComponentPlugin('waxOverlays');
-const BottomRightInfo=ComponentPlugin('BottomRightInfo');
+const BottomRightInfo = ComponentPlugin('BottomRightInfo');
 const EditoriaLayout = ({ editor }) => {
   const {
     view: { main },
+    options,
   } = useContext(WaxContext);
 
+  let fullScreenStyles = {};
+
+  if (options.fullScreen) {
+    fullScreenStyles = {
+      backgroundColor: '#fff',
+      height: '100%',
+      left: '0',
+      margin: '0',
+      padding: '0',
+      position: 'fixed',
+      top: '0',
+      width: '100%',
+      zIndex: '99999',
+    };
+  }
+
   const notes = main && getNotes(main);
   const areNotes = notes && !!notes.length && notes.length > 0;
 
@@ -220,14 +233,7 @@ const EditoriaLayout = ({ editor }) => {
 
   return (
     <ThemeProvider theme={cokoTheme}>
-      <Wrapper>
-        
-        <WaxBottomRightInfo>
-          <InfoContainer id="info-container">
-            <BottomRightInfo/>
-          </InfoContainer>            
-         </WaxBottomRightInfo>
-
+      <Wrapper style={fullScreenStyles}>
         <TopMenu>
           <MainMenuToolBar />
         </TopMenu>
@@ -273,6 +279,11 @@ const EditoriaLayout = ({ editor }) => {
           </EditorArea>
         </Main>
         <WaxOverlays />
+        <WaxBottomRightInfo>
+          <InfoContainer id="info-container">
+            <BottomRightInfo />
+          </InfoContainer>
+        </WaxBottomRightInfo>
       </Wrapper>
     </ThemeProvider>
   );
diff --git a/wax-prosemirror-components/src/components/FullScreen.js b/wax-prosemirror-components/src/components/FullScreen.js
index 94c1415914b323157858a0e26ecdfdfad471a6fa..e5af708eb16fe398e28a49cc00c3f883e2f914c0 100644
--- a/wax-prosemirror-components/src/components/FullScreen.js
+++ b/wax-prosemirror-components/src/components/FullScreen.js
@@ -1,27 +1,32 @@
 /* eslint react/prop-types: 0 */
 
 import React, { useContext, useMemo } from 'react';
+import { TextSelection } from 'prosemirror-state';
 import { WaxContext } from 'wax-prosemirror-core';
 import MenuButton from '../ui/buttons/MenuButton';
 
 const Button = ({ view = {}, item }) => {
-  const { active, icon, label, onlyOnMain, run, select, title } = item;
+  const { active, icon, label, select, title } = item;
+  const context = useContext(WaxContext);
 
-  const {
-    view: { main },
-    activeViewId,
-    activeView,
-  } = useContext(WaxContext);
+  const { activeViewId, activeView, options } = context;
 
-  if (onlyOnMain) view = main;
-
-  const { dispatch, state } = view;
+  const { state } = view;
 
   const handleMouseDown = (e, editorState, editorDispatch) => {
     e.preventDefault();
-    run(editorState, dispatch);
+    options.fullScreen = !options.fullScreen;
+    const { selection } = state;
+    activeView.dispatch(
+      activeView.state.tr.setSelection(
+        new TextSelection(
+          activeView.state.tr.doc.resolve(selection.from, selection.to),
+        ),
+      ),
+    );
   };
 
+  const usedIcon = options.fullScreen ? 'fullScreenExit' : icon;
   const isActive = active(state, activeViewId) && select(state, activeViewId);
 
   const isDisabled = !select(state, activeViewId, activeView);
@@ -31,13 +36,13 @@ const Button = ({ view = {}, item }) => {
       <MenuButton
         active={false}
         disabled={false}
-        iconName={icon}
+        iconName={usedIcon}
         label={label}
         onMouseDown={e => handleMouseDown(e, view.state, view.dispatch)}
         title={title}
       />
     ),
-    [isActive, isDisabled],
+    [isActive, isDisabled, usedIcon],
   );
 
   return MenuButtonComponent;
diff --git a/wax-prosemirror-core/src/WaxContext.js b/wax-prosemirror-core/src/WaxContext.js
index 6889bc6a0ddb607d883aba7966ae85121b4262b1..bbfe41a5389e982713f8d1b58c507641882059dc 100644
--- a/wax-prosemirror-core/src/WaxContext.js
+++ b/wax-prosemirror-core/src/WaxContext.js
@@ -18,6 +18,10 @@ export default props => {
     view: props.view || {},
     activeView: props.activeView || {},
     activeViewId: props.activeViewId || {},
+    options: { fullScreen: false },
+    setOption: option => {
+      Object.assign(context.options, option);
+    },
     removeView: deletedView => {
       delete context.view[deletedView];
     },