<?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="Linaris.AlbumPage"
             xmlns:local="clr-namespace:Linaris"
             xmlns:avatarview="clr-namespace:Syncfusion.Maui.Core;assembly=Syncfusion.Maui.Core"
             Title="Album"
             Style="{StaticResource PageFlyoutTrigger}">

    <Grid Style="{StaticResource GridFlyoutTrigger}">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="6*"/>
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="8*"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>
        
        <local:Layout Grid.Column="0"/>

        <ScrollView Grid.Column="1"
                             BackgroundColor="#404040">
            <VerticalStackLayout>
                
                <SearchBar Style="{StaticResource SearchBar}"/>

                <Grid VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand" Style="{StaticResource InfosComplementairesGridTrigger}">
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="6*"/>
                        <ColumnDefinition Width="*"/>
                    </Grid.ColumnDefinitions>
                    <VerticalStackLayout Grid.Column="0">
                        <avatarview:SfAvatarView 
                            Style="{StaticResource pdp}"
                            ImageSource="album9.jpg"/>
                        <Label Text="Night Visions"
                                Style="{StaticResource Titre}">
                        </Label>
                        <Label Text="Description"
                               Style="{StaticResource SousTitre}">
                        </Label>

                        <Frame Style="{StaticResource Song}">
                            <Label Text="Morceau 1"
                                   FontSize="20"
                                   TextColor="white"
                                   HorizontalTextAlignment="Center"/>
                        </Frame>

                        <Frame Style="{StaticResource Song}">
                            <Label Text="Morceau 2"
                                   FontSize="20"
                                   TextColor="white"
                                   HorizontalTextAlignment="Center"/>
                        </Frame>

                        <Frame Style="{StaticResource Song}">
                            <Label Text="Morceau 3"
                                   FontSize="20"
                                   TextColor="white"
                                   HorizontalTextAlignment="Center"/>
                        </Frame>

                        <Frame Style="{StaticResource Song}">
                            <Label Text="Morceau 4"
                                   FontSize="20"
                                   TextColor="white"
                                   HorizontalTextAlignment="Center"/>
                        </Frame>

                        <Frame Style="{StaticResource Song}">
                            <Label Text="Morceau 5"
                                   FontSize="20"
                                   TextColor="white"
                                   HorizontalTextAlignment="Center"/>
                        </Frame>

                        <Frame Style="{StaticResource Song}">
                            <Label Text="Morceau 6"
                                   FontSize="20"
                                   TextColor="white"
                                   HorizontalTextAlignment="Center"/>
                        </Frame>

                        <Frame Style="{StaticResource Song}">
                            <Label Text="Morceau 7"
                                   FontSize="20"
                                   TextColor="white"
                                   HorizontalTextAlignment="Center"/>
                        </Frame>

                        <VerticalStackLayout VerticalOptions="Fill" BackgroundColor="grey" Style="{StaticResource InfosStackTrigger}" Padding="20" Margin="0,10,0,10">
                            <VerticalStackLayout HorizontalOptions="Fill">
                                <Label Text="Informations complémentaires" TextColor="White" HorizontalOptions="Center">
                                </Label>
                                <Label TextColor="White" HorizontalOptions="Center" VerticalOptions="End">
                                    <Label.Text>
                                        Plein d'informations sur ce bel album, plein de chiffres etc...
                                    </Label.Text>
                                </Label>
                            </VerticalStackLayout>
                        </VerticalStackLayout>


                    </VerticalStackLayout>
                    <ScrollView Grid.Column="1" VerticalOptions="Fill" BackgroundColor="gray">
                        <VerticalStackLayout HorizontalOptions="Fill">
                            <Label Text="Informations complémentaires" TextColor="White" HorizontalOptions="Center"/>

                            <Label TextColor="White" HorizontalOptions="Center" VerticalOptions="End">
                                <Label.Text>
                                    Plein d'informations sur ce bel album, plein de chiffres etc...
                                </Label.Text>
                            </Label>
                        </VerticalStackLayout>
                    </ScrollView>
                </Grid>

            </VerticalStackLayout>

        </ScrollView>
        
        <local:FooterPage Grid.Row="1" Grid.ColumnSpan="2"/>

    </Grid>

</ContentPage>