301 lines
14 KiB
XML
301 lines
14 KiB
XML
<ContentDialog
|
|
x:Class="Wino.Dialogs.WinoAccountRegistrationDialog"
|
|
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:domain="using:Wino.Core.Domain"
|
|
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
|
|
Title="{x:Bind domain:Translator.WinoAccount_RegisterDialog_Title}"
|
|
FullSizeDesired="True"
|
|
PrimaryButtonClick="RegisterClicked"
|
|
PrimaryButtonStyle="{ThemeResource AccentButtonStyle}"
|
|
PrimaryButtonText="{x:Bind domain:Translator.WinoAccount_RegisterDialog_PrimaryButton}"
|
|
SecondaryButtonText="{x:Bind domain:Translator.Buttons_Cancel}"
|
|
Style="{StaticResource WinoDialogStyle}"
|
|
mc:Ignorable="d">
|
|
|
|
<ContentDialog.Resources>
|
|
<x:Double x:Key="ContentDialogMinWidth">560</x:Double>
|
|
<x:Double x:Key="ContentDialogMaxWidth">560</x:Double>
|
|
<x:Double x:Key="ContentDialogMaxHeight">900</x:Double>
|
|
</ContentDialog.Resources>
|
|
|
|
<ScrollViewer VerticalScrollBarVisibility="Auto">
|
|
<StackPanel Spacing="20">
|
|
|
|
<!-- Hero illustration area -->
|
|
<Border Height="140" CornerRadius="12">
|
|
<Border.Background>
|
|
<LinearGradientBrush StartPoint="0,0" EndPoint="1,1">
|
|
<GradientStop Offset="0" Color="#1A818CF8" />
|
|
<GradientStop Offset="0.5" Color="#20A78BFA" />
|
|
<GradientStop Offset="1" Color="#1AE879F9" />
|
|
</LinearGradientBrush>
|
|
</Border.Background>
|
|
<Canvas>
|
|
<!-- Background decorative circles -->
|
|
<Ellipse
|
|
Canvas.Left="370"
|
|
Canvas.Top="-10"
|
|
Width="90"
|
|
Height="90"
|
|
Opacity="0.12">
|
|
<Ellipse.Fill>
|
|
<RadialGradientBrush>
|
|
<GradientStop Offset="0" Color="#A78BFA" />
|
|
<GradientStop Offset="1" Color="Transparent" />
|
|
</RadialGradientBrush>
|
|
</Ellipse.Fill>
|
|
</Ellipse>
|
|
<Ellipse
|
|
Canvas.Left="30"
|
|
Canvas.Top="90"
|
|
Width="70"
|
|
Height="70"
|
|
Opacity="0.1">
|
|
<Ellipse.Fill>
|
|
<RadialGradientBrush>
|
|
<GradientStop Offset="0" Color="#38BDF8" />
|
|
<GradientStop Offset="1" Color="Transparent" />
|
|
</RadialGradientBrush>
|
|
</Ellipse.Fill>
|
|
</Ellipse>
|
|
|
|
<!-- Person/account illustration -->
|
|
<Canvas Canvas.Left="200" Canvas.Top="12">
|
|
<!-- Circular badge background -->
|
|
<Ellipse
|
|
Canvas.Left="8"
|
|
Canvas.Top="8"
|
|
Width="80"
|
|
Height="80"
|
|
Opacity="0.9">
|
|
<Ellipse.Fill>
|
|
<LinearGradientBrush StartPoint="0,0" EndPoint="1,1">
|
|
<GradientStop Offset="0" Color="#818CF8" />
|
|
<GradientStop Offset="1" Color="#6366F1" />
|
|
</LinearGradientBrush>
|
|
</Ellipse.Fill>
|
|
</Ellipse>
|
|
<!-- Inner circle -->
|
|
<Ellipse
|
|
Canvas.Left="14"
|
|
Canvas.Top="14"
|
|
Width="68"
|
|
Height="68"
|
|
Opacity="0.35">
|
|
<Ellipse.Fill>
|
|
<LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
|
|
<GradientStop Offset="0" Color="#C7D2FE" />
|
|
<GradientStop Offset="1" Color="#A5B4FC" />
|
|
</LinearGradientBrush>
|
|
</Ellipse.Fill>
|
|
</Ellipse>
|
|
<!-- Person head -->
|
|
<Ellipse
|
|
Canvas.Left="34"
|
|
Canvas.Top="24"
|
|
Width="28"
|
|
Height="28"
|
|
Fill="White" />
|
|
<!-- Person body -->
|
|
<Path Data="M28 68 A20 16 0 0 1 68 68" Fill="White" />
|
|
|
|
<!-- Plus badge -->
|
|
<Ellipse
|
|
Canvas.Left="62"
|
|
Canvas.Top="62"
|
|
Width="28"
|
|
Height="28">
|
|
<Ellipse.Fill>
|
|
<LinearGradientBrush StartPoint="0,0" EndPoint="1,1">
|
|
<GradientStop Offset="0" Color="#4ADE80" />
|
|
<GradientStop Offset="1" Color="#16A34A" />
|
|
</LinearGradientBrush>
|
|
</Ellipse.Fill>
|
|
</Ellipse>
|
|
<!-- Plus sign -->
|
|
<Rectangle
|
|
Canvas.Left="73"
|
|
Canvas.Top="70"
|
|
Width="4"
|
|
Height="16"
|
|
Fill="White"
|
|
RadiusX="2"
|
|
RadiusY="2" />
|
|
<Rectangle
|
|
Canvas.Left="69"
|
|
Canvas.Top="74"
|
|
Width="12"
|
|
Height="4"
|
|
Fill="White"
|
|
RadiusX="2"
|
|
RadiusY="2" />
|
|
</Canvas>
|
|
|
|
<!-- Decorative sparkles -->
|
|
<Ellipse
|
|
Canvas.Left="140"
|
|
Canvas.Top="35"
|
|
Width="6"
|
|
Height="6"
|
|
Fill="#A78BFA"
|
|
Opacity="0.5" />
|
|
<Ellipse
|
|
Canvas.Left="350"
|
|
Canvas.Top="55"
|
|
Width="5"
|
|
Height="5"
|
|
Fill="#38BDF8"
|
|
Opacity="0.6" />
|
|
<Ellipse
|
|
Canvas.Left="120"
|
|
Canvas.Top="95"
|
|
Width="4"
|
|
Height="4"
|
|
Fill="#6EE7B7"
|
|
Opacity="0.4" />
|
|
<Ellipse
|
|
Canvas.Left="380"
|
|
Canvas.Top="105"
|
|
Width="4"
|
|
Height="4"
|
|
Fill="#F472B6"
|
|
Opacity="0.5" />
|
|
</Canvas>
|
|
</Border>
|
|
|
|
<!-- Benefits section -->
|
|
<StackPanel Spacing="8">
|
|
<TextBlock
|
|
Margin="0,0,0,4"
|
|
Style="{StaticResource BodyStrongTextBlockStyle}"
|
|
Text="{x:Bind domain:Translator.WinoAccount_RegisterDialog_BenefitsTitle}" />
|
|
|
|
<Border
|
|
Padding="14"
|
|
Background="{ThemeResource CardBackgroundFillColorSecondaryBrush}"
|
|
CornerRadius="12">
|
|
<Grid ColumnSpacing="12">
|
|
<Grid.ColumnDefinitions>
|
|
<ColumnDefinition Width="Auto" />
|
|
<ColumnDefinition Width="*" />
|
|
</Grid.ColumnDefinitions>
|
|
<Border
|
|
Width="36"
|
|
Height="36"
|
|
Background="{ThemeResource AccentFillColorDefaultBrush}"
|
|
CornerRadius="8"
|
|
Opacity="0.15" />
|
|
<FontIcon
|
|
HorizontalAlignment="Center"
|
|
VerticalAlignment="Center"
|
|
FontSize="16"
|
|
Foreground="{ThemeResource AccentTextFillColorPrimaryBrush}"
|
|
Glyph="" />
|
|
<StackPanel Grid.Column="1" Spacing="2">
|
|
<TextBlock Style="{StaticResource BodyStrongTextBlockStyle}" Text="{x:Bind domain:Translator.WinoAccount_RegisterDialog_BenefitSyncTitle}" />
|
|
<TextBlock
|
|
Foreground="{ThemeResource TextFillColorSecondaryBrush}"
|
|
Style="{StaticResource CaptionTextBlockStyle}"
|
|
Text="{x:Bind domain:Translator.WinoAccount_RegisterDialog_BenefitSyncDescription}"
|
|
TextWrapping="WrapWholeWords" />
|
|
</StackPanel>
|
|
</Grid>
|
|
</Border>
|
|
|
|
<Border
|
|
Padding="14"
|
|
Background="{ThemeResource CardBackgroundFillColorSecondaryBrush}"
|
|
CornerRadius="12">
|
|
<Grid ColumnSpacing="12">
|
|
<Grid.ColumnDefinitions>
|
|
<ColumnDefinition Width="Auto" />
|
|
<ColumnDefinition Width="*" />
|
|
</Grid.ColumnDefinitions>
|
|
<Border
|
|
Width="36"
|
|
Height="36"
|
|
Background="{ThemeResource AccentFillColorDefaultBrush}"
|
|
CornerRadius="8"
|
|
Opacity="0.15" />
|
|
<FontIcon
|
|
HorizontalAlignment="Center"
|
|
VerticalAlignment="Center"
|
|
FontSize="16"
|
|
Foreground="{ThemeResource AccentTextFillColorPrimaryBrush}"
|
|
Glyph="" />
|
|
<StackPanel Grid.Column="1" Spacing="2">
|
|
<TextBlock Style="{StaticResource BodyStrongTextBlockStyle}" Text="{x:Bind domain:Translator.WinoAccount_RegisterDialog_BenefitAiTitle}" />
|
|
<TextBlock
|
|
Foreground="{ThemeResource TextFillColorSecondaryBrush}"
|
|
Style="{StaticResource CaptionTextBlockStyle}"
|
|
Text="{x:Bind domain:Translator.WinoAccount_RegisterDialog_BenefitAiDescription}"
|
|
TextWrapping="WrapWholeWords" />
|
|
</StackPanel>
|
|
</Grid>
|
|
</Border>
|
|
</StackPanel>
|
|
|
|
<TextBlock
|
|
x:Name="ErrorTextBlock"
|
|
Foreground="{ThemeResource SystemFillColorCriticalBrush}"
|
|
TextWrapping="WrapWholeWords"
|
|
Visibility="Collapsed" />
|
|
|
|
<!-- Input fields -->
|
|
<StackPanel Spacing="12">
|
|
<TextBox
|
|
x:Name="EmailTextBox"
|
|
Header="{x:Bind domain:Translator.WinoAccount_EmailLabel}"
|
|
KeyDown="EmailTextBox_KeyDown"
|
|
PlaceholderText="{x:Bind domain:Translator.WinoAccount_EmailPlaceholder}"
|
|
TextChanging="InputChanged" />
|
|
|
|
<PasswordBox
|
|
x:Name="PasswordBox"
|
|
Header="{x:Bind domain:Translator.WinoAccount_PasswordLabel}"
|
|
KeyDown="PasswordBox_KeyDown"
|
|
PasswordChanged="InputChanged" />
|
|
|
|
<PasswordBox
|
|
x:Name="ConfirmPasswordBox"
|
|
Header="{x:Bind domain:Translator.WinoAccount_ConfirmPasswordLabel}"
|
|
KeyDown="ConfirmPasswordBox_KeyDown"
|
|
PasswordChanged="InputChanged" />
|
|
</StackPanel>
|
|
|
|
<Border
|
|
Padding="14"
|
|
Background="{ThemeResource CardBackgroundFillColorSecondaryBrush}"
|
|
CornerRadius="12">
|
|
<StackPanel Spacing="10">
|
|
<TextBlock Style="{StaticResource BodyStrongTextBlockStyle}" Text="{x:Bind domain:Translator.WinoAccount_RegisterDialog_PrivacyTitle}" />
|
|
<TextBlock
|
|
Foreground="{ThemeResource TextFillColorSecondaryBrush}"
|
|
Style="{StaticResource CaptionTextBlockStyle}"
|
|
Text="{x:Bind domain:Translator.WinoAccount_RegisterDialog_PrivacyDescription}"
|
|
TextWrapping="WrapWholeWords" />
|
|
<HyperlinkButton
|
|
HorizontalAlignment="Left"
|
|
Click="PrivacyPolicyLink_Click"
|
|
Content="{x:Bind domain:Translator.WinoAccount_RegisterDialog_PrivacyLinkText}" />
|
|
<CheckBox
|
|
x:Name="PrivacyPolicyCheckBox"
|
|
Checked="InputChanged"
|
|
Content="{x:Bind domain:Translator.WinoAccount_RegisterDialog_PrivacyCheckbox}"
|
|
Unchecked="InputChanged" />
|
|
</StackPanel>
|
|
</Border>
|
|
|
|
<ProgressRing
|
|
x:Name="BusyRing"
|
|
Width="20"
|
|
Height="20"
|
|
HorizontalAlignment="Left"
|
|
IsActive="False"
|
|
Visibility="Collapsed" />
|
|
</StackPanel>
|
|
</ScrollViewer>
|
|
</ContentDialog>
|