From f8cfdacc26968c1b6f1baa48c38f2637ca67a2c4 Mon Sep 17 00:00:00 2001
From: Leigh Pointer <leigh.pointer@outlook.com>
Date: Tue, 3 Jan 2023 14:24:17 +0100
Subject: [PATCH] A change to the Pager bar to set the mouse pointer to pointer

Currently the mouse pointer shows the Selector icon when hoovered over the page number buttons. This is an update changing the icon to the Pointer icon.

Updated the CSS class name to 'app-pager-pointer' in app.css and the Component.
---
 Oqtane.Client/Modules/Controls/Pager.razor | 32 +++++++++++-----------
 Oqtane.Server/wwwroot/css/app.css          |  2 +-
 2 files changed, 17 insertions(+), 17 deletions(-)

diff --git a/Oqtane.Client/Modules/Controls/Pager.razor b/Oqtane.Client/Modules/Controls/Pager.razor
index e30a7c0e..bf735801 100644
--- a/Oqtane.Client/Modules/Controls/Pager.razor
+++ b/Oqtane.Client/Modules/Controls/Pager.razor
@@ -8,16 +8,16 @@
     @if ((Toolbar == "Top" || Toolbar == "Both") && _pages > 0 && Items.Count() > _maxItems)
     {
         <ul class="pagination justify-content-center my-2">
-            <li class="page-item@((_page > 1) ? " page-pointer" : " disabled")">
+            <li class="page-item@((_page > 1) ? " app-pager-pointer" : " disabled")">
                 <a class="page-link" @onclick=@(async () => UpdateList(1))><span class="oi oi-media-step-backward" title="start" aria-hidden="true"></span></a>
             </li>
             @if (_pages > _displayPages && _displayPages > 1)
             {
-                <li class="page-item@((_page > _displayPages) ? " page-pointer" : " disabled")">
+                <li class="page-item@((_page > _displayPages) ? " app-pager-pointer" : " disabled")">
                     <a class="page-link" @onclick=@(async () => SkipPages("back"))><span class="oi oi-media-skip-backward" title="skip back" aria-hidden="true"></span></a>
                 </li>
             }
-            <li class="page-item@((_page > 1) ? " page-pointer" : " disabled")">
+            <li class="page-item@((_page > 1) ? " app-pager-pointer" : " disabled")">
                 <a class="page-link" @onclick=@(async () => NavigateToPage("previous"))><span class="oi oi-chevron-left" title="previous" aria-hidden="true"></span></a>
             </li>
             @for (int i = _startPage; i <= _endPage; i++)
@@ -25,27 +25,27 @@
                 var pager = i;
                 if (pager == _page)
                 {
-                    <li class="page-item page-pointer active">
+                    <li class="page-item app-pager-pointer active">
                         <a class="page-link" @onclick=@(async () => UpdateList(pager))>@pager</a>
                     </li>
                 }
                 else
                 {
-                    <li class="page-item page-pointer">
+                    <li class="page-item app-pager-pointer">
                         <a class="page-link" @onclick=@(async () => UpdateList(pager))>@pager</a>
                     </li>
                 }
             }
-            <li class="page-item@((_page < _pages) ? " page-pointer" : " disabled")">
+            <li class="page-item@((_page < _pages) ? " app-pager-pointer" : " disabled")">
                 <a class="page-link" @onclick=@(async () => NavigateToPage("next"))><span class="oi oi-chevron-right" title="next" aria-hidden="true"></span></a>
             </li>
             @if (_pages > _displayPages && _displayPages > 1)
             {
-                <li class="page-item@((_endPage < _pages) ? " page-pointer" : " disabled")">
+                <li class="page-item@((_endPage < _pages) ? " app-pager-pointer" : " disabled")">
                     <a class="page-link" @onclick=@(async () => SkipPages("forward"))><span class="oi oi-media-skip-forward" title="skip forward" aria-hidden="true"></span></a>
                 </li>
             }
-            <li class="page-item@((_page < _pages) ? " page-pointer" : " disabled")">
+            <li class="page-item@((_page < _pages) ? " app-pager-pointer" : " disabled")">
                 <a class="page-link" @onclick=@(async () => UpdateList(_pages))><span class="oi oi-media-step-forward" title="end" aria-hidden="true"></span></a>
             </li>
             <li class="page-item disabled">
@@ -119,16 +119,16 @@
     @if ((Toolbar == "Bottom" || Toolbar == "Both") && _pages > 0 && Items.Count() > _maxItems)
     {
         <ul class="pagination justify-content-center my-2">
-            <li class="page-item@((_page > 1) ? " page-pointer" : " disabled")">
+            <li class="page-item@((_page > 1) ? " app-pager-pointer" : " disabled")">
                 <a class="page-link" @onclick=@(async () => UpdateList(1))><span class="oi oi-media-step-backward" title="start" aria-hidden="true"></span></a>
             </li>
             @if (_pages > _displayPages && _displayPages > 1)
             {
-                <li class="page-item@((_page > _displayPages) ? " page-pointer" : " disabled")">
+                <li class="page-item@((_page > _displayPages) ? " app-pager-pointer" : " disabled")">
                     <a class="page-link" @onclick=@(async () => SkipPages("back"))><span class="oi oi-media-skip-backward" title="skip back" aria-hidden="true"></span></a>
                 </li>
             }
-            <li class="page-item@((_page > 1) ? " page-pointer" : " disabled")">
+            <li class="page-item@((_page > 1) ? " app-pager-pointer" : " disabled")">
                 <a class="page-link" @onclick=@(async () => NavigateToPage("previous"))><span class="oi oi-chevron-left" title="previous" aria-hidden="true"></span></a>
             </li>
             @for (int i = _startPage; i <= _endPage; i++)
@@ -136,27 +136,27 @@
                 var pager = i;
                 if (pager == _page)
                 {
-                    <li class="page-item page-pointer active">
+                    <li class="page-item app-pager-pointer active">
                         <a class="page-link" @onclick=@(async () => UpdateList(pager))>@pager</a>
                     </li>
                 }
                 else
                 {
-                    <li class="page-item page-pointer">
+                    <li class="page-item app-pager-pointer">
                         <a class="page-link" @onclick=@(async () => UpdateList(pager))>@pager</a>
                     </li>
                 }
             }
-            <li class="page-item@((_page < _pages) ? " page-pointer" : " disabled")">
+            <li class="page-item@((_page < _pages) ? " app-pager-pointer" : " disabled")">
                 <a class="page-link" @onclick=@(async () => NavigateToPage("next"))><span class="oi oi-chevron-right" title="next" aria-hidden="true"></span></a>
             </li>
             @if (_pages > _displayPages && _displayPages > 1)
             {
-                <li class="page-item@((_endPage < _pages) ? " page-pointer" : " disabled")">
+                <li class="page-item@((_endPage < _pages) ? " app-pager-pointer" : " disabled")">
                     <a class="page-link" @onclick=@(async () => SkipPages("forward"))><span class="oi oi-media-skip-forward" title="skip forward" aria-hidden="true"></span></a>
                 </li>
             }
-            <li class="page-item@((_page < _pages) ? " page-pointer" : " disabled")">
+            <li class="page-item@((_page < _pages) ? " app-pager-pointer" : " disabled")">
                 <a class="page-link" @onclick=@(async () => UpdateList(_pages))><span class="oi oi-media-step-forward" title="end" aria-hidden="true"></span></a>
             </li>
             <li class="page-item disabled">
diff --git a/Oqtane.Server/wwwroot/css/app.css b/Oqtane.Server/wwwroot/css/app.css
index 21034ae7..8a2a4e3a 100644
--- a/Oqtane.Server/wwwroot/css/app.css
+++ b/Oqtane.Server/wwwroot/css/app.css
@@ -217,6 +217,6 @@ app {
 /* Oqtane Conrol Styles */
 
 /* Pager */
-.page-pointer {
+.app-pager-pointer {
     cursor: pointer;
 }
\ No newline at end of file