diff --git a/apps/spreadsheeteditor/mobile/src/view/edit/EditCell.jsx b/apps/spreadsheeteditor/mobile/src/view/edit/EditCell.jsx
index 905135484..e66e49045 100644
--- a/apps/spreadsheeteditor/mobile/src/view/edit/EditCell.jsx
+++ b/apps/spreadsheeteditor/mobile/src/view/edit/EditCell.jsx
@@ -146,7 +146,13 @@ const PageFontsCell = props => {
 
     return (
         <Page>
-            <Navbar title={_t.textFonts} backLink={_t.textBack} />
+            <Navbar title={_t.textFonts} backLink={_t.textBack}>
+                {Device.phone &&
+                    <NavRight>
+                        <Link icon='icon-expand-down' sheetClose></Link>
+                    </NavRight>
+                }
+            </Navbar>
             <List>
                 <ListItem title={_t.textSize}>
                     {!isAndroid && <div slot='after-start'>{displaySize}</div>}
@@ -218,9 +224,11 @@ const PageTextColorCell = props => {
     return (
         <Page>
             <Navbar title={_t.textTextColor} backLink={_t.textBack}>
-                <NavRight>
-                    <Link icon='icon-expand-down' sheetClose></Link>
-                </NavRight>
+                {Device.phone &&
+                    <NavRight>
+                        <Link icon='icon-expand-down' sheetClose></Link>
+                    </NavRight>
+                }
             </Navbar>
             <ThemeColorPalette changeColor={changeColor} curColor={fontColor} customColors={customColors} />
             <List>
@@ -265,9 +273,11 @@ const PageFillColorCell = props => {
     return (
         <Page>
             <Navbar title={_t.textFillColor} backLink={_t.textBack}>
-                <NavRight>
-                    <Link icon='icon-expand-down' sheetClose></Link>
-                </NavRight>
+                {Device.phone &&
+                    <NavRight>
+                        <Link icon='icon-expand-down' sheetClose></Link>
+                    </NavRight>
+                }
             </Navbar>
             <ThemeColorPalette changeColor={changeColor} curColor={fillColor} customColors={customColors} transparent={true} />
             <List>
@@ -298,7 +308,13 @@ const PageCustomTextColorCell = props => {
 
     return (
         <Page>
-            <Navbar title={_t.textCustomColor} backLink={_t.textBack} />
+            <Navbar title={_t.textCustomColor} backLink={_t.textBack}>
+                {Device.phone &&
+                    <NavRight>
+                        <Link icon='icon-expand-down' sheetClose></Link>
+                    </NavRight>
+                }
+            </Navbar>
             <CustomColorPicker currentColor={fontColor} onAddNewColor={onAddNewColor} />
         </Page>
     )
@@ -323,7 +339,13 @@ const PageCustomFillColorCell = props => {
 
     return (
         <Page>
-            <Navbar title={_t.textCustomColor} backLink={_t.textBack} />
+            <Navbar title={_t.textCustomColor} backLink={_t.textBack}>
+                {Device.phone &&
+                    <NavRight>
+                        <Link icon='icon-expand-down' sheetClose></Link>
+                    </NavRight>
+                }
+            </Navbar>
             <CustomColorPicker currentColor={fillColor} onAddNewColor={onAddNewColor} />
         </Page>
     )
@@ -346,7 +368,13 @@ const PageTextFormatCell = props => {
 
     return (
         <Page>
-            <Navbar title={_t.textTextFormat} backLink={_t.textBack} />
+            <Navbar title={_t.textTextFormat} backLink={_t.textBack}>
+                {Device.phone &&
+                    <NavRight>
+                        <Link icon='icon-expand-down' sheetClose></Link>
+                    </NavRight>
+                }
+            </Navbar>
             <List>
                 <ListItem title={_t.textAlignLeft} radio checked={hAlignStr === 'left'} onChange={() => {
                     props.onHAlignChange('left');
@@ -419,7 +447,13 @@ const PageTextOrientationCell = props => {
    
     return (
         <Page>
-            <Navbar title={_t.textTextOrientation} backLink={_t.textBack} />
+            <Navbar title={_t.textTextOrientation} backLink={_t.textBack}>
+                {Device.phone &&
+                    <NavRight>
+                        <Link icon='icon-expand-down' sheetClose></Link>
+                    </NavRight>
+                }
+            </Navbar>
             <List>
                 <ListItem title={_t.textHorizontalText} radio checked={orientationStr === 'horizontal'}
                     after={isAndroid ? <Icon slot="media" icon="icon-text-orientation-horizontal"></Icon> : null} onChange={() => {
@@ -494,7 +528,13 @@ const PageBorderStyleCell = props => {
 
     return (
         <Page>
-            <Navbar title={_t.textBorderStyle} backLink={_t.textBack} />
+            <Navbar title={_t.textBorderStyle} backLink={_t.textBack}>
+                {Device.phone &&
+                    <NavRight>
+                        <Link icon='icon-expand-down' sheetClose></Link>
+                    </NavRight>
+                }
+            </Navbar>
             <List>
                 <ListItem link='#' className='no-indicator' title={_t.textNoBorder} onClick={() => {
                     storeCellSettings.changeBorderStyle('none');
@@ -616,9 +656,11 @@ const PageBorderColorCell = props => {
     return (
         <Page>
             <Navbar backLink={_t.textBack}>
-                <NavRight>
-                    <Link icon='icon-expand-down' sheetClose></Link>
-                </NavRight>
+                {Device.phone &&
+                    <NavRight>
+                        <Link icon='icon-expand-down' sheetClose></Link>
+                    </NavRight>
+                }
             </Navbar>
             <ThemeColorPalette changeColor={changeColor} curColor={borderColor} customColors={customColors} />
             <List>
@@ -653,7 +695,13 @@ const PageCustomBorderColorCell = props => {
 
     return (
         <Page>
-            <Navbar title={_t.textCustomColor} backLink={_t.textBack} />
+            <Navbar title={_t.textCustomColor} backLink={_t.textBack}>
+                {Device.phone &&
+                    <NavRight>
+                        <Link icon='icon-expand-down' sheetClose></Link>
+                    </NavRight>
+                }
+            </Navbar>
             <CustomColorPicker currentColor={borderColor} onAddNewColor={onAddNewColor} />
         </Page>
     )
@@ -674,7 +722,13 @@ const PageBorderSizeCell = props => {
 
     return (
         <Page>
-            <Navbar title={_t.textSize} backLink={_t.textBack} />
+            <Navbar title={_t.textSize} backLink={_t.textBack}>
+                {Device.phone &&
+                    <NavRight>
+                        <Link icon='icon-expand-down' sheetClose></Link>
+                    </NavRight>
+                }
+            </Navbar>
             <List>
                 {Object.keys(borderSizes).map(key => {
                     return (
@@ -695,7 +749,13 @@ const PageFormatCell = props => {
 
     return (
         <Page>
-            <Navbar title={_t.textFormat} backLink={_t.textBack} />
+            <Navbar title={_t.textFormat} backLink={_t.textBack}>
+                {Device.phone &&
+                    <NavRight>
+                        <Link icon='icon-expand-down' sheetClose></Link>
+                    </NavRight>
+                }
+            </Navbar>
             <List>
                 <ListItem link='#' className='no-indicator' title={_t.textGeneral} onClick={() => props.onCellFormat('R2VuZXJhbA==')}>
                     <Icon slot="media" icon="icon-format-general"></Icon>
@@ -746,7 +806,13 @@ const PageAccountingFormatCell = props => {
 
     return (
         <Page>
-            <Navbar title={_t.textAccounting} backLink={_t.textBack} />
+            <Navbar title={_t.textAccounting} backLink={_t.textBack}>
+                {Device.phone &&
+                    <NavRight>
+                        <Link icon='icon-expand-down' sheetClose></Link>
+                    </NavRight>
+                }
+            </Navbar>
             <List>
                 <ListItem link='#' className='no-indicator' title={_t.textDollar} after='$'
                     onClick={() => props.onCellFormat('XyglMjQqJTIwJTIzJTJDJTIzJTIzMC4wMF8pJTNCXyglMjQqJTIwKCUyMyUyQyUyMyUyMzAuMDApJTNCXyglMjQqJTIwJTIyLSUyMiUzRiUzRl8pJTNCXyglNDBfKQ==')}>
@@ -774,7 +840,13 @@ const PageCurrencyFormatCell = props => {
 
     return (
         <Page>
-            <Navbar title={_t.textAccounting} backLink={_t.textBack} />
+            <Navbar title={_t.textAccounting} backLink={_t.textBack}>
+                {Device.phone &&
+                    <NavRight>
+                        <Link icon='icon-expand-down' sheetClose></Link>
+                    </NavRight>
+                }
+            </Navbar>
             <List>
                 <ListItem link='#' className='no-indicator' title={_t.textDollar} after='$'
                     onClick={() => props.onCellFormat('JTI0JTIzJTJDJTIzJTIzMC4wMA==')}>
@@ -802,7 +874,13 @@ const PageDateFormatCell = props => {
 
     return (
         <Page>
-            <Navbar title={_t.textDate} backLink={_t.textBack} />
+            <Navbar title={_t.textDate} backLink={_t.textBack}>
+                {Device.phone &&
+                    <NavRight>
+                        <Link icon='icon-expand-down' sheetClose></Link>
+                    </NavRight>
+                }
+            </Navbar>
             <List>
                 <ListItem link='#' className='no-indicator' title='07-24-88' after='MM-dd-yy'
                     onClick={() => props.onCellFormat('TU0tZGQteXk=')}></ListItem>
@@ -835,7 +913,13 @@ const PageTimeFormatCell = props => {
 
     return (
         <Page>
-            <Navbar title={_t.textTime} backLink={_t.textBack} />
+            <Navbar title={_t.textTime} backLink={_t.textBack}>
+                {Device.phone &&
+                    <NavRight>
+                        <Link icon='icon-expand-down' sheetClose></Link>
+                    </NavRight>
+                }
+            </Navbar>
             <List>
                 <ListItem link='#' className='no-indicator' title='10:56' after='HH:mm'
                     onClick={() => props.onCellFormat('aCUzQW1tJTNCJTQw')}>
diff --git a/apps/spreadsheeteditor/mobile/src/view/edit/EditChart.jsx b/apps/spreadsheeteditor/mobile/src/view/edit/EditChart.jsx
index 011ad253d..4beba878c 100644
--- a/apps/spreadsheeteditor/mobile/src/view/edit/EditChart.jsx
+++ b/apps/spreadsheeteditor/mobile/src/view/edit/EditChart.jsx
@@ -1,6 +1,6 @@
 import React, {Fragment, useState, useEffect} from 'react';
 import {observer, inject} from "mobx-react";
-import {f7, List, ListItem, ListButton, ListInput, Icon, Row, Page, Navbar, BlockTitle, Toggle, Range, Link, Tabs, Tab, NavTitle, NavRight} from 'framework7-react';
+import {f7, List, ListItem, ListButton, ListInput, Icon, Page, Navbar, NavRight, BlockTitle, Toggle, Range, Link, Tabs, Tab} from 'framework7-react';
 import { useTranslation } from 'react-i18next';
 import {Device} from '../../../../../common/mobile/utils/device';
 import {CustomColorPicker, ThemeColorPalette} from "../../../../../common/mobile/lib/component/ThemeColorPalette.jsx";
@@ -23,7 +23,13 @@ const PageCustomFillColor = props => {
 
     return (
         <Page>
-            <Navbar title={_t.textCustomColor} backLink={_t.textBack} />
+            <Navbar title={_t.textCustomColor} backLink={_t.textBack}>
+                {Device.phone &&
+                    <NavRight>
+                        <Link icon='icon-expand-down' sheetClose></Link>
+                    </NavRight>
+                }
+            </Navbar>
             <CustomColorPicker currentColor={fillColor} onAddNewColor={onAddNewColor}/>
         </Page>
     )
@@ -83,7 +89,13 @@ const PageCustomBorderColor = props => {
 
     return (
         <Page>
-            <Navbar title={_t.textCustomColor} backLink={_t.textBack} />
+            <Navbar title={_t.textCustomColor} backLink={_t.textBack}>
+                {Device.phone &&
+                    <NavRight>
+                        <Link icon='icon-expand-down' sheetClose></Link>
+                    </NavRight>
+                }
+            </Navbar>
             <CustomColorPicker currentColor={borderColor} onAddNewColor={onAddNewColor}/>
         </Page>
     )
@@ -115,7 +127,13 @@ const PageBorderColor = props => {
 
     return (
         <Page>
-            <Navbar title={_t.textColor} backLink={_t.textBack} />
+            <Navbar title={_t.textColor} backLink={_t.textBack}>
+                {Device.phone &&
+                    <NavRight>
+                        <Link icon='icon-expand-down' sheetClose></Link>
+                    </NavRight>
+                }
+            </Navbar>
             <ThemeColorPalette changeColor={changeColor} curColor={borderColor} customColors={customColors} />
             <List>
                 <ListItem title={_t.textAddCustomColor} link={'/edit-chart-custom-border-color/'} routeProps={{
@@ -178,6 +196,11 @@ const PageStyle = props => {
                     <Link key={"sse-link-chart-fill"} tabLink={"#edit-chart-fill"}>{_t.textFill}</Link>
                     <Link key={"sse-link-chart-border"} tabLink={"#edit-chart-border"}>{_t.textBorder}</Link>
                 </div>
+                {Device.phone &&
+                    <NavRight>
+                        <Link icon='icon-expand-down' sheetClose></Link>
+                    </NavRight>
+                }
             </Navbar>
             <Tabs animated>
                 <Tab key={"sse-tab-chart-type"} id={"edit-chart-type"} className="page-content no-padding-top dataview" tabActive={true}>
@@ -262,7 +285,13 @@ const PageReorder = props => {
     }
     return (
         <Page>
-            <Navbar title={_t.textReorder} backLink={_t.textBack} />
+            <Navbar title={_t.textReorder} backLink={_t.textBack}>
+                {Device.phone &&
+                    <NavRight>
+                        <Link icon='icon-expand-down' sheetClose></Link>
+                    </NavRight>
+                }
+            </Navbar>
             <List>
                 <ListItem title={_t.textBringToForeground} onClick={() => {props.onReorder('all-up')}} link='#' className='no-indicator'>
                     <Icon slot="media" icon="icon-move-foreground"></Icon>
@@ -404,7 +433,13 @@ const PageLayout = props => {
 
     return (
         <Page>
-            <Navbar title={_t.textLayout} backLink={_t.textBack} />
+            <Navbar title={_t.textLayout} backLink={_t.textBack}>
+                {Device.phone &&
+                    <NavRight>
+                        <Link icon='icon-expand-down' sheetClose></Link>
+                    </NavRight>
+                }
+            </Navbar>
             <List>
                 <ListItem title={_t.textChartTitle} 
                     after={chartLayoutTitles[chartTitle]} link="/edit-chart-title/" routeProps={{
@@ -482,7 +517,13 @@ const PageChartTitle = props => {
 
     return (
         <Page>
-            <Navbar title={_t.textChartTitle} backLink={_t.textBack} />
+            <Navbar title={_t.textChartTitle} backLink={_t.textBack}>
+                {Device.phone &&
+                    <NavRight>
+                        <Link icon='icon-expand-down' sheetClose></Link>
+                    </NavRight>
+                }
+            </Navbar>
             <List>
                 {Object.keys(chartLayoutTitles).map(key => {
                     return (
@@ -507,7 +548,13 @@ const PageLegend = props => {
 
     return (
         <Page>
-            <Navbar title={_t.textLegend} backLink={_t.textBack} />
+            <Navbar title={_t.textLegend} backLink={_t.textBack}>
+                {Device.phone &&
+                    <NavRight>
+                        <Link icon='icon-expand-down' sheetClose></Link>
+                    </NavRight>
+                }
+            </Navbar>
             <List>
                 {Object.keys(chartLayoutLegends).map(key => {
                     return (
@@ -532,7 +579,13 @@ const PageHorizontalAxisTitle = props => {
 
     return (
         <Page>
-            <Navbar title={_t.textHorizontal} backLink={_t.textBack} />
+            <Navbar title={_t.textHorizontal} backLink={_t.textBack}>
+                {Device.phone &&
+                    <NavRight>
+                        <Link icon='icon-expand-down' sheetClose></Link>
+                    </NavRight>
+                }
+            </Navbar>
             <List>
                 {Object.keys(chartLayoutAxisTitleHorizontal).map(key => {
                     return (
@@ -557,7 +610,13 @@ const PageVerticalAxisTitle = props => {
 
     return (
         <Page>
-            <Navbar title={_t.textVertical} backLink={_t.textBack} />
+            <Navbar title={_t.textVertical} backLink={_t.textBack}>
+                {Device.phone &&
+                    <NavRight>
+                        <Link icon='icon-expand-down' sheetClose></Link>
+                    </NavRight>
+                }
+            </Navbar>
             <List>
                 {Object.keys(chartLayoutAxisTitleVertical).map(key => {
                     return (
@@ -582,7 +641,13 @@ const PageHorizontalGridlines = props => {
 
     return (
         <Page>
-            <Navbar title={_t.textHorizontal} backLink={_t.textBack} />
+            <Navbar title={_t.textHorizontal} backLink={_t.textBack}>
+                {Device.phone &&
+                    <NavRight>
+                        <Link icon='icon-expand-down' sheetClose></Link>
+                    </NavRight>
+                }
+            </Navbar>
             <List>
                 {Object.keys(chartLayoutGridlinesHorizontal).map(key => {
                     return (
@@ -607,7 +672,13 @@ const PageVerticalGridlines = props => {
 
     return (
         <Page>
-            <Navbar title={_t.textVertical} backLink={_t.textBack} />
+            <Navbar title={_t.textVertical} backLink={_t.textBack}>
+                {Device.phone &&
+                    <NavRight>
+                        <Link icon='icon-expand-down' sheetClose></Link>
+                    </NavRight>
+                }
+            </Navbar>
             <List>
                 {Object.keys(chartLayoutGridlinesVertical).map(key => {
                     return (
@@ -632,7 +703,13 @@ const PageDataLabels = props => {
 
     return (
         <Page>
-            <Navbar title={_t.textDataLabels} backLink={_t.textBack} />
+            <Navbar title={_t.textDataLabels} backLink={_t.textBack}>
+                {Device.phone &&
+                    <NavRight>
+                        <Link icon='icon-expand-down' sheetClose></Link>
+                    </NavRight>
+                }
+            </Navbar>
             <List>
                 {Object.keys(chartDataLabels).map(key => {
                     return (
@@ -724,7 +801,13 @@ const PageVerticalAxis = props => {
 
     return (
         <Page>
-            <Navbar title={_t.textAxisOptions} backLink={_t.textBack} />
+            <Navbar title={_t.textAxisOptions} backLink={_t.textBack}>
+                {Device.phone &&
+                    <NavRight>
+                        <Link icon='icon-expand-down' sheetClose></Link>
+                    </NavRight>
+                }
+            </Navbar>
             <List inlineLabels className="inputs-list">
                 <ListInput 
                     label={_t.textMinimumValue}
@@ -818,7 +901,13 @@ const PageVertAxisCrosses = props => {
 
     return (    
         <Page>
-            <Navbar title={_t.textAxisCrosses} backLink={_t.textBack} />
+            <Navbar title={_t.textAxisCrosses} backLink={_t.textBack}>
+                {Device.phone &&
+                    <NavRight>
+                        <Link icon='icon-expand-down' sheetClose></Link>
+                    </NavRight>
+                }
+            </Navbar>
             <List>
                 {axisCrosses.map((elem, index) => {
                     return (
@@ -846,7 +935,13 @@ const PageDisplayUnits = props => {
     
     return (
         <Page>
-            <Navbar title={_t.textDisplayUnits} backLink={_t.textBack} />
+            <Navbar title={_t.textDisplayUnits} backLink={_t.textBack}>
+                {Device.phone &&
+                    <NavRight>
+                        <Link icon='icon-expand-down' sheetClose></Link>
+                    </NavRight>
+                }
+            </Navbar>
             <List>
                 {vertAxisDisplayUnits.map((elem, index) => {
                     return (
@@ -874,7 +969,13 @@ const PageVertMajorType = props => {
 
     return (
         <Page>
-            <Navbar title={_t.textMajorType} backLink={_t.textBack} />
+            <Navbar title={_t.textMajorType} backLink={_t.textBack}>
+                {Device.phone &&
+                    <NavRight>
+                        <Link icon='icon-expand-down' sheetClose></Link>
+                    </NavRight>
+                }
+            </Navbar>
             <List>
                 {tickOptions.map((elem, index) => {
                     return (
@@ -902,7 +1003,13 @@ const PageVertMinorType = props => {
 
     return (
         <Page>
-            <Navbar title={_t.textMinorType} backLink={_t.textBack} />
+            <Navbar title={_t.textMinorType} backLink={_t.textBack}>
+                {Device.phone &&
+                    <NavRight>
+                        <Link icon='icon-expand-down' sheetClose></Link>
+                    </NavRight>
+                }
+            </Navbar>
             <List>
                 {tickOptions.map((elem, index) => {
                     return (
@@ -930,7 +1037,13 @@ const PageVertLabelPosition = props => {
 
     return (
         <Page>
-            <Navbar title={_t.textLabelPosition} backLink={_t.textBack} />
+            <Navbar title={_t.textLabelPosition} backLink={_t.textBack}>
+                {Device.phone &&
+                    <NavRight>
+                        <Link icon='icon-expand-down' sheetClose></Link>
+                    </NavRight>
+                }
+            </Navbar>
             <List>
                 {verticalAxisLabelsPosition.map((elem, index) => {
                     return (
@@ -1015,7 +1128,13 @@ const PageHorizontalAxis = props => {
 
     return (
         <Page>
-            <Navbar title={_t.textAxisOptions} backLink={_t.textBack} />
+            <Navbar title={_t.textAxisOptions} backLink={_t.textBack}>
+                {Device.phone &&
+                    <NavRight>
+                        <Link icon='icon-expand-down' sheetClose></Link>
+                    </NavRight>
+                }
+            </Navbar>
             <List inlineLabels className="inputs-list">
                 <ListItem title={_t.textAxisCrosses} link="/edit-hor-axis-crosses/" after={currentAxisCrosses.display} routeProps={{
                     axisCrosses,
@@ -1088,7 +1207,13 @@ const PageHorAxisCrosses = props => {
 
     return (    
         <Page>
-            <Navbar title={_t.textAxisCrosses} backLink={_t.textBack} />
+            <Navbar title={_t.textAxisCrosses} backLink={_t.textBack}>
+                {Device.phone &&
+                    <NavRight>
+                        <Link icon='icon-expand-down' sheetClose></Link>
+                    </NavRight>
+                }
+            </Navbar>
             <List>
                 {axisCrosses.map((elem, index) => {
                     return (
@@ -1116,7 +1241,13 @@ const PageHorAxisPosition = props => {
 
     return (    
         <Page>
-            <Navbar title={_t.textAxisPosition} backLink={_t.textBack} />
+            <Navbar title={_t.textAxisPosition} backLink={_t.textBack}>
+                {Device.phone &&
+                    <NavRight>
+                        <Link icon='icon-expand-down' sheetClose></Link>
+                    </NavRight>
+                }
+            </Navbar>
             <List>
                 {horAxisPosition.map((elem, index) => {
                     return (
@@ -1144,7 +1275,13 @@ const PageHorMajorType = props => {
 
     return (
         <Page>
-            <Navbar title={_t.textMajorType} backLink={_t.textBack} />
+            <Navbar title={_t.textMajorType} backLink={_t.textBack}>
+                {Device.phone &&
+                    <NavRight>
+                        <Link icon='icon-expand-down' sheetClose></Link>
+                    </NavRight>
+                }
+            </Navbar>
             <List>
                 {tickOptions.map((elem, index) => {
                     return (
@@ -1172,7 +1309,13 @@ const PageHorMinorType = props => {
 
     return (
         <Page>
-            <Navbar title={_t.textMinorType} backLink={_t.textBack} />
+            <Navbar title={_t.textMinorType} backLink={_t.textBack}>
+                {Device.phone &&
+                    <NavRight>
+                        <Link icon='icon-expand-down' sheetClose></Link>
+                    </NavRight>
+                }
+            </Navbar>
             <List>
                 {tickOptions.map((elem, index) => {
                     return (
@@ -1200,7 +1343,13 @@ const PageHorLabelPosition = props => {
 
     return (
         <Page>
-            <Navbar title={_t.textLabelPosition} backLink={_t.textBack} />
+            <Navbar title={_t.textLabelPosition} backLink={_t.textBack}>
+                {Device.phone &&
+                    <NavRight>
+                        <Link icon='icon-expand-down' sheetClose></Link>
+                    </NavRight>
+                }
+            </Navbar>
             <List>
                 {horAxisLabelsPosition.map((elem, index) => {
                     return (
diff --git a/apps/spreadsheeteditor/mobile/src/view/edit/EditImage.jsx b/apps/spreadsheeteditor/mobile/src/view/edit/EditImage.jsx
index ff49398e3..a71943fa3 100644
--- a/apps/spreadsheeteditor/mobile/src/view/edit/EditImage.jsx
+++ b/apps/spreadsheeteditor/mobile/src/view/edit/EditImage.jsx
@@ -1,7 +1,6 @@
 import React, {Fragment, useState} from 'react';
 import {observer, inject} from "mobx-react";
-import {f7, Page, Navbar, List, ListItem, Row, BlockTitle, Link, Toggle, Icon, View, NavRight, ListItemCell, Range, Button, Segmented, Tab, Tabs, ListInput, ListButton} from 'framework7-react';
-import { ThemeColorPalette, CustomColorPicker } from '../../../../../common/mobile/lib/component/ThemeColorPalette.jsx';
+import {f7, Page, Navbar, NavRight, List, ListItem, BlockTitle, Icon, ListInput, ListButton, Link} from 'framework7-react';
 import { useTranslation } from 'react-i18next';
 import {Device} from '../../../../../common/mobile/utils/device';
 
@@ -40,7 +39,13 @@ const PageReorder = props => {
 
     return (
         <Page>
-            <Navbar title={_t.textReorder} backLink={_t.textBack} />
+            <Navbar title={_t.textReorder} backLink={_t.textBack}>
+                {Device.phone &&
+                    <NavRight>
+                        <Link icon='icon-expand-down' sheetClose></Link>
+                    </NavRight>
+                }
+            </Navbar>
             <List>
                 <ListItem title={_t.textBringToForeground} link='#' onClick={() => {props.onReorder('all-up')}} className='no-indicator'>
                     <Icon slot="media" icon="icon-move-foreground"></Icon>
@@ -72,7 +77,13 @@ const PageReplace = props => {
 
     return (
         <Page className="images">
-            <Navbar title={_t.textReplace} backLink={_t.textBack} />
+            <Navbar title={_t.textReplace} backLink={_t.textBack}>
+                {Device.phone &&
+                    <NavRight>
+                        <Link icon='icon-expand-down' sheetClose></Link>
+                    </NavRight>
+                }
+            </Navbar>
             <List>
                 <ListItem title={_t.textPictureFromLibrary} onClick={() => {props.onReplaceByFile()}}>
                     <Icon slot="media" icon="icon-image-library"></Icon>
@@ -105,7 +116,13 @@ const PageLinkSettings = props => {
     };
     return (
         <Page>
-            <Navbar title={_t.textLinkSettings} backLink={_t.textBack} />
+            <Navbar title={_t.textLinkSettings} backLink={_t.textBack}>
+                {Device.phone &&
+                    <NavRight>
+                        <Link icon='icon-expand-down' sheetClose></Link>
+                    </NavRight>
+                }
+            </Navbar>
             <BlockTitle>{_t.textAddress}</BlockTitle>
             <List>
                 <ListInput
diff --git a/apps/spreadsheeteditor/mobile/src/view/edit/EditLink.jsx b/apps/spreadsheeteditor/mobile/src/view/edit/EditLink.jsx
index d6b8e5717..8b9f6d554 100644
--- a/apps/spreadsheeteditor/mobile/src/view/edit/EditLink.jsx
+++ b/apps/spreadsheeteditor/mobile/src/view/edit/EditLink.jsx
@@ -1,6 +1,6 @@
 import React, {useState, useEffect, Fragment} from 'react';
 import {observer, inject} from "mobx-react";
-import {f7, List, ListItem, Page, Navbar, Icon, ListButton, ListInput, Segmented, Button} from 'framework7-react';
+import {f7, List, ListItem, Page, Navbar, NavRight, Icon, ListButton, ListInput, Link} from 'framework7-react';
 import { useTranslation } from 'react-i18next';
 import {Device} from "../../../../../common/mobile/utils/device";
 
@@ -17,7 +17,13 @@ const PageTypeLink = ({curType, changeType, storeFocusObjects}) => {
 
     return (
         <Page>
-            <Navbar title={_t.textLinkType} backLink={_t.textBack}/>
+            <Navbar title={_t.textLinkType} backLink={_t.textBack}>
+                {Device.phone &&
+                    <NavRight>
+                        <Link icon='icon-expand-down' sheetClose></Link>
+                    </NavRight>
+                }
+            </Navbar>
             <List>
                 <ListItem title={_t.textExternalLink} radio checked={typeLink === 1} onClick={() => {setTypeLink(1); changeType(1);}}></ListItem>
                 <ListItem title={_t.textInternalDataRange} radio checked={typeLink === 2} onClick={() => {setTypeLink(2); changeType(2);}}></ListItem>
@@ -39,7 +45,13 @@ const PageSheet = ({curSheet, sheets, changeSheet, storeFocusObjects}) => {
 
     return (
         <Page>
-            <Navbar title={_t.textSheet} backLink={_t.textBack}/>
+            <Navbar title={_t.textSheet} backLink={_t.textBack}>
+                {Device.phone &&
+                    <NavRight>
+                        <Link icon='icon-expand-down' sheetClose></Link>
+                    </NavRight>
+                }
+            </Navbar>
             <List>
                 {sheets.map(sheet => {
                     return(
diff --git a/apps/spreadsheeteditor/mobile/src/view/edit/EditShape.jsx b/apps/spreadsheeteditor/mobile/src/view/edit/EditShape.jsx
index 2c1cb974f..f4fcb7c19 100644
--- a/apps/spreadsheeteditor/mobile/src/view/edit/EditShape.jsx
+++ b/apps/spreadsheeteditor/mobile/src/view/edit/EditShape.jsx
@@ -1,6 +1,6 @@
 import React, {Fragment, useState} from 'react';
 import {observer, inject} from "mobx-react";
-import {f7, Page, Navbar, List, ListItem, Row, BlockTitle, Link, Toggle, Icon, View, NavRight, ListItemCell, Range, Button, Segmented, Tab, Tabs} from 'framework7-react';
+import {f7, Page, Navbar, NavRight, List, ListItem, Link, Icon, Range, Tab, Tabs} from 'framework7-react';
 import { ThemeColorPalette, CustomColorPicker } from '../../../../../common/mobile/lib/component/ThemeColorPalette.jsx';
 import { useTranslation } from 'react-i18next';
 import {Device} from '../../../../../common/mobile/utils/device';
@@ -120,6 +120,11 @@ const PageStyle = props => {
                     <Link key={"se-link-shape-border"}  tabLink={"#edit-shape-border"}>{_t.textBorder}</Link>
                     <Link key={"se-link-shape-effects"}  tabLink={"#edit-shape-effects"}>{_t.textEffects}</Link>
                 </div>
+                {Device.phone &&
+                    <NavRight>
+                        <Link icon='icon-expand-down' sheetClose></Link>
+                    </NavRight>
+                }
             </Navbar>
             <Tabs animated>
                 <Tab key={"se-tab-shape-fill"} id={"edit-shape-fill"} className="page-content no-padding-top" tabActive={true}>
@@ -188,7 +193,13 @@ const PageCustomFillColor = props => {
 
     return(
         <Page>
-            <Navbar title={_t.textCustomColor} backLink={_t.textBack} />
+            <Navbar title={_t.textCustomColor} backLink={_t.textBack}>
+                {Device.phone &&
+                    <NavRight>
+                        <Link icon='icon-expand-down' sheetClose></Link>
+                    </NavRight>
+                }
+            </Navbar>
             <CustomColorPicker currentColor={fillColor} onAddNewColor={onAddNewColor}/>
         </Page>
     )
@@ -218,7 +229,13 @@ const PageStyleNoFill = props => {
 
     return (
         <Page>
-            <Navbar backLink={_t.textBack} title={_t.textBorder}></Navbar>
+            <Navbar backLink={_t.textBack} title={_t.textBorder}>
+                {Device.phone &&
+                    <NavRight>
+                        <Link icon='icon-expand-down' sheetClose></Link>
+                    </NavRight>
+                }
+            </Navbar>
             <List>
                 <ListItem>
                     <div slot="root-start" className='inner-range-title'>{_t.textSize}</div>
@@ -260,7 +277,13 @@ const PageReplace = props => {
 
     return (
         <Page className="shapes dataview">
-            <Navbar title={_t.textReplace} backLink={_t.textBack} />
+            <Navbar title={_t.textReplace} backLink={_t.textBack}>
+                {Device.phone &&
+                    <NavRight>
+                        <Link icon='icon-expand-down' sheetClose></Link>
+                    </NavRight>
+                }
+            </Navbar>
             {shapes.map((row, indexRow) => {
                 return (
                     <ul className="row" key={'shape-row-' + indexRow}>
@@ -292,7 +315,13 @@ const PageReorder = props => {
 
     return (
         <Page>
-            <Navbar title={_t.textReorder} backLink={_t.textBack} />
+            <Navbar title={_t.textReorder} backLink={_t.textBack}>
+                {Device.phone &&
+                    <NavRight>
+                        <Link icon='icon-expand-down' sheetClose></Link>
+                    </NavRight>
+                }
+            </Navbar>
             <List>
                 <ListItem title={_t.textBringToForeground} link='#' onClick={() => {props.onReorder('all-up')}} className='no-indicator'>
                     <Icon slot="media" icon="icon-move-foreground"></Icon>
@@ -334,7 +363,13 @@ const PageBorderColor = props => {
     };
     return (
         <Page>
-            <Navbar title={_t.textColor} backLink={_t.textBack} />
+            <Navbar title={_t.textColor} backLink={_t.textBack}>
+                {Device.phone &&
+                    <NavRight>
+                        <Link icon='icon-expand-down' sheetClose></Link>
+                    </NavRight>
+                }
+            </Navbar>
             <ThemeColorPalette changeColor={changeColor} curColor={borderColor} customColors={customColors}/>
             <List>
                 <ListItem title={_t.textAddCustomColor} link={'/edit-shape-custom-border-color/'} routeProps={{
@@ -360,7 +395,13 @@ const PageCustomBorderColor = props => {
     };
     return (
         <Page>
-            <Navbar title={_t.textCustomColor} backLink={_t.textBack} />
+            <Navbar title={_t.textCustomColor} backLink={_t.textBack}>
+                {Device.phone &&
+                    <NavRight>
+                        <Link icon='icon-expand-down' sheetClose></Link>
+                    </NavRight>
+                }
+            </Navbar>
             <CustomColorPicker currentColor={borderColor} onAddNewColor={onAddNewColor}/>
         </Page>
     )
diff --git a/apps/spreadsheeteditor/mobile/src/view/edit/EditText.jsx b/apps/spreadsheeteditor/mobile/src/view/edit/EditText.jsx
index cd29dfd5a..edd1f410f 100644
--- a/apps/spreadsheeteditor/mobile/src/view/edit/EditText.jsx
+++ b/apps/spreadsheeteditor/mobile/src/view/edit/EditText.jsx
@@ -1,6 +1,6 @@
 import React, {Fragment, useState} from 'react';
 import {observer, inject} from "mobx-react";
-import {f7, List, ListItem, Icon, Row, Button, Page, Navbar, Segmented, BlockTitle} from 'framework7-react';
+import {f7, List, ListItem, Icon, Row, Button, Page, Navbar, NavRight, Segmented, BlockTitle, Link} from 'framework7-react';
 import { useTranslation } from 'react-i18next';
 import {Device} from '../../../../../common/mobile/utils/device';
 import { ThemeColorPalette, CustomColorPicker } from '../../../../../common/mobile/lib/component/ThemeColorPalette.jsx';
@@ -9,14 +9,12 @@ const EditText = props => {
     const isAndroid = Device.android;
     const { t } = useTranslation();
     const _t = t('View.Edit', {returnObjects: true});
-    // const metricText = Common.Utils.Metric.getCurrentMetricName();
     const storeTextSettings = props.storeTextSettings;
     const textIn = storeTextSettings.textIn;
 
     const fontName = storeTextSettings.fontName || _t.textFonts;
     const fontSize = storeTextSettings.fontSize;
     const fontColor = storeTextSettings.textColor;
-    // console.log(fontColor);
 
     const displaySize = typeof fontSize === 'undefined' ? _t.textAuto : fontSize + ' ' + _t.textPt;
     const isBold = storeTextSettings.isBold;
@@ -119,7 +117,13 @@ const PageFonts = props => {
 
     return (
         <Page>
-            <Navbar title={_t.textFonts} backLink={_t.textBack} />
+            <Navbar title={_t.textFonts} backLink={_t.textBack}>
+                {Device.phone &&
+                    <NavRight>
+                        <Link icon='icon-expand-down' sheetClose></Link>
+                    </NavRight>
+                }
+            </Navbar>
             <List>
                 <ListItem title={_t.textSize}>
                     {!isAndroid && <div slot='after-start'>{displaySize}</div>}
@@ -184,7 +188,13 @@ const PageFontColor = props => {
 
     return (
         <Page>
-            <Navbar title={_t.textTextColor} backLink={_t.textBack} />
+            <Navbar title={_t.textTextColor} backLink={_t.textBack}>
+                {Device.phone &&
+                    <NavRight>
+                        <Link icon='icon-expand-down' sheetClose></Link>
+                    </NavRight>
+                }
+            </Navbar>
             <ThemeColorPalette changeColor={changeColor} curColor={textColor} customColors={customColors} />
             <List>
                 <ListItem title={_t.textAddCustomColor} link={'/edit-text-custom-font-color/'} routeProps={{
@@ -216,7 +226,13 @@ const PageCustomFontColor = props => {
     };
     return (
         <Page>
-            <Navbar title={_t.textCustomColor} backLink={_t.textBack} />
+            <Navbar title={_t.textCustomColor} backLink={_t.textBack}>
+                {Device.phone &&
+                    <NavRight>
+                        <Link icon='icon-expand-down' sheetClose></Link>
+                    </NavRight>
+                }
+            </Navbar>
             <CustomColorPicker autoColor={autoColor} currentColor={textColor} onAddNewColor={onAddNewColor}/>
         </Page>
     )