You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
ShopNCook/Views/LoginPage.xaml

147 lines
4.9 KiB

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="ShoopNCook.Views.LoginPage"
Title="LoginPage"
BackgroundColor="{StaticResource BackgroundPrimary}">
<VerticalStackLayout
Margin="20, 75, 20, 20">
<Label
FontFamily="PoppinsBold"
Text="Welcome Back!"
FontSize="32"
TextColor="{StaticResource TextColorPrimary}"
FontAttributes="Bold"
VerticalOptions="Start"
HorizontalOptions="Start" />
<Label
Text="Fill in your credentials or continue with social media"
FontFamily="PoppinsBold"
FontSize="20"
TextColor="{StaticResource TextColorSecondary}"
VerticalOptions="Start"
HorizontalOptions="Start" />
<Border
Style="{StaticResource SecondaryBorder}"
Margin="0,30,0,20">
<Grid
Padding="5"
BackgroundColor="{StaticResource BackgroundSecondary}"
ColumnDefinitions="Auto,Auto,*">
<Image
Grid.Column="1"
Source="email_icon.svg">
</Image>
<Entry
Style="{StaticResource UserInput}"
Grid.Column="2"
Placeholder="Mail address"/>
</Grid>
</Border>
<Border
Style="{StaticResource SecondaryBorder}"
StrokeShape="RoundRectangle 12"
>
<Grid
Padding="5"
BackgroundColor="{StaticResource BackgroundSecondary}"
ColumnDefinitions="Auto,Auto,*,Auto">
<Image
Grid.Column="1"
Source="password_icon.svg">
</Image>
<Entry
Style="{StaticResource UserInput}"
Grid.Column="2"
Placeholder="Password"/>
<ImageButton
Grid.Column="3"
Source="visibility_off.svg"
HeightRequest="30">
</ImageButton>
</Grid>
</Border>
<Label
TextColor="{StaticResource TextColorSecondary}"
HorizontalOptions="End">
Forgot Password ?
</Label>
<Border
Margin="0, 30, 0, 0"
Stroke="{StaticResource BackgroundPrimary}"
StrokeShape="RoundRectangle 12">
<Label
HeightRequest="50"
BackgroundColor="{StaticResource ActionButton}"
HorizontalTextAlignment="Center"
VerticalTextAlignment="Center">
LOG IN</Label>
</Border>
<HorizontalStackLayout
HorizontalOptions="Center"
Margin="0, 20, 0, 0"
Spacing="6">
<Rectangle
BackgroundColor="Gray"
WidthRequest="15"
HeightRequest="3"/>
<Label
TextColor="{StaticResource TextColorSecondary}">
Or continue with</Label>
<Rectangle
BackgroundColor="Gray"
WidthRequest="15"
HeightRequest="3"/>
</HorizontalStackLayout>
<HorizontalStackLayout
Margin="0, 20, 0, 0"
Spacing="15"
HorizontalOptions="Center">
<Border
HeightRequest="75"
WidthRequest="75"
BackgroundColor="#e9f4ff"
StrokeShape="RoundRectangle 25 25 25 25"
Stroke="{StaticResource BackgroundPrimary}">
<Image
HeightRequest="50"
Source="google_logo.svg"/>
</Border>
<Border
HeightRequest="75"
WidthRequest="75"
BackgroundColor="#4460a0"
StrokeShape="RoundRectangle 25 25 25 25"
Stroke="{StaticResource BackgroundPrimary}">
<Image
WidthRequest="40"
Source="facebook_logo.svg"/>
</Border>
</HorizontalStackLayout>
<HorizontalStackLayout
Spacing="4"
HorizontalOptions="Center"
Margin="0, 20, 0, 0">
<Label
TextColor="{StaticResource TextColorPrimary}">
New User?</Label>
<Label
FontAttributes="Bold"
TextColor="{StaticResource TextColorPrimary}">
Create Account</Label>
</HorizontalStackLayout>
</VerticalStackLayout>
</ContentPage>