mirror of
https://github.com/zoriya/flood.git
synced 2025-12-20 14:15:15 +00:00
Improve directory view
This commit is contained in:
@@ -7,7 +7,7 @@ export default class File extends BaseIcon {
|
||||
return (
|
||||
<svg className={`icon icon--file ${this.props.className}`}
|
||||
xmlns={this.getXmlns()} viewBox={this.getViewBox()}>
|
||||
<path d="M49.4,15.3l-8.6-8.9c-1-1.1-3.1-1.9-4.5-1.9H11.4c-1.5,0-2.7,1.2-2.7,2.7v45.5c0,1.5,1.2,2.7,2.7,2.7h37.2 c1.5,0,2.7-1.2,2.7-2.7V20C51.3,18.5,50.4,16.4,49.4,15.3z M37.1,8.4C37.6,8.5,38,8.8,38.2,9l8.7,8.9c0.2,0.2,0.4,0.7,0.6,1.2H37.1 V8.4z M47.7,51.9H12.3V8.1h21.3V20c0,1.5,1.2,2.7,2.7,2.7h11.5V51.9z"/>
|
||||
<path d="M48.14,19.89V56a3,3,0,0,1-3,3H3a3,3,0,0,1-3-3V5.84a3,3,0,0,1,3-3H31.09A8.41,8.41,0,0,1,36.23,5L46,14.75A8.4,8.4,0,0,1,48.14,19.89Zm-4,3h-13a3,3,0,0,1-3-3v-13H4V55H44.13V22.89Zm-12-4H43.88a4,4,0,0,0-.69-1.29L33.38,7.79a4,4,0,0,0-1.28-.69V18.88Z"/>
|
||||
</svg>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -0,0 +1,18 @@
|
||||
import React from 'react';
|
||||
|
||||
import BaseIcon from './BaseIcon';
|
||||
|
||||
export default class FolderClosedOutline extends BaseIcon {
|
||||
render() {
|
||||
return (
|
||||
<svg className={`icon icon--directory-outlined ${this.props.className}`}
|
||||
xmlns={this.getXmlns()} viewBox={this.getViewBox()}>
|
||||
<path d="M52.3,47.47a7.07,7.07,0,0,1-7,7H7a7.07,7.07,0,0,1-7-7V17.29a7.07,7.07,0,0,1,7-7H17.1a7.07,7.07,0,0,1,7,7v1H45.26a7.07,7.07,0,0,1,7,7V47.47Zm-4-22.13a3,3,0,0,0-3-3H23.13a3,3,0,0,1-3-3v-2a3,3,0,0,0-3-3H7a3,3,0,0,0-3,3V47.47a3,3,0,0,0,3,3H45.26a3,3,0,0,0,3-3V25.34Z"/>
|
||||
</svg>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
FolderClosedOutline.defaultProps = {
|
||||
className: ''
|
||||
};
|
||||
@@ -7,7 +7,7 @@ export default class FolderOpenOutlined extends BaseIcon {
|
||||
return (
|
||||
<svg className={`icon icon--directory-outlined ${this.props.className}`}
|
||||
xmlns={this.getXmlns()} viewBox={this.getViewBox()}>
|
||||
<path d="M55.8,33c0,0.5-0.3,0.8-0.6,1.2l-9.2,11c-1.1,1.3-3.2,2.3-4.9,2.3H7.2c-0.7,0-1.7-0.2-1.7-1.1c0-0.5,0.3-0.8,0.6-1.2l9.2-11 c1.1-1.2,3.2-2.2,4.9-2.2h33.9C54.8,31.9,55.8,32.1,55.8,33z M20.2,28.1c-2.8,0-6.2,1.5-8,3.7l-8,9.5V15.5c0-1.6,1.3-2.9,3-2.9h10 c1.7,0,3,1.3,3,2.9v1.9c0,1.6,1.3,2.9,3,2.9h18c1.7,0,3,1.3,3,2.9v4.8H20.2z M59.8,33c0-0.7-0.2-1.4-0.5-2.1 c-0.9-1.9-3.1-2.9-5.2-2.9h-6v-4.8c0-3.7-3.1-6.8-7-6.8h-17v-1c0-3.7-3.1-6.8-7-6.8h-10c-3.8,0-7,3.1-7,6.8v29c0,3.7,3.1,6.8,7,6.8 h33.9c2.8,0,6.2-1.6,8-3.7l9.2-11C59.2,35.6,59.8,34.3,59.8,33z"/>
|
||||
<path d="M58.55,39.26L49.28,50.67a11.34,11.34,0,0,1-8,3.83H7a7.07,7.07,0,0,1-7-7V17.29a7.07,7.07,0,0,1,7-7H17.1a7.07,7.07,0,0,1,7,7v1h17.1a7.07,7.07,0,0,1,7,7v5h6a5.59,5.59,0,0,1,5.22,3A4.94,4.94,0,0,1,60,35.49,6.18,6.18,0,0,1,58.55,39.26Zm-14.3-8.9v-5a3,3,0,0,0-3-3H23.13a3,3,0,0,1-3-3v-2a3,3,0,0,0-3-3H7a3,3,0,0,0-3,3V44.1l8-9.9a11.22,11.22,0,0,1,8-3.84H44.25Zm10.06,4H20.11a7.25,7.25,0,0,0-4.93,2.33L5.94,48.13a2.19,2.19,0,0,0-.57,1.26c0,0.88,1,1.1,1.67,1.1h34.2a7.15,7.15,0,0,0,4.93-2.36l9.24-11.41A2,2,0,0,0,56,35.49C56,34.61,55,34.39,54.31,34.39Z"/>
|
||||
</svg>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
import React from 'react';
|
||||
|
||||
import FolderClosedOutlined from '../icons/FolderClosedOutlined';
|
||||
import FolderOpenOutlined from '../icons/FolderOpenOutlined';
|
||||
import DirectoryTree from './DirectoryTree';
|
||||
|
||||
@@ -39,11 +40,17 @@ export default class DirectoryTreeNode extends React.Component {
|
||||
render() {
|
||||
let classes = `directory-tree__branch directory-tree__branch--depth-${this.props.depth}`;
|
||||
|
||||
let icon = <FolderClosedOutlined />;
|
||||
|
||||
if (this.state.expanded) {
|
||||
icon = <FolderOpenOutlined />;
|
||||
}
|
||||
|
||||
return (
|
||||
<div className={classes}>
|
||||
<div className="directory-tree__node directory-tree__node--directory"
|
||||
onClick={this.handleDirectoryClick} title={this.props.directoryName}>
|
||||
<FolderOpenOutlined />
|
||||
{icon}
|
||||
{this.props.directoryName}
|
||||
</div>
|
||||
{this.getSubTree()}
|
||||
|
||||
Reference in New Issue
Block a user