From 45ac2c403b21bd50f49a3c741d5fc21272560554 Mon Sep 17 00:00:00 2001
From: Yoan <yoan2004.yb@gmail.com>
Date: Fri, 28 Apr 2023 22:51:57 +0200
Subject: [PATCH] =?UTF-8?q?Page=20info=20Fruit=20du=20d=C3=A9mon=20+=20vis?=
 =?UTF-8?q?ual=20state=20boutton?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 Sources/Model/Stub/StubEquipage.cs         |  10 ++
 Sources/Ohara/AppShell.xaml                |   2 +-
 Sources/Ohara/PageBestiaire.xaml           |  37 ++---
 Sources/Ohara/PageEquipage.xaml            |  50 ++++---
 Sources/Ohara/PageEquipage.xaml.cs         |   5 +
 Sources/Ohara/PageFDD.xaml                 |   2 +-
 Sources/Ohara/PageInfoEquipage.xaml        |  56 +++----
 Sources/Ohara/PageInfoFdd.xaml             | 161 +++++++++++----------
 Sources/Ohara/Resources/Styles/Styles.xaml | 101 +++++++++++++
 9 files changed, 269 insertions(+), 155 deletions(-)

diff --git a/Sources/Model/Stub/StubEquipage.cs b/Sources/Model/Stub/StubEquipage.cs
index 41bae57..822dec9 100644
--- a/Sources/Model/Stub/StubEquipage.cs
+++ b/Sources/Model/Stub/StubEquipage.cs
@@ -17,6 +17,16 @@ namespace Model.Stub
                 new Equipage("Équipage du Clown", "Bagï Kalzokudan", "East Blue", 8, 4, true, "L'équipage du Clown ...","clown.png"),
                 new Equipage("Équipage de Barbe Blanche", "Shirohige Kaizokudan", "East Blue", 234, 151, true, "L'équipage de Barbe Blanche ...","blanche.jpg"),
                 new Equipage("Équipage de Barbe Noire", "Kurohige Kaizokudan", "East Blue", 234, 151, true, "L'équipage de Barbe Noire ...","noire.png"),
+                new Equipage("Équipage de Barbe Noire", "Kurohige Kaizokudan", "East Blue", 234, 151, true, "L'équipage de Barbe Noire ...","noire.png"),
+                new Equipage("Équipage de Barbe Noire", "Kurohige Kaizokudan", "East Blue", 234, 151, true, "L'équipage de Barbe Noire ...","noire.png"),
+                new Equipage("Équipage de Barbe Noire", "Kurohige Kaizokudan", "East Blue", 234, 151, true, "L'équipage de Barbe Noire ...","noire.png"),
+                new Equipage("Équipage de Barbe Noire", "Kurohige Kaizokudan", "East Blue", 234, 151, true, "L'équipage de Barbe Noire ...","noire.png"),
+                new Equipage("Équipage de Barbe Noire", "Kurohige Kaizokudan", "East Blue", 234, 151, true, "L'équipage de Barbe Noire ...","noire.png"),
+                new Equipage("Équipage de Barbe Noire", "Kurohige Kaizokudan", "East Blue", 234, 151, true, "L'équipage de Barbe Noire ...","noire.png"),
+                new Equipage("Équipage de Barbe Noire", "Kurohige Kaizokudan", "East Blue", 234, 151, true, "L'équipage de Barbe Noire ...","noire.png"),
+                new Equipage("Équipage de Barbe Noire", "Kurohige Kaizokudan", "East Blue", 234, 151, true, "L'équipage de Barbe Noire ...","noire.png"),
+                new Equipage("Équipage de Barbe Noire", "Kurohige Kaizokudan", "East Blue", 234, 151, true, "L'équipage de Barbe Noire ...","noire.png"),
+                new Equipage("Équipage de Barbe Noire", "Kurohige Kaizokudan", "East Blue", 234, 151, true, "L'équipage de Barbe Noire ...","noire.png"),
             };
             return Lequipage;
         }
diff --git a/Sources/Ohara/AppShell.xaml b/Sources/Ohara/AppShell.xaml
index ff3a83a..3058a7d 100644
--- a/Sources/Ohara/AppShell.xaml
+++ b/Sources/Ohara/AppShell.xaml
@@ -13,7 +13,7 @@
     
     
     <ShellContent
-        ContentTemplate="{DataTemplate local:PageEquipage}"
+        ContentTemplate="{DataTemplate local:PageBestiaire}"
         Route="PageFDD" />   
             
 
diff --git a/Sources/Ohara/PageBestiaire.xaml b/Sources/Ohara/PageBestiaire.xaml
index ff5b8c1..7ae7de4 100644
--- a/Sources/Ohara/PageBestiaire.xaml
+++ b/Sources/Ohara/PageBestiaire.xaml
@@ -29,7 +29,7 @@
             <Button Style="{StaticResource buttonMenu2}" Text="Bestiaire"/>
             <Button Style="{StaticResource buttonMenu}" Text="Équipages" Clicked="Hyperlink_Equip"/>
         </VerticalStackLayout>
-        <VerticalStackLayout Grid.Row="0" Grid.Column="1" Spacing="40">
+        <VerticalStackLayout Grid.Row="0" Grid.Column="1" Spacing="20">
             <Grid BackgroundColor="#72a3b3" Padding="10" ColumnSpacing="50" >
                 <Grid.RowDefinitions>
                     <RowDefinition Height="10*"/>
@@ -53,27 +53,28 @@
             <CollectionView x:Name="listeBest" ItemsUpdatingScrollMode="KeepScrollOffset" VerticalScrollBarVisibility="Always" ItemsLayout="VerticalGrid, 4">
                 <CollectionView.ItemTemplate>
                     <DataTemplate>
-                        <Grid Padding="10" ColumnSpacing="10" RowSpacing="50">
+                        <Grid Padding="20" ColumnSpacing="20" RowSpacing="20">
                             <Grid.ColumnDefinitions>
                                 <ColumnDefinition Width="25*"/>
                             </Grid.ColumnDefinitions>
-                            <Image
-                                Source="{Binding Image}"
-                                HeightRequest="270"
-                                WidthRequest="270" 
-                                
-                                />
+                            <Frame CornerRadius="25" BackgroundColor="#e2edf1" BorderColor="#72a3b3"  >
+                                <StackLayout Orientation="Vertical" Padding="5">
+                                    <Image
+                                        Source="{Binding Image}"
+                                        HeightRequest="290"
+                                        WidthRequest="290" />
 
-                            <Label 
-                                VerticalOptions="End"
-                                
-                                HorizontalOptions="Center"
-                                HorizontalTextAlignment="Center"
-                                Padding="5"
-                                Margin="10"
-                                Text="{Binding Nom}"
-                                BackgroundColor="#72a3b3"
-                                FontAttributes="Bold" />
+                                    <Label
+                                            HorizontalOptions="Center"
+                                            VerticalOptions="Start"
+                                            HorizontalTextAlignment="Center"
+                                            Text="{Binding Nom}"
+                                         
+                                            FontSize="19"
+                                            TextColor="#72a3b3"
+                                            FontAttributes="Bold" />
+                                </StackLayout>
+                            </Frame>
 
                         </Grid>
                     </DataTemplate>
diff --git a/Sources/Ohara/PageEquipage.xaml b/Sources/Ohara/PageEquipage.xaml
index 2272d9f..8866883 100644
--- a/Sources/Ohara/PageEquipage.xaml
+++ b/Sources/Ohara/PageEquipage.xaml
@@ -22,15 +22,15 @@
 
 
             <Button Style="{StaticResource buttonMenu}" Text="Accueil" Clicked="Hyperlink_Accueil"/>
-            <Button Style="{StaticResource buttonMenu2}" Text="Carte"/>
+            <Button Style="{StaticResource buttonMenu}" Text="Carte"/>
             <Button Style="{StaticResource buttonMenu}" Text="Personnages" Clicked="Hyperlink_Perso"/>
             <Button Style="{StaticResource buttonMenu}" Text="Fruits du démon" Clicked="Hyperlink_FDD"/>
             <Button Style="{StaticResource buttonMenu}" Text="Bateaux" Clicked="Hyperlink_Bateau"/>
             <Button Style="{StaticResource buttonMenu}" Text="Îles"/>
             <Button Style="{StaticResource buttonMenu}" Text="Bestiaire"/>
-            <Button Style="{StaticResource buttonMenu}" Text="Équipages" Clicked="Hyperlink_Equip"/>
+            <Button Style="{StaticResource buttonMenu2}" Text="Équipages" Clicked="Hyperlink_Equip"/>
         </VerticalStackLayout>
-        <VerticalStackLayout Grid.Row="0" Grid.Column="1" Spacing="40">
+        <VerticalStackLayout Grid.Row="0" Grid.Column="1" Spacing="10">
             <Grid BackgroundColor="#72a3b3" Padding="10" ColumnSpacing="50" >
                 <Grid.RowDefinitions>
                     <RowDefinition Height="10*"/>
@@ -51,36 +51,40 @@
                 </Frame>
             </Grid>
 
-            <CollectionView x:Name="listeEquip" ItemsUpdatingScrollMode="KeepScrollOffset" VerticalScrollBarVisibility="Always" ItemsLayout="VerticalGrid, 4">
+            <CollectionView x:Name="listeEquip" VerticalScrollBarVisibility="Always"  ItemsLayout="VerticalGrid, 4">
                 <CollectionView.ItemTemplate>
                     <DataTemplate>
-                        <Grid Padding="10" ColumnSpacing="10" RowSpacing="50">
+                        <Grid Padding="20" ColumnSpacing="20" RowSpacing="20">
                             <Grid.ColumnDefinitions>
                                 <ColumnDefinition Width="25*"/>
                             </Grid.ColumnDefinitions>
-                            <Image
-                                Source="{Binding Image}"
-                                HeightRequest="270"
-                                WidthRequest="270" 
-                                BackgroundColor="Black"
-                                />
-                               
-                            <Label 
-                                VerticalOptions="End"
-                                
-                                HorizontalOptions="Center"
-                                HorizontalTextAlignment="Center"
-                                Padding="5"
-                                Margin="10"
-                                Text="{Binding Nom}"
-                                BackgroundColor="#72a3b3"
-                                FontAttributes="Bold" />
-                            
+                            <Frame CornerRadius="25" BackgroundColor="Black" BorderColor="Black"  >
+                                <StackLayout Orientation="Vertical" Padding="5">
+                                    <Image
+                                            Source="{Binding Image}"
+                                            HeightRequest="290"
+                                            WidthRequest="290" 
+                                            />
+
+                                    <Label
+                                            HorizontalOptions="Center"
+                                            VerticalOptions="Start"
+                                            HorizontalTextAlignment="Center"
+                                            Text="{Binding Nom}"
+                                         
+                                            FontSize="19"
+                                            TextColor="White"
+                                            FontAttributes="Bold" />
+                                </StackLayout>
+                            </Frame>
+
                         </Grid>
                     </DataTemplate>
                 </CollectionView.ItemTemplate>
             </CollectionView>
 
+
+
         </VerticalStackLayout>
     </Grid>
 </ContentPage>
\ No newline at end of file
diff --git a/Sources/Ohara/PageEquipage.xaml.cs b/Sources/Ohara/PageEquipage.xaml.cs
index 8aa86cd..43e3aad 100644
--- a/Sources/Ohara/PageEquipage.xaml.cs
+++ b/Sources/Ohara/PageEquipage.xaml.cs
@@ -36,4 +36,9 @@ public partial class PageEquipage : ContentPage
     {
         await Navigation.PushAsync(new PageBateau());
     }
+
+    private void listeEquip_ScrollToRequested(object sender, ScrollToRequestEventArgs e)
+    {
+
+    }
 }
\ No newline at end of file
diff --git a/Sources/Ohara/PageFDD.xaml b/Sources/Ohara/PageFDD.xaml
index feb8c59..cb54195 100644
--- a/Sources/Ohara/PageFDD.xaml
+++ b/Sources/Ohara/PageFDD.xaml
@@ -55,7 +55,7 @@
                 </Frame>
             </Grid>
 
-            <CollectionView x:Name="listeFDD" ItemsLayout="VerticalGrid, 4">
+            <CollectionView x:Name="listeFDD" Style="{StaticResource RespCollection}">
                 <CollectionView.ItemTemplate>
                     <DataTemplate>
                         <Grid Padding="20" ColumnSpacing="20" RowSpacing="20">
diff --git a/Sources/Ohara/PageInfoEquipage.xaml b/Sources/Ohara/PageInfoEquipage.xaml
index 3568398..648a0d7 100644
--- a/Sources/Ohara/PageInfoEquipage.xaml
+++ b/Sources/Ohara/PageInfoEquipage.xaml
@@ -25,11 +25,11 @@
             <Button Style="{StaticResource buttonMenu}" Text="Accueil"/>
             <Button Style="{StaticResource buttonMenu}" Text="Carte"/>
             <Button Style="{StaticResource buttonMenu}" Text="Personnages"/>
-            <Button Style="{StaticResource buttonMenu2}" Text="Fruits du démon"/>
+            <Button Style="{StaticResource buttonMenu}" Text="Fruits du démon"/>
             <Button Style="{StaticResource buttonMenu}" Text="Bateaux"/>
             <Button Style="{StaticResource buttonMenu}" Text="Îles"/>
             <Button Style="{StaticResource buttonMenu}" Text="Bestiaire"/>
-            <Button Style="{StaticResource buttonMenu}" Text="Équipages"/>
+            <Button Style="{StaticResource buttonMenu2}" Text="Équipages"/>
         </VerticalStackLayout>
         <ScrollView  Grid.Row="0" Grid.Column="1" Orientation="Vertical" VerticalScrollBarVisibility="Always">
             <VerticalStackLayout  Spacing="40">
@@ -37,64 +37,56 @@
                         <CollectionView.ItemTemplate>
                             <DataTemplate>
 
-                                <VerticalStackLayout Spacing="10" Padding="20">
+                                <VerticalStackLayout Spacing="10" Padding="40">
 
-                                    <Grid Padding="10" ColumnSpacing="20">
+                                    <Grid ColumnSpacing="20">
 
                                         <Grid.ColumnDefinitions>
-                                            <ColumnDefinition Width="45*"/>
-                                            <ColumnDefinition Width="45*"/>
+                                            <ColumnDefinition Width="40*"/>
+                                            <ColumnDefinition Width="40*"/>
                                         </Grid.ColumnDefinitions>
                                         <VerticalStackLayout Grid.Column="0" Spacing="4">
-                                            <Frame BorderColor="#72a3b3">
-                                                <Label Text="Sommaire" TextColor="#72a3b3"/>
+                                        <Frame Style="{StaticResource frameInfo}">
+                                            <Label Text="Sommaire" Style="{StaticResource titreInfo}"/>
                                             </Frame>
-                                            <Frame BorderColor="#72a3b3">
+                                        <Frame Style="{StaticResource frameInfo}">
                                                 <Label Text="1 - Description" TextColor="#72a3b3"/>
                                             </Frame>
-                                            <Frame BorderColor="#72a3b3">
+                                        <Frame Style="{StaticResource frameInfo}">
                                                 <Label Text="2 - Membre(s)" TextColor="#72a3b3"/>
                                             </Frame>
-                                            <Frame BorderColor="#72a3b3">
+                                        <Frame Style="{StaticResource frameInfo}">
                                                 <Label Text="3 - Allié(s)" TextColor="#72a3b3"/>
                                             </Frame>
                                         </VerticalStackLayout>
                                         <VerticalStackLayout Grid.Column="1" Spacing="4">
-                                            <Frame BorderColor="#72a3b3">
-                                                <Label 
-                                            VerticalOptions="End"
-                                
-                                            HorizontalOptions="Center"
-                                            HorizontalTextAlignment="Center"
-                                            FontSize="20"
-                                            Text="{Binding Nom}"
-                                            TextColor="#72a3b3"
-                                            FontAttributes="Bold" />
+                                        <Frame Style="{StaticResource frameInfo}">
+                                                <Label Style="{StaticResource titreInfo}" Text="{Binding Nom}"/>
                                             </Frame>
                                             <Frame BorderColor="#72a3b3">
                                                 <Image
                                         Source="{Binding Image}"
-                                        HeightRequest="270"
-                                        WidthRequest="270" 
+                                        HeightRequest="200"
+                                        WidthRequest="300" 
                                         Aspect="AspectFit"
                                     
                                         />
                                             </Frame>
-                                            <Frame BorderColor="#72a3b3">
+                                        <Frame Style="{StaticResource frameInfo}">
                                                 <StackLayout HorizontalOptions="Center" Orientation="Horizontal" Spacing="5">
-                                                    <Label Text="Nom Romanisé :" TextColor="#72a3b3"/>
+                                                    <Label Text="Nom Romanisé :" TextColor="#72a3b3" FontAttributes="Bold"/>
                                                     <Label Text="{Binding NomRomanise}" TextColor="#72a3b3"/>
                                                 </StackLayout>
                                             </Frame>
-                                            <Frame BorderColor="#72a3b3">
+                                        <Frame Style="{StaticResource frameInfo}">
                                                 <StackLayout HorizontalOptions="Center" Orientation="Horizontal" Spacing="5">
-                                                    <Label Text="Region :" TextColor="#72a3b3"/>
+                                                <Label Text="Region :" TextColor="#72a3b3" FontAttributes="Bold"/>
                                                     <Label Text="{Binding Region}" TextColor="#72a3b3"/>
                                                 </StackLayout>
                                             </Frame>
-                                            <Frame BorderColor="#72a3b3">
+                                        <Frame Style="{StaticResource frameInfo}">
                                                 <StackLayout HorizontalOptions="Center" Orientation="Horizontal" Spacing="5">
-                                                    <Label Text="Statut :" TextColor="#72a3b3"/>
+                                                <Label Text="Statut :" TextColor="#72a3b3" FontAttributes="Bold"/>
                                                     <Label Text="{Binding Statut}" TextColor="#72a3b3"/>
                                                 </StackLayout>
                                             </Frame>
@@ -104,13 +96,13 @@
 
                                     </Grid>
                                     <Label Text="Description :"  TextColor="#72a3b3" FontSize="20" FontAttributes="Bold"/>
-                                    <Line X1="0" Y1="0" X2="3000" Y2="0"  Stroke="#72a3b3" />
+                                    <Line X1="0" Y1="0" X2="3000" Y2="0" StrokeThickness="2" Stroke="#72a3b3" />
                                     <Label Text="{Binding Description}" TextColor="#72a3b3" />
                                     <Label Text="Membre(s) :"  TextColor="#72a3b3" FontSize="20" FontAttributes="Bold"/>
-                                    <Line X1="0" Y1="0" X2="3000" Y2="0"  Stroke="#72a3b3" />
+                                    <Line X1="0" Y1="0" X2="3000" Y2="0" StrokeThickness="2" Stroke="#72a3b3" />
                                     <Label Text="{Binding Membre}" TextColor="#72a3b3" />
                                     <Label Text="Allié(s) :"  TextColor="#72a3b3" FontSize="20" FontAttributes="Bold"/>
-                                    <Line X1="0" Y1="0" X2="3000" Y2="0"  Stroke="#72a3b3" />
+                                    <Line X1="0" Y1="0" X2="3000" Y2="0" StrokeThickness="2" Stroke="#72a3b3" />
                                     <Label Text="{Binding Allie}" TextColor="#72a3b3" />
                                 </VerticalStackLayout>
 
diff --git a/Sources/Ohara/PageInfoFdd.xaml b/Sources/Ohara/PageInfoFdd.xaml
index 2c6aaf7..1215d2d 100644
--- a/Sources/Ohara/PageInfoFdd.xaml
+++ b/Sources/Ohara/PageInfoFdd.xaml
@@ -31,86 +31,87 @@
             <Button Style="{StaticResource buttonMenu}" Text="Bestiaire"/>
             <Button Style="{StaticResource buttonMenu}" Text="Équipages"/>
         </VerticalStackLayout>
-        <VerticalStackLayout Grid.Row="0" Grid.Column="1" Spacing="40">
-        
-            <CollectionView x:Name="listObj" >
-                <CollectionView.ItemTemplate>
-                    <DataTemplate>
-                        <VerticalStackLayout Spacing="10" Padding="20" >
-                            
-                            <Grid ColumnSpacing="45" Padding="30">
-                                <Grid.ColumnDefinitions>
-                                    <ColumnDefinition Width="30*"/>
-                                    <ColumnDefinition Width="30*"/>
-                                   
-                                </Grid.ColumnDefinitions>
-                                <VerticalStackLayout Grid.Column="0" Spacing="2"  Padding="5">
-                                    <Frame BorderColor="#72a3b3" BackgroundColor="#e2edf1">
-                                        <Label Text="Sommaire :" Style="{StaticResource titreInfo}" />
-                                    </Frame>
-                                    <Frame BorderColor="#72a3b3" BackgroundColor="#e2edf1">
-                                        <Label Text="1 Description" TextColor="#72a3b3"/>
-                                    </Frame>
-                                    <Frame BorderColor="#72a3b3" BackgroundColor="#e2edf1">
-                                        <Label Text="2 Force/Faiblesses" TextColor="#72a3b3"/>
-                                    </Frame>
-                                    <Frame BorderColor="#72a3b3" BackgroundColor="#e2edf1">
-                                        <Label Text="3 Utilisateurs" TextColor="#72a3b3"/>
-                                    </Frame>
-                                </VerticalStackLayout>
-                                <VerticalStackLayout Grid.Column="1" Spacing="2" Padding="5">
-                                    <Frame BorderColor="#72a3b3" BackgroundColor="#e2edf1">
-                                        <Label Text="{Binding Nom}"  HorizontalOptions="Center" Style="{StaticResource titreInfo}"  />
-                                    </Frame>
-                                    <Frame BorderColor="#72a3b3" BackgroundColor="#e2edf1">
-                                        <Image
-                                        Source="{Binding Image}"
-                                        HeightRequest="250"
-                                        WidthRequest="250"/>   
-                                    </Frame>
-                                    <Frame BorderColor="#72a3b3" BackgroundColor="#e2edf1">
-                                        <HorizontalStackLayout Spacing="5" HorizontalOptions="Center">
-                                            <Label Text="Nom romanisé :" TextColor="#72a3b3" FontAttributes="Bold"/>
-                                            <Label  Text="{Binding NomRomanise}" TextColor="#72a3b3"/>
-                                        </HorizontalStackLayout>
-                                    </Frame>
-                                    <Frame BorderColor="#72a3b3" BackgroundColor="#e2edf1">
-                                        <HorizontalStackLayout Spacing="5" HorizontalOptions="Center">
-                                            <Label Text="Type :" TextColor="#72a3b3" FontAttributes="Bold"/>
-                                            <Label  Text="{Binding Type}" TextColor="#72a3b3"/>
-                                        </HorizontalStackLayout>
-                                    </Frame>
-                                    <Frame BorderColor="#72a3b3" BackgroundColor="#e2edf1">
-                                        <HorizontalStackLayout Spacing="5" HorizontalOptions="Center">
-                                            <Label Text="Premier apparition (chapitre) :" TextColor="#72a3b3" FontAttributes="Bold"/>
-                                            <Label  Text="{Binding PremierChap}" TextColor="#72a3b3"/>
-                                        </HorizontalStackLayout>
-                                    </Frame>
-                                    <Frame BorderColor="#72a3b3" BackgroundColor="#e2edf1">
-                                        <HorizontalStackLayout Spacing="5" HorizontalOptions="Center">
-                                            <Label Text="Premier apparition (episode) :" TextColor="#72a3b3" FontAttributes="Bold"/>
-                                            <Label  Text="{Binding PremierEp}" TextColor="#72a3b3"/>
-                                        </HorizontalStackLayout>
-                                    </Frame>
+        <ScrollView  Grid.Row="0" Grid.Column="1" Orientation="Vertical" VerticalScrollBarVisibility="Always">
+            <VerticalStackLayout Spacing="40">
 
-                                </VerticalStackLayout>
-                            </Grid>
-                            
-                         
-                            <Label Text="Description :" Style="{StaticResource titreInfo}"/>
-                            <Line Stroke="#72a3b3" StrokeThickness="2" X1="0" X2="1500"/>
-                            <Label Text="{Binding Description}" TextColor="#72a3b3"/>
-                            <Label Text="Force / Faiblesses :" Style="{StaticResource titreInfo}"/>
-                            <Line Stroke="#72a3b3" StrokeThickness="2" X1="0" X2="1500"/>
-                            <Label Text="{Binding Forces}" TextColor="#72a3b3"/>
-                            <Label Text="{Binding Faiblesses}" TextColor="#72a3b3"/>
-                            <Label Text="Utilisateurs :" Style="{StaticResource titreInfo}"/>
-                            <Line Stroke="#72a3b3" StrokeThickness="2" X1="0" X2="1500"/>
-                        </VerticalStackLayout>
-                    </DataTemplate>   
-                </CollectionView.ItemTemplate>
-            </CollectionView>
-        </VerticalStackLayout>
-        
+                <CollectionView x:Name="listObj" >
+                    <CollectionView.ItemTemplate>
+                        <DataTemplate>
+                            <VerticalStackLayout Spacing="10" Padding="40" >
+
+                                <Grid ColumnSpacing="20">
+                                    <Grid.ColumnDefinitions>
+                                        <ColumnDefinition Width="45*"/>
+                                        <ColumnDefinition Width="45*"/>
+
+                                    </Grid.ColumnDefinitions>
+                                    <VerticalStackLayout Grid.Column="0" Spacing="2"  Padding="5">
+                                        <Frame Style="{StaticResource frameInfo}">
+                                            <Label Text="Sommaire :" Style="{StaticResource titreInfo}" />
+                                        </Frame>
+                                        <Frame Style="{StaticResource frameInfo}" >
+                                            <Label Text="1 Description" TextColor="#72a3b3"/>
+                                        </Frame>
+                                        <Frame Style="{StaticResource frameInfo}" >
+                                            <Label Text="2 Force/Faiblesses" TextColor="#72a3b3"/>
+                                        </Frame>
+                                        <Frame Style="{StaticResource frameInfo}" >
+                                            <Label Text="3 Utilisateurs" TextColor="#72a3b3"/>
+                                        </Frame>
+                                    </VerticalStackLayout>
+                                    <VerticalStackLayout Grid.Column="1" Spacing="2" Padding="5">
+                                        <Frame Style="{StaticResource frameInfo}" >
+                                            <Label Text="{Binding Nom}"  HorizontalOptions="Center" Style="{StaticResource titreInfo}"  />
+                                        </Frame>
+                                        <Frame Style="{StaticResource frameInfo}">
+                                            <Image
+                                            Source="{Binding Image}"
+                                            HeightRequest="250"
+                                            WidthRequest="250"/>
+                                        </Frame>
+                                        <Frame Style="{StaticResource frameInfo}">
+                                            <HorizontalStackLayout Spacing="5" HorizontalOptions="Center">
+                                                <Label Text="Nom romanisé :" TextColor="#72a3b3" FontAttributes="Bold"/>
+                                                <Label  Text="{Binding NomRomanise}" TextColor="#72a3b3"/>
+                                            </HorizontalStackLayout>
+                                        </Frame>
+                                        <Frame Style="{StaticResource frameInfo}">
+                                            <HorizontalStackLayout Spacing="5" HorizontalOptions="Center">
+                                                <Label Text="Type :" TextColor="#72a3b3" FontAttributes="Bold"/>
+                                                <Label  Text="{Binding Type}" TextColor="#72a3b3"/>
+                                            </HorizontalStackLayout>
+                                        </Frame>
+                                        <Frame Style="{StaticResource frameInfo}">
+                                            <HorizontalStackLayout Spacing="5" HorizontalOptions="Center">
+                                                <Label Text="Premier apparition (chapitre) :" TextColor="#72a3b3" FontAttributes="Bold"/>
+                                                <Label  Text="{Binding PremierChap}" TextColor="#72a3b3"/>
+                                            </HorizontalStackLayout>
+                                        </Frame>
+                                        <Frame Style="{StaticResource frameInfo}">
+                                            <HorizontalStackLayout Spacing="5" HorizontalOptions="Center">
+                                                <Label Text="Premier apparition (episode) :" TextColor="#72a3b3" FontAttributes="Bold"/>
+                                                <Label  Text="{Binding PremierEp}" TextColor="#72a3b3"/>
+                                            </HorizontalStackLayout>
+                                        </Frame>
+
+                                    </VerticalStackLayout>
+                                </Grid>
+
+
+                                <Label Text="Description :" Style="{StaticResource titreInfo}"/>
+                                <Line Stroke="#72a3b3" StrokeThickness="2" X1="0" X2="3000"/>
+                                <Label Text="{Binding Description}" TextColor="#72a3b3"/>
+                                <Label Text="Force / Faiblesses :" Style="{StaticResource titreInfo}"/>
+                                <Line Stroke="#72a3b3" StrokeThickness="2" X1="0" X2="3000"/>
+                                <Label Text="{Binding Forces}" TextColor="#72a3b3"/>
+                                <Label Text="{Binding Faiblesses}" TextColor="#72a3b3"/>
+                                <Label Text="Utilisateurs :" Style="{StaticResource titreInfo}"/>
+                                <Line Stroke="#72a3b3" StrokeThickness="2" X1="0" X2="3000"/>
+                            </VerticalStackLayout>
+                        </DataTemplate>
+                    </CollectionView.ItemTemplate>
+                </CollectionView>
+            </VerticalStackLayout>
+        </ScrollView>
     </Grid>
 </ContentPage>
\ No newline at end of file
diff --git a/Sources/Ohara/Resources/Styles/Styles.xaml b/Sources/Ohara/Resources/Styles/Styles.xaml
index 33ca22a..207465c 100644
--- a/Sources/Ohara/Resources/Styles/Styles.xaml
+++ b/Sources/Ohara/Resources/Styles/Styles.xaml
@@ -410,6 +410,34 @@
         <Setter Property="TextColor" Value="White"/>
         <Setter Property="CornerRadius" Value="0"/>
         <Setter Property="WidthRequest" Value="250"/>
+        <Setter Property="VisualStateManager.VisualStateGroups">
+            <VisualStateGroupList>
+                <VisualStateGroup>
+                    <VisualState x:Name="Normal">
+                        <VisualState.Setters>
+                            <Setter Property="BackgroundColor" Value="#bfe5ef"/>
+                            <Setter Property="WidthRequest" Value="250"/>
+                        </VisualState.Setters>
+                    </VisualState>
+                    <VisualState x:Name="PointerOver">
+                        <VisualState.Setters>
+                            <Setter Property="Background">
+                                <Setter.Value>
+                                    <LinearGradientBrush StartPoint="0,0" EndPoint="1,1">
+                                        <GradientStop Color="#cdffd8" Offset="0.1" />
+                                        <GradientStop Color="#94b9ff" Offset="1.0" />
+
+                                    </LinearGradientBrush>
+                                </Setter.Value>
+
+                            </Setter>
+                            
+                            <Setter Property="WidthRequest" Value="275" />
+                        </VisualState.Setters>
+                    </VisualState>
+                </VisualStateGroup>
+            </VisualStateGroupList>
+        </Setter>
     </Style>
 
     <Style TargetType="Button" x:Key="buttonMenu2">
@@ -435,4 +463,77 @@
         <Setter Property="FontSize" Value="20"/>
         <Setter Property="TextColor" Value="#72a3b3"/>
     </Style>
+    <Style TargetType="Frame" x:Key="frameInfo">
+        <Setter Property="BackgroundColor" Value="White"/>
+        <Setter Property="BorderColor" Value="#72a3b3"/>
+    </Style>
+    
+    <Style x:Key="RespCollection"
+           TargetType="CollectionView">
+        <Setter Property="VisualStateManager.VisualStateGroups">
+            <VisualStateGroupList>
+                <VisualStateGroup>
+                    <VisualState x:Name="Petit">
+                        <VisualState.StateTriggers>
+                            <AdaptiveTrigger MinWindowWidth="0" />
+                        </VisualState.StateTriggers>
+                        <VisualState.Setters>
+                            <Setter Property="ItemsLayout"
+                                    Value="VerticalGrid, 1" />
+                        </VisualState.Setters>
+                    </VisualState>
+                    <VisualState x:Name="Moyen">
+                        <VisualState.StateTriggers>
+                            <AdaptiveTrigger MinWindowWidth="480" />
+                        </VisualState.StateTriggers>
+                        <VisualState.Setters>
+                            <Setter Property="ItemsLayout"
+                                    Value="VerticalGrid, 2" />
+                        </VisualState.Setters>
+                    </VisualState>
+                    <VisualState x:Name="Grand">
+                        <VisualState.StateTriggers>
+                            <AdaptiveTrigger MinWindowWidth="960" />
+                        </VisualState.StateTriggers>
+                        <VisualState.Setters>
+                            <Setter Property="ItemsLayout"
+                                    Value="VerticalGrid, 4" />
+                        </VisualState.Setters>
+                    </VisualState>
+                </VisualStateGroup>
+            </VisualStateGroupList>
+        </Setter>
+    </Style>
+
+    <Style x:Key="frameObjet" TargetType="Frame">
+        <Setter Property="VisualStateManager.VisualStateGroups">
+            <VisualStateGroupList>
+                <VisualStateGroup>
+                    <VisualState x:Name="Normal">
+                        <VisualState.Setters>
+                            <Setter Property="CornerRadius" Value="25"/>
+                            <Setter Property="BackgroundColor" Value="#e2edf1"/>
+                            <Setter Property="BorderColor" Value="#72a3b3"/>
+                        </VisualState.Setters>
+                    </VisualState>
+                    <VisualState x:Name="PointerOver">
+                        <VisualState.Setters>
+                            <Setter Property="Background">
+                                <Setter.Value>
+                                    <LinearGradientBrush StartPoint="0,0" EndPoint="1,1">
+                                        <GradientStop Color="#cdffd8" Offset="0.1" />
+                                        <GradientStop Color="#94b9ff" Offset="1.0" />
+
+                                    </LinearGradientBrush>
+                                </Setter.Value>
+
+                            </Setter>
+
+                            <Setter Property="WidthRequest" Value="275" />
+                        </VisualState.Setters>
+                    </VisualState>
+                </VisualStateGroup>
+            </VisualStateGroupList>
+        </Setter>
+    </Style>
 </ResourceDictionary>