haiwen/seahub
1
0
Fork 0
mirror of https://github.com/haiwen/seahub.git synced 2025-09-04 00:20:07 +00:00
Code Issues Releases Wiki Activity

fix mobile style (#3567)

Browse Source
This commit is contained in:
Michael An
2019-05-29 11:48:00 +08:00
committed by Daniel Pan
parent 9df8ee0d6e
commit e1e9ca8bd1
6 changed files with 44 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
frontend/src/components/toolbar/groups-toolbar.js
View File

@@ -1,5 +1,6 @@
import React from 'react';
import PropTypes from 'prop-types';
import MediaQuery from 'react-responsive';
import CommonToolbar from './common-toolbar';
import { Button } from 'reactstrap';
import { gettext } from '../../utils/constants';
@@ -24,9 +25,16 @@ class GroupsToolbar extends React.Component {
<div className="cur-view-toolbar">
<span title="Side Nav Menu" onClick={onShowSidePanel} className="sf2-icon-menu side-nav-toggle hidden-md-up d-md-none"></span>
<div className="operation">
<MediaQuery query="(min-width: 768px)">
<Button color="btn btn-secondary operation-item" onClick={this.props.toggleAddGroupModal}>
<i className="fas fa-plus-square text-secondary mr-1"></i>{gettext('New Group')}
</Button>
</MediaQuery>
<MediaQuery query="(max-width: 767.8px)">
<Button color="btn btn-secondary operation-item my-1" onClick={this.props.toggleAddGroupModal}>
<i className="fas fa-plus-square text-secondary mr-1"></i>{gettext('New Group')}
</Button>
</MediaQuery>
</div>
</div>
<CommonToolbar searchPlaceholder={this.props.searchPlaceholder} onSearchedClick={onSearchedClick}/>

4
frontend/src/components/wiki-markdown-viewer.js
View File

@@ -234,9 +234,11 @@ class WikiMarkdownViewer extends React.Component {
if (this.props.isFileLoading) {
return <Loading />;
}
// In dir-column-file repoID is one of props, width is 100%; In wiki-viewer repoID is not props, width isn't 100%
let contentClassName = `${this.props.repoID ? contentClass + ' w-100' : contentClass}`
return (
<div ref={this.markdownContainer} className="wiki-page-container" onScroll={this.onScrollHandler.bind(this)}>
<div className={contentClass}>
<div className={contentClassName}>
{this.props.children}
{this.renderMarkdown()}
{this.props.isWiki && this.renderRelatedFiles()}

2
frontend/src/css/wiki.css
View File

@@ -101,7 +101,7 @@ img[src=""] {
width: 100%;
padding-right: 0;
}
.cur-view-content .markdown-outline {
.cur-view-content .seafile-markdown-outline {
display: none;
}
}

8
frontend/src/pages/shared-with-all/public-shared-view.js
View File

@@ -1,6 +1,7 @@
import React, { Fragment } from 'react';
import PropTypes from 'prop-types';
import cookie from 'react-cookies';
import MediaQuery from 'react-responsive';
import { Dropdown, DropdownToggle, DropdownMenu, DropdownItem} from 'reactstrap';
import { seafileAPI } from '../../utils/seafile-api';
import { gettext, loginUrl, canAddPublicRepo } from '../../utils/constants';
@@ -174,9 +175,16 @@ class PublicSharedView extends React.Component {
<span className="sf2-icon-menu side-nav-toggle hidden-md-up d-md-none" title="Side Nav Menu" onClick={this.props.onShowSidePanel}></span>
<div className="operation">
<Dropdown isOpen={this.state.isCreateMenuShow} toggle={this.onAddRepoToggle}>
<MediaQuery query="(min-width: 768px)">
<DropdownToggle className='btn btn-secondary operation-item'>
<i className="fas fa-plus-square text-secondary mr-1"></i>{gettext('Add Library')}
</DropdownToggle>
</MediaQuery>
<MediaQuery query="(max-width: 767.8px)">
<DropdownToggle className='btn btn-secondary operation-item my-1'>
<i className="fas fa-plus-square text-secondary mr-1"></i>{gettext('Add Library')}
</DropdownToggle>
</MediaQuery>
<DropdownMenu>
<DropdownItem onClick={this.onSelectRepoToggle}>{gettext('Share existing libraries')}</DropdownItem>
<DropdownItem onClick={this.onCreateRepoToggle}>{gettext('New Library')}</DropdownItem>

12
frontend/src/pages/wiki/main-panel.js
View File

@@ -1,5 +1,6 @@
import React, { Component, Fragment } from 'react';
import PropTypes from 'prop-types';
import MediaQuery from 'react-responsive';
import { gettext, repoID, slug, siteRoot, username } from '../../utils/constants';
import CommonToolbar from '../../components/toolbar/common-toolbar';
import WikiMarkdownViewer from '../../components/wiki-markdown-viewer';
@@ -78,9 +79,14 @@ class MainPanel extends Component {
<Fragment>
<div className="cur-view-toolbar">
<span className="sf2-icon-menu hidden-md-up d-md-none side-nav-toggle" title="Side Nav Menu" onClick={this.onMenuClick}></span>
{this.props.permission === 'rw' && (
<button className="btn btn-secondary operation-item my-1" title="Edit" onClick={this.onEditClick}>{gettext('Edit')}</button>
)}
<MediaQuery query="(min-width: 768px)">
{this.props.permission === 'rw' &&
<button className="btn btn-secondary operation-item" title="Edit" onClick={this.onEditClick}>{gettext('Edit')}</button>}
</MediaQuery>
<MediaQuery query="(max-width: 767.8px)">
{this.props.permission === 'rw' &&
<button className="btn btn-secondary operation-item my-1" title="Edit" onClick={this.onEditClick}>{gettext('Edit')}</button>}
</MediaQuery>
</div>
<CommonToolbar
repoID={repoID}

14
frontend/src/pages/wikis/wikis.js
View File

@@ -1,6 +1,7 @@
import React, { Component, Fragment } from 'react';
import PropTypes from 'prop-types';
import { Button } from 'reactstrap';
import MediaQuery from 'react-responsive';
import { seafileAPI } from '../../utils/seafile-api';
import { gettext, loginUrl, canPublishRepo } from '../../utils/constants';
import toaster from '../../components/toast';
@@ -128,11 +129,14 @@ class Wikis extends Component {
<div className="cur-view-toolbar">
<span className="sf2-icon-menu side-nav-toggle hidden-md-up d-md-none" title="Side Nav Menu" onClick={this.props.onShowSidePanel}></span>
<div className="operation">
{canPublishRepo &&
<Button className="btn btn-secondary operation-item my-1" onClick={this.onSelectToggle}>
{gettext('Publish a Library')}
</Button>
}
{canPublishRepo && <Fragment>
<MediaQuery query="(min-width: 768px)">
<Button className="btn btn-secondary operation-item" onClick={this.onSelectToggle}>{gettext('Publish a Library')}</Button>
</MediaQuery>
<MediaQuery query="(max-width: 767.8px)">
<Button className="btn btn-secondary operation-item my-1" onClick={this.onSelectToggle}>{gettext('Publish a Library')}</Button>
</MediaQuery>
</Fragment>}
</div>
</div>
<CommonToolbar onSearchedClick={this.props.onSearchedClick} />