diff --git a/js/page/watch.js b/js/page/watch.js
index c58d10281..4825049f2 100644
--- a/js/page/watch.js
+++ b/js/page/watch.js
@@ -1,4 +1,6 @@
import React from 'react';
+import {Icon} from '../component/common.js';
+import {Link} from '../component/link.js';
import lbry from '../lbry.js';
import LoadScreen from '../component/load_screen.js'
@@ -22,6 +24,9 @@ var WatchPage = React.createClass({
lbry.getStream(this.props.name);
this.updateLoadStatus();
},
+ handleBackClicked: function() {
+ history.back();
+ },
updateLoadStatus: function() {
lbry.getFileStatus(this.props.name, (status) => {
if (!status || !['running', 'stopped'].includes(status.code) || status.written_bytes == 0) {
@@ -56,8 +61,19 @@ var WatchPage = React.createClass({
return (
!this.state.readyToPlay
?
- :
+ :
+
);
}
diff --git a/scss/all.scss b/scss/all.scss
index 452cbbcac..8729eb666 100644
--- a/scss/all.scss
+++ b/scss/all.scss
@@ -10,4 +10,5 @@
@import "component/_menu.scss";
@import "component/_tooltip.scss";
@import "component/_load-screen.scss";
-@import "page/_developer.scss";
\ No newline at end of file
+@import "page/_developer.scss";
+@import "page/_watch.scss";
\ No newline at end of file
diff --git a/scss/page/_watch.scss b/scss/page/_watch.scss
new file mode 100644
index 000000000..ab3c9a577
--- /dev/null
+++ b/scss/page/_watch.scss
@@ -0,0 +1,50 @@
+.video {
+ background: #000;
+}
+
+.video__overlay {
+ position: absolute;
+ top: 0px;
+ bottom: 0px;
+ left: 0px;
+ right: 0px;
+ color: #fff;
+ z-index: 1;
+}
+
+.video__back {
+ margin-top: 30px;
+ margin-left: 50px;
+ display: flex;
+ flex-direction: row;
+ align-items: center;
+}
+
+.video__back-link {
+ font-size: 50px;
+}
+
+.video__back-label {
+ opacity: 0;
+ transition: opacity 100ms ease-in;
+}
+
+.video__back-link:hover + .video__back-label {
+ opacity: 1;
+}
+
+.video__back-label-arrow {
+ color: darken($color-primary, 5%);
+ font-size: 20px;
+}
+
+.video__back-label-content {
+ display: inline-block;
+ margin-left: -2px;
+ font-size: 20px;
+ padding: 10px;
+ border-radius: 3px;
+ background-color: darken($color-primary, 5%);
+ color: #fff;
+ pointer-events: none;
+}