Bump version. Add settings to hide Twitch Prime offers and to show minimal navigation when in theatre mode.

changelog.html

@@ -1,3 +1,13 @@
+<div class="list-header">4.0.0-beta2.1<span>@1a56c5fabae6fb37d845</span> <time datetime="2018-04-07">(2018-04-07)</time></div>
+<ul class="chat-menu-content menu-side-padding">
+	<li>Added several settings to configure the emote menu.</li>
+	<li>Added: Setting to display minimized navigation at the top of the page when in theatre mode.</li>
+	<li>Added: Setting to hide Twitch Prime offers.</li>
+	<li>Fixed: Tab-completion not updating correctly when navigating to another channel.</li>
+	<li>Fixed: Chat rendering failure when we receive conflicting user ID &lt;-&gt; username mappings.</li>
+	<li>Fixed: The emote menu erroring out if you aren't logged in.</li>
+</ul>
+
 <div class="list-header">4.0.0-beta2<span>@65ca9bedbd1b59ec8df4</span> <time datetime="2018-04-06">(2018-04-06)</time></div>
 <ul class="chat-menu-content menu-side-padding">
 	<li>Added: Emote Menu</li>

src/main.js

@@ -95,7 +95,7 @@ class FrankerFaceZ extends Module {
 FrankerFaceZ.Logger = Logger;
 
 const VER = FrankerFaceZ.version_info = {
-	major: 4, minor: 0, revision: 0, extra: '-beta2',
+	major: 4, minor: 0, revision: 0, extra: '-beta2.1',
 	build: __webpack_hash__,
 	toString: () =>
 		`${VER.major}.${VER.minor}.${VER.revision}${VER.extra || ''}${DEBUG ? '-dev' : ''}`

src/sites/twitch-twilight/modules/css_tweaks/index.js

@@ -17,6 +17,8 @@ const CLASSES = {
 	'side-closed-friends': '.side-nav--collapsed .online-friends',
 	'side-closed-rec-channels': '.side-nav--collapsed .recommended-channels',
 
+	'prime-offers': '.top-nav__prime',
+
 	'player-ext': '.player .extension-overlay',
 	'player-ext-hover': '.player:not([data-controls="true"]) .extension-overlay',
 
@@ -112,7 +114,7 @@ export default class CSSTweaks extends Module {
 		this.settings.add('layout.swap-sidebars', {
 			default: false,
 			ui: {
-				path: 'Appearance > Layout >> General',
+				path: 'Appearance > Layout >> Side Navigation',
 				title: 'Swap Sidebars',
 				description: 'Swap navigation and chat to the opposite sides of the window.',
 
@@ -122,9 +124,14 @@ export default class CSSTweaks extends Module {
 		});
 
 		this.settings.add('layout.minimal-navigation', {
+			requires: ['layout.theatre-navigation'],
 			default: false,
+			process(ctx, val) {
+				return ctx.get('layout.theatre-navigation') ?
+					true : val;
+			},
 			ui: {
-				path: 'Appearance > Layout >> General',
+				path: 'Appearance > Layout >> Top Navigation',
 				title: 'Minimize Navigation',
 				description: "Slide the site navigation bar up out of view when it isn't in use.",
 
@@ -133,6 +140,30 @@ export default class CSSTweaks extends Module {
 			changed: val => this.toggle('minimal-navigation', val)
 		});
 
+		this.settings.add('layout.theatre-navigation', {
+			requires: ['context.ui.theatreModeEnabled'],
+			default: false,
+			process(ctx, val) {
+				return ctx.get('context.ui.theatreModeEnabled') ? val : false
+			},
+			ui: {
+				path: 'Appearance > Layout >> Top Navigation',
+				title: 'Show the minimized navigation bar when in theatre mode.',
+				component: 'setting-check-box'
+			},
+			changed: val => this.toggle('theatre-nav', val)
+		})
+
+		this.settings.add('layout.prime-offers', {
+			default: true,
+			ui: {
+				path: 'Appearance > Layout >> Top Navigation',
+				title: 'Show Twitch Prime offers.',
+				component: 'setting-check-box'
+			},
+			changed: val => this.toggleHide('prime-offers', !val)
+		});
+
 
 		// Chat
 
@@ -162,9 +193,11 @@ export default class CSSTweaks extends Module {
 	onEnable() {
 		this.toggle('swap-sidebars', this.settings.get('layout.swap-sidebars'));
 		this.toggle('minimal-navigation', this.settings.get('layout.minimal-navigation'));
+		this.toggle('theatre-nav', this.settings.get('layout.theatre-navigation'));
 
 		this.toggleHide('side-nav', !this.settings.get('layout.side-nav.show'));
 		this.toggleHide('side-rec-friends', !this.settings.get('layout.side-nav.show-rec-friends'));
+		this.toggleHide('prime-offers', !this.settings.get('layout.prime-offers'));
 
 		const recs = this.settings.get('layout.side-nav.show-rec-channels');
 		this.toggleHide('side-rec-channels', recs === 0);

src/sites/twitch-twilight/modules/css_tweaks/styles/theatre-nav.scss

@@ -0,0 +1,11 @@
+.twilight-root {
+	.top-nav {
+		z-index: 9999;
+	}
+
+	.persistent-player--theatre,
+	.right-column--theatre {
+		top: 1rem !important;
+		height: calc(100% - 1rem) !important;
+	}
+}