feat breadcrumb.back: add back button

build/main.js

@@ -30280,10 +30280,21 @@ var Breadcrumb = (function (_Component) {
         _react2['default'].createElement(
           'div',
           null,
+          _react2['default'].createElement('span', { onClick: this.goUp, className: 'icon-up' }),
           els
         )
       );
     }
+  }, {
+    key: 'goUp',
+    value: function goUp() {
+      var current = store.getState().get('cwd');
+      var up = current.split('/').slice(0, -1).join('/');
+
+      if (up === current) return;
+
+      store.dispatch((0, _actionsChangedir2['default'])(up));
+    }
   }]);
 
   var _Breadcrumb = Breadcrumb;

build/style.css

@@ -59,6 +59,19 @@
 .icon-cross svg * {
   fill: white;
 }
+.icon-up {
+  display: block;
+  display: inline-block;
+  border: 11px solid transparent;
+  border-right-color: #63b0cd;
+  border-top-width: 8px;
+  border-bottom-width: 8px;
+  border-radius: 3px;
+  margin-right: 0.5rem;
+  position: relative;
+  top: 2px;
+  right: 0.5rem;
+}
 .regular-medium {
   font-weight: normal;
 }
@@ -365,7 +378,9 @@ header button {
   background: none;
   border: none;
   width: 8rem;
-  height: 4rem;
+  height: 3rem;
+  padding-top: 1rem;
+  margin-top: -1rem;
 }
 header button::before {
   content: '';

src/js/components/breadcrumb.js

@@ -41,11 +41,21 @@ export default class Breadcrumb extends Component {
     return (
       <div className='breadcrumb'>
         <div>
+          <span onClick={this.goUp} className='icon-up'></span>
           {els}
         </div>
       </div>
     );
   }
+
+  goUp() {
+    let current = store.getState().get('cwd');
+    let up = current.split('/').slice(0, -1).join('/');
+
+    if (up === current) return;
+
+    store.dispatch(changedir(up));
+  }
 }
 
 function props(state) {

src/less/components/header.less

@@ -28,7 +28,9 @@ header {
     border: none;
 
     width: 8rem;
-    height: 4rem;
+    height: 3rem;
+    padding-top: 1rem;
+    margin-top: -1rem;
 
     &::before {
       content: '';

src/less/icons.less

@@ -65,3 +65,20 @@
     fill: white;
   }
 }
+
+.icon-up {
+  .icon;
+  display: inline-block;
+
+  border: 11px solid transparent;
+  border-right-color: @blue;
+  border-top-width: 8px;
+  border-bottom-width: 8px;
+  border-radius: 3px;
+
+  margin-right: 0.5rem;
+
+  position: relative;
+  top: 2px;
+  right: 0.5rem;
+}