diff options
-rw-r--r-- | deploy/mobile/image.html | 1 | ||||
-rw-r--r-- | src/client/util/CurrentUserUtils.ts | 73 | ||||
-rw-r--r-- | src/client/views/collections/CollectionStackingView.tsx | 2 | ||||
-rw-r--r-- | src/client/views/nodes/AudioBox.tsx | 2 | ||||
-rw-r--r-- | src/client/views/nodes/PresBox.scss | 5 | ||||
-rw-r--r-- | src/client/views/nodes/RadialMenu.tsx | 6 | ||||
-rw-r--r-- | src/client/views/nodes/formattedText/FormattedTextBox.tsx | 3 | ||||
-rw-r--r-- | src/client/views/presentationview/PresElementBox.scss | 2 | ||||
-rw-r--r-- | src/mobile/MobileInterface.tsx | 69 | ||||
-rw-r--r-- | src/mobile/MobileMenu.scss | 4 |
10 files changed, 77 insertions, 90 deletions
diff --git a/deploy/mobile/image.html b/deploy/mobile/image.html index d30ad6ac2..718550f02 100644 --- a/deploy/mobile/image.html +++ b/deploy/mobile/image.html @@ -3,6 +3,7 @@ <head> <title>Dash Mobile</title> <link href="https://fonts.googleapis.com/css?family=Fjalla+One|Hind+Siliguri:300" rel="stylesheet"> + <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0,user-scalable=0" /> </head> <body> diff --git a/src/client/util/CurrentUserUtils.ts b/src/client/util/CurrentUserUtils.ts index 323e398be..9ce162897 100644 --- a/src/client/util/CurrentUserUtils.ts +++ b/src/client/util/CurrentUserUtils.ts @@ -55,6 +55,15 @@ export class CurrentUserUtils { }); } + if (doc["template-mobile-button"] === undefined) { + const queryTemplate = this.mobileButton({ title: "NEW MOBILE BUTTON", onClick: undefined, _backgroundColor: "lightgrey" }, [this.ficon({ ignoreClick: true, icon: "mobile", backgroundColor: "rgba(0,0,0,0)" }), this.mobileTextContainer({}, [this.mobileButtonText({}, "NEW MOBILE BUTTON"), this.mobileButtonInfo({}, "You can customize this button and make it your own.")])]); + doc["template-mobile-button"] = CurrentUserUtils.ficon({ + onDragStart: ScriptField.MakeFunction('getCopy(this.dragFactory, true)'), + dragFactory: new PrefetchProxy(queryTemplate) as any as Doc, + removeDropProperties: new List<string>(["dropAction"]), title: "mobile button", icon: "mobile" + }); + } + if (doc["template-button-slides"] === undefined) { const slideTemplate = Docs.Create.MultirowDocument( [ @@ -165,16 +174,6 @@ export class CurrentUserUtils { }); } - // if (doc["mobile-button"] === undefined) { - // const mobileTemplate = this.mobileButton({ title: "mobile button", _backgroundColor: "lightgrey" }, [this.ficon({ ignoreClick: true, icon: "mobile", backgroundColor: "rgba(0,0,0,0)" }), this.mobileTextContainer({}, [this.mobileButtonText({}, "text"), this.mobileButtonInfo({}, "This is a default mobile button for use in the mobile menu")])]); - // mobileTemplate.isTemplateDoc = makeTemplate(mobileTemplate); - // doc["mobile-button"] = CurrentUserUtils.ficon({ - // onDragStart: ScriptField.MakeFunction('getCopy(this.dragFactory, true)'), - // dragFactory: new PrefetchProxy(mobileTemplate) as any as Doc, - // removeDropProperties: new List<string>(["dropAction"]), title: "mobile button view", icon: "mobile" - // }); - // } - if (doc["template-button-detail"] === undefined) { const { TextDocument, MasonryDocument, CarouselDocument } = Docs.Create; @@ -229,6 +228,7 @@ export class CurrentUserUtils { doc["template-button-slides"] as Doc, doc["template-button-description"] as Doc, doc["template-button-query"] as Doc, + doc["template-mobile-button"] as Doc, doc["template-button-detail"] as Doc, doc["template-button-link"] as Doc, doc["template-button-switch"] as Doc]; @@ -378,9 +378,8 @@ export class CurrentUserUtils { if (doc.emptyWebpage === undefined) { doc.emptyWebpage = Docs.Create.WebDocument("", { title: "New Webpage", _nativeWidth: 850, _nativeHeight: 962, _width: 600, UseCors: true }); } - if (doc.activeMobile === undefined) { - console.log("phone setup"); - this.setupActiveMobile(doc); + if (doc.activeMobileMenu === undefined) { + this.setupActiveMobileMenu(doc); } return [ { title: "Drag a comparison box", label: "Comp", icon: "columns", ignoreClick: true, drag: 'Docs.Create.ComparisonDocument()' }, @@ -395,7 +394,7 @@ export class CurrentUserUtils { { title: "Drag a search box", label: "Query", icon: "search", ignoreClick: true, drag: 'Docs.Create.QueryDocument({ _width: 200, title: "an image of a cat" })' }, { title: "Drag a scripting box", label: "Script", icon: "terminal", ignoreClick: true, drag: 'Docs.Create.ScriptingDocument(undefined, { _width: 200, _height: 250 title: "untitled script" })' }, { title: "Drag an import folder", label: "Load", icon: "cloud-upload-alt", ignoreClick: true, drag: 'Docs.Create.DirectoryImportDocument({ title: "Directory Import", _width: 400, _height: 400 })' }, - { title: "Drag a mobile view", label: "Phone", icon: "mobile", click: 'openOnRight(getCopy(this.dragFactory, true))', drag: 'getCopy(this.dragFactory,true)', dragFactory: doc.activeMobile as Doc }, + { title: "Drag a mobile view", label: "Phone", icon: "mobile", click: 'openOnRight(Doc.UserDoc().activeMobileMenu)', drag: 'this.dragFactory', dragFactory: doc.activeMobileMenu as Doc }, { title: "Drag an instance of the device collection", label: "Buxton", icon: "globe-asia", ignoreClick: true, drag: 'Docs.Create.Buxton()' }, // { title: "use pen", icon: "pen-nib", click: 'activatePen(this.activeInkPen = sameDocs(this.activeInkPen, this) ? undefined : this)', backgroundColor: "blue", ischecked: `sameDocs(this.activeInkPen, this)`, activeInkPen: doc }, // { title: "use highlighter", icon: "highlighter", click: 'activateBrush(this.activeInkPen = sameDocs(this.activeInkPen, this) ? undefined : this,20,this.backgroundColor)', backgroundColor: "yellow", ischecked: `sameDocs(this.activeInkPen, this)`, activeInkPen: doc }, @@ -449,12 +448,12 @@ export class CurrentUserUtils { return doc.myItemCreators as Doc; } - static setupActiveMobile(doc: Doc) { - if (doc.activeMobile === undefined) { + static setupActiveMobileMenu(doc: Doc) { + if (doc.activeMobileMenu === undefined) { console.log("undefined"); - doc.activeMobile = this.setupMobileMenu(); + doc.activeMobileMenu = this.setupMobileMenu(); } - return doc.activeMobile as Doc; + return doc.activeMobileMenu as Doc; } static setupMobileMenu() { @@ -466,37 +465,45 @@ export class CurrentUserUtils { static setupMobileButtons(doc?: Doc, buttons?: string[]) { const docProtoData: { title: string, icon: string, drag?: string, ignoreClick?: boolean, click?: string, ischecked?: string, activePen?: Doc, backgroundColor?: string, info: string, dragFactory?: Doc }[] = [ - { title: "LIBRARY", icon: "bars", click: 'switchToLibrary()', backgroundColor: "#ffd6d6", info: "Navigate and access all of your documents within their respective collections" }, - { title: "RECORD", icon: "microphone", click: 'openMobileAudio()', backgroundColor: "#ffbfbf", info: "Use your mobile to record audio and access it on Dash Web." }, - { title: "UPLOAD", icon: "upload", click: 'uploadImageMobile()', backgroundColor: "#ff9e9e", info: "Upload an image from your mobile device so it can be accessed on Dash Web" }, + { title: "LIBRARY", icon: "bars", click: 'switchToLibrary()', backgroundColor: "#ffd6d6", info: "Navigate and access all of your documents within their respective collections." }, + { title: "RECORD", icon: "microphone", click: 'openMobileAudio()', backgroundColor: "#ffbfbf", info: "Use your phone to record and upload audio onto Dash Web." }, + { title: "UPLOAD", icon: "upload", click: 'uploadImageMobile()', backgroundColor: "#ff9e9e", info: "Upload images or videos from your mobile device so they can be accessed on Dash Web." }, { title: "PRESENTATION", icon: "desktop", click: 'openMobilePresentation()', backgroundColor: "#ff8080", info: "Use your phone as a remote for you presentation." }, - { title: "SETTINGS", icon: "cog", click: 'openMobileSettings()', backgroundColor: "#ff5e5e", info: "Change your password, log out, or manage your account security" } + { title: "SETTINGS", icon: "cog", click: 'openMobileSettings()', backgroundColor: "#ff5e5e", info: "Change your password, log out, or manage your account security." } ]; - return docProtoData.filter(d => !buttons || !buttons.includes(d.title)).map(data => this.mobileButton({ title: data.title, onClick: data.click ? ScriptField.MakeScript(data.click) : undefined, _backgroundColor: data.backgroundColor }, [this.ficon({ ignoreClick: true, icon: data.icon, backgroundColor: "rgba(0,0,0,0)" }), this.mobileTextContainer({}, [this.mobileButtonText({}, data.title), this.mobileButtonInfo({}, data.info)])])); + return docProtoData.filter(d => !buttons || !buttons.includes(d.title)).map(data => + this.mobileButton({ + title: data.title, + lockedPosition: true, + onClick: data.click ? ScriptField.MakeScript(data.click) : undefined, + _backgroundColor: data.backgroundColor + }, + [this.ficon({ ignoreClick: true, icon: data.icon, backgroundColor: "rgba(0,0,0,0)" }), this.mobileTextContainer({}, [this.mobileButtonText({}, data.title), this.mobileButtonInfo({}, data.info)])]) + ); } - static mobileButton = (opts: DocumentOptions, docs: Doc[]) => new PrefetchProxy(Docs.Create.MulticolumnDocument(docs, { + static mobileButton = (opts: DocumentOptions, docs: Doc[]) => Docs.Create.MulticolumnDocument(docs, { ...opts, dropAction: undefined, removeDropProperties: new List<string>(["dropAction"]), _nativeWidth: 900, _nativeHeight: 250, _width: 900, _height: 250, _yMargin: 15, - borderRounding: "5px", boxShadow: "0 0", _chromeStatus: "disabled", - })) as any as Doc + borderRounding: "5px", boxShadow: "0 0", _chromeStatus: "disabled" + }) as any as Doc - static mobileTextContainer = (opts: DocumentOptions, docs: Doc[]) => new PrefetchProxy(Docs.Create.MultirowDocument(docs, { + static mobileTextContainer = (opts: DocumentOptions, docs: Doc[]) => Docs.Create.MultirowDocument(docs, { ...opts, dropAction: undefined, removeDropProperties: new List<string>(["dropAction"]), _nativeWidth: 450, _nativeHeight: 250, _width: 450, _height: 250, _yMargin: 25, backgroundColor: "rgba(0,0,0,0)", borderRounding: "0", boxShadow: "0 0", _chromeStatus: "disabled", ignoreClick: true - })) as any as Doc + }) as any as Doc - static mobileButtonText = (opts: DocumentOptions, buttonTitle: string) => new PrefetchProxy(Docs.Create.TextDocument(buttonTitle, { + static mobileButtonText = (opts: DocumentOptions, buttonTitle: string) => Docs.Create.TextDocument(buttonTitle, { ...opts, dropAction: undefined, title: buttonTitle, _fontSize: 37, _xMargin: 0, _yMargin: 0, ignoreClick: true, _chromeStatus: "disabled", backgroundColor: "rgba(0,0,0,0)" - })) as any as Doc + }) as any as Doc - static mobileButtonInfo = (opts: DocumentOptions, buttonInfo: string) => new PrefetchProxy(Docs.Create.TextDocument(buttonInfo, { + static mobileButtonInfo = (opts: DocumentOptions, buttonInfo: string) => Docs.Create.TextDocument(buttonInfo, { ...opts, dropAction: undefined, title: "info", _fontSize: 25, _xMargin: 0, _yMargin: 0, ignoreClick: true, _chromeStatus: "disabled", backgroundColor: "rgba(0,0,0,0)", _dimMagnitude: 2, - })) as any as Doc + }) as any as Doc static setupThumbButtons(doc: Doc) { @@ -795,7 +802,7 @@ export class CurrentUserUtils { this.setupDefaultIconTemplates(doc); // creates a set of icon templates triggered by the document deoration icon this.setupDocTemplates(doc); // sets up the template menu of templates this.setupRightSidebar(doc); // sets up the right sidebar collection for mobile upload documents and sharing - this.setupActiveMobile(doc); + this.setupActiveMobileMenu(doc); this.setupOverlays(doc); // documents in overlay layer this.setupDockedButtons(doc); // the bottom bar of font icons this.setupDefaultPresentation(doc); // presentation that's initially triggered diff --git a/src/client/views/collections/CollectionStackingView.tsx b/src/client/views/collections/CollectionStackingView.tsx index 0a1b03522..bd0b69da8 100644 --- a/src/client/views/collections/CollectionStackingView.tsx +++ b/src/client/views/collections/CollectionStackingView.tsx @@ -476,7 +476,7 @@ export class CollectionStackingView extends CollectionSubView(StackingDocument) transformOrigin: "top left", }} onScroll={action(e => { - if (!this.props.isSelected()) e.currentTarget.scrollTop = this._scroll; + if (!this.props.isSelected() && window.innerWidth > 1000) e.currentTarget.scrollTop = this._scroll; else this._scroll = e.currentTarget.scrollTop; })} onDrop={this.onExternalDrop.bind(this)} diff --git a/src/client/views/nodes/AudioBox.tsx b/src/client/views/nodes/AudioBox.tsx index 1a935d9b0..2e0be1c6a 100644 --- a/src/client/views/nodes/AudioBox.tsx +++ b/src/client/views/nodes/AudioBox.tsx @@ -228,7 +228,7 @@ export class AudioBox extends ViewBoxBaseComponent<FieldViewProps, AudioDocument {!this.path ? <div className="audiobox-buttons"> <div className="audiobox-dictation" onClick={this.onFile}> - <FontAwesomeIcon style={{ width: "30px", background: this.layoutDoc.playOnSelect ? "yellow" : "dimGray" }} icon="file-alt" size={this.props.PanelHeight() < 36 ? "1x" : "2x"} /> + <FontAwesomeIcon style={{ width: "30px", background: this.layoutDoc.playOnSelect ? "yellow" : "rgba(0,0,0,0)" }} icon="file-alt" size={this.props.PanelHeight() < 36 ? "1x" : "2x"} /> </div> <button className={`audiobox-record${interactive}`} style={{ backgroundColor: this.audioState === "recording" ? "red" : "black" }}> {this.audioState === "recording" ? "STOP" : "RECORD"} diff --git a/src/client/views/nodes/PresBox.scss b/src/client/views/nodes/PresBox.scss index 2bb249ee4..ccce6e627 100644 --- a/src/client/views/nodes/PresBox.scss +++ b/src/client/views/nodes/PresBox.scss @@ -126,4 +126,9 @@ position: absolute; min-width: 50px; } + + .input, + .select { + font-size: 100%; + } }
\ No newline at end of file diff --git a/src/client/views/nodes/RadialMenu.tsx b/src/client/views/nodes/RadialMenu.tsx index ddfdb67b4..2bbb80b2a 100644 --- a/src/client/views/nodes/RadialMenu.tsx +++ b/src/client/views/nodes/RadialMenu.tsx @@ -1,9 +1,9 @@ import React = require("react"); import { action, computed, IReactionDisposer, observable, reaction, runInAction } from "mobx"; import { observer } from "mobx-react"; -import MobileInterface from "../../../mobile/MobileInterface"; import "./RadialMenu.scss"; import { RadialMenuItem, RadialMenuProps } from "./RadialMenuItem"; +import { MobileInterface } from "../../../mobile/MobileInterface"; @observer export class RadialMenu extends React.Component { @@ -38,7 +38,6 @@ export class RadialMenu extends React.Component { this._mouseY = e.clientY; this.used = false; document.addEventListener("pointermove", this.onPointerMove); - } @observable @@ -176,7 +175,6 @@ export class RadialMenu extends React.Component { @action openMenu = (x: number, y: number) => { - this._pageX = x; this._pageY = y; this._shouldDisplay; @@ -216,7 +214,7 @@ export class RadialMenu extends React.Component { render() { - if (!this._display || MobileInterface.Instance) { + if (!this._display) { return null; } const style = this._yRelativeToTop ? { left: this._pageX - 130, top: this._pageY - 130 } : diff --git a/src/client/views/nodes/formattedText/FormattedTextBox.tsx b/src/client/views/nodes/formattedText/FormattedTextBox.tsx index 1db50a5cc..912bafc46 100644 --- a/src/client/views/nodes/formattedText/FormattedTextBox.tsx +++ b/src/client/views/nodes/formattedText/FormattedTextBox.tsx @@ -262,7 +262,8 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<(FieldViewProp } public unhighlightSearchTerms = () => { - if (this._editorView && (this._editorView as any).docView) { + if (window.innerWidth < 1000) null; + else if (this._editorView && (this._editorView as any).docView) { const mark = this._editorView.state.schema.mark(this._editorView.state.schema.marks.search_highlight); const activeMark = this._editorView.state.schema.mark(this._editorView.state.schema.marks.search_highlight, { selected: true }); const end = this._editorView.state.doc.nodeSize - 2; diff --git a/src/client/views/presentationview/PresElementBox.scss b/src/client/views/presentationview/PresElementBox.scss index ec82b0c51..bf268eb8d 100644 --- a/src/client/views/presentationview/PresElementBox.scss +++ b/src/client/views/presentationview/PresElementBox.scss @@ -79,7 +79,7 @@ } .presElementBox-name { - font-size: 12pxππ; + font-size: 12px; position: absolute; display: inline-block; width: calc(100% - 45px); diff --git a/src/mobile/MobileInterface.tsx b/src/mobile/MobileInterface.tsx index 25dc9fd55..7af11a9c4 100644 --- a/src/mobile/MobileInterface.tsx +++ b/src/mobile/MobileInterface.tsx @@ -35,6 +35,7 @@ import { nullAudio } from '../fields/URLField'; import GestureOverlay from "../client/views/GestureOverlay"; import { ScriptField } from "../fields/ScriptField"; import InkOptionsMenu from "../client/views/collections/collectionFreeForm/InkOptionsMenu"; +import { RadialMenu } from "../client/views/nodes/RadialMenu"; library.add(faTasks, faMobile, faThLarge, faWindowClose, faEdit, faTrashAlt, faPalette, faAngleRight, faBell, faTrash, faCamera, faExpand, faCaretDown, faCaretLeft, faCaretRight, faCaretSquareDown, faCaretSquareRight, faArrowsAltH, faPlus, faMinus, faTerminal, faToggleOn, fileSolid, faExternalLinkAlt, faLocationArrow, faSearch, faFileDownload, faStop, faCalculator, faWindowMaximize, faAddressCard, @@ -48,7 +49,7 @@ export class MobileInterface extends React.Component { @observable static Instance: MobileInterface; @computed private get userDoc() { return Doc.UserDoc(); } @computed private get mainContainer() { return this.userDoc ? FieldValue(Cast(this.userDoc.activeMobile, Doc)) : CurrentUserUtils.GuestMobile; } - @observable private mainDoc: any = CurrentUserUtils.setupActiveMobile(this.userDoc); + @observable private mainDoc: any = CurrentUserUtils.setupActiveMobileMenu(this.userDoc); @observable private renderView?: () => JSX.Element; @observable private sidebarActive: boolean = false; @observable private imageUploadActive: boolean = false; @@ -94,31 +95,6 @@ export class MobileInterface extends React.Component { this.renderView = renderView; } - onSwitchUpload = async () => { - let width = 300; - let height = 300; - const res = await rp.get(Utils.prepend("/getUserDocumentId")); - - // get width and height of the collection doc - if (this.mainContainer) { - const data = Cast(this.mainContainer.data, listSpec(Doc)); - if (data) { - const collectionDoc = await data[1]; // this should be the collection doc since the positions should be locked - const docView = DocumentManager.Instance.getDocumentView(collectionDoc); - if (docView) { - width = docView.nativeWidth ? docView.nativeWidth : 300; - height = docView.nativeHeight ? docView.nativeHeight : 300; - } - } - } - DocServer.Mobile.dispatchOverlayTrigger({ - enableOverlay: true, - width: width, - height: height, - text: "Documents uploaded from mobile will show here", - }); - } - // For toggling the hamburger menu @action toggleSidebar = () => this.sidebarActive = !this.sidebarActive @@ -138,8 +114,8 @@ export class MobileInterface extends React.Component { * Back method for navigating */ back = () => { - let header = document.getElementById("header") as HTMLElement; - let doc = Cast(this._parents.pop(), Doc) as Doc; + const header = document.getElementById("header") as HTMLElement; + const doc = Cast(this._parents.pop(), Doc) as Doc; if (doc === Cast(this._library, Doc) as Doc) { this._child = null; @@ -198,7 +174,7 @@ export class MobileInterface extends React.Component { if (this.mainContainer) { const backgroundColor = () => "white"; return ( - <div style={{ position: "relative", top: '200px', height: `calc(100% - 200px)`, width: "100%", overflow: "hidden", left: "0%" }}> + <div style={{ position: "relative", top: '200px', height: `calc(100% - 350px)`, width: "100%", left: "0%" }}> <DocumentView Document={this.mainContainer} DataDoc={undefined} @@ -238,16 +214,15 @@ export class MobileInterface extends React.Component { * @param doc: doc for which the method is called */ handleClick = async (doc: Doc) => { - let children = DocListCast(doc.data); + const children = DocListCast(doc.data); if (doc.type !== "collection") { this._parents.push(this._activeDoc); this._activeDoc = doc; this.switchCurrentView((userDoc: Doc) => doc); this._homeMenu = false; this.toggleSidebar(); - } else if (doc.type === "collection" && children.length === 0) { - console.log("This collection has no children"); - } else { + } else if (doc.type === "collection" && children.length === 0) console.log("This collection has no children"); + else { this._parents.push(this._activeDoc); this._activeDoc = doc; this.switchCurrentView((userDoc: Doc) => doc); @@ -260,7 +235,7 @@ export class MobileInterface extends React.Component { * Handles creation of array which is then rendered in renderPathbar() */ createPathname = () => { - let docArray = []; + const docArray = []; this._parents.map((doc: Doc, index: any) => { docArray.push(doc); }); @@ -270,8 +245,8 @@ export class MobileInterface extends React.Component { // Renders the graphical pathbar renderPathbar = () => { - let docArray = this.createPathname(); - let items = docArray.map((doc: Doc, index: any) => { + const docArray = this.createPathname(); + const items = docArray.map((doc: Doc, index: any) => { if (index === 0) { return ( <> @@ -341,9 +316,8 @@ export class MobileInterface extends React.Component { this._child = null; this.switchCurrentView((userDoc: Doc) => doc); this._parents.length = index; - } else if (doc === this._homeDoc) { - this.returnHome(); - } else { + } else if (doc === this._homeDoc) this.returnHome(); + else { this._activeDoc = doc; this._child = doc; this.switchCurrentView((userDoc: Doc) => doc); @@ -384,7 +358,7 @@ export class MobileInterface extends React.Component { workspaces = this._child; } - let buttons = DocListCast(workspaces.data).map((doc: Doc, index: any) => { + const buttons = DocListCast(workspaces.data).map((doc: Doc, index: any) => { if (doc.type !== "ink") { return ( <div @@ -473,7 +447,7 @@ export class MobileInterface extends React.Component { console.log("here"); return <div className="colorSelector"> <InkOptionsMenu /> - </div> + </div>; } } @@ -677,17 +651,18 @@ export class MobileInterface extends React.Component { {this.uploadImage()} </div> {this.switchMenuView()} - <div className="docButtonContainer"> - {this.pinToPresentation()} - {this.downloadDocument()} - {this.drawInk()} - {this.uploadAudioButton()} - </div> {this.inkMenu()} <GestureOverlay> + <div className="docButtonContainer"> + {this.pinToPresentation()} + {this.downloadDocument()} + {this.drawInk()} + {this.uploadAudioButton()} + </div> {this.displayWorkspaces()} {this.renderDefaultContent()} </GestureOverlay> + <RadialMenu /> </div> ); } diff --git a/src/mobile/MobileMenu.scss b/src/mobile/MobileMenu.scss index 8d996f779..3126a7d0e 100644 --- a/src/mobile/MobileMenu.scss +++ b/src/mobile/MobileMenu.scss @@ -256,7 +256,7 @@ body { } .docButtonContainer { - top: 90%; + top: 80%; position: absolute; display: flex; transform: translate(-50%, 0); @@ -306,7 +306,7 @@ body { width: 200px; left: 0px; top: 0px; - background-image: linear-gradient(to right, #1a1a1a, rgba(255, 0, 0, 0)); + background-image: linear-gradient(to right, #1a1a1a, rgba(0, 0, 0, 0)); text-align: center; user-select: none; z-index: 99; |