issue/229 Converted button divs to spans (#230)

adaptlearning · Jul 4, 2022 · d313250 · d313250
1 parent c8b700a
commit d313250
Show file tree

Hide file tree

Showing 3 changed files with 12 additions and 8 deletions.
diff --git a/less/hotgraphic.less b/less/hotgraphic.less
@@ -24,6 +24,10 @@
     padding: 0;
   }
 
+  &__pin-number {
+    display: block;
+  }
+
   // Hotgraphic as tiles
   // --------------------------------------------------
   &__tile-item-container {

diff --git a/templates/hotgraphic.hbs b/templates/hotgraphic.hbs
@@ -26,17 +26,17 @@
           <span class="aria-label">{{#if ../_useNumberedPins}}{{math @index "+" 1}} {{/if}}{{#if _pin.alt}}{{{compile _pin.alt}}}{{else}}{{{compile title}}}{{/if}}.</span>
 
           {{#if _pin.src}}
-          <div class="hotgraphic__pin-image-container item-{{@index}}">
+          <span class="hotgraphic__pin-image-container item-{{@index}}">
             <img class="hotgraphic__pin-image" src="{{_pin.src}}" aria-hidden="true">
-          </div>
+          </span>
           {{else}}
 
           {{#if ../_useNumberedPins}}
-          <div class="hotgraphic__pin-number" aria-hidden="true">
+          <span class="hotgraphic__pin-number" aria-hidden="true">
             {{math @index "+" 1}}
-          </div>
+          </span>
           {{else}}
-          <div class="icon"></div>
+          <span class="icon"></span>
           {{/if}}
 
           {{/if}}

diff --git a/templates/hotgraphicPopup.hbs b/templates/hotgraphicPopup.hbs
@@ -50,20 +50,20 @@
   <div class="hotgraphic-popup__nav">
 
     <button data-direction="back" class="btn-icon hotgraphic-popup__controls back js-hotgraphic-controls-click" aria-label="{{_globals._accessibility._ariaLabels.previous}}">
-      <div class="icon"></div>
+      <span class="icon"></span>
     </button>
 
     <div class="hotgraphic-popup__count"></div>
 
     <button data-direction="next" class="btn-icon hotgraphic-popup__controls next js-hotgraphic-controls-click" aria-label="{{_globals._accessibility._ariaLabels.next}}">
-      <div class="icon"></div>
+      <span class="icon"></span>
     </button>
 
   </div>
   {{/unless}}
 
   <button class="btn-icon hotgraphic-popup__close js-hotgraphic-popup-close" aria-label="{{_globals._accessibility._ariaLabels.closePopup}}">
-    <div class="icon"></div>
+    <span class="icon"></span>
   </button>
 
 </div>