diff --git a/MP.MONO.UI/Components/AlarmsOverview.razor b/MP.MONO.UI/Components/AlarmsOverview.razor
index 5f2e607..2589855 100644
--- a/MP.MONO.UI/Components/AlarmsOverview.razor
+++ b/MP.MONO.UI/Components/AlarmsOverview.razor
@@ -7,6 +7,7 @@
 
 @if (@ListRecords != null)
 {
+
     <div class="card-body px-0 py-0 @css() align-content-center rounded">
         <div>
             <div class="px-2 text-center">
diff --git a/MP.MONO.UI/Components/AlarmsOverview.razor.cs b/MP.MONO.UI/Components/AlarmsOverview.razor.cs
index 5683664..0036be2 100644
--- a/MP.MONO.UI/Components/AlarmsOverview.razor.cs
+++ b/MP.MONO.UI/Components/AlarmsOverview.razor.cs
@@ -44,6 +44,10 @@ namespace MP.MONO.UI.Components
             }
             return answ;
         }
+        private void showAalarms()
+        {
+            compMode = !compMode;
+        }
 
         #endregion Public Methods
 
diff --git a/MP.MONO.UI/MP.MONO.UI.csproj b/MP.MONO.UI/MP.MONO.UI.csproj
index 45a44b9..84c1c55 100644
--- a/MP.MONO.UI/MP.MONO.UI.csproj
+++ b/MP.MONO.UI/MP.MONO.UI.csproj
@@ -5,7 +5,7 @@
     <Nullable>enable</Nullable>
     <ImplicitUsings>enable</ImplicitUsings>
     <Platforms>AnyCPU;x86;x64</Platforms>
-    <Version>1.2.2210.2811</Version>
+    <Version>1.2.2210.2815</Version>
   </PropertyGroup>
 
   <ItemGroup>
diff --git a/MP.MONO.UI/Pages/Index.razor b/MP.MONO.UI/Pages/Index.razor
index d8cf9f8..73f1742 100644
--- a/MP.MONO.UI/Pages/Index.razor
+++ b/MP.MONO.UI/Pages/Index.razor
@@ -5,14 +5,34 @@
 <div class="card">
     <div class="card-header">
         <div class="d-flex justify-content-between">
-            <h1 class="col-5">MAPO-MONO</h1>
+            <h1 class="col-9">MAPO-MONO</h1>
 
-            <div class="col-7 d-flex flex-row-start">
-                <div class="px-0 mx-1 py-1 text-center rounded w-25">
-                    <NavLink href="Alarms" class="text-decoration-none">
-                        @*<h5 class="card-header text-center bg-primary"><i class="fa-solid fa-triangle-exclamation"></i> ALARMS</h5>*@
-                        <AlarmsOverview compMode="true"></AlarmsOverview>
-                    </NavLink>
+            <div class="col-3 d-flex flex-row-reverse">
+                <div class="px-0 mx-1 py-1 text-center rounded d-flex justify-content-between" style="
+    position: absolute;
+    z-index: 1;
+">
+                    <div>
+                        <button class="btn btn-primary mx-1 my-1" @onclick="@showAalarms">ALARMS PREVIEW</button>
+                    </div>
+                    @if (!compMode)
+                    {
+
+                        <div class="card">
+                            <NavLink href="Alarms" class="text-decoration-none">
+                                <AlarmsOverview compMode="@compMode"></AlarmsOverview>
+                            </NavLink>
+                        </div>
+                    }
+                    else
+                    {
+                        <div>
+
+                            <NavLink href="Alarms" class="text-decoration-none">
+                                <AlarmsOverview compMode="@compMode"></AlarmsOverview>
+                            </NavLink>
+                        </div>
+                    }
                 </div>
             </div>
         </div>
@@ -92,3 +112,12 @@
         </div>
     </div>
 </div>
+
+@code {
+    private bool compMode { get; set; } = false;
+
+    private void showAalarms()
+    {
+        compMode = !compMode;
+    }
+}
diff --git a/MP.MONO.UI/Pages/Test.razor b/MP.MONO.UI/Pages/Test.razor
index eda304d..9d91873 100644
--- a/MP.MONO.UI/Pages/Test.razor
+++ b/MP.MONO.UI/Pages/Test.razor
@@ -59,3 +59,19 @@
     </div>
 </div>*@
 
+<div class="card test w-25" tabindex="0">
+    <span class="card__infoicon">
+        <i class="fa fa-info"></i>
+    </span>
+    <h1 class="card__title">This is a title</h1>
+    <p class="card__description">
+        <AlarmsOverview compMode="false"></AlarmsOverview>
+    </p>
+</div>
+
+<div class="px-0 mx-1 py-1 text-center rounded card__infoicon w-40">
+    <NavLink href="Alarms" class="text-decoration-none">
+        @*<h5 class="card-header text-center bg-primary"><i class="fa-solid fa-triangle-exclamation"></i> ALARMS</h5>*@
+        <AlarmsOverview compMode="true"></AlarmsOverview>
+    </NavLink>
+</div>
\ No newline at end of file
diff --git a/MP.MONO.UI/Pages/Test.razor.cs b/MP.MONO.UI/Pages/Test.razor.cs
index 9d5434a..34e3d5e 100644
--- a/MP.MONO.UI/Pages/Test.razor.cs
+++ b/MP.MONO.UI/Pages/Test.razor.cs
@@ -18,8 +18,11 @@ using MP.MONO.UI.Components;
 
 namespace MP.MONO.UI.Pages
 {
+
     public partial class Test
     {
+        [Inject]
+        private IJSRuntime JSRuntime { get; set; } = null!;
         protected int _numHourPrev = 24;
         protected int numHourPrev
         {
@@ -40,9 +43,13 @@ namespace MP.MONO.UI.Pages
 
         protected override async Task OnInitializedAsync()
         {
+            
             await ReloadData();
         }
-
+        private async void popover()
+        {
+            await JSRuntime.InvokeVoidAsync("pop");
+        }
         private async Task ReloadData()
         {
             await Task.Delay(1);
diff --git a/MP.MONO.UI/Pages/_Layout.cshtml b/MP.MONO.UI/Pages/_Layout.cshtml
index 69d4642..a2b3937 100644
--- a/MP.MONO.UI/Pages/_Layout.cshtml
+++ b/MP.MONO.UI/Pages/_Layout.cshtml
@@ -56,5 +56,6 @@
     <script src="lib/luxon/luxon.js"></script>
     <script src="lib/chartjs-adapter-luxon/chartjs-adapter-luxon.js"></script>
     <script src="lib/chartBoot.js"></script>
+    <script src="lib/popover.js"></script>
 </body>
 </html>
diff --git a/MP.MONO.UI/Resources/ChangeLog.html b/MP.MONO.UI/Resources/ChangeLog.html
index 75395e8..6fa1195 100644
--- a/MP.MONO.UI/Resources/ChangeLog.html
+++ b/MP.MONO.UI/Resources/ChangeLog.html
@@ -1,6 +1,6 @@
 <body>
     <i>MAPO-MONO</i>
-    <h4>Version: 1.2.2210.2811</h4>
+    <h4>Version: 1.2.2210.2815</h4>
     <br /> Release Note:
     <ul>
         <li>
diff --git a/MP.MONO.UI/Resources/VersNum.txt b/MP.MONO.UI/Resources/VersNum.txt
index 53dd5cd..eff0546 100644
--- a/MP.MONO.UI/Resources/VersNum.txt
+++ b/MP.MONO.UI/Resources/VersNum.txt
@@ -1 +1 @@
-1.2.2210.2811
+1.2.2210.2815
diff --git a/MP.MONO.UI/Resources/manifest.xml b/MP.MONO.UI/Resources/manifest.xml
index fb3a217..ba67947 100644
--- a/MP.MONO.UI/Resources/manifest.xml
+++ b/MP.MONO.UI/Resources/manifest.xml
@@ -1,6 +1,6 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <item>
-  <version>1.2.2210.2811</version>
+  <version>1.2.2210.2815</version>
   <url>http://nexus.steamware.net/repository/SWS/MP.MONO.UI/stable/LAST/MP.Mon.zip</url>
   <changelog>http://nexus.steamware.net/repository/SWS/MP.MONO.UI/stable/LAST/ChangeLog.html</changelog>
   <mandatory>false</mandatory>
diff --git a/MP.MONO.UI/wwwroot/css/site.less b/MP.MONO.UI/wwwroot/css/site.less
index 632f9a4..7d0dbc4 100644
--- a/MP.MONO.UI/wwwroot/css/site.less
+++ b/MP.MONO.UI/wwwroot/css/site.less
@@ -10,6 +10,8 @@ html, body {
     /*font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;*/
     font-family: 'Roboto', sans-serif;
 }
+
+
 .pulse-warning {
     /*color: rgba(255, 255, 255, 0.8);*/
     box-shadow: 0px 0px 20px 5px rgba(255, 0, 0, .8);
diff --git a/MP.MONO.UI/wwwroot/lib/popover.js b/MP.MONO.UI/wwwroot/lib/popover.js
new file mode 100644
index 0000000..2f249ae
--- /dev/null
+++ b/MP.MONO.UI/wwwroot/lib/popover.js
@@ -0,0 +1,9 @@
+
+
+window.pop = () => {
+    var popoverTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="popover"]'))
+    var popoverList = popoverTriggerList.map(function (popoverTriggerEl) {
+        return new bootstrap.Popover(popoverTriggerEl)
+        console.log("fatto");
+    })
+}
\ No newline at end of file