From 7c9c07a4cf48b24eda0de1afc3665a1ef02c5daa Mon Sep 17 00:00:00 2001
From: Tanner Collin <git@tannercollin.com>
Date: Wed, 10 Aug 2022 04:05:25 +0000
Subject: [PATCH] Hide fullscreen button if it's not available

---
 webclient/src/App.js         | 16 +++++++++++-----
 webclient/src/Style-dark.css |  1 +
 webclient/src/Style-red.css  |  1 +
 3 files changed, 13 insertions(+), 5 deletions(-)

diff --git a/webclient/src/App.js b/webclient/src/App.js
index 56de518..3ec3e45 100644
--- a/webclient/src/App.js
+++ b/webclient/src/App.js
@@ -73,6 +73,10 @@ class App extends React.Component {
 	render() {
 		const theme = this.state.theme;
 		document.body.style.backgroundColor = theme ? '#000' : '#eeeeee';
+		const fullScreenAvailable = document.fullscreenEnabled ||
+			document.mozFullscreenEnabled ||
+			document.webkitFullscreenEnabled ||
+			document.msFullscreenEnabled;
 
 		return (
 			<div className={theme}>
@@ -87,11 +91,13 @@ class App extends React.Component {
 						</p>
 						<Route path='/(|search)' component={Search} />
 						<Route path='/(|search)' component={Submit} />
-						<Route path='/(|search)' render={() => !document.fullscreenElement ?
-							<button className='fullscreen' onClick={() => this.goFullScreen()}>Enter Fullscreen</button>
-						:
-							<button className='fullscreen' onClick={() => this.exitFullScreen()}>Exit Fullscreen</button>
-						} />
+						{fullScreenAvailable &&
+							<Route path='/(|search)' render={() => !document.fullscreenElement ?
+								<button className='fullscreen' onClick={() => this.goFullScreen()}>Enter Fullscreen</button>
+							:
+								<button className='fullscreen' onClick={() => this.exitFullScreen()}>Exit Fullscreen</button>
+							} />
+						}
 					</div>
 
 					<Route path='/' exact render={(props) => <Feed {...props} updateCache={this.updateCache} />} />
diff --git a/webclient/src/Style-dark.css b/webclient/src/Style-dark.css
index d4c9630..2ce97f1 100644
--- a/webclient/src/Style-dark.css
+++ b/webclient/src/Style-dark.css
@@ -43,6 +43,7 @@
 	text-decoration: none;
 }
 
+.dark .story-text video,
 .dark .story-text img {
 	filter: brightness(50%);
 }
diff --git a/webclient/src/Style-red.css b/webclient/src/Style-red.css
index e0afd1a..c874c4b 100644
--- a/webclient/src/Style-red.css
+++ b/webclient/src/Style-red.css
@@ -59,6 +59,7 @@
 	text-decoration: none;
 }
 
+.red .story-text video,
 .red .story-text img {
 	filter: grayscale(100%) brightness(20%) sepia(100%) hue-rotate(-50deg) saturate(600%) contrast(0.8);
 }