From 9dac0222dc4dc005b903712df052c9636c983156 Mon Sep 17 00:00:00 2001
From: Yoan <yoan2004.yb@gmail.com>
Date: Wed, 3 May 2023 08:41:31 +0200
Subject: [PATCH] Page information bestiaire et style dynamique sur les frames
 objets

---
 Sources/Ohara/AppShell.xaml                |   4 +-
 Sources/Ohara/Ohara.csproj                 |   6 ++
 Sources/Ohara/PageBateau.xaml              |  35 +------
 Sources/Ohara/PageBestiaire.xaml           |   2 +-
 Sources/Ohara/PageEquipage.xaml            | 100 ++++++++++----------
 Sources/Ohara/PageEquipage.xaml.cs         |   3 -
 Sources/Ohara/PageFDD.xaml                 |   4 +-
 Sources/Ohara/PageIle.xaml                 |  24 +----
 Sources/Ohara/PageInfoBestiaire.xaml       | 104 +++++++++++++++++++++
 Sources/Ohara/PageInfoBestiaire.xaml.cs    |  16 ++++
 Sources/Ohara/PagePersonnage.xaml          |  29 ++----
 Sources/Ohara/Resources/Styles/Styles.xaml |  69 ++++++++++++--
 12 files changed, 255 insertions(+), 141 deletions(-)
 create mode 100644 Sources/Ohara/PageInfoBestiaire.xaml
 create mode 100644 Sources/Ohara/PageInfoBestiaire.xaml.cs

diff --git a/Sources/Ohara/AppShell.xaml b/Sources/Ohara/AppShell.xaml
index 3058a7d..97c8cea 100644
--- a/Sources/Ohara/AppShell.xaml
+++ b/Sources/Ohara/AppShell.xaml
@@ -13,8 +13,8 @@
     
     
     <ShellContent
-        ContentTemplate="{DataTemplate local:PageBestiaire}"
-        Route="PageFDD" />   
+        ContentTemplate="{DataTemplate local:PageInfoBestiaire}"
+        Route="PageInfoBestiaire" />   
             
 
 </Shell>
diff --git a/Sources/Ohara/Ohara.csproj b/Sources/Ohara/Ohara.csproj
index 6055149..6b7e757 100644
--- a/Sources/Ohara/Ohara.csproj
+++ b/Sources/Ohara/Ohara.csproj
@@ -57,6 +57,9 @@
 	</ItemGroup>
 
 	<ItemGroup>
+	  <Compile Update="PageInfoBestiaire.xaml.cs">
+	    <DependentUpon>PageInfoBestiaire.xaml</DependentUpon>
+	  </Compile>
 	  <Compile Update="PageIle.xaml.cs">
 	    <DependentUpon>PageIle.xaml</DependentUpon>
 	  </Compile>
@@ -81,6 +84,9 @@
 	</ItemGroup>
 
 	<ItemGroup>
+	  <MauiXaml Update="PageInfoBestiaire.xaml">
+	    <Generator>MSBuild:Compile</Generator>
+	  </MauiXaml>
 	  <MauiXaml Update="PageIle.xaml">
 	    <Generator>MSBuild:Compile</Generator>
 	  </MauiXaml>
diff --git a/Sources/Ohara/PageBateau.xaml b/Sources/Ohara/PageBateau.xaml
index 272c75a..ceb2475 100644
--- a/Sources/Ohara/PageBateau.xaml
+++ b/Sources/Ohara/PageBateau.xaml
@@ -83,37 +83,24 @@
 
 
 
-                                <Frame CornerRadius="20" 
-                                        BorderColor="#72a3b3"
-                                        BackgroundColor="#72a3b3"
-                                        Margin="20, 50" Padding="15"
-                                        WidthRequest="275"
-                                        HeightRequest="150"
-                                        Grid.Row="0" 
-                                        VerticalOptions="End">
+                                <Frame Style="{StaticResource frameObjet2}">
 
 
-                                    <StackLayout Orientation="Vertical" Spacing="10" VerticalOptions="Center">
+                                    <StackLayout Orientation="Vertical" Spacing="25" VerticalOptions="Center">
                                         <Label 
                                                 Text="{Binding Nom}" 
                                                 FontAttributes="Bold" 
                                                 FontSize="22" 
-                                                TextColor="White"  
+                                                TextColor="#72a3b3"  
                                                 HorizontalOptions="Center"
                                                 />
-                                        <Label 
-                                                Text="-----------------------------" 
-                                                FontAttributes="Bold" 
-                                                FontSize="20" 
-                                                TextColor="White"
-                                                HorizontalOptions="Center" 
-                                                />
+                                        <Line X1="0" X2="500" Stroke="#72a3b3" StrokeThickness="2"/>
 
                                         <Label 
                                                 Text="Cliquez ici pour voir en détail"
                                                 FontAttributes="Bold,Italic"
                                                 FontSize="15" 
-                                                TextColor="White"
+                                                TextColor="#72a3b3"
                                                 TextDecorations="Underline" 
                                                 HorizontalOptions="Center"/>
 
@@ -125,18 +112,6 @@
                 </CollectionView>
             </ScrollView>
         </VerticalStackLayout>
-
-
-
-        <!--<Rectangle WidthRequest="200" HeightRequest="300" HorizontalOptions="Start"   BackgroundColor="#72a3b3">
-            <Rectangle.Fill>
-                <LinearGradientBrush StartPoint="0,0.5" EndPoint="1,0.5">
-                    <GradientStop Color="#cdffd8" Offset="0.0" />-->
-        <!--<GradientStop Color="#94b9ff" Offset="1.0" /></LinearGradientBrush></Rectangle.Fill></Rectangle>-->
-
-
-
-
     </Grid>
 
 
diff --git a/Sources/Ohara/PageBestiaire.xaml b/Sources/Ohara/PageBestiaire.xaml
index f9519d6..27a104e 100644
--- a/Sources/Ohara/PageBestiaire.xaml
+++ b/Sources/Ohara/PageBestiaire.xaml
@@ -57,7 +57,7 @@
                             <Grid.ColumnDefinitions>
                                 <ColumnDefinition Width="25*"/>
                             </Grid.ColumnDefinitions>
-                            <Frame CornerRadius="25" BackgroundColor="#e2edf1" BorderColor="#72a3b3"  >
+                            <Frame Style="{StaticResource frameObjet}">
                                 <StackLayout Orientation="Vertical" Padding="5">
                                     <Image
                                         Source="{Binding Image}"
diff --git a/Sources/Ohara/PageEquipage.xaml b/Sources/Ohara/PageEquipage.xaml
index abdd83f..4441b67 100644
--- a/Sources/Ohara/PageEquipage.xaml
+++ b/Sources/Ohara/PageEquipage.xaml
@@ -30,61 +30,57 @@
             <Button Style="{StaticResource buttonMenu}" Text="Bestiaire" Clicked="Hyperlink_Bestiaire"/>
             <Button Style="{StaticResource buttonMenu2}" Text="Équipages"/>
         </VerticalStackLayout>
-        <VerticalStackLayout Grid.Row="0" Grid.Column="1" Spacing="10">
-            <Grid BackgroundColor="#72a3b3" Padding="10" ColumnSpacing="50" >
-                <Grid.RowDefinitions>
-                    <RowDefinition Height="10*"/>
-                </Grid.RowDefinitions>
-                <Grid.ColumnDefinitions >
-                    <ColumnDefinition Width="20*"/>
-                    <ColumnDefinition Width="25*"/>
-                    <ColumnDefinition Width="10*"/>
-                    <ColumnDefinition Width="10*"/>
-                </Grid.ColumnDefinitions>
-                <SearchBar Placeholder="Rechercher..." BackgroundColor="#bfe5ef" Grid.Column="0"/>
-                <Frame CornerRadius="20" BackgroundColor="#bfe5ef" BorderColor="#bfe5ef" Grid.Column="2">
-                    <Label Text="Filtrer" HorizontalTextAlignment="Center" />
-                </Frame>
+        <ScrollView Grid.Row="0" Grid.Column="1" >
+            <VerticalStackLayout Spacing="10">
+                <Grid BackgroundColor="#72a3b3" Padding="10" ColumnSpacing="50" >
+                    <Grid.RowDefinitions>
+                        <RowDefinition Height="10*"/>
+                    </Grid.RowDefinitions>
+                    <Grid.ColumnDefinitions >
+                        <ColumnDefinition Width="20*"/>
+                        <ColumnDefinition Width="25*"/>
+                        <ColumnDefinition Width="10*"/>
+                        <ColumnDefinition Width="10*"/>
+                    </Grid.ColumnDefinitions>
+                    <SearchBar Placeholder="Rechercher..." BackgroundColor="#bfe5ef" Grid.Column="0"/>
+                    <Frame CornerRadius="20" BackgroundColor="#bfe5ef" BorderColor="#bfe5ef" Grid.Column="2">
+                        <Label Text="Filtrer" HorizontalTextAlignment="Center" />
+                    </Frame>
 
-                <Frame CornerRadius="20" BackgroundColor="#bfe5ef" BorderColor="#bfe5ef" Grid.Column="3">
-                    <Label Text="Trier" HorizontalTextAlignment="Center"  />
-                </Frame>
-            </Grid>
+                    <Frame CornerRadius="20" BackgroundColor="#bfe5ef" BorderColor="#bfe5ef" Grid.Column="3">
+                        <Label Text="Trier" HorizontalTextAlignment="Center"  />
+                    </Frame>
+                </Grid>
 
-            <CollectionView x:Name="listeEquip" VerticalScrollBarVisibility="Always"  ItemsLayout="VerticalGrid, 4">
-                <CollectionView.ItemTemplate>
-                    <DataTemplate>
-                        <Grid Padding="20" ColumnSpacing="20" RowSpacing="20">
-                            <Grid.ColumnDefinitions>
-                                <ColumnDefinition Width="25*"/>
-                            </Grid.ColumnDefinitions>
-                            <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}"
+                <CollectionView x:Name="listeEquip"  ItemsLayout="VerticalGrid, 4">
+                    <CollectionView.ItemTemplate>
+                        <DataTemplate>
+                            <Grid Padding="20" ColumnSpacing="20" RowSpacing="20">
+                                <Grid.ColumnDefinitions>
+                                    <ColumnDefinition Width="25*"/>
+                                </Grid.ColumnDefinitions>
+                                <Frame Style="{StaticResource frameEquip}" >
+                                    <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>
-
+                                                            FontSize="19"
+                                                            TextColor="White"
+                                                            FontAttributes="Bold" />
+                                    </StackLayout>
+                                </Frame>
 
-
-        </VerticalStackLayout>
+                            </Grid>
+                        </DataTemplate>
+                    </CollectionView.ItemTemplate>
+                </CollectionView>
+            </VerticalStackLayout>
+        </ScrollView>
     </Grid>
 </ContentPage>
\ No newline at end of file
diff --git a/Sources/Ohara/PageEquipage.xaml.cs b/Sources/Ohara/PageEquipage.xaml.cs
index 636063b..dd0287d 100644
--- a/Sources/Ohara/PageEquipage.xaml.cs
+++ b/Sources/Ohara/PageEquipage.xaml.cs
@@ -7,10 +7,7 @@ public partial class PageEquipage : ContentPage
 	public PageEquipage()
 	{
 		InitializeComponent();
-    
         List<Equipage> Lequipage = StubEquipage.RecupererEquipage().ToList();
-
-
         listeEquip.ItemsSource = Lequipage;
     }
     private async void Hyperlink_Accueil(object sender, EventArgs e)
diff --git a/Sources/Ohara/PageFDD.xaml b/Sources/Ohara/PageFDD.xaml
index 42607b5..4a9757c 100644
--- a/Sources/Ohara/PageFDD.xaml
+++ b/Sources/Ohara/PageFDD.xaml
@@ -65,9 +65,7 @@
                             </Grid.ColumnDefinitions>
                            
                             
-                            <Frame CornerRadius="25"
-                                        BackgroundColor="#e2edf1"
-                                        BorderColor="#72a3b3"
+                            <Frame Style="{StaticResource frameObjet}"
                                        
                                     >
                                 <StackLayout Orientation="Vertical" Padding="5">
diff --git a/Sources/Ohara/PageIle.xaml b/Sources/Ohara/PageIle.xaml
index e838de1..dc3ddd0 100644
--- a/Sources/Ohara/PageIle.xaml
+++ b/Sources/Ohara/PageIle.xaml
@@ -83,37 +83,23 @@
 
 
 
-                                <Frame CornerRadius="20" 
-                                        BorderColor="#72a3b3"
-                                        BackgroundColor="#72a3b3"
-                                        Margin="20, 50" Padding="15"
-                                        WidthRequest="275"
-                                        HeightRequest="150"
-                                        Grid.Row="0" 
-                                        VerticalOptions="End">
+                                <Frame Style="{StaticResource frameObjet2}">
 
 
-                                    <StackLayout Orientation="Vertical" Spacing="10" VerticalOptions="Center">
+                                    <StackLayout Orientation="Vertical" Spacing="25" VerticalOptions="Center">
                                         <Label 
                                                 Text="{Binding Nom}" 
                                                 FontAttributes="Bold" 
                                                 FontSize="22" 
-                                                TextColor="White"  
+                                                TextColor="#72a3b3"  
                                                 HorizontalOptions="Center"
                                                 />
-                                        <Label 
-                                                Text="-----------------------------" 
-                                                FontAttributes="Bold" 
-                                                FontSize="20" 
-                                                TextColor="White"
-                                                HorizontalOptions="Center" 
-                                                />
-
+                                        <Line X1="0" X2="500" Stroke="#72a3b3" StrokeThickness="2"/>
                                         <Label 
                                                 Text="Cliquez ici pour voir en détail"
                                                 FontAttributes="Bold,Italic"
                                                 FontSize="15" 
-                                                TextColor="White"
+                                                TextColor="#72a3b3"
                                                 TextDecorations="Underline" 
                                                 HorizontalOptions="Center"/>
 
diff --git a/Sources/Ohara/PageInfoBestiaire.xaml b/Sources/Ohara/PageInfoBestiaire.xaml
new file mode 100644
index 0000000..e910469
--- /dev/null
+++ b/Sources/Ohara/PageInfoBestiaire.xaml
@@ -0,0 +1,104 @@
+<?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="Ohara.PageInfoBestiaire"
+             Title="PageInfoBestiaire"
+             BackgroundColor="#e2edf1">
+    <Grid>
+
+        <Grid.RowDefinitions>
+            <RowDefinition Height="2*" />
+        </Grid.RowDefinitions>
+        <Grid.ColumnDefinitions>
+            <ColumnDefinition Width="300" />
+            <ColumnDefinition Width="90*" />
+        </Grid.ColumnDefinitions>
+        <VerticalStackLayout BackgroundColor="#72a3b3" Grid.Row="0" Grid.Column="0" Spacing="10">
+
+            <Image Source="ohara2.png" HeightRequest="300" HorizontalOptions="Center" >
+                <Image.Clip>
+                    <EllipseGeometry Center="150,90"  RadiusX="80"  RadiusY="80"/>
+                </Image.Clip>
+            </Image>
+
+
+            <Button Style="{StaticResource buttonMenu}" Text="Accueil"/>
+            <Button Style="{StaticResource buttonMenu}" Text="Carte"/>
+            <Button Style="{StaticResource buttonMenu}" Text="Personnages"/>
+            <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 buttonMenu2}" Text="Équipages"/>
+        </VerticalStackLayout>
+        <ScrollView  Grid.Row="0" Grid.Column="1" Orientation="Vertical" VerticalScrollBarVisibility="Always">
+            <VerticalStackLayout  Spacing="40">
+                <CollectionView x:Name="listeBest">
+                    <CollectionView.ItemTemplate>
+                        <DataTemplate>
+
+                            <VerticalStackLayout Spacing="10" Padding="40">
+
+                                <Grid ColumnSpacing="20">
+
+                                    <Grid.ColumnDefinitions>
+                                        <ColumnDefinition Width="40*"/>
+                                        <ColumnDefinition Width="40*"/>
+                                    </Grid.ColumnDefinitions>
+                                    <VerticalStackLayout Grid.Column="0" Spacing="4">
+                                        <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 - Caracteristiques" TextColor="#72a3b3"/>
+                                        </Frame>
+                                        
+                                    </VerticalStackLayout>
+                                    <VerticalStackLayout Grid.Column="1" Spacing="4">
+                                        <Frame Style="{StaticResource frameInfo}">
+                                            <Label Style="{StaticResource titreInfo}" Text="{Binding Nom}"/>
+                                        </Frame>
+                                        <Frame Style="{StaticResource frameInfo}" >
+                                            <Image
+                                        Source="{Binding Image}"
+                                        HeightRequest="200"
+                                        WidthRequest="300" 
+                                         
+                                    
+                                        />
+                                        </Frame>
+                                        <Frame Style="{StaticResource frameInfo}">
+                                            <StackLayout HorizontalOptions="Center" Orientation="Horizontal" Spacing="5">
+                                                <Label Text="Origine :" TextColor="#72a3b3" FontAttributes="Bold"/>
+                                                <Label Text="{Binding Origine}" TextColor="#72a3b3"/>
+                                            </StackLayout>
+                                        </Frame>
+                                    </VerticalStackLayout>
+
+
+
+                                </Grid>
+                                <Label Text="Description :"  TextColor="#72a3b3" FontSize="20" FontAttributes="Bold"/>
+                                <Line X1="0" Y1="0" X2="3000" Y2="0" StrokeThickness="2" Stroke="#72a3b3" />
+                                <Label Text="{Binding Description}" TextColor="#72a3b3" />
+                                <Label Text="Caracteristiques :"  TextColor="#72a3b3" FontSize="20" FontAttributes="Bold"/>
+                                <Line X1="0" Y1="0" X2="3000" Y2="0" StrokeThickness="2" Stroke="#72a3b3" />
+                                <Label Text="{Binding Caracteristique}" TextColor="#72a3b3" />
+                                
+                            </VerticalStackLayout>
+
+
+
+
+                        </DataTemplate>
+                    </CollectionView.ItemTemplate>
+                </CollectionView>
+
+
+            </VerticalStackLayout>
+        </ScrollView>
+    </Grid>
+</ContentPage>
\ No newline at end of file
diff --git a/Sources/Ohara/PageInfoBestiaire.xaml.cs b/Sources/Ohara/PageInfoBestiaire.xaml.cs
new file mode 100644
index 0000000..05b6114
--- /dev/null
+++ b/Sources/Ohara/PageInfoBestiaire.xaml.cs
@@ -0,0 +1,16 @@
+using Model.Stub;
+using Model;
+
+namespace Ohara;
+
+public partial class PageInfoBestiaire : ContentPage
+{
+	public PageInfoBestiaire()
+	{
+		InitializeComponent();
+        List<Bestiaire> Lbest = StubBestiaire.RecupererBestiaire().ToList();
+
+
+        listeBest.ItemsSource = Lbest;
+    }
+}
\ No newline at end of file
diff --git a/Sources/Ohara/PagePersonnage.xaml b/Sources/Ohara/PagePersonnage.xaml
index e248000..e311f9f 100644
--- a/Sources/Ohara/PagePersonnage.xaml
+++ b/Sources/Ohara/PagePersonnage.xaml
@@ -69,13 +69,13 @@
                                     <RowDefinition Height="750"/>
                                 </Grid.RowDefinitions>
 
-                                <Frame
-                                    CornerRadius="25"
+                                <Frame  CornerRadius="25"
                                     BorderColor="#e2edf1"
                                     IsClippedToBounds="True"
                                     Padding="0"
                                     HeightRequest="800"
                                     WidthRequest="450">
+
                                     <Image
                                         Source="{Binding Image}"
                                         
@@ -83,36 +83,23 @@
                                         />
                                 </Frame>
                                 
-                                <Frame CornerRadius="20" 
-                                        BorderColor="#72a3b3"
-                                        BackgroundColor="#72a3b3"
-                                        Margin="20, 50" Padding="15"
-                                        WidthRequest="275"
-                                        HeightRequest="150"
-                                        Grid.Row="0" 
-                                        VerticalOptions="End">
-
-                                    <StackLayout Orientation="Vertical" Spacing="10" VerticalOptions="Center">
+                                <Frame Style="{StaticResource frameObjet2}">
+
+                                    <StackLayout Orientation="Vertical" Spacing="25" VerticalOptions="Center">
                                         <Label 
                                                 Text="{Binding Nom}" 
                                                 FontAttributes="Bold" 
                                                 FontSize="22" 
-                                                TextColor="White"  
+                                                TextColor="#72a3b3"  
                                                 HorizontalOptions="Center"
                                                 />
-                                        <Label 
-                                                Text="-----------------------------" 
-                                                FontAttributes="Bold" 
-                                                FontSize="20" 
-                                                TextColor="White"
-                                                HorizontalOptions="Center" 
-                                                />
+                                        <Line X1="0" X2="500" Stroke="#72a3b3" StrokeThickness="2"/>
 
                                         <Label 
                                                 Text="Cliquez ici pour voir en détail"
                                                 FontAttributes="Bold,Italic"
                                                 FontSize="15" 
-                                                TextColor="White"
+                                                TextColor="#72a3b3"
                                                 TextDecorations="Underline" 
                                                 HorizontalOptions="Center"/>
 
diff --git a/Sources/Ohara/Resources/Styles/Styles.xaml b/Sources/Ohara/Resources/Styles/Styles.xaml
index ba43b25..5510a60 100644
--- a/Sources/Ohara/Resources/Styles/Styles.xaml
+++ b/Sources/Ohara/Resources/Styles/Styles.xaml
@@ -525,22 +525,71 @@
                     </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="BackgroundColor" Value="#d8dddf"/>
+                            <Setter Property="CornerRadius" Value="25"/>
+                            <Setter Property="BorderColor" Value="#72a3b3"/>
+                        </VisualState.Setters>
+                    </VisualState>
+                </VisualStateGroup>
+            </VisualStateGroupList>
+        </Setter>
+    </Style>
 
-                            <Setter Property="WidthRequest" Value="275" />
+    <Style x:Key="frameObjet2" TargetType="Frame">
+        <Setter Property="VisualStateManager.VisualStateGroups">
+            <VisualStateGroupList>
+                <VisualStateGroup>
+                    <VisualState x:Name="Normal">
+                        <VisualState.Setters>
+                            <Setter Property="CornerRadius" Value="20"/>
+                            <Setter Property="BorderColor" Value="#72a3b3"/>
+                            <Setter Property="BackgroundColor" Value="#e2edf1"/>
+                            <Setter Property="Margin" Value="20,0,20,50"/>
+                            <Setter Property="Grid.Row" Value="0"/>
+                            <Setter Property="VerticalOptions" Value="End"/>
+                            <Setter Property="HeightRequest" Value="150"/>
+                            <Setter Property="WidthRequest" Value="275"/>
+                        </VisualState.Setters>
+                    </VisualState>
+                    <VisualState x:Name="PointerOver">
+                        <VisualState.Setters>
+                            <Setter Property="CornerRadius" Value="20"/>
+                            <Setter Property="BorderColor" Value="#72a3b3"/>
+                            <Setter Property="BackgroundColor" Value="#e2edf1"/>
+                            
+                            <Setter Property="Margin" Value="20,50,20,50"/>
+                            <Setter Property="Grid.Row" Value="0"/>
+                            <Setter Property="VerticalOptions" Value="End"/>
+                            <Setter Property="HeightRequest" Value="160"/>
+                            <Setter Property="WidthRequest" Value="285"/>
                         </VisualState.Setters>
                     </VisualState>
                 </VisualStateGroup>
             </VisualStateGroupList>
         </Setter>
     </Style>
+    <Style x:Key="frameEquip" TargetType="Frame">
+        <Setter Property="VisualStateManager.VisualStateGroups">
+            <VisualStateGroupList>
+                <VisualStateGroup>
+                    <VisualState x:Name="Normal">
+                        <VisualState.Setters>
+                            <Setter Property="CornerRadius" Value="25"/>
+                            <Setter Property="BorderColor" Value="Black"/>
+                            <Setter Property="BackgroundColor" Value="Black"/>
+                        </VisualState.Setters>
+                    </VisualState>
+                    <VisualState x:Name="PointerOver">
+                        <VisualState.Setters>
+                            <Setter Property="CornerRadius" Value="25"/>
+                            <Setter Property="BorderColor" Value="Black"/>
+                            <Setter Property="BackgroundColor" Value="#424545"/>
+                        </VisualState.Setters>
+                    </VisualState>
+                </VisualStateGroup>
+            </VisualStateGroupList>
+        </Setter>
+    </Style>
+    
 </ResourceDictionary>