GhostEngine/Ghost.Editor/View/Pages/Landing/CreateProjectPage.xaml

<?xml version="1.0" encoding="utf-8" ?>
<Page
    x:Class="Ghost.Editor.View.Pages.Landing.CreateProjectPage"
    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:data="using:Ghost.Data.Models"
    xmlns:editor="using:Ghost.Editor.Controls"
    xmlns:local="using:Ghost.Editor.View.Pages.Landing"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    NavigationCacheMode="Enabled"
    mc:Ignorable="d">

    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="Auto" />
            <ColumnDefinition Width="*" />
        </Grid.ColumnDefinitions>

        <!--  Template Info  -->
        <Grid Grid.Column="0" Width="300">
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto" />
                <RowDefinition Height="*" />
            </Grid.RowDefinitions>

            <TextBlock
                Grid.Row="0"
                Margin="0,0,0,24"
                Style="{StaticResource SubtitleTextBlockStyle}"
                Text="Template" />

            <ListView
                Grid.Row="1"
                ItemsSource="{x:Bind ViewModel.templates}"
                SelectedItem="{x:Bind ViewModel.SelectedTemplate, Mode=TwoWay}">
                <ListView.ItemTemplate>
                    <DataTemplate x:DataType="data:TemplateData">
                        <Grid>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="Auto" />
                                <ColumnDefinition Width="*" />
                            </Grid.ColumnDefinitions>

                            <ImageIcon
                                Grid.Column="0"
                                Width="24"
                                Height="24">
                                <ImageIcon.Source>
                                    <BitmapImage UriSource="{x:Bind GetIconURI()}" />
                                </ImageIcon.Source>
                            </ImageIcon>
                            <TextBlock
                                Grid.Column="1"
                                Margin="8,0"
                                VerticalAlignment="Center"
                                Text="{x:Bind Info.Name}" />
                        </Grid>
                    </DataTemplate>
                </ListView.ItemTemplate>
            </ListView>
        </Grid>

        <!--  Project Info  -->
        <Grid
            Grid.Column="1"
            Margin="16,0,0,0"
            Padding="16"
            Background="{ThemeResource CardBackgroundFillColorDefaultBrush}"
            CornerRadius="{StaticResource OverlayCornerRadius}">
            <Grid.RowDefinitions>
                <RowDefinition Height="300" />
                <RowDefinition Height="*" />
                <RowDefinition Height="Auto" />
            </Grid.RowDefinitions>

            <Grid Grid.Row="0" CornerRadius="4">
                <Image VerticalAlignment="Center" Stretch="UniformToFill">
                    <Image.Source>
                        <BitmapImage UriSource="{x:Bind ViewModel.SelectedTemplate.Value.GetPreviewURI(), Mode=OneWay}" />
                    </Image.Source>
                </Image>
                <Grid
                    MaxHeight="100"
                    VerticalAlignment="Bottom"
                    Background="{ThemeResource ControlOnImageFillColorDefaultBrush}">
                    <TextBlock
                        Margin="16"
                        VerticalAlignment="Bottom"
                        Foreground="{ThemeResource TextFillColorTertiaryBrush}"
                        Text="{x:Bind ViewModel.SelectedTemplate.Value.Info.Description, Mode=OneWay}" />
                </Grid>
            </Grid>

            <StackPanel Grid.Row="1" Margin="8,0">
                <TextBlock
                    Margin="0,16,0,8"
                    Style="{StaticResource TitleTextBlockStyle}"
                    Text="{x:Bind ViewModel.SelectedTemplate.Value.Info.Name, Mode=OneWay}" />
                <TextBlock
                    Margin="0,8,0,16"
                    Foreground="{ThemeResource TextFillColorSecondaryBrush}"
                    Style="{StaticResource SubtitleTextBlockStyle}"
                    Text="Project Settings" />

                <editor:PropertyField Label="Name">
                    <TextBox Text="{x:Bind ViewModel.ProjectName, Mode=TwoWay}" />
                </editor:PropertyField>
                <editor:PropertyField Label="Location">
                    <Grid>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="*" />
                            <ColumnDefinition Width="Auto" />
                        </Grid.ColumnDefinitions>

                        <TextBox
                            Grid.Column="0"
                            IsReadOnly="True"
                            Text="{x:Bind ViewModel.ProjectLocation, Mode=TwoWay}" />
                        <Button
                            Grid.Column="1"
                            Margin="4,0,0,0"
                            VerticalAlignment="Stretch"
                            Command="{x:Bind ViewModel.SelectionProjectLocationCommand}">
                            <FontIcon FontSize="16" Glyph="&#xE8DA;" />
                        </Button>
                    </Grid>
                </editor:PropertyField>
            </StackPanel>

            <Grid Grid.Row="2">
                <Button
                    Width="150"
                    HorizontalAlignment="Right"
                    Command="{x:Bind ViewModel.CreateProjectCommand}"
                    Content="Create"
                    Style="{ThemeResource AccentButtonStyle}" />
            </Grid>
        </Grid>

    </Grid>
</Page>