From 27eae15143c6c17c88d2a30686b44dcb1e514469 Mon Sep 17 00:00:00 2001
From: kirsty-hames <kirsty-hames@users.noreply.github.com>
Date: Wed, 24 May 2023 17:01:51 +0100
Subject: [PATCH 1/2] add generic .notify__btn-icon class

---
 templates/hotgridPopupToolbar.jsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/templates/hotgridPopupToolbar.jsx b/templates/hotgridPopupToolbar.jsx
index 528f492..390b55a 100644
--- a/templates/hotgridPopupToolbar.jsx
+++ b/templates/hotgridPopupToolbar.jsx
@@ -33,7 +33,7 @@ export default function HotgridPopupToolbar(props) {
 
         <button
           className={classes([
-            'btn-icon hotgrid-popup__controls back',
+            'btn-icon notify__btn-icon hotgrid-popup__controls back',
             !shouldEnableBack && 'is-disabled'
           ])}
           aria-label={backLabel}
@@ -52,7 +52,7 @@ export default function HotgridPopupToolbar(props) {
 
         <button
           className={classes([
-            'btn-icon hotgrid-popup__controls next',
+            'btn-icon notify__btn-icon hotgrid-popup__controls next',
             !shouldEnableNext && 'is-disabled'
           ])}
           aria-label={nextLabel}
@@ -67,7 +67,7 @@ export default function HotgridPopupToolbar(props) {
       }
 
       <button
-        className="btn-icon hotgrid-popup__close"
+        className="btn-icon notify__btn-icon hotgrid-popup__close"
         aria-label={ariaLabels.closePopup}
         onClick={onCloseClick}
       >

From f8bb45f1a8473bfaca738053bef9afc21ab99519 Mon Sep 17 00:00:00 2001
From: kirsty-hames <kirsty-hames@users.noreply.github.com>
Date: Wed, 24 May 2023 17:04:05 +0100
Subject: [PATCH 2/2] remove duplicate LESS

as these now inherit from .notify__btn-icon in Vanilla notify.less
---
 less/hotgridPopup.less | 15 ---------------
 1 file changed, 15 deletions(-)

diff --git a/less/hotgridPopup.less b/less/hotgridPopup.less
index ca8270f..247a90f 100644
--- a/less/hotgridPopup.less
+++ b/less/hotgridPopup.less
@@ -133,21 +133,6 @@
     padding-top: (@icon-size + (@icon-padding * 2)) + (@item-padding / 2);
   }
 
-  .btn-icon&__controls,
-  .btn-icon&__close {
-    margin: @btn-margin / 2;
-    padding: @btn-padding / 2;
-    background-color: @notify-icon;
-    color: @notify-icon-inverted;
-    border-radius: 50%;
-
-    .no-touch &:not(.is-disabled):not(.is-locked):hover {
-      background-color: @notify-icon-hover;
-      color: @notify-icon-inverted-hover;
-      .transition(background-color @duration ease-in, color @duration ease-in;);
-    }
-  }
-
   &__item-title {
     margin-bottom: @notify-title-margin;
     .notify-title;