Merge pull request #54 from mpolidori/fix/WCAG-2.1-compliance

[WCAG]: 2.1 compliance
datopian · Dec 9, 2020 · 8011e11 · 8011e11
2 parents be47b66 + 5d6a873
commit 8011e11
Show file tree

Hide file tree

Showing 3 changed files with 13 additions and 11 deletions.
diff --git a/dist/Document.js b/dist/Document.js
@@ -47,7 +47,7 @@ var PdfViewer = function PdfViewer(props) {
       }
     }, _react.default.createElement("a", {
       href: "#previous"
-    }, _react.default.createElement("i", {
+    }, _react.default.createElement("span", {
       className: "arrow-left"
     }), " Previous"));
 
@@ -56,7 +56,7 @@ var PdfViewer = function PdfViewer(props) {
         className: "previous disabled"
       }, _react.default.createElement("a", {
         href: "#previous"
-      }, _react.default.createElement("i", {
+      }, _react.default.createElement("span", {
         className: "arrow-left"
       }), " Previous"));
     }
@@ -68,7 +68,7 @@ var PdfViewer = function PdfViewer(props) {
       }
     }, _react.default.createElement("a", {
       href: "#next"
-    }, "Next ", _react.default.createElement("i", {
+    }, "Next ", _react.default.createElement("span", {
       className: "arrow-right"
     })));
 
@@ -77,12 +77,14 @@ var PdfViewer = function PdfViewer(props) {
         className: "next disabled"
       }, _react.default.createElement("a", {
         href: "#next"
-      }, "Next ", _react.default.createElement("i", {
+      }, "Next ", _react.default.createElement("span", {
         className: "arrow-right"
       })));
     }
 
-    return _react.default.createElement("nav", null, _react.default.createElement("ul", {
+    return _react.default.createElement("nav", {
+      "aria-label": "Navigate pages: Previous/Next"
+    }, _react.default.createElement("ul", {
       className: "pager"
     }, previousButton, nextButton));
   };

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@datopian/datapackage-views-js",
-  "version": "1.3.17",
+  "version": "1.3.18",
   "private": false,
   "main": "/dist/App.js",
   "module": "/dist/App.js",

diff --git a/src/Document.js b/src/Document.js
@@ -12,16 +12,16 @@ const PdfViewer = (props) => {
     if (!pages) {
       return null;
     }
-    let previousButton = <li className="previous" onClick={() => setPage(page - 1)}><a href="#previous"><i className="arrow-left"></i> Previous</a></li>;
+    let previousButton = <li className="previous" onClick={() => setPage(page - 1)}><a href="#previous"><span className="arrow-left"></span> Previous</a></li>;
     if (page === 1) {
-      previousButton = <li className="previous disabled"><a href="#previous"><i className="arrow-left"></i> Previous</a></li>;
+      previousButton = <li className="previous disabled"><a href="#previous"><span className="arrow-left"></span> Previous</a></li>;
     }
-    let nextButton = <li className="next" onClick={() => setPage(page + 1)}><a href="#next">Next <i className="arrow-right"></i></a></li>;
+    let nextButton = <li className="next" onClick={() => setPage(page + 1)}><a href="#next">Next <span className="arrow-right"></span></a></li>;
     if (page === pages) {
-      nextButton = <li className="next disabled"><a href="#next">Next <i className="arrow-right"></i></a></li>;
+      nextButton = <li className="next disabled"><a href="#next">Next <span className="arrow-right"></span></a></li>;
     }
     return (
-      <nav>
+      <nav aria-label="Navigate pages: Previous/Next">
         <ul className="pager">
           {previousButton}
           {nextButton}