Borders won't appear on UserControl Instances - wpf

Question

I have created a custom control that utilizes pre-existing WPF controls. Inside the control I made some borders that visually separates the individual elements.
Here's the XAML code for the UserControl: TimeEntry:
<UserControl
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
x:Class="ClockWatcher.TimeEntry"
x:Name="UserControl"
d:DesignWidth="365" d:DesignHeight="40" VerticalAlignment="Top" HorizontalAlignment="Left">
<UserControl.Resources>
<Thickness x:Key="borderDim">0,0,1,0</Thickness>
<Thickness x:Key="labelPadding">2,0</Thickness>
<Color x:Key="borderColor">#FF151E3E</Color>
<Color x:Key="buttonColorBackground">#FFB3D6E6</Color>
</UserControl.Resources>
<Grid x:Name="LayoutRoot" HorizontalAlignment="Left" VerticalAlignment="Top">
<Border x:Name="mainBorder" BorderThickness="3" CornerRadius="1" Padding="1" Background="#FF9DB6BF" HorizontalAlignment="Left" VerticalAlignment="Top">
<Border.BorderBrush>
<SolidColorBrush Color="{DynamicResource borderColor}"/>
</Border.BorderBrush>
<Grid x:Name="borderGrid">
<StackPanel x:Name="mainStack" Orientation="Horizontal" HorizontalAlignment="Left" VerticalAlignment="Top">
<Border x:Name="timeInBorder" HorizontalAlignment="Center" VerticalAlignment="Center" BorderThickness="{DynamicResource borderDim}" Padding="{DynamicResource labelPadding}">
<Border.BorderBrush>
<SolidColorBrush Color="{DynamicResource borderColor}"/>
</Border.BorderBrush>
<StackPanel x:Name="timeInStack" Orientation="Vertical" Height="31.92" Width="50.46">
<Label x:Name="timeInLabel" Content="Time In" VerticalAlignment="Top" Padding="{DynamicResource labelPadding}" BorderThickness="0,0,0,1">
<Label.BorderBrush>
<SolidColorBrush Color="{DynamicResource borderColor}"/>
</Label.BorderBrush>
</Label>
<TextBlock x:Name="timeInBlock" HorizontalAlignment="Left" TextWrapping="Wrap" Text="{Binding timeIn.TimeOfDay, ElementName=UserControl}" VerticalAlignment="Top"/>
</StackPanel>
</Border>
<Border x:Name="timeOutBorder" HorizontalAlignment="Center" VerticalAlignment="Center" BorderThickness="{DynamicResource borderDim}" Padding="{DynamicResource labelPadding}">
<Border.BorderBrush>
<SolidColorBrush Color="{DynamicResource borderColor}"/>
</Border.BorderBrush>
<StackPanel x:Name="timeOutStack" Orientation="Vertical" Height="31.92" Width="54.46">
<Label x:Name="timeOutLabel" Content="Time Out" HorizontalAlignment="Left" VerticalAlignment="Top" Padding="{DynamicResource labelPadding}" BorderThickness="0,0,0,1">
<Label.BorderBrush>
<SolidColorBrush Color="{DynamicResource borderColor}"/>
</Label.BorderBrush>
</Label>
<TextBlock x:Name="timeOutBlock" HorizontalAlignment="Left" TextWrapping="Wrap" Text="{Binding timeOut.TimeOfDay, ElementName=UserControl}" VerticalAlignment="Top" Padding="{DynamicResource labelPadding}"/>
</StackPanel>
</Border>
<Border x:Name="timeSpentBorder" HorizontalAlignment="Center" VerticalAlignment="Center" BorderThickness="{DynamicResource borderDim}" Padding="{DynamicResource labelPadding}">
<Border.BorderBrush>
<SolidColorBrush Color="{DynamicResource borderColor}"/>
</Border.BorderBrush>
<StackPanel x:Name="timeSpentStack" Orientation="Vertical" Height="31.92" Width="63.653">
<Label x:Name="timeSpentLabel" Content="Time Spent" HorizontalAlignment="Left" VerticalAlignment="Top" Padding="{DynamicResource labelPadding}" BorderThickness="0,0,0,1">
<Label.BorderBrush>
<SolidColorBrush Color="{DynamicResource borderColor}"/>
</Label.BorderBrush>
</Label>
<TextBlock x:Name="timeSpentBlock" HorizontalAlignment="Left" TextWrapping="Wrap" Text="{Binding timeSpent,ElementName=UserControl}" VerticalAlignment="Top" Padding="{DynamicResource labelPadding}"/>
</StackPanel>
</Border>
<Button x:Name="alarmButton" Content="Alarm" HorizontalAlignment="Center" BorderThickness="0,0,1,0">
<Button.Background>
<SolidColorBrush Color="{DynamicResource buttonColorBackground}"/>
</Button.Background>
<Button.BorderBrush>
<SolidColorBrush Color="{DynamicResource borderColor}"/>
</Button.BorderBrush>
</Button>
<StackPanel x:Name="commentStack1" Orientation="Horizontal">
<TextBox x:Name="commentBox" HorizontalAlignment="Left" TextWrapping="Wrap" Text="{Binding comment,ElementName=UserControl}" VerticalAlignment="Top" Padding="{DynamicResource labelPadding}" BorderThickness="0" SourceUpdated="commentBox_SourceUpdated">
<TextBox.BorderBrush>
<SolidColorBrush Color="{DynamicResource borderColor}"/>
</TextBox.BorderBrush>
</TextBox>
<Button x:Name="commentButton" VerticalAlignment="Top" Content="Ad" BorderThickness="1,0" Padding="{DynamicResource labelPadding}">
<Button.Background>
<SolidColorBrush Color="{DynamicResource buttonColorBackground}"/>
</Button.Background>
<Button.BorderBrush>
<SolidColorBrush Color="{DynamicResource borderColor}"/>
</Button.BorderBrush>
</Button>
</StackPanel>
<Button x:Name="deleteButton" Content="X" Padding="{DynamicResource labelPadding}" HorizontalAlignment="Left" VerticalAlignment="Top" BorderBrush="{x:Null}" BorderThickness="{DynamicResource borderDim}">
<Button.Background>
<SolidColorBrush Color="{DynamicResource buttonColorBackground}"/>
</Button.Background>
</Button>
</StackPanel>
</Grid>
</Border>
</Grid>
</UserControl>
In Blend, or the designer view in VS2013, the borders will appear just fine. However, when I place an instance of this control into a grid in the MainWindow, the borders won't appear.
All I do is this in MainWindow:
<Window
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:ClockWatcher" x:Class="ClockWatcher.MainWindow"
Title="MainWindow" Height="554" Width="949">
<Window.Resources>
<UserControl x:Key="timeEntry"/>
</Window.Resources>
<Grid x:Name="mainGrid">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="250*"/>
<ColumnDefinition Width="445*"/>
<ColumnDefinition Width="246*"/>
</Grid.ColumnDefinitions>
<Grid x:Name="leftGrid" Grid.Column="0">
<Grid.RowDefinitions>
<RowDefinition/>
<RowDefinition/>
</Grid.RowDefinitions>
</Grid>
<Grid x:Name="rightGrid" Grid.Column="2">
<Grid.RowDefinitions>
<RowDefinition/>
<RowDefinition/>
<RowDefinition/>
</Grid.RowDefinitions>
</Grid>
<ScrollViewer x:Name="timeEntryList" Grid.Column="1" HorizontalAlignment="Left">
<StackPanel x:Name="scrollStack" Orientation="Vertical" VerticalAlignment="Top" HorizontalAlignment="Left">
<local:TimeEntry/>
</StackPanel>
</ScrollViewer>
</Grid>
</Window>
Can someone help me find out what I did wrong here? I've been reading a book to find out about dependency objects and dependency properties, which I've also added the UserControl, but I'm not sure what's really wrong with it right now.

Answer 1

Declare all these resources in App.xaml and it will work,
<Application.Resources>
<Thickness x:Key="borderDim">0,0,1,0</Thickness>
<Thickness x:Key="labelPadding">2,0</Thickness>
<Color x:Key="borderColor">#FF151E3E</Color>
<Color x:Key="buttonColorBackground">#FFB3D6E6</Color>
</Application.Resources>