<?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.Pages.MyRecipesPage"
             Title="MyRecipesPage"
             xmlns:views="clr-namespace:ShoopNCook.Views"
             BackgroundColor="{StaticResource BackgroundPrimary}">
    <Grid
        RowDefinitions="Auto, *, Auto">
        <!-- Header label and return button -->
        <Grid
            Grid.Row="0"
            Padding="10, 20, 0, 30">

            <ImageButton 
                Grid.Column="0" 
                HeightRequest="50"
                WidthRequest="50"
                Source="arrow_back.svg"
                HorizontalOptions="Start"
                Clicked="OnBackButtonClicked"/>
            
            <Label 
                Grid.Column="0"
                FontSize="24"
                TextColor="{StaticResource TextColorPrimary}"
                Text="My Recipes"
                FontFamily="PoppinsBold"
                HorizontalOptions="Center"
                VerticalOptions="Center"/>
        </Grid>

        <!-- Favorite items -->
        <ScrollView
            Grid.Row="1">
            <FlexLayout
                JustifyContent="Center"
                AlignItems="Start"
                AlignContent="Start"
                Direction="Row"
                Wrap="Wrap"
                x:Name="RecipesLayout">

            </FlexLayout>
        </ScrollView>

        <Border 
            Margin="20, 0, 20, 5"
            Grid.Row="2"
            Style="{StaticResource SecondaryBorder}">
            <Button
                Style="{StaticResource UserButton}"
                BackgroundColor="{StaticResource Selected}"
                Text="Add a new recipe"
                Clicked="OnAddRecipeButtonClicked"/>
        </Border>
    </Grid>
</ContentPage>