Add font

minodisk · Feb 24, 2016 · 50f1db3 · 50f1db3
1 parent 955b7a1
commit 50f1db3
Show file tree

Hide file tree

Showing 5 changed files with 31 additions and 15 deletions.
diff --git a/server/static/bundle.js b/server/static/bundle.js
@@ -38442,6 +38442,7 @@
 	var React = __webpack_require__(1);
 	var Files_1 = __webpack_require__(209);
 	var Link_1 = __webpack_require__(214);
+	var classes = __webpack_require__(210);
 	var File = (function (_super) {
 	    __extends(File, _super);
 	    function File(props, context) {
@@ -38458,9 +38459,9 @@
 	        var _this = this;
 	        var file = this.props.file;
 	        if (file.children == null) {
-	            return (React.createElement(Link_1.default, {active: true, children: file.name, onClick: function () { return console.log('start'); }}));
+	            return (React.createElement("div", {className: classes.file}, React.createElement(Link_1.default, {active: true, children: file.name, onClick: function () { return console.log('start'); }})));
 	        }
-	        return (React.createElement("div", null, React.createElement(Link_1.default, {active: true, children: file.name, onClick: function () { return _this.toggleOpen(); }}), React.createElement(Files_1.default, {files: file.children, opened: this.state.opened})));
+	        return (React.createElement("div", {className: classes.dir}, React.createElement(Link_1.default, {active: true, children: file.name, onClick: function () { return _this.toggleOpen(); }}), React.createElement(Files_1.default, {files: file.children, opened: this.state.opened})));
 	    };
 	    return File;
 	}(React.Component));
@@ -38481,7 +38482,7 @@
 	var React = __webpack_require__(1);
 	var File_1 = __webpack_require__(208);
 	var classnames = __webpack_require__(207);
-	var style = __webpack_require__(210);
+	var classes = __webpack_require__(210);
 	var Files = (function (_super) {
 	    __extends(Files, _super);
 	    function Files() {
@@ -38490,8 +38491,8 @@
 	    Files.prototype.render = function () {
 	        var _a = this.props, files = _a.files, opened = _a.opened;
 	        return (React.createElement("ul", {className: classnames((_b = {},
-	            _b[style.files] = true,
-	            _b[style.closed] = !opened,
+	            _b[classes.files] = true,
+	            _b[classes.closed] = !opened,
 	            _b
 	        ))}, files.map(function (file) { return React.createElement("li", null, React.createElement(File_1.default, {file: file})); })));
 	        var _b;
@@ -38537,13 +38538,15 @@
 
 
 	// module
-	exports.push([module.id, ".h8rplDPLVeDLmTndCDi-3 {\n  width: 200px;\n  word-break: break-all;\n}\n._3XXpQACdS3nsvEH3aBhKLy {\n  padding-left: 15px;\n}\n._3__TbHfLgY6XY-FGzUZa5n {\n  display: none;\n}\n", ""]);
+	exports.push([module.id, ".h8rplDPLVeDLmTndCDi-3 {\n  width: 200px;\n  word-break: break-all;\n}\n._3XXpQACdS3nsvEH3aBhKLy {\n  list-style-type: none;\n  padding-left: 15px;\n}\n._3__TbHfLgY6XY-FGzUZa5n {\n  display: none;\n}\n._10PwQgq9AmdjFjsJNSjIRo:before {\n  content: '\\25A1';\n}\n._2PMYQm-qMrv_5b6GmzyQvH:before {\n  content: '\\25BC';\n}\n", ""]);
 
 	// exports
 	exports.locals = {
 		"header": "h8rplDPLVeDLmTndCDi-3",
 		"files": "_3XXpQACdS3nsvEH3aBhKLy",
-		"closed": "_3__TbHfLgY6XY-FGzUZa5n"
+		"closed": "_3__TbHfLgY6XY-FGzUZa5n",
+		"file": "_10PwQgq9AmdjFjsJNSjIRo",
+		"dir": "_2PMYQm-qMrv_5b6GmzyQvH"
 	};
 
 /***/ },

diff --git a/server/static/index.html b/server/static/index.html
@@ -4,6 +4,7 @@
   <title>TodoMVC</title>
   <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
 
+  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
   <script src="http://localhost:35729/livereload.js"></script>
 </head>
 <body>

diff --git a/server/static/src/components/File.tsx b/server/static/src/components/File.tsx
@@ -4,6 +4,8 @@ import Files from './Files'
 import Link from './Link'
 import * as models from '../models/files'
 
+const classes = require('../styles/header.styl')
+
 interface FileProps {
   file: models.File
 }
@@ -29,14 +31,16 @@ export default class File extends React.Component<FileProps, FileState> {
     const {file} = this.props
     if (file.children == null) {
       return (
-        <Link
-          active={true}
-          children={file.name}
-          onClick={() => console.log('start')} />
+        <div className={classes.file}>
+          <Link
+            active={true}
+            children={file.name}
+            onClick={() => console.log('start')} />
+        </div>
       )
     }
     return (
-      <div>
+      <div className={classes.dir}>
         <Link
           active={true}
           children={file.name}

diff --git a/server/static/src/components/Files.tsx b/server/static/src/components/Files.tsx
@@ -4,7 +4,7 @@ import File from './File'
 import * as models from '../models/files'
 import * as classnames from 'classnames'
 
-const style = require('../styles/header.styl')
+const classes = require('../styles/header.styl')
 
 interface FilesProps {
   files: models.File[]
@@ -16,8 +16,8 @@ export default class Files extends React.Component<FilesProps, void> {
     const {files, opened} = this.props
     return (
       <ul className={classnames({
-        [style.files]: true,
-        [style.closed]: !opened
+        [classes.files]: true,
+        [classes.closed]: !opened
       })}>
       {
         files.map((file) => <li><File file={file} /></li>)

diff --git a/server/static/src/styles/header.styl b/server/static/src/styles/header.styl
@@ -3,6 +3,14 @@
     width 200px
     word-break break-all
   .files
+    list-style-type none
     padding-left 15px
   .closed
     display none
+
+  .file
+    &:before
+      content '□'
+  .dir
+    &:before
+      content '▼'