src/mobile/SideBar.tsx


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39

import React = require("react");
import { observer } from "mobx-react";
import "./SideBar.scss";
import { computed } from "mobx";
import { DocumentView } from '../client/views/nodes/DocumentView';

@observer
export class SideBar extends React.Component<{ views: (DocumentView | undefined)[], stack?: any }, {}>{

    constructor(props: { views: (DocumentView | undefined)[] }) {
        super(props);
    }

    @computed
    onClick() {
        document.getElementsByClassName('sidebar')
        [0].classList.toggle('active');
    }

    render() {
        return (
            <>
                <div className="navbar">
                    <div className="toggle-btn" onClick={this.onClick}>
                        <span></span>
                        <span></span>
                        <span></span>
                    </div>
                </div>
                <div className="sidebar">
                    <div className="item">Workspace1</div>
                    <div className="item">Workspace2</div>
                    <div className="item">Workspace3</div>
                </div>
            </>
        );
    }

}