From cdd641a40ca696e97b8b12a07db6bdb9b2114725 Mon Sep 17 00:00:00 2001
From: Scrub <72096833+ScrubN@users.noreply.github.com>
Date: Fri, 29 Mar 2024 23:11:35 -0400
Subject: [PATCH] Fix WPF styling (#1020)

* Remove AppRadio brush :(

* Fix margins and add explicit separators to PageChatRender

* Manually add file extensions to circumvent new SaveFileDialog behavior
After the recent WPF update, SaveFileDialog no longer appends the filtered extension if the FileName already has an extension, regardless of whether said extension is correct or not according to the filter. This is a problem when streams have a URL at the end of the title
---
 TwitchDownloaderWPF/App.xaml                 |   2 +-
 TwitchDownloaderWPF/PageChatDownload.xaml    |  18 +-
 TwitchDownloaderWPF/PageChatDownload.xaml.cs |  28 +-
 TwitchDownloaderWPF/PageChatRender.xaml      | 257 ++++++++++---------
 TwitchDownloaderWPF/PageChatUpdate.xaml      |  18 +-
 TwitchDownloaderWPF/PageChatUpdate.xaml.cs   |  29 ++-
 TwitchDownloaderWPF/PageClipDownload.xaml    |   2 +-
 TwitchDownloaderWPF/PageClipDownload.xaml.cs |   2 +-
 TwitchDownloaderWPF/PageQueue.xaml           |   8 +-
 TwitchDownloaderWPF/PageVodDownload.xaml     |   8 +-
 TwitchDownloaderWPF/PageVodDownload.xaml.cs  |   2 +-
 TwitchDownloaderWPF/Themes/Dark.xaml         |   2 +-
 TwitchDownloaderWPF/Themes/Light.xaml        |   2 +-
 TwitchDownloaderWPF/WindowQueueOptions.xaml  |  10 +-
 TwitchDownloaderWPF/WindowSettings.xaml      |  16 +-
 15 files changed, 222 insertions(+), 182 deletions(-)

diff --git a/TwitchDownloaderWPF/App.xaml b/TwitchDownloaderWPF/App.xaml
index 6dd4a03c..6c6c13e5 100644
--- a/TwitchDownloaderWPF/App.xaml
+++ b/TwitchDownloaderWPF/App.xaml
@@ -22,7 +22,7 @@
             <SolidColorBrush x:Key="AppInnerTextDisabled" Color="#A6A6A6" />
             <SolidColorBrush x:Key="AppHyperlink" Color="#0066CC" />
             <SolidColorBrush x:Key="AppCheckBox" Color="#3A96F2" />
-            <SolidColorBrush x:Key="AppRadio" Color="#2388ED" />
+            <!-- <SolidColorBrush x:Key="AppRadio" Color="#2388ED" /> DEPRECATED :( -->
             <SolidColorBrush x:Key="AppDivider" Color="#E0E0E0" />
             <SolidColorBrush x:Key="AppDividerText" Color="#212121" />
 
diff --git a/TwitchDownloaderWPF/PageChatDownload.xaml b/TwitchDownloaderWPF/PageChatDownload.xaml
index c95fbf85..47b976ed 100644
--- a/TwitchDownloaderWPF/PageChatDownload.xaml
+++ b/TwitchDownloaderWPF/PageChatDownload.xaml
@@ -66,10 +66,10 @@
         <StackPanel Grid.Row="2" Grid.Column="2" Grid.ColumnSpan="2" Margin="0,20,0,0" Orientation="Horizontal" HorizontalAlignment="Center">
             <StackPanel HorizontalAlignment="Left">
                 <TextBlock Text="{lex:Loc Length}" HorizontalAlignment="Right" Foreground="{DynamicResource AppText}" />
-                <TextBlock Text="{lex:Loc DownloadFormat}" HorizontalAlignment="Right" Margin="0,13,0,0" Foreground="{DynamicResource AppText}" />
-                <TextBlock Visibility="Visible" x:Name="compressionText" Text="{lex:Loc ChatCompression}" HorizontalAlignment="Right" Margin="0,15,0,0" Foreground="{DynamicResource AppText}" />
-                <TextBlock Visibility="Collapsed" x:Name="timeText" Text="{lex:Loc TimestampFormat}" HorizontalAlignment="Right" Margin="0,15,0,0" Foreground="{DynamicResource AppText}" />
-                <TextBlock x:Name="textCrop" Text="{lex:Loc ChatCrop}" HorizontalAlignment="Right" Margin="0,12,0,36" Foreground="{DynamicResource AppText}" />
+                <TextBlock Text="{lex:Loc DownloadFormat}" HorizontalAlignment="Right" Margin="0,12,0,0" Foreground="{DynamicResource AppText}" />
+                <TextBlock Visibility="Visible" x:Name="compressionText" Text="{lex:Loc ChatCompression}" HorizontalAlignment="Right" Margin="0,14,0,0" Foreground="{DynamicResource AppText}" />
+                <TextBlock Visibility="Collapsed" x:Name="timeText" Text="{lex:Loc TimestampFormat}" HorizontalAlignment="Right" Margin="0,8,0,0" Foreground="{DynamicResource AppText}" />
+                <TextBlock x:Name="textCrop" Text="{lex:Loc ChatCrop}" HorizontalAlignment="Right" Margin="0,10,0,33" Foreground="{DynamicResource AppText}" />
                 <StackPanel x:Name="stackEmbedText" Visibility="Visible">
                     <TextBlock HorizontalAlignment="Right" Margin="0,8,0,0" Foreground="{DynamicResource AppText}" ><Run Text="{lex:Loc EmbedImages}"/><Hyperlink ToolTipService.ShowDuration="30000" Foreground="{DynamicResource AppHyperlink}"><Hyperlink.ToolTip><Run Text="{lex:Loc EmbedImagesTooltip}"/></Hyperlink.ToolTip>(?)</Hyperlink>:</TextBlock>
                     <TextBlock HorizontalAlignment="Right" Margin="0,8,0,0" Foreground="{DynamicResource AppText}" ><Run Text="{lex:Loc ThirdPartyEmotes}"/><Hyperlink ToolTipService.ShowDuration="30000" Foreground="{DynamicResource AppHyperlink}"><Hyperlink.ToolTip><Run Text="{lex:Loc ThirdPartyEmotesTooltip}"/></Hyperlink.ToolTip>(?)</Hyperlink>:</TextBlock>
@@ -84,13 +84,13 @@
                     <RadioButton x:Name="radioHTML" Content="HTML" Checked="radioHTML_Checked" Background="{DynamicResource AppElementBackground}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}" />
                 </hc:ButtonGroup>
                 <StackPanel Visibility="Visible" x:Name="compressionOptions" Margin="5,8,0,0" Orientation="Horizontal">
-                    <RadioButton x:Name="radioCompressionNone" IsChecked="True" Content="{lex:Loc ChatCompressionNone}" Margin="3,0,0,0" Background="{DynamicResource AppRadio}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}" />
-                    <RadioButton x:Name="radioCompressionGzip" Content="{lex:Loc ChatCompressionGzip}" Margin="3,0,0,0" Background="{DynamicResource AppRadio}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}" />
+                    <RadioButton x:Name="radioCompressionNone" IsChecked="True" Content="{lex:Loc ChatCompressionNone}" Margin="3,0,0,0" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}" />
+                    <RadioButton x:Name="radioCompressionGzip" Content="{lex:Loc ChatCompressionGzip}" Margin="3,0,0,0" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}" />
                 </StackPanel>
                 <StackPanel Visibility="Collapsed" x:Name="timeOptions" Margin="5,8,0,0" Orientation="Horizontal">
-                    <RadioButton x:Name="radioTimestampUTC" IsChecked="True" Content="{lex:Loc TimestampUtc}" Background="{DynamicResource AppRadio}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}" />
-                    <RadioButton x:Name="radioTimestampRelative" Content="{lex:Loc TimestampRelative}" Margin="3,0,0,0" Background="{DynamicResource AppRadio}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}" />
-                    <RadioButton x:Name="radioTimestampNone" Content="{lex:Loc TimestampNone}" Margin="3,0,0,0" Background="{DynamicResource AppRadio}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}" />
+                    <RadioButton x:Name="radioTimestampUTC" IsChecked="True" Content="{lex:Loc TimestampUtc}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}" />
+                    <RadioButton x:Name="radioTimestampRelative" Content="{lex:Loc TimestampRelative}" Margin="3,0,0,0" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}" />
+                    <RadioButton x:Name="radioTimestampNone" Content="{lex:Loc TimestampNone}" Margin="3,0,0,0" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}" />
                 </StackPanel>
                 <StackPanel Margin="5,5,0,0">
                     <StackPanel Orientation="Horizontal">
diff --git a/TwitchDownloaderWPF/PageChatDownload.xaml.cs b/TwitchDownloaderWPF/PageChatDownload.xaml.cs
index f2ef7ae7..f570ec91 100644
--- a/TwitchDownloaderWPF/PageChatDownload.xaml.cs
+++ b/TwitchDownloaderWPF/PageChatDownload.xaml.cs
@@ -447,23 +447,37 @@ private async void SplitBtnDownload_Click(object sender, RoutedEventArgs e)
                 return;
             }
 
-            SaveFileDialog saveFileDialog = new SaveFileDialog();
+            var saveFileDialog = new SaveFileDialog
+            {
+                FileName = FilenameService.GetFilename(Settings.Default.TemplateChat, textTitle.Text, downloadId, currentVideoTime, textStreamer.Text,
+                    checkCropStart.IsChecked == true ? new TimeSpan((int)numStartHour.Value, (int)numStartMinute.Value, (int)numStartSecond.Value) : TimeSpan.Zero,
+                    checkCropEnd.IsChecked == true ? new TimeSpan((int)numEndHour.Value, (int)numEndMinute.Value, (int)numEndSecond.Value) : vodLength,
+                    viewCount.ToString(), game)
+            };
+
             if (radioJson.IsChecked == true)
             {
                 if (radioCompressionNone.IsChecked == true)
+                {
                     saveFileDialog.Filter = "JSON Files | *.json";
+                    saveFileDialog.FileName += ".json";
+                }
                 else if (radioCompressionGzip.IsChecked == true)
+                {
                     saveFileDialog.Filter = "GZip JSON Files | *.json.gz";
+                    saveFileDialog.FileName += ".json.gz";
+                }
             }
             else if (radioHTML.IsChecked == true)
-                saveFileDialog.Filter = "HTML Files | *.html;*.htm";
+            {
+                saveFileDialog.Filter = "HTML Files | *.html";
+                saveFileDialog.FileName += ".html";
+            }
             else if (radioText.IsChecked == true)
+            {
                 saveFileDialog.Filter = "TXT Files | *.txt";
-
-            saveFileDialog.FileName = FilenameService.GetFilename(Settings.Default.TemplateChat, textTitle.Text, downloadId, currentVideoTime, textStreamer.Text,
-                checkCropStart.IsChecked == true ? new TimeSpan((int)numStartHour.Value, (int)numStartMinute.Value, (int)numStartSecond.Value) : TimeSpan.Zero,
-                checkCropEnd.IsChecked == true ? new TimeSpan((int)numEndHour.Value, (int)numEndMinute.Value, (int)numEndSecond.Value) : vodLength,
-                viewCount.ToString(), game);
+                saveFileDialog.FileName += ".txt";
+            }
 
             if (saveFileDialog.ShowDialog() != true)
             {
diff --git a/TwitchDownloaderWPF/PageChatRender.xaml b/TwitchDownloaderWPF/PageChatRender.xaml
index fab704bd..caedea67 100644
--- a/TwitchDownloaderWPF/PageChatRender.xaml
+++ b/TwitchDownloaderWPF/PageChatRender.xaml
@@ -40,136 +40,149 @@
             <RowDefinition Height="28"/>
         </Grid.RowDefinitions>
 
-        <TabControl Grid.Row="2" Grid.Column="1" Grid.ColumnSpan="3" Margin="0,0,20,0" Background="{DynamicResource AppBackground}" BorderThickness="1">
+        <TabControl Grid.Row="2" Grid.Column="1" Grid.ColumnSpan="3" Margin="0,0,20,0" Background="{DynamicResource AppBackground}" BorderThickness="0">
             <TabItem Header="{lex:Loc RenderTabGeneral}" Background="{DynamicResource AppBackground}" Foreground="{DynamicResource AppText}">
-                <DockPanel Background="{DynamicResource AppBackground}">
-                    <StackPanel Orientation="Vertical" Margin="5,10,5,5">
-                        <TextBlock Text="{lex:Loc ChatWidth}" HorizontalAlignment="Right" Margin="0,5,0,0" Foreground="{DynamicResource AppText}"/>
-                        <TextBlock Text="{lex:Loc ChatHeight}" HorizontalAlignment="Right" Margin="0,22,0,0" Foreground="{DynamicResource AppText}"/>
-                    </StackPanel>
-                    <StackPanel Orientation="Vertical" Margin="0,10,0,5">
-                        <TextBox x:Name="textWidth" Text="12" Width="75" HorizontalAlignment="Left" Background="{DynamicResource AppElementBackground}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}"/>
-                        <TextBox x:Name="textHeight" Text="12" Width="75" HorizontalAlignment="Left" Margin="0,7,0,0" Background="{DynamicResource AppElementBackground}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}"/>
-                    </StackPanel>
-                    <StackPanel Orientation="Vertical" Margin="5,10,5,5">
-                        <TextBlock Text="{lex:Loc ChatFont}" HorizontalAlignment="Right" Margin="0,5,0,0" Foreground="{DynamicResource AppText}"/>
-                        <TextBlock Text="{lex:Loc ChatFontSize}" HorizontalAlignment="Right" Margin="0,21,0,0" Foreground="{DynamicResource AppText}"/>
-                        <TextBlock Text="{lex:Loc FontColor}" HorizontalAlignment="Right" Margin="0,16,0,0" Foreground="{DynamicResource AppText}"/>
-                        <TextBlock Text="{lex:Loc BackgroundColor}" HorizontalAlignment="Right" Margin="0,12,0,0" Foreground="{DynamicResource AppText}"/>
-                        <TextBlock Text="{lex:Loc AlternateBackgroundColor}" HorizontalAlignment="Right" Margin="0,12,0,0" Foreground="{DynamicResource AppText}"/>
-                    </StackPanel>
-                    <StackPanel Orientation="Vertical" Margin="0,10,0,5">
-                        <ComboBox x:Name="comboFont" MinWidth="180" MaxWidth="300" HorizontalAlignment="Left" Background="{DynamicResource AppElementBackground}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}"/>
-                        <hc:NumericUpDown x:Name="numFontSize" Value="12" Width="75" HorizontalAlignment="Left" Margin="0,7,0,0" Minimum="1" Background="{DynamicResource AppElementBackground}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}" />
-                        <xctk:ColorPicker x:Name="colorFont" SelectedColor="#FFFFFF" Width="50" UsingAlphaChannel="False" Margin="0,5,0,0" HorizontalAlignment="Left" Background="White" BorderBrush="{DynamicResource AppElementInnerBorder}" DropDownBackground="{DynamicResource AppElementInnerBackground}" Foreground="{DynamicResource AppText}" HeaderBackground="{DynamicResource AppElementInnerBackground}" HeaderForeground="{DynamicResource AppText}" TabBackground="{DynamicResource AppElementBorder}" TabForeground="{DynamicResource AppText}"/>
-                        <xctk:ColorPicker x:Name="colorBackground" SelectedColor="#111111" Width="50" UsingAlphaChannel="True" Margin="0,5,0,0" HorizontalAlignment="Left" Background="White" BorderBrush="{DynamicResource AppElementInnerBorder}" DropDownBackground="{DynamicResource AppElementInnerBackground}" Foreground="{DynamicResource AppText}" HeaderBackground="{DynamicResource AppElementInnerBackground}" HeaderForeground="{DynamicResource AppText}" TabBackground="{DynamicResource AppElementBorder}" TabForeground="{DynamicResource AppText}"/>
-                        <xctk:ColorPicker x:Name="colorAlternateBackground" SelectedColor="#191919" Width="50" UsingAlphaChannel="True" Margin="0,5,0,0" HorizontalAlignment="Left" Background="White" BorderBrush="{DynamicResource AppElementInnerBorder}" DropDownBackground="{DynamicResource AppElementInnerBackground}" Foreground="{DynamicResource AppText}" HeaderBackground="{DynamicResource AppElementInnerBackground}" HeaderForeground="{DynamicResource AppText}" TabBackground="{DynamicResource AppElementBorder}" TabForeground="{DynamicResource AppText}"/>
-                    </StackPanel>
-                </DockPanel>
+                <StackPanel>
+                    <Separator Margin="0" />
+                    <DockPanel Background="{DynamicResource AppBackground}">
+                        <StackPanel Orientation="Vertical" Margin="5,10,5,5">
+                            <TextBlock Text="{lex:Loc ChatWidth}" HorizontalAlignment="Right" Margin="0,5,0,0" Foreground="{DynamicResource AppText}"/>
+                            <TextBlock Text="{lex:Loc ChatHeight}" HorizontalAlignment="Right" Margin="0,20,0,0" Foreground="{DynamicResource AppText}"/>
+                        </StackPanel>
+                        <StackPanel Orientation="Vertical" Margin="0,10,0,5">
+                            <TextBox x:Name="textWidth" Text="12" Width="75" HorizontalAlignment="Left" Background="{DynamicResource AppElementBackground}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}"/>
+                            <TextBox x:Name="textHeight" Text="12" Width="75" HorizontalAlignment="Left" Margin="0,7,0,0" Background="{DynamicResource AppElementBackground}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}"/>
+                        </StackPanel>
+                        <StackPanel Orientation="Vertical" Margin="5,10,5,5">
+                            <TextBlock Text="{lex:Loc ChatFont}" HorizontalAlignment="Right" Margin="0,5,0,0" Foreground="{DynamicResource AppText}"/>
+                            <TextBlock Text="{lex:Loc ChatFontSize}" HorizontalAlignment="Right" Margin="0,20,0,0" Foreground="{DynamicResource AppText}"/>
+                            <TextBlock Text="{lex:Loc FontColor}" HorizontalAlignment="Right" Margin="0,14,0,0" Foreground="{DynamicResource AppText}"/>
+                            <TextBlock Text="{lex:Loc BackgroundColor}" HorizontalAlignment="Right" Margin="0,12,0,0" Foreground="{DynamicResource AppText}"/>
+                            <TextBlock Text="{lex:Loc AlternateBackgroundColor}" HorizontalAlignment="Right" Margin="0,12,0,0" Foreground="{DynamicResource AppText}"/>
+                        </StackPanel>
+                        <StackPanel Orientation="Vertical" Margin="0,10,0,5">
+                            <ComboBox x:Name="comboFont" MinWidth="180" MaxWidth="300" HorizontalAlignment="Left" Background="{DynamicResource AppElementBackground}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}"/>
+                            <hc:NumericUpDown x:Name="numFontSize" Value="12" Width="75" HorizontalAlignment="Left" Margin="0,7,0,0" Minimum="1" Background="{DynamicResource AppElementBackground}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}" />
+                            <xctk:ColorPicker x:Name="colorFont" SelectedColor="#FFFFFF" Width="50" UsingAlphaChannel="False" Margin="0,5,0,0" HorizontalAlignment="Left" Background="White" BorderBrush="{DynamicResource AppElementInnerBorder}" DropDownBackground="{DynamicResource AppElementInnerBackground}" Foreground="{DynamicResource AppText}" HeaderBackground="{DynamicResource AppElementInnerBackground}" HeaderForeground="{DynamicResource AppText}" TabBackground="{DynamicResource AppElementBorder}" TabForeground="{DynamicResource AppText}"/>
+                            <xctk:ColorPicker x:Name="colorBackground" SelectedColor="#111111" Width="50" UsingAlphaChannel="True" Margin="0,5,0,0" HorizontalAlignment="Left" Background="White" BorderBrush="{DynamicResource AppElementInnerBorder}" DropDownBackground="{DynamicResource AppElementInnerBackground}" Foreground="{DynamicResource AppText}" HeaderBackground="{DynamicResource AppElementInnerBackground}" HeaderForeground="{DynamicResource AppText}" TabBackground="{DynamicResource AppElementBorder}" TabForeground="{DynamicResource AppText}"/>
+                            <xctk:ColorPicker x:Name="colorAlternateBackground" SelectedColor="#191919" Width="50" UsingAlphaChannel="True" Margin="0,5,0,0" HorizontalAlignment="Left" Background="White" BorderBrush="{DynamicResource AppElementInnerBorder}" DropDownBackground="{DynamicResource AppElementInnerBackground}" Foreground="{DynamicResource AppText}" HeaderBackground="{DynamicResource AppElementInnerBackground}" HeaderForeground="{DynamicResource AppText}" TabBackground="{DynamicResource AppElementBorder}" TabForeground="{DynamicResource AppText}"/>
+                        </StackPanel>
+                    </DockPanel>
+                </StackPanel>
             </TabItem>
             <TabItem Header="{lex:Loc RenderTabRendering}" Background="{DynamicResource AppBackground}" Foreground="{DynamicResource AppText}">
-                <DockPanel Background="{DynamicResource AppBackground}">
-                    <StackPanel Orientation="Vertical" Margin="5,10,5,5">
-                        <TextBlock Text="{lex:Loc Outline}" HorizontalAlignment="Right" Margin="0,0,0,0" Foreground="{DynamicResource AppText}"/>
-                        <TextBlock Text="{lex:Loc Timestamps}" HorizontalAlignment="Right" Margin="0,6,0,0" Foreground="{DynamicResource AppText}"/>
-                        <TextBlock Text="{lex:Loc SubMessages}" HorizontalAlignment="Right" Margin="0,6,0,0" Foreground="{DynamicResource AppText}"/>
-                        <TextBlock Text="{lex:Loc ChatBadges}" HorizontalAlignment="Right" Margin="0,6,0,0" Foreground="{DynamicResource AppText}"/>
-                        <TextBlock Text="{lex:Loc UpdateRate}" HorizontalAlignment="Right" Margin="0,14,0,0" Foreground="{DynamicResource AppText}"/>
-                        <TextBlock HorizontalAlignment="Right" Margin="0,14,0,0" Foreground="{DynamicResource AppText}"><Run Text="{lex:Loc MessageDispersion}"/><Hyperlink ToolTipService.ShowDuration="30000" Foreground="{DynamicResource AppHyperlink}"><Hyperlink.ToolTip><Run Text="{lex:Loc MessageDispersionTooltip}"/></Hyperlink.ToolTip>(?)</Hyperlink>:</TextBlock>
-                        <TextBlock HorizontalAlignment="Right" Margin="0,6,0,0" MaxWidth="120" TextWrapping="Wrap" Foreground="{DynamicResource AppText}"><Run Text="{lex:Loc AlternateMessageBackgrounds}"/><Hyperlink ToolTipService.ShowDuration="30000" Foreground="{DynamicResource AppHyperlink}"><Hyperlink.ToolTip><Run Text="{lex:Loc AlternateMessageBackgroundsTooltip}"/></Hyperlink.ToolTip>(?)</Hyperlink>:</TextBlock>
-                    </StackPanel>
-                    <StackPanel Orientation="Vertical" Margin="0,10,0,5">
-                        <CheckBox x:Name="checkOutline" HorizontalAlignment="Left" Margin="0,2,0,0" BorderBrush="{DynamicResource AppElementBorder}"/>
-                        <CheckBox x:Name="checkTimestamp" HorizontalAlignment="Left" Margin="0,6,0,0" BorderBrush="{DynamicResource AppElementBorder}"/>
-                        <CheckBox x:Name="checkSub" HorizontalAlignment="Left" Margin="0,6,0,0" BorderBrush="{DynamicResource AppElementBorder}"/>
-                        <CheckBox x:Name="checkBadge" HorizontalAlignment="Left" Margin="0,6,0,0" BorderBrush="{DynamicResource AppElementBorder}"/>
-                        <TextBox x:Name="textUpdateTime" Text="0.5" Width="50" HorizontalAlignment="Left" Margin="0,7,0,0" Background="{DynamicResource AppElementBackground}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}"/>
-                        <CheckBox x:Name="checkDispersion" HorizontalAlignment="Left" Margin="0,6,0,0" BorderBrush="{DynamicResource AppElementBorder}"/>
-                        <CheckBox x:Name="checkAlternateMessageBackgrounds" HorizontalAlignment="Left" Margin="0,22,0,0" BorderBrush="{DynamicResource AppElementBorder}"/>
-                    </StackPanel>
-                    <StackPanel Orientation="Vertical" Margin="15,10,5,2">
-                        <TextBlock Text="{lex:Loc BttvEmotes}" HorizontalAlignment="Right" Margin="0,0,0,0" Foreground="{DynamicResource AppText}"/>
-                        <TextBlock Text="{lex:Loc FfzEmotes}" HorizontalAlignment="Right" Margin="0,6,0,0" Foreground="{DynamicResource AppText}"/>
-                        <TextBlock Text="{lex:Loc StvEmotes}" HorizontalAlignment="Right" Margin="0,6,0,0" Foreground="{DynamicResource AppText}"/>
-                        <TextBlock HorizontalAlignment="Right" Margin="0,6,0,0" Foreground="{DynamicResource AppText}"><Run Text="{lex:Loc Offline}"/><Hyperlink ToolTipService.ShowDuration="30000" Foreground="{DynamicResource AppHyperlink}"><Hyperlink.ToolTip><Run Text="{lex:Loc OfflineTooltip}"/></Hyperlink.ToolTip>(?)</Hyperlink>:</TextBlock>
-                    </StackPanel>
-                    <StackPanel Orientation="Vertical" Margin="0,10,0,2">
-                        <CheckBox x:Name="checkBTTV" HorizontalAlignment="Left" Margin="0,2,0,0" BorderBrush="{DynamicResource AppElementBorder}"/>
-                        <CheckBox x:Name="checkFFZ" HorizontalAlignment="Left" Margin="0,6,0,0" BorderBrush="{DynamicResource AppElementBorder}"/>
-                        <CheckBox x:Name="checkSTV" HorizontalAlignment="Left" Margin="0,6,0,0" BorderBrush="{DynamicResource AppElementBorder}"/>
-                        <CheckBox x:Name="checkOffline" HorizontalAlignment="Left" Margin="0,6,0,0" BorderBrush="{DynamicResource AppElementBorder}"/>
-                    </StackPanel>
-                    <StackPanel Orientation="Vertical" Margin="20,10,0,5">
-                        <TextBlock Text="{lex:Loc ChatBadgeFilter}" Foreground="{DynamicResource AppText}"></TextBlock>
-                        <hc:CheckComboBox x:Name="comboBadges" MinWidth="200" HorizontalAlignment="Left" Margin="0,4,0,0" Background="{DynamicResource AppElementBackground}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}"/>
-                        <TextBlock Margin="0,10,0,0" Foreground="{DynamicResource AppText}"><Run Text="{lex:Loc IgnoreUsersList}"/><Hyperlink ToolTipService.ShowDuration="30000" Foreground="{DynamicResource AppHyperlink}"><Hyperlink.ToolTip><Run Text="{lex:Loc IgnoreUsersListTooltip}"/></Hyperlink.ToolTip>(?)</Hyperlink>:</TextBlock>
-                        <TextBox x:Name="textIgnoreUsersList" Margin="0,4,0,0" Background="{DynamicResource AppElementBackground}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}"/>
-                        <TextBlock Margin="0,10,0,0" Foreground="{DynamicResource AppText}"><Run Text="{lex:Loc BannedWordsList}"/><Hyperlink ToolTipService.ShowDuration="30000" Foreground="{DynamicResource AppHyperlink}"><Hyperlink.ToolTip><Run Text="{lex:Loc BannedWordsListTooltip}"/></Hyperlink.ToolTip>(?)</Hyperlink>:</TextBlock>
-                        <TextBox x:Name="textBannedWordsList" Margin="0,4,0,0" Background="{DynamicResource AppElementBackground}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}"/>
-                        <WrapPanel Orientation="Horizontal" Margin="0,10,0,0">
-                            <TextBlock Text="{lex:Loc EmojiVendor}" Margin="0,0,0,0" Foreground="{DynamicResource AppText}"/>
-                            <RadioButton x:Name="RadioEmojiNotoColor" IsChecked="True" Content="{lex:Loc EmojiVendorNotoColor}" Margin="3,0,0,0" Background="{DynamicResource AppRadio}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}" />
-                            <RadioButton x:Name="RadioEmojiTwemoji" Content="{lex:Loc EmojiVendorTwemoji}" Margin="3,0,0,0" Background="{DynamicResource AppRadio}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}" />
-                            <RadioButton x:Name="RadioEmojiNone" Content="{lex:Loc EmojiVendorNone}" Margin="3,0,0,0" Background="{DynamicResource AppRadio}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}" />
-                        </WrapPanel>
-                    </StackPanel>
-                </DockPanel>
+                <StackPanel>
+                    <Separator Margin="0" />
+                    <DockPanel Background="{DynamicResource AppBackground}">
+                        <StackPanel Orientation="Vertical" Margin="5,10,5,5">
+                            <TextBlock Text="{lex:Loc Outline}" HorizontalAlignment="Right" Margin="0,0,0,0" Foreground="{DynamicResource AppText}"/>
+                            <TextBlock Text="{lex:Loc Timestamps}" HorizontalAlignment="Right" Margin="0,6,0,0" Foreground="{DynamicResource AppText}"/>
+                            <TextBlock Text="{lex:Loc SubMessages}" HorizontalAlignment="Right" Margin="0,6,0,0" Foreground="{DynamicResource AppText}"/>
+                            <TextBlock Text="{lex:Loc ChatBadges}" HorizontalAlignment="Right" Margin="0,6,0,0" Foreground="{DynamicResource AppText}"/>
+                            <TextBlock Text="{lex:Loc UpdateRate}" HorizontalAlignment="Right" Margin="0,13,0,0" Foreground="{DynamicResource AppText}"/>
+                            <TextBlock HorizontalAlignment="Right" Margin="0,12,0,0" Foreground="{DynamicResource AppText}"><Run Text="{lex:Loc MessageDispersion}"/><Hyperlink ToolTipService.ShowDuration="30000" Foreground="{DynamicResource AppHyperlink}"><Hyperlink.ToolTip><Run Text="{lex:Loc MessageDispersionTooltip}"/></Hyperlink.ToolTip>(?)</Hyperlink>:</TextBlock>
+                            <TextBlock HorizontalAlignment="Right" Margin="0,6,0,0" MaxWidth="120" TextWrapping="Wrap" Foreground="{DynamicResource AppText}"><Run Text="{lex:Loc AlternateMessageBackgrounds}"/><Hyperlink ToolTipService.ShowDuration="30000" Foreground="{DynamicResource AppHyperlink}"><Hyperlink.ToolTip><Run Text="{lex:Loc AlternateMessageBackgroundsTooltip}"/></Hyperlink.ToolTip>(?)</Hyperlink>:</TextBlock>
+                        </StackPanel>
+                        <StackPanel Orientation="Vertical" Margin="0,10,0,5">
+                            <CheckBox x:Name="checkOutline" HorizontalAlignment="Left" Margin="0,0,0,0" BorderBrush="{DynamicResource AppElementBorder}"/>
+                            <CheckBox x:Name="checkTimestamp" HorizontalAlignment="Left" Margin="0,6,0,0" BorderBrush="{DynamicResource AppElementBorder}"/>
+                            <CheckBox x:Name="checkSub" HorizontalAlignment="Left" Margin="0,6,0,0" BorderBrush="{DynamicResource AppElementBorder}"/>
+                            <CheckBox x:Name="checkBadge" HorizontalAlignment="Left" Margin="0,6,0,0" BorderBrush="{DynamicResource AppElementBorder}"/>
+                            <TextBox x:Name="textUpdateTime" Text="0.5" Width="50" HorizontalAlignment="Left" Margin="0,7,0,0" Background="{DynamicResource AppElementBackground}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}"/>
+                            <CheckBox x:Name="checkDispersion" HorizontalAlignment="Left" Margin="0,6,0,0" BorderBrush="{DynamicResource AppElementBorder}"/>
+                            <CheckBox x:Name="checkAlternateMessageBackgrounds" HorizontalAlignment="Left" Margin="0,21,0,0" BorderBrush="{DynamicResource AppElementBorder}"/>
+                        </StackPanel>
+                        <StackPanel Orientation="Vertical" Margin="15,10,5,2">
+                            <TextBlock Text="{lex:Loc BttvEmotes}" HorizontalAlignment="Right" Margin="0,0,0,0" Foreground="{DynamicResource AppText}"/>
+                            <TextBlock Text="{lex:Loc FfzEmotes}" HorizontalAlignment="Right" Margin="0,6,0,0" Foreground="{DynamicResource AppText}"/>
+                            <TextBlock Text="{lex:Loc StvEmotes}" HorizontalAlignment="Right" Margin="0,6,0,0" Foreground="{DynamicResource AppText}"/>
+                            <TextBlock HorizontalAlignment="Right" Margin="0,6,0,0" Foreground="{DynamicResource AppText}"><Run Text="{lex:Loc Offline}"/><Hyperlink ToolTipService.ShowDuration="30000" Foreground="{DynamicResource AppHyperlink}"><Hyperlink.ToolTip><Run Text="{lex:Loc OfflineTooltip}"/></Hyperlink.ToolTip>(?)</Hyperlink>:</TextBlock>
+                        </StackPanel>
+                        <StackPanel Orientation="Vertical" Margin="0,10,0,2">
+                            <CheckBox x:Name="checkBTTV" HorizontalAlignment="Left" Margin="0,0,0,0" BorderBrush="{DynamicResource AppElementBorder}"/>
+                            <CheckBox x:Name="checkFFZ" HorizontalAlignment="Left" Margin="0,6,0,0" BorderBrush="{DynamicResource AppElementBorder}"/>
+                            <CheckBox x:Name="checkSTV" HorizontalAlignment="Left" Margin="0,6,0,0" BorderBrush="{DynamicResource AppElementBorder}"/>
+                            <CheckBox x:Name="checkOffline" HorizontalAlignment="Left" Margin="0,6,0,0" BorderBrush="{DynamicResource AppElementBorder}"/>
+                        </StackPanel>
+                        <StackPanel Orientation="Vertical" Margin="20,10,0,5">
+                            <TextBlock Text="{lex:Loc ChatBadgeFilter}" Foreground="{DynamicResource AppText}"></TextBlock>
+                            <hc:CheckComboBox x:Name="comboBadges" MinWidth="200" HorizontalAlignment="Left" Margin="0,4,0,0" Background="{DynamicResource AppElementBackground}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}"/>
+                            <TextBlock Margin="0,10,0,0" Foreground="{DynamicResource AppText}"><Run Text="{lex:Loc IgnoreUsersList}"/><Hyperlink ToolTipService.ShowDuration="30000" Foreground="{DynamicResource AppHyperlink}"><Hyperlink.ToolTip><Run Text="{lex:Loc IgnoreUsersListTooltip}"/></Hyperlink.ToolTip>(?)</Hyperlink>:</TextBlock>
+                            <TextBox x:Name="textIgnoreUsersList" Margin="0,4,0,0" Background="{DynamicResource AppElementBackground}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}"/>
+                            <TextBlock Margin="0,10,0,0" Foreground="{DynamicResource AppText}"><Run Text="{lex:Loc BannedWordsList}"/><Hyperlink ToolTipService.ShowDuration="30000" Foreground="{DynamicResource AppHyperlink}"><Hyperlink.ToolTip><Run Text="{lex:Loc BannedWordsListTooltip}"/></Hyperlink.ToolTip>(?)</Hyperlink>:</TextBlock>
+                            <TextBox x:Name="textBannedWordsList" Margin="0,4,0,0" Background="{DynamicResource AppElementBackground}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}"/>
+                            <WrapPanel Orientation="Horizontal" Margin="0,10,0,0">
+                                <TextBlock Text="{lex:Loc EmojiVendor}" Margin="0,0,0,0" Foreground="{DynamicResource AppText}"/>
+                                <RadioButton x:Name="RadioEmojiNotoColor" IsChecked="True" Content="{lex:Loc EmojiVendorNotoColor}" Margin="3,0,0,0" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}" />
+                                <RadioButton x:Name="RadioEmojiTwemoji" Content="{lex:Loc EmojiVendorTwemoji}" Margin="3,0,0,0" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}" />
+                                <RadioButton x:Name="RadioEmojiNone" Content="{lex:Loc EmojiVendorNone}" Margin="3,0,0,0" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}" />
+                            </WrapPanel>
+                        </StackPanel>
+                    </DockPanel>
+                </StackPanel>
             </TabItem>
             <TabItem Header="{lex:Loc RenderTabScaling}" Background="{DynamicResource AppBackground}" Foreground="{DynamicResource AppText}">
-                <DockPanel Background="{DynamicResource AppBackground}">
-                    <StackPanel Orientation="Vertical" Margin="5,10,5,5">
-                        <TextBlock Text="{lex:Loc EmoteScale}" HorizontalAlignment="Right" Margin="0,6,0,0" Foreground="{DynamicResource AppText}"/>
-                        <TextBlock Text="{lex:Loc BadgeScale}" HorizontalAlignment="Right" Margin="0,15,0,0" Foreground="{DynamicResource AppText}"/>
-                        <TextBlock Text="{lex:Loc EmojiScale}" HorizontalAlignment="Right" Margin="0,15,0,0" Foreground="{DynamicResource AppText}"/>
-                        <TextBlock Text="{lex:Loc OutlineScale}" HorizontalAlignment="Right" Margin="0,15,0,0" Foreground="{DynamicResource AppText}"/>
-                        <TextBlock Text="{lex:Loc VerticalSpacingScale}" HorizontalAlignment="Right" Margin="0,15,0,0" Foreground="{DynamicResource AppText}"/>
-                        <TextBlock Text="{lex:Loc SectionHeightScale}" HorizontalAlignment="Right" Margin="0,15,0,0" Foreground="{DynamicResource AppText}"/>
-                    </StackPanel>
-                    <StackPanel Orientation="Vertical" Margin="0,10,5,5">
-                        <TextBox x:Name="textEmoteScale" Text="1.0" Width="50" HorizontalAlignment="Left" Margin="0,0,0,0" Background="{DynamicResource AppElementBackground}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}"/>
-                        <TextBox x:Name="textBadgeScale" Text="1.0" Width="50" HorizontalAlignment="Left" Margin="0,1,0,0" Background="{DynamicResource AppElementBackground}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}"/>
-                        <TextBox x:Name="textEmojiScale" Text="1.0" Width="50" HorizontalAlignment="Left" Margin="0,1,0,0" Background="{DynamicResource AppElementBackground}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}"/>
-                        <TextBox x:Name="textOutlineScale" Text="1.0" Width="50" HorizontalAlignment="Left" Margin="0,1,0,0" Background="{DynamicResource AppElementBackground}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}"/>
-                        <TextBox x:Name="textVerticalScale" Text="1.0" Width="50" HorizontalAlignment="Left" Margin="0,1,0,0" Background="{DynamicResource AppElementBackground}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}"/>
-                        <TextBox x:Name="textSectionHeightScale" Text="1.0" Width="50" HorizontalAlignment="Left" Margin="0,1,0,0" Background="{DynamicResource AppElementBackground}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}"/>
-                    </StackPanel>
-                    <StackPanel Orientation="Vertical" Margin="5,10,5,5">
-                        <TextBlock Text="{lex:Loc WordSpacingScale}" HorizontalAlignment="Right" Margin="0,6,0,0" Foreground="{DynamicResource AppText}"/>
-                        <TextBlock Text="{lex:Loc EmoteSpacingScale}" HorizontalAlignment="Right" Margin="0,15,0,0" Foreground="{DynamicResource AppText}"/>
-                        <TextBlock Text="{lex:Loc HighlightStrokeScale}" HorizontalAlignment="Right" Margin="0,15,0,0" Foreground="{DynamicResource AppText}"/>
-                        <TextBlock Text="{lex:Loc HighlightIndentScale}" HorizontalAlignment="Right" Margin="0,15,0,0" Foreground="{DynamicResource AppText}"/>
-                        <TextBlock Text="{lex:Loc SidePaddingScale}" HorizontalAlignment="Right" Margin="0,15,0,0" Foreground="{DynamicResource AppText}"/>
-                    </StackPanel>
-                    <StackPanel Orientation="Vertical" Margin="0,10,5,5">
-                        <TextBox x:Name="textWordSpaceScale" Text="1.0" Width="50" HorizontalAlignment="Left" Margin="0,0,0,0" Background="{DynamicResource AppElementBackground}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}"/>
-                        <TextBox x:Name="textEmoteSpaceScale" Text="1.0" Width="50" HorizontalAlignment="Left" Margin="0,1,0,0" Background="{DynamicResource AppElementBackground}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}"/>
-                        <TextBox x:Name="textAccentStrokeScale" Text="1.0" Width="50" HorizontalAlignment="Left" Margin="0,1,0,0" Background="{DynamicResource AppElementBackground}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}"/>
-                        <TextBox x:Name="textAccentIndentScale" Text="1.0" Width="50" HorizontalAlignment="Left" Margin="0,1,0,0" Background="{DynamicResource AppElementBackground}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}"/>
-                        <TextBox x:Name="textSidePaddingScale" Text="1.0" Width="50" HorizontalAlignment="Left" Margin="0,1,0,0" Background="{DynamicResource AppElementBackground}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}"/>
-                    </StackPanel>
-                </DockPanel>
+                <StackPanel>
+                <Separator Margin="0" />
+                    <DockPanel Background="{DynamicResource AppBackground}">
+                        <StackPanel Orientation="Vertical" Margin="5,10,5,5">
+                            <TextBlock Text="{lex:Loc EmoteScale}" HorizontalAlignment="Right" Margin="0,6,0,0" Foreground="{DynamicResource AppText}"/>
+                            <TextBlock Text="{lex:Loc BadgeScale}" HorizontalAlignment="Right" Margin="0,14,0,0" Foreground="{DynamicResource AppText}"/>
+                            <TextBlock Text="{lex:Loc EmojiScale}" HorizontalAlignment="Right" Margin="0,14,0,0" Foreground="{DynamicResource AppText}"/>
+                            <TextBlock Text="{lex:Loc OutlineScale}" HorizontalAlignment="Right" Margin="0,14,0,0" Foreground="{DynamicResource AppText}"/>
+                            <TextBlock Text="{lex:Loc VerticalSpacingScale}" HorizontalAlignment="Right" Margin="0,14,0,0" Foreground="{DynamicResource AppText}"/>
+                            <TextBlock Text="{lex:Loc SectionHeightScale}" HorizontalAlignment="Right" Margin="0,14, 0,0" Foreground="{DynamicResource AppText}"/>
+                        </StackPanel>
+                        <StackPanel Orientation="Vertical" Margin="0,10,5,5">
+                            <TextBox x:Name="textEmoteScale" Text="1.0" Width="50" HorizontalAlignment="Left" Margin="0,0,0,0" Background="{DynamicResource AppElementBackground}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}"/>
+                            <TextBox x:Name="textBadgeScale" Text="1.0" Width="50" HorizontalAlignment="Left" Margin="0,2,0,0" Background="{DynamicResource AppElementBackground}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}"/>
+                            <TextBox x:Name="textEmojiScale" Text="1.0" Width="50" HorizontalAlignment="Left" Margin="0,2,0,0" Background="{DynamicResource AppElementBackground}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}"/>
+                            <TextBox x:Name="textOutlineScale" Text="1.0" Width="50" HorizontalAlignment="Left" Margin="0,2,0,0" Background="{DynamicResource AppElementBackground}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}"/>
+                            <TextBox x:Name="textVerticalScale" Text="1.0" Width="50" HorizontalAlignment="Left" Margin="0,2,0,0" Background="{DynamicResource AppElementBackground}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}"/>
+                            <TextBox x:Name="textSectionHeightScale" Text="1.0" Width="50" HorizontalAlignment="Left" Margin="0,2,0,0" Background="{DynamicResource AppElementBackground}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}"/>
+                        </StackPanel>
+                        <StackPanel Orientation="Vertical" Margin="5,10,5,5">
+                            <TextBlock Text="{lex:Loc WordSpacingScale}" HorizontalAlignment="Right" Margin="0,6,0,0" Foreground="{DynamicResource AppText}"/>
+                            <TextBlock Text="{lex:Loc EmoteSpacingScale}" HorizontalAlignment="Right" Margin="0,14,0,0" Foreground="{DynamicResource AppText}"/>
+                            <TextBlock Text="{lex:Loc HighlightStrokeScale}" HorizontalAlignment="Right" Margin="0,14,0,0" Foreground="{DynamicResource AppText}"/>
+                            <TextBlock Text="{lex:Loc HighlightIndentScale}" HorizontalAlignment="Right" Margin="0,14,0,0" Foreground="{DynamicResource AppText}"/>
+                            <TextBlock Text="{lex:Loc SidePaddingScale}" HorizontalAlignment="Right" Margin="0,14,0,0" Foreground="{DynamicResource AppText}"/>
+                        </StackPanel>
+                        <StackPanel Orientation="Vertical" Margin="0,10,5,5">
+                            <TextBox x:Name="textWordSpaceScale" Text="1.0" Width="50" HorizontalAlignment="Left" Margin="0,0,0,0" Background="{DynamicResource AppElementBackground}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}"/>
+                            <TextBox x:Name="textEmoteSpaceScale" Text="1.0" Width="50" HorizontalAlignment="Left" Margin="0,2,0,0" Background="{DynamicResource AppElementBackground}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}"/>
+                            <TextBox x:Name="textAccentStrokeScale" Text="1.0" Width="50" HorizontalAlignment="Left" Margin="0,2,0,0" Background="{DynamicResource AppElementBackground}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}"/>
+                            <TextBox x:Name="textAccentIndentScale" Text="1.0" Width="50" HorizontalAlignment="Left" Margin="0,2,0,0" Background="{DynamicResource AppElementBackground}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}"/>
+                            <TextBox x:Name="textSidePaddingScale" Text="1.0" Width="50" HorizontalAlignment="Left" Margin="0,2,0,0" Background="{DynamicResource AppElementBackground}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}"/>
+                        </StackPanel>
+                    </DockPanel>
+                </StackPanel>
             </TabItem>
-            <TabItem Header="{lex:Loc RenderTabEncoding}" Background="{DynamicResource AppBackground}" Foreground="{DynamicResource AppText}">
-                <DockPanel Background="{DynamicResource AppBackground}">
-                    <StackPanel Orientation="Vertical" Margin="5,10,5,5">
-                        <TextBlock Text="{lex:Loc RenderFileFormat}" HorizontalAlignment="Right" Margin="0,4,0,0" Foreground="{DynamicResource AppText}"/>
-                        <TextBlock Text="{lex:Loc RenderCodec}" HorizontalAlignment="Right" Margin="0,22,0,0" Foreground="{DynamicResource AppText}"/>
-                        <TextBlock Text="{lex:Loc RenderFramerate}" HorizontalAlignment="Right" Margin="0,20,0,0" Foreground="{DynamicResource AppText}"/>
-                        <TextBlock Text="{lex:Loc GenerateMask}" HorizontalAlignment="Right" Margin="0,15,0,0" Foreground="{DynamicResource AppText}"/>
-                        <TextBlock Text="{lex:Loc RenderImageSharpening}" HorizontalAlignment="Right" Margin="0,6,0,0" Foreground="{DynamicResource AppText}"/>
-                    </StackPanel>
-                    <StackPanel Orientation="Vertical" Margin="0,10,5,5">
-                        <ComboBox x:Name="comboFormat" MinWidth="120" MaxWidth="300" HorizontalAlignment="Left" Background="{DynamicResource AppElementBackground}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}"/>
-                        <ComboBox x:Name="comboCodec" MinWidth="120" MaxWidth="300" HorizontalAlignment="Left" Margin="0,7,0,0" Background="{DynamicResource AppElementBackground}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}"/>
-                        <TextBox x:Name="textFramerate" Text="30" Width="50" HorizontalAlignment="Left" Margin="0,7,0,0" Background="{DynamicResource AppElementBackground}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}"/>
-                        <CheckBox x:Name="checkMask" HorizontalAlignment="Left" Margin="0,6,0,0" BorderBrush="{DynamicResource AppElementBorder}"/>
-                        <CheckBox x:Name="CheckRenderSharpening" Margin="0,6,0,0" BorderBrush="{DynamicResource AppElementBorder}"/>
-                    </StackPanel>
-                </DockPanel>
+            <TabItem Header="{lex:Loc RenderTabEncoding}" Background="{DynamicResource AppBackground}" Foreground="{DynamicResource AppText}" >
+                <StackPanel>
+                    <Separator Margin="0" />
+                    <DockPanel Background="{DynamicResource AppBackground}">
+                        <StackPanel Orientation="Vertical" Margin="5,10,5,5">
+                            <TextBlock Text="{lex:Loc RenderFileFormat}" HorizontalAlignment="Right" Margin="0,4,0,0" Foreground="{DynamicResource AppText}"/>
+                            <TextBlock Text="{lex:Loc RenderCodec}" HorizontalAlignment="Right" Margin="0,21,0,0" Foreground="{DynamicResource AppText}"/>
+                            <TextBlock Text="{lex:Loc RenderFramerate}" HorizontalAlignment="Right" Margin="0,20,0,0" Foreground="{DynamicResource AppText}"/>
+                            <TextBlock Text="{lex:Loc GenerateMask}" HorizontalAlignment="Right" Margin="0,11,0,0" Foreground="{DynamicResource AppText}"/>
+                            <TextBlock Text="{lex:Loc RenderImageSharpening}" HorizontalAlignment="Right" Margin="0,6,0,0" Foreground="{DynamicResource AppText}"/>
+                        </StackPanel>
+                        <StackPanel Orientation="Vertical" Margin="0,10,5,5">
+                            <ComboBox x:Name="comboFormat" MinWidth="120" MaxWidth="300" HorizontalAlignment="Left" Background="{DynamicResource AppElementBackground}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}"/>
+                            <ComboBox x:Name="comboCodec" MinWidth="120" MaxWidth="300" HorizontalAlignment="Left" Margin="0,7,0,0" Background="{DynamicResource AppElementBackground}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}"/>
+                            <TextBox x:Name="textFramerate" Text="30" Width="50" HorizontalAlignment="Left" Margin="0,7,0,0" Background="{DynamicResource AppElementBackground}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}"/>
+                            <CheckBox x:Name="checkMask" HorizontalAlignment="Left" Margin="0,6,0,0" BorderBrush="{DynamicResource AppElementBorder}"/>
+                            <CheckBox x:Name="CheckRenderSharpening" Margin="0,6,0,0" BorderBrush="{DynamicResource AppElementBorder}"/>
+                        </StackPanel>
+                    </DockPanel>
+                </StackPanel>
             </TabItem>
             <TabItem Header="{lex:Loc RenderTabFfmpeg}" Background="{DynamicResource AppBackground}" Foreground="{DynamicResource AppText}">
-                <StackPanel Orientation="Vertical" Background="{DynamicResource AppBackground}" Margin="5,10,5,5">
-                    <WrapPanel Orientation="Horizontal">
+                <StackPanel Orientation="Vertical" Background="{DynamicResource AppBackground}">
+                    <Separator Margin="0" />
+                    <WrapPanel Orientation="Horizontal" Margin="0, 10, 0, 0">
                         <fa:SvgAwesome Icon="Solid_ExclamationCircle" Width="16" Margin="0,0,3,0" Foreground="{DynamicResource AppText}" />
                         <TextBlock Text="{lex:Loc RenderFfmpegWarning}" Foreground="{DynamicResource AppInnerText}" FontWeight="Bold" TextWrapping="Wrap" />
                     </WrapPanel>
diff --git a/TwitchDownloaderWPF/PageChatUpdate.xaml b/TwitchDownloaderWPF/PageChatUpdate.xaml
index 1eb270f3..1e292b3b 100644
--- a/TwitchDownloaderWPF/PageChatUpdate.xaml
+++ b/TwitchDownloaderWPF/PageChatUpdate.xaml
@@ -66,10 +66,10 @@
         <StackPanel Grid.Row="2" Grid.Column="2" Grid.ColumnSpan="2" Margin="0,20,0,0" Orientation="Horizontal" HorizontalAlignment="Center">
             <StackPanel HorizontalAlignment="Left">
                 <TextBlock Text="{lex:Loc Length}" HorizontalAlignment="Right" Foreground="{DynamicResource AppText}" />
-                <TextBlock Text="{lex:Loc DownloadFormat}" HorizontalAlignment="Right" Margin="0,13,0,0" Foreground="{DynamicResource AppText}" />
-                <TextBlock Visibility="Visible" x:Name="compressionText" Text="{lex:Loc ChatCompression}" HorizontalAlignment="Right" Margin="0,15,0,0" Foreground="{DynamicResource AppText}" />
-                <TextBlock Visibility="Collapsed" x:Name="timeText" Text="{lex:Loc TimestampFormat}" HorizontalAlignment="Right" Margin="0,15,0,0" Foreground="{DynamicResource AppText}" />
-                <TextBlock x:Name="textCrop" Text="{lex:Loc ChatCrop}" HorizontalAlignment="Right" Margin="0,12,0,38" Foreground="{DynamicResource AppText}" />
+                <TextBlock Text="{lex:Loc DownloadFormat}" HorizontalAlignment="Right" Margin="0,12,0,0" Foreground="{DynamicResource AppText}" />
+                <TextBlock Visibility="Visible" x:Name="compressionText" Text="{lex:Loc ChatCompression}" HorizontalAlignment="Right" Margin="0,14,0,0" Foreground="{DynamicResource AppText}" />
+                <TextBlock Visibility="Collapsed" x:Name="timeText" Text="{lex:Loc TimestampFormat}" HorizontalAlignment="Right" Margin="0,8,0,0" Foreground="{DynamicResource AppText}" />
+                <TextBlock x:Name="textCrop" Text="{lex:Loc ChatCrop}" HorizontalAlignment="Right" Margin="0,10,0,33" Foreground="{DynamicResource AppText}" />
                 <StackPanel x:Name="stackEmbedText" Visibility="Visible">
                     <TextBlock HorizontalAlignment="Right" Margin="0,8,0,0" Foreground="{DynamicResource AppText}" ><Run Text="{lex:Loc EmbedMissing}"/><Hyperlink ToolTipService.ShowDuration="30000" Foreground="{DynamicResource AppHyperlink}"><Hyperlink.ToolTip><Run Text="{lex:Loc EmbedMissingTooltip}"/></Hyperlink.ToolTip>(?)</Hyperlink>:</TextBlock>
                     <TextBlock HorizontalAlignment="Right" Margin="0,8,0,0" Foreground="{DynamicResource AppText}" ><Run Text="{lex:Loc ReplaceEmbeds}"/><Hyperlink ToolTipService.ShowDuration="30000" Foreground="{DynamicResource AppHyperlink}"><Hyperlink.ToolTip><Run Text="{lex:Loc ReplaceEmbedsTooltip}"/></Hyperlink.ToolTip>(?)</Hyperlink>:</TextBlock>
@@ -84,13 +84,13 @@
                     <RadioButton x:Name="radioHTML" Content="HTML" Checked="radioHTML_Checked" Background="{DynamicResource AppElementBackground}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}" />
                 </hc:ButtonGroup>
                 <StackPanel Visibility="Visible" x:Name="compressionOptions" Margin="5,8,0,0" Orientation="Horizontal">
-                    <RadioButton x:Name="radioCompressionNone" IsChecked="True" Content="{lex:Loc ChatCompressionNone}" Margin="3,0,0,0" Background="{DynamicResource AppRadio}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}" />
-                    <RadioButton x:Name="radioCompressionGzip" Content="{lex:Loc ChatCompressionGzip}" Margin="3,0,0,0" Background="{DynamicResource AppRadio}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}" />
+                    <RadioButton x:Name="radioCompressionNone" IsChecked="True" Content="{lex:Loc ChatCompressionNone}" Margin="3,0,0,0" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}" />
+                    <RadioButton x:Name="radioCompressionGzip" Content="{lex:Loc ChatCompressionGzip}" Margin="3,0,0,0" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}" />
                 </StackPanel>
                 <StackPanel Visibility="Collapsed" x:Name="timeOptions" Margin="5,8,0,0" Orientation="Horizontal">
-                    <RadioButton x:Name="radioTimestampUTC" IsChecked="True" Content="{lex:Loc TimestampUtc}" Background="{DynamicResource AppRadio}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}" />
-                    <RadioButton x:Name="radioTimestampRelative" Content="{lex:Loc TimestampRelative}" Margin="3,0,0,0" Background="{DynamicResource AppRadio}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}" />
-                    <RadioButton x:Name="radioTimestampNone" Content="{lex:Loc TimestampNone}" Margin="3,0,0,0" Background="{DynamicResource AppRadio}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}" />
+                    <RadioButton x:Name="radioTimestampUTC" IsChecked="True" Content="{lex:Loc TimestampUtc}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}" />
+                    <RadioButton x:Name="radioTimestampRelative" Content="{lex:Loc TimestampRelative}" Margin="3,0,0,0" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}" />
+                    <RadioButton x:Name="radioTimestampNone" Content="{lex:Loc TimestampNone}" Margin="3,0,0,0" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}" />
                 </StackPanel>
                 <StackPanel Margin="5,5,0,0">
                     <StackPanel Orientation="Horizontal">
diff --git a/TwitchDownloaderWPF/PageChatUpdate.xaml.cs b/TwitchDownloaderWPF/PageChatUpdate.xaml.cs
index 1b4d9a2f..64b99f4c 100644
--- a/TwitchDownloaderWPF/PageChatUpdate.xaml.cs
+++ b/TwitchDownloaderWPF/PageChatUpdate.xaml.cs
@@ -480,25 +480,38 @@ private async void SplitBtnUpdate_Click(object sender, RoutedEventArgs e)
                 return;
             }
 
-            SaveFileDialog saveFileDialog = new SaveFileDialog();
+            var saveFileDialog = new SaveFileDialog
+            {
+                FileName = FilenameService.GetFilename(Settings.Default.TemplateChat, textTitle.Text,
+                    ChatJsonInfo.video.id ?? ChatJsonInfo.comments.FirstOrDefault()?.content_id ?? "-1", VideoCreatedAt, textStreamer.Text,
+                    checkStart.IsChecked == true ? new TimeSpan((int)numStartHour.Value, (int)numStartMinute.Value, (int)numStartSecond.Value) : TimeSpan.FromSeconds(double.IsNegative(ChatJsonInfo.video.start) ? 0.0 : ChatJsonInfo.video.start),
+                    checkEnd.IsChecked == true ? new TimeSpan((int)numEndHour.Value, (int)numEndMinute.Value, (int)numEndSecond.Value) : VideoLength,
+                    ViewCount.ToString(), Game)
+            };
 
             if (radioJson.IsChecked == true)
             {
                 if (radioCompressionNone.IsChecked == true)
+                {
                     saveFileDialog.Filter = "JSON Files | *.json";
+                    saveFileDialog.FileName += ".json";
+                }
                 else if (radioCompressionGzip.IsChecked == true)
+                {
                     saveFileDialog.Filter = "GZip JSON Files | *.json.gz";
+                    saveFileDialog.FileName += ".json.gz";
+                }
             }
             else if (radioHTML.IsChecked == true)
-                saveFileDialog.Filter = "HTML Files | *.html;*.htm";
+            {
+                saveFileDialog.Filter = "HTML Files | *.html";
+                saveFileDialog.FileName += ".html";
+            }
             else if (radioText.IsChecked == true)
+            {
                 saveFileDialog.Filter = "TXT Files | *.txt";
-
-            saveFileDialog.FileName = FilenameService.GetFilename(Settings.Default.TemplateChat, textTitle.Text,
-                ChatJsonInfo.video.id ?? ChatJsonInfo.comments.FirstOrDefault()?.content_id ?? "-1", VideoCreatedAt, textStreamer.Text,
-                checkStart.IsChecked == true ? new TimeSpan((int)numStartHour.Value, (int)numStartMinute.Value, (int)numStartSecond.Value) : TimeSpan.FromSeconds(double.IsNegative(ChatJsonInfo.video.start) ? 0.0 : ChatJsonInfo.video.start),
-                checkEnd.IsChecked == true ? new TimeSpan((int)numEndHour.Value, (int)numEndMinute.Value, (int)numEndSecond.Value) : VideoLength,
-                ViewCount.ToString(), Game);
+                saveFileDialog.FileName += ".txt";
+            }
 
             if (saveFileDialog.ShowDialog() != true)
             {
diff --git a/TwitchDownloaderWPF/PageClipDownload.xaml b/TwitchDownloaderWPF/PageClipDownload.xaml
index c875b23e..ef2bb3c6 100644
--- a/TwitchDownloaderWPF/PageClipDownload.xaml
+++ b/TwitchDownloaderWPF/PageClipDownload.xaml
@@ -66,7 +66,7 @@
             <StackPanel HorizontalAlignment="Left">
                 <TextBlock Text="{lex:Loc Length}" HorizontalAlignment="Right" Foreground="{DynamicResource AppText}" />
                 <TextBlock Text="{lex:Loc Quality}" HorizontalAlignment="Right" Margin="0,14,0,0" Foreground="{DynamicResource AppText}" />
-                <TextBlock Text="{lex:Loc EncodeClipMetadata}" HorizontalAlignment="Right" Margin="0,17,0,0" Foreground="{DynamicResource AppText}" />
+                <TextBlock Text="{lex:Loc EncodeClipMetadata}" HorizontalAlignment="Right" Margin="0,16,0,0" Foreground="{DynamicResource AppText}" />
             </StackPanel>
             <StackPanel>
                 <TextBlock x:Name="labelLength" Text="0:0:0" Margin="5,0,0,0" Foreground="{DynamicResource AppText}" />
diff --git a/TwitchDownloaderWPF/PageClipDownload.xaml.cs b/TwitchDownloaderWPF/PageClipDownload.xaml.cs
index d68e600c..e78e22ad 100644
--- a/TwitchDownloaderWPF/PageClipDownload.xaml.cs
+++ b/TwitchDownloaderWPF/PageClipDownload.xaml.cs
@@ -201,7 +201,7 @@ private async void SplitBtnDownload_Click(object sender, RoutedEventArgs e)
             SaveFileDialog saveFileDialog = new SaveFileDialog
             {
                 Filter = "MP4 Files | *.mp4",
-                FileName = FilenameService.GetFilename(Settings.Default.TemplateClip, textTitle.Text, clipId, currentVideoTime, textStreamer.Text, TimeSpan.Zero, clipLength, viewCount.ToString(), game)
+                FileName = FilenameService.GetFilename(Settings.Default.TemplateClip, textTitle.Text, clipId, currentVideoTime, textStreamer.Text, TimeSpan.Zero, clipLength, viewCount.ToString(), game) + ".mp4"
             };
             if (saveFileDialog.ShowDialog() != true)
             {
diff --git a/TwitchDownloaderWPF/PageQueue.xaml b/TwitchDownloaderWPF/PageQueue.xaml
index b337fdbb..3e5e1534 100644
--- a/TwitchDownloaderWPF/PageQueue.xaml
+++ b/TwitchDownloaderWPF/PageQueue.xaml
@@ -94,19 +94,19 @@
             <StackPanel HorizontalAlignment="Center">
                 <hc:Divider Content="{lex:Loc ParallelTaskLimits}" HorizontalAlignment="Center" Margin="0,10,0,0" FontWeight="Bold" MinWidth="180" LineStroke="{DynamicResource AppDivider}" Foreground="{DynamicResource AppDividerText}"/>
                 <WrapPanel HorizontalAlignment="Right" Orientation="Horizontal" Margin="0,8,0,0">
-                    <TextBlock Text="{lex:Loc VodDownloads}" Margin="0,7,0,0" Foreground="{DynamicResource AppText}" TextWrapping="Wrap" />
+                    <TextBlock Text="{lex:Loc VodDownloads}" Margin="0,6,0,0" Foreground="{DynamicResource AppText}" TextWrapping="Wrap" />
                     <hc:NumericUpDown Margin="5,0,0,0" Value="1" Minimum="1" Name="numVod" Width="70" ValueChanged="numVod_ValueChanged" Background="{DynamicResource AppElementBackground}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}" />
                 </WrapPanel>
                 <WrapPanel HorizontalAlignment="Right" Orientation="Horizontal" Margin="0,2,0,0">
-                    <TextBlock Text="{lex:Loc ClipDownloads}" Margin="0,7,0,0" Foreground="{DynamicResource AppText}" TextWrapping="Wrap" />
+                    <TextBlock Text="{lex:Loc ClipDownloads}" Margin="0,6,0,0" Foreground="{DynamicResource AppText}" TextWrapping="Wrap" />
                     <hc:NumericUpDown Margin="5,0,0,0" Value="1" Minimum="1" x:Name="numClip" Width="70" ValueChanged="numClip_ValueChanged" Background="{DynamicResource AppElementBackground}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}" />
                 </WrapPanel>
                 <WrapPanel HorizontalAlignment="Right" Orientation="Horizontal" Margin="0,2,0,0">
-                    <TextBlock Text="{lex:Loc ChatDownloads}" Margin="0,7,0,0" Foreground="{DynamicResource AppText}" TextWrapping="Wrap" />
+                    <TextBlock Text="{lex:Loc ChatDownloads}" Margin="0,6,0,0" Foreground="{DynamicResource AppText}" TextWrapping="Wrap" />
                     <hc:NumericUpDown Margin="5,0,0,0" Value="1" Minimum="1" x:Name="numChat" Width="70" ValueChanged="numChat_ValueChanged" Background="{DynamicResource AppElementBackground}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}" />
                 </WrapPanel>
                 <WrapPanel HorizontalAlignment="Right" Orientation="Horizontal" Margin="0,2,0,0">
-                    <TextBlock Text="{lex:Loc ChatRenders}" Margin="0,7,0,0" Foreground="{DynamicResource AppText}" TextWrapping="Wrap" />
+                    <TextBlock Text="{lex:Loc ChatRenders}" Margin="0,6,0,0" Foreground="{DynamicResource AppText}" TextWrapping="Wrap" />
                     <hc:NumericUpDown Margin="5,0,0,0" Value="1" Minimum="1" x:Name="numRender" Width="70" ValueChanged="numRender_ValueChanged" Background="{DynamicResource AppElementBackground}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}" />
                 </WrapPanel>
                 <hc:Divider Content="{lex:Loc MassDownloads}" HorizontalAlignment="Center" Margin="0,10,0,0" FontWeight="Bold" MinWidth="180" LineStroke="{DynamicResource AppDivider}" Foreground="{DynamicResource AppDividerText}"/>
diff --git a/TwitchDownloaderWPF/PageVodDownload.xaml b/TwitchDownloaderWPF/PageVodDownload.xaml
index ed2be6a8..4e91f745 100644
--- a/TwitchDownloaderWPF/PageVodDownload.xaml
+++ b/TwitchDownloaderWPF/PageVodDownload.xaml
@@ -68,9 +68,9 @@
             <StackPanel HorizontalAlignment="Left">
                 <TextBlock Text="{lex:Loc Length}" HorizontalAlignment="Right" Foreground="{DynamicResource AppText}" />
                 <TextBlock Text="{lex:Loc Quality}" HorizontalAlignment="Right" Margin="0,15,0,0" Foreground="{DynamicResource AppText}" />
-                <TextBlock Text="{lex:Loc CropVideo}" HorizontalAlignment="Right" Margin="0,19,0,0" Foreground="{DynamicResource AppText}" />
-                <TextBlock Text="{lex:Loc DownloadThreads}" HorizontalAlignment="Right" Margin="0,50,0,0" Foreground="{DynamicResource AppText}" />
-                <TextBlock HorizontalAlignment="Right" Margin="0,22,0,0" Foreground="{DynamicResource AppText}"><Run Text="{lex:Loc Oauth}"/><Hyperlink NavigateUri="https://www.youtube.com/watch?v=1MBsUoFGuls" RequestNavigate="Hyperlink_RequestNavigate" ToolTipService.ShowDuration="30000" Foreground="{DynamicResource AppHyperlink}"><Hyperlink.ToolTip><Run Text="{lex:Loc OauthTooltip}"/></Hyperlink.ToolTip>(?)</Hyperlink>:</TextBlock>
+                <TextBlock Text="{lex:Loc CropVideo}" HorizontalAlignment="Right" Margin="0,17,0,0" Foreground="{DynamicResource AppText}" />
+                <TextBlock Text="{lex:Loc DownloadThreads}" HorizontalAlignment="Right" Margin="0,46,0,0" Foreground="{DynamicResource AppText}" />
+                <TextBlock HorizontalAlignment="Right" Margin="0,21,0,0" Foreground="{DynamicResource AppText}"><Run Text="{lex:Loc Oauth}"/><Hyperlink NavigateUri="https://www.youtube.com/watch?v=1MBsUoFGuls" RequestNavigate="Hyperlink_RequestNavigate" ToolTipService.ShowDuration="30000" Foreground="{DynamicResource AppHyperlink}"><Hyperlink.ToolTip><Run Text="{lex:Loc OauthTooltip}"/></Hyperlink.ToolTip>(?)</Hyperlink>:</TextBlock>
             </StackPanel>
             <StackPanel>
                 <TextBlock x:Name="labelLength" Text="0:0:0" Margin="5,0,0,0" Foreground="{DynamicResource AppText}" />
@@ -90,7 +90,7 @@
                         <hc:NumericUpDown Margin="3,-1,0,0" Minimum="0" Maximum="60" Value="0" x:Name="numEndMinute" ValueChanged="numEndMinute_ValueChanged" Background="{DynamicResource AppElementBackground}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}" />
                         <hc:NumericUpDown Margin="3,-1,0,0" Minimum="0" Maximum="60" Value="0" x:Name="numEndSecond" ValueChanged="numEndSecond_ValueChanged" Background="{DynamicResource AppElementBackground}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}" />
                     </StackPanel>
-                    <hc:NumericUpDown Margin="2,5,0,0" Minimum="1" Value="4" Maximum="10" x:Name="numDownloadThreads" HorizontalAlignment="Left" ValueChanged="numDownloadThreads_ValueChanged" Background="{DynamicResource AppElementBackground}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}" />
+                    <hc:NumericUpDown Margin="0,5,0,0" Minimum="1" Value="4" Maximum="10" x:Name="numDownloadThreads" HorizontalAlignment="Left" ValueChanged="numDownloadThreads_ValueChanged" Background="{DynamicResource AppElementBackground}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}" />
                     <TextBox x:Name="TextOauth" Margin="0,8,3,3" MinWidth="200" MaxWidth="400" TextChanged="TextOauth_TextChanged" Background="{DynamicResource AppElementBackground}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}" />
                 </StackPanel>
             </StackPanel>
diff --git a/TwitchDownloaderWPF/PageVodDownload.xaml.cs b/TwitchDownloaderWPF/PageVodDownload.xaml.cs
index 8e4406ae..9202c23e 100644
--- a/TwitchDownloaderWPF/PageVodDownload.xaml.cs
+++ b/TwitchDownloaderWPF/PageVodDownload.xaml.cs
@@ -411,7 +411,7 @@ private async void SplitBtnDownloader_Click(object sender, RoutedEventArgs e)
                 FileName = FilenameService.GetFilename(Settings.Default.TemplateVod, textTitle.Text, currentVideoId.ToString(), currentVideoTime, textStreamer.Text,
                     checkStart.IsChecked == true ? new TimeSpan((int)numStartHour.Value, (int)numStartMinute.Value, (int)numStartSecond.Value) : TimeSpan.Zero,
                     checkEnd.IsChecked == true ? new TimeSpan((int)numEndHour.Value, (int)numEndMinute.Value, (int)numEndSecond.Value) : vodLength,
-                    viewCount.ToString(), game)
+                    viewCount.ToString(), game) + ".mp4"
             };
             if (saveFileDialog.ShowDialog() == false)
             {
diff --git a/TwitchDownloaderWPF/Themes/Dark.xaml b/TwitchDownloaderWPF/Themes/Dark.xaml
index 376b0b22..d4cd4c7e 100644
--- a/TwitchDownloaderWPF/Themes/Dark.xaml
+++ b/TwitchDownloaderWPF/Themes/Dark.xaml
@@ -19,7 +19,7 @@
     <SolidColorBrush x:Key="AppInnerTextDisabled" Color="#999999"/>
     <SolidColorBrush x:Key="AppHyperlink" Color="#F224B7"/>
     <SolidColorBrush x:Key="AppCheckBox" Color="#B5005D"/>
-    <SolidColorBrush x:Key="AppRadio" Color="#B5005D"/>
+    <!-- <SolidColorBrush x:Key="AppRadio" Color="#B5005D"/> DEPRECATED -->
     <SolidColorBrush x:Key="AppDivider" Color="#919191"/>
     <SolidColorBrush x:Key="AppDividerText" Color="#E0E0E0"/>
 
diff --git a/TwitchDownloaderWPF/Themes/Light.xaml b/TwitchDownloaderWPF/Themes/Light.xaml
index 2caa884a..fbd055e8 100644
--- a/TwitchDownloaderWPF/Themes/Light.xaml
+++ b/TwitchDownloaderWPF/Themes/Light.xaml
@@ -19,7 +19,7 @@
     <SolidColorBrush x:Key="AppInnerTextDisabled" Color="#A6A6A6"/>
     <SolidColorBrush x:Key="AppHyperlink" Color="#0066CC"/>
     <SolidColorBrush x:Key="AppCheckBox" Color="#3A96F2"/>
-    <SolidColorBrush x:Key="AppRadio" Color="#2388ED"/>
+    <!-- <SolidColorBrush x:Key="AppRadio" Color="#2388ED"/> DEPRECATED -->
     <SolidColorBrush x:Key="AppDivider" Color="#E0E0E0"/>
     <SolidColorBrush x:Key="AppDividerText" Color="#212121"/>
 
diff --git a/TwitchDownloaderWPF/WindowQueueOptions.xaml b/TwitchDownloaderWPF/WindowQueueOptions.xaml
index 4c8680e5..6b935daa 100644
--- a/TwitchDownloaderWPF/WindowQueueOptions.xaml
+++ b/TwitchDownloaderWPF/WindowQueueOptions.xaml
@@ -51,14 +51,14 @@
             <StackPanel Margin="20,0,0,0">
                 <StackPanel Orientation="Horizontal" Margin="0,5,0,0">
                     <TextBlock x:Name="TextDownloadFormat" Text="{lex:Loc DownloadFormat}" IsEnabled="False" Margin="5,0,0,0" Foreground="{DynamicResource AppTextDisabled}"/>
-                    <RadioButton x:Name="radioJson" IsEnabled="False" IsChecked="True" Content="JSON" HorizontalAlignment="Left" Margin="5,0,0,0" VerticalAlignment="Top" Checked="radioJson_Checked" Background="{DynamicResource AppRadio}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}"/>
-                    <RadioButton x:Name="radioTxt" IsEnabled="False" Content="TXT" HorizontalAlignment="Left" Margin="5,0,0,0" VerticalAlignment="Top" Checked="radioTxt_Checked" Background="{DynamicResource AppRadio}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}"/>
-                    <RadioButton x:Name="radioHTML" IsEnabled="False" Content="HTML" HorizontalAlignment="Left" Margin="5,0,0,0" VerticalAlignment="Top" Checked="radioHTML_Checked" Background="{DynamicResource AppRadio}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}"/>
+                    <RadioButton x:Name="radioJson" IsEnabled="False" IsChecked="True" Content="JSON" HorizontalAlignment="Left" Margin="5,0,0,0" VerticalAlignment="Top" Checked="radioJson_Checked" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}"/>
+                    <RadioButton x:Name="radioTxt" IsEnabled="False" Content="TXT" HorizontalAlignment="Left" Margin="5,0,0,0" VerticalAlignment="Top" Checked="radioTxt_Checked" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}"/>
+                    <RadioButton x:Name="radioHTML" IsEnabled="False" Content="HTML" HorizontalAlignment="Left" Margin="5,0,0,0" VerticalAlignment="Top" Checked="radioHTML_Checked" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}"/>
                 </StackPanel>
                 <StackPanel x:Name="StackChatCompression" Orientation="Horizontal" Margin="0,5,0,0">
                     <TextBlock x:Name="TextCompression" Text="{lex:Loc ChatCompression}" Margin="5,0,0,0" Foreground="{DynamicResource AppTextDisabled}"/>
-                    <RadioButton x:Name="RadioCompressionNone" IsEnabled="False" IsChecked="True" Content="{lex:Loc ChatCompressionNone}" HorizontalAlignment="Left" Margin="5,0,0,0" VerticalAlignment="Top" Background="{DynamicResource AppRadio}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}"/>
-                    <RadioButton x:Name="RadioCompressionGzip" IsEnabled="False" Content="{lex:Loc ChatCompressionGzip}" HorizontalAlignment="Left" Margin="5,0,0,0" VerticalAlignment="Top" Background="{DynamicResource AppRadio}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}"/>
+                    <RadioButton x:Name="RadioCompressionNone" IsEnabled="False" IsChecked="True" Content="{lex:Loc ChatCompressionNone}" HorizontalAlignment="Left" Margin="5,0,0,0" VerticalAlignment="Top" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}"/>
+                    <RadioButton x:Name="RadioCompressionGzip" IsEnabled="False" Content="{lex:Loc ChatCompressionGzip}" HorizontalAlignment="Left" Margin="5,0,0,0" VerticalAlignment="Top" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}"/>
                 </StackPanel>
                 <CheckBox x:Name="checkEmbed" IsEnabled="False" Content="{lex:Loc EmbedImages}" HorizontalAlignment="Left" Margin="5,5,0,0" VerticalAlignment="Top" Foreground="{DynamicResource AppText}" BorderBrush="{DynamicResource AppElementBorder}"/>
             </StackPanel>
diff --git a/TwitchDownloaderWPF/WindowSettings.xaml b/TwitchDownloaderWPF/WindowSettings.xaml
index 611f8456..81ac7ba5 100644
--- a/TwitchDownloaderWPF/WindowSettings.xaml
+++ b/TwitchDownloaderWPF/WindowSettings.xaml
@@ -43,26 +43,26 @@
                 <CheckBox x:Name="CheckDonation" VerticalAlignment="Center" HorizontalAlignment="Left" Margin="0,2,0,0" Checked="CheckDonation_OnCheckedChanged" Unchecked="CheckDonation_OnCheckedChanged" BorderBrush="{DynamicResource AppElementBorder}" />
             </StackPanel>
             <StackPanel Margin="0,0,0,10" Orientation="Horizontal">
-                <TextBlock Margin="3,4,3,3" Text="{lex:Loc SettingsTimeFormat}" Foreground="{DynamicResource AppText}" />
-                <RadioButton x:Name="RadioTimeFormatUtc" Content="{lex:Loc TimestampUtc}" Checked="RadioTimeFormat_OnCheckedChanged" Unchecked="RadioTimeFormat_OnCheckedChanged" Background="{DynamicResource AppRadio}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}" />
-                <RadioButton x:Name="RadioTimeFormatLocal" IsChecked="True" Content="{lex:Loc TimestampLocal}" Margin="3,0,0,0" Checked="RadioTimeFormat_OnCheckedChanged" Unchecked="RadioTimeFormat_OnCheckedChanged" Background="{DynamicResource AppRadio}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}" />
+                <TextBlock Margin="3,3,3,4" Text="{lex:Loc SettingsTimeFormat}" Foreground="{DynamicResource AppText}" />
+                <RadioButton x:Name="RadioTimeFormatUtc" Content="{lex:Loc TimestampUtc}" Checked="RadioTimeFormat_OnCheckedChanged" Unchecked="RadioTimeFormat_OnCheckedChanged" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}" />
+                <RadioButton x:Name="RadioTimeFormatLocal" IsChecked="True" Content="{lex:Loc TimestampLocal}" Margin="3,0,0,0" Checked="RadioTimeFormat_OnCheckedChanged" Unchecked="RadioTimeFormat_OnCheckedChanged" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}" />
             </StackPanel>
             <StackPanel Margin="0,0,0,10" Orientation="Horizontal">
-                <TextBlock Margin="3,4,3,3" Text="{lex:Loc VerboseErrors}" Foreground="{DynamicResource AppText}" />
+                <TextBlock Margin="3,3,3,2" Text="{lex:Loc VerboseErrors}" Foreground="{DynamicResource AppText}" />
                 <CheckBox x:Name="CheckVerboseErrors" VerticalAlignment="Center" HorizontalAlignment="Left" Margin="0,2,0,0" Checked="CheckVerboseErrors_OnCheckedChanged" Unchecked="CheckVerboseErrors_OnCheckedChanged" BorderBrush="{DynamicResource AppElementBorder}" />
             </StackPanel>
             <StackPanel Margin="0,0,0,10" Orientation="Horizontal">
                 <!--TODO: Add theme creation window instead of just opening the theme folder-->
-                <TextBlock Margin="3,7,3,3" Foreground="{DynamicResource AppText}"><Run Text="{lex:Loc ApplicationTheme}"/><Hyperlink ToolTipService.ShowDuration="30000" NavigateUri="Themes" RequestNavigate="Hyperlink_RequestNavigate" Foreground="{DynamicResource AppHyperlink}"><Hyperlink.ToolTip><Run Text="{lex:Loc ApplicationThemeTooltip}"/></Hyperlink.ToolTip>(?)</Hyperlink>:</TextBlock>
+                <TextBlock Margin="3,6,3,3" Foreground="{DynamicResource AppText}"><Run Text="{lex:Loc ApplicationTheme}"/><Hyperlink ToolTipService.ShowDuration="30000" NavigateUri="Themes" RequestNavigate="Hyperlink_RequestNavigate" Foreground="{DynamicResource AppHyperlink}"><Hyperlink.ToolTip><Run Text="{lex:Loc ApplicationThemeTooltip}"/></Hyperlink.ToolTip>(?)</Hyperlink>:</TextBlock>
                 <ComboBox x:Name="ComboTheme" MinWidth="100" MaxWidth="345" HorizontalAlignment="Left" SelectionChanged="ComboTheme_OnSelectionChanged" Margin="3,0,3,0" Background="{DynamicResource AppElementBackground}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}" />
             </StackPanel>
             <StackPanel Margin="0,0,0,10" Orientation="Horizontal">
-                <fa:SvgAwesome Margin="3,2,1,-2" Icon="Solid_Language" Width="32" Height="26" Foreground="{DynamicResource AppText}" />
-                <TextBlock Margin="3,8,3,3" Foreground="{DynamicResource AppText}"><Run Text="{lex:Loc ApplicationLanguage}"/><Hyperlink ToolTipService.ShowDuration="30000" NavigateUri="https://github.com/lay295/TwitchDownloader/blob/master/TwitchDownloaderWPF/README.md#localization" RequestNavigate="Hyperlink_RequestNavigate" Foreground="{DynamicResource AppHyperlink}"><Hyperlink.ToolTip><Run Text="{lex:Loc ApplicationLanguageTooltip}"/></Hyperlink.ToolTip>(?)</Hyperlink>:</TextBlock>
+                <fa:SvgAwesome Margin="3,0,1,-2" Icon="Solid_Language" Width="32" Height="26" Foreground="{DynamicResource AppText}" />
+                <TextBlock Margin="3,6,3,3" Foreground="{DynamicResource AppText}"><Run Text="{lex:Loc ApplicationLanguage}"/><Hyperlink ToolTipService.ShowDuration="30000" NavigateUri="https://github.com/lay295/TwitchDownloader/blob/master/TwitchDownloaderWPF/README.md#localization" RequestNavigate="Hyperlink_RequestNavigate" Foreground="{DynamicResource AppHyperlink}"><Hyperlink.ToolTip><Run Text="{lex:Loc ApplicationLanguageTooltip}"/></Hyperlink.ToolTip>(?)</Hyperlink>:</TextBlock>
                 <ComboBox x:Name="ComboLocale" MinWidth="100" MaxWidth="330" HorizontalAlignment="Left" SelectionChanged="ComboLocale_OnSelectionChanged" Margin="3,0,3,0" Background="{DynamicResource AppElementBackground}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}" />
             </StackPanel>
             <StackPanel Margin="0,0,0,10" Orientation="Horizontal">
-                <TextBlock Margin="3,7,3,3" Foreground="{DynamicResource AppText}"><Run Text="{lex:Loc MaximumThreadBandwidth}" /><Hyperlink ToolTipService.ShowDuration="30000" Foreground="{DynamicResource AppHyperlink}"><Hyperlink.ToolTip><Run Text="{lex:Loc MaximumThreadBandwidthTooltip}" /></Hyperlink.ToolTip>(?)</Hyperlink>:</TextBlock>
+                <TextBlock Margin="3,6,3,3" Foreground="{DynamicResource AppText}"><Run Text="{lex:Loc MaximumThreadBandwidth}" /><Hyperlink ToolTipService.ShowDuration="30000" Foreground="{DynamicResource AppHyperlink}"><Hyperlink.ToolTip><Run Text="{lex:Loc MaximumThreadBandwidthTooltip}" /></Hyperlink.ToolTip>(?)</Hyperlink>:</TextBlock>
                 <CheckBox x:Name="CheckThrottleEnabled" VerticalAlignment="Center" HorizontalAlignment="Left" Margin="1, 6, 3, 3" Checked="CheckThrottleEnabled_OnCheckedChanged" Unchecked="CheckThrottleEnabled_OnCheckedChanged" BorderBrush="{DynamicResource AppElementBorder}" />
                 <hc:NumericUpDown x:Name="NumMaximumBandwidth" Value="4096" Minimum="1" Maximum="122070" ValueChanged="NumMaximumBandwidth_OnValueChanged" Background="{DynamicResource AppElementBackground}" BorderBrush="{DynamicResource AppElementBorder}" Foreground="{DynamicResource AppText}" />
                 <TextBlock Margin="3,7,0,0" Text="KiB/s" Foreground="{DynamicResource AppText}" />