Fixes render demo with new tab control

samples/RenderDemo/MainWindow.xaml

@@ -24,9 +24,6 @@
       </MenuItem>
     </Menu>
     <TabControl Classes="sidebar">
-      <TabControl.PageTransition>
-        <CrossFade Duration="0.25"/>
-      </TabControl.PageTransition>
       <TabItem Header="Animations">
         <pages:AnimationsPage/>
       </TabItem>
@@ -38,4 +35,4 @@
       </TabItem>
     </TabControl>
   </DockPanel>
-</Window>
+</Window>

samples/RenderDemo/SideBar.xaml

@@ -1,53 +1,66 @@
 <Styles xmlns="https://github.com/avaloniaui"
-        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-        xmlns:a="clr-namespace:Avalonia.Media.Animations;assembly=Avalonia.Media.Animations">
-  <Style Selector="TabControl.sidebar">
-    <Setter Property="Template">
-      <ControlTemplate>
-        <DockPanel>
-          <ScrollViewer MinWidth="190" Background="{DynamicResource ThemeAccentBrush}" DockPanel.Dock="Left">
-            <TabStrip Name="PART_TabStrip"
-                      MemberSelector="{x:Static TabControl.HeaderSelector}"
-                      Items="{TemplateBinding Items}"
-                      SelectedIndex="{TemplateBinding SelectedIndex, Mode=TwoWay}">
-              <TabStrip.ItemsPanel>
-                <ItemsPanelTemplate>
-                  <StackPanel Orientation="Vertical"/>
-                </ItemsPanelTemplate>
-              </TabStrip.ItemsPanel>
-            </TabStrip>
-          </ScrollViewer>
-          <Carousel Name="PART_Content"
-                    Margin="8 0 0 0"
-                    MemberSelector="{x:Static TabControl.ContentSelector}"
-                    Items="{TemplateBinding Items}"
-                    SelectedIndex="{TemplateBinding SelectedIndex}"
-                    PageTransition="{TemplateBinding PageTransition}"
-                    Grid.Row="1"/>
-        </DockPanel>
-      </ControlTemplate>
-    </Setter>
-  </Style>
+        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" >
+    <Style Selector="TabControl.sidebar">
+        <Setter Property="TabStripPlacement" Value="Left"/>
+        <Setter Property="Padding" Value="8 0 0 0"/>
+        <Setter Property="Background" Value="{DynamicResource ThemeAccentBrush}"/>
+        <Setter Property="Template">
+            <ControlTemplate>
+                <Border 
+                    Margin="{TemplateBinding Margin}"
+                    BorderBrush="{TemplateBinding BorderBrush}"
+                    BorderThickness="{TemplateBinding BorderThickness}">
+                    <DockPanel>
+                        <ScrollViewer
+                            Name="PART_ScrollViewer"
+                            HorizontalScrollBarVisibility="{TemplateBinding (ScrollViewer.HorizontalScrollBarVisibility)}"
+                            VerticalScrollBarVisibility="{TemplateBinding (ScrollViewer.VerticalScrollBarVisibility)}"
+                            Background="{TemplateBinding Background}">
+                            <ItemsPresenter
+                                Name="PART_ItemsPresenter"                                                            
+                                Items="{TemplateBinding Items}"
+                                ItemsPanel="{TemplateBinding ItemsPanel}"
+                                ItemTemplate="{TemplateBinding ItemTemplate}"
+                                MemberSelector="{TemplateBinding MemberSelector}">
+                            </ItemsPresenter>
+                        </ScrollViewer>
+                        <ContentPresenter
+                            Name="PART_Content"
+                            Margin="{TemplateBinding Padding}"                           
+                            HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
+                            VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
+                            Content="{TemplateBinding SelectedContent}"
+                            ContentTemplate="{TemplateBinding SelectedContentTemplate}">
+                        </ContentPresenter>
+                    </DockPanel>
+                </Border>
+            </ControlTemplate>
+        </Setter>
+    </Style>
 
-  <Style Selector="TabControl.sidebar TabStripItem">
-    <Setter Property="Foreground" Value="White"/>
-    <Setter Property="FontSize" Value="14"/>
-    <Setter Property="Margin" Value="0"/>
-    <Setter Property="Padding" Value="16"/>
-    <Setter Property="Opacity" Value="0.5"/>
-    <Setter Property="Transitions">
-      <Transitions>
-        <DoubleTransition Property="Opacity" Duration="0:0:0.2"/>
-      </Transitions>
-    </Setter>
-  </Style>
-
-  <Style Selector="TabControl.sidebar TabStripItem:pointerover">
-    <Setter Property="Opacity" Value="1"/>
-  </Style>
-
-  <Style Selector="TabControl.sidebar TabStripItem:selected">
-    <Setter Property="Background" Value="{DynamicResource ThemeAccentBrush2}"/>
-    <Setter Property="Opacity" Value="1"/>
-  </Style>
+    <Style Selector="TabControl.sidebar > TabItem">       
+        <Setter Property="BorderThickness" Value="0"/>
+        <Setter Property="Foreground" Value="White"/>
+        <Setter Property="FontSize" Value="14"/>
+        <Setter Property="Margin" Value="0"/>
+        <Setter Property="Padding" Value="16"/>
+        <Setter Property="Opacity" Value="0.5"/>
+        <Setter Property="Transitions">
+            <Transitions>
+                <DoubleTransition Property="Opacity" Duration="0:0:0.5"/>
+            </Transitions>
+        </Setter>
+    </Style>
+    <Style Selector="TabControl.sidebar > TabItem:pointerover">
+        <Setter Property="Opacity" Value="1"/>
+    </Style>
+    <Style Selector="TabControl.sidebar > TabItem:pointerover /template/ ContentPresenter#PART_ContentPresenter">
+        <Setter Property="Background" Value="Transparent"/>
+    </Style>
+    <Style Selector="TabControl.sidebar > TabItem:selected">
+        <Setter Property="Opacity" Value="1"/>
+    </Style>
+    <Style Selector="TabControl.sidebar > TabItem:selected /template/ ContentPresenter#PART_ContentPresenter">
+        <Setter Property="Background" Value="{DynamicResource ThemeAccentBrush2}"/>
+    </Style>
 </Styles>