Added ability to print a document

app/components/Actions/Actions.js

@@ -29,6 +29,10 @@ const Actions = styled(Flex)`
   border-radius: 3px;
   background: rgba(255, 255, 255, 0.9);
   -webkit-backdrop-filter: blur(20px);
+
+  @media print {
+    display: none;
+  }
 `;
 
 export default Actions;

app/components/Editor/Editor.js

@@ -238,6 +238,10 @@ const Header = styled(Flex)`
   flex-shrink: 0;
   align-items: flex-end;
   ${({ readOnly }) => !readOnly && 'cursor: text;'};
+
+  @media print {
+    display: none;
+  }
 `;
 
 const StyledEditor = styled(Editor)`

app/components/Editor/components/Contents.js

@@ -92,6 +92,10 @@ const Wrapper = styled.div`
   right: 0;
   top: 150px;
   z-index: 100;
+
+  @media print {
+    display: none;
+  }
 `;
 
 const Anchor = styled.a`

app/components/Layout/Layout.js

@@ -124,6 +124,10 @@ const Container = styled(Flex)`
 const Content = styled(Flex)`
   margin-left: ${props => (props.editMode ? 0 : layout.sidebarWidth)};
   transition: margin-left 200ms ease-in-out;
+
+  @media print {
+    margin-left: 0;
+  }
 `;
 
 export default withRouter(inject('user', 'auth', 'ui', 'documents')(Layout));

app/components/Sidebar/Sidebar.js

@@ -106,6 +106,11 @@ const Container = styled(Flex)`
   width: ${layout.sidebarWidth};
   background: ${color.smoke};
   transition: left 200ms ease-in-out;
+
+  @media print {
+    display: none;
+    left: 0;
+  }
 `;
 
 const Section = styled(Flex)`

app/menus/DocumentMenu.js

@@ -67,6 +67,7 @@ class DocumentMenu extends Component {
         <DropdownMenuItem onClick={this.handleExport}>
           Download
         </DropdownMenuItem>
+        <DropdownMenuItem onClick={window.print}>Print</DropdownMenuItem>
         <DropdownMenuItem onClick={this.handleMove}>Move…</DropdownMenuItem>
         {allowDelete && (
           <DropdownMenuItem onClick={this.handleDelete}>