Verified Commit 2e6b5aae authored by Vincent's avatar Vincent

Make screen readers ignore the Plaudit logo

The branding likely doesn't come across properly anyway, so might
as well not waste the time of screen reader users with it.
parent 83bbec51
......@@ -65,8 +65,8 @@ const renderSignInModal = (
) => (
<form onSubmit={handleSignin} className="Widget" data-iframe-height="data-iframe-height">
<span className="Widget__FlexContainer">
<span className="Widget__Brand">
<Logo role="img" aria-label="" className="Widget__logo"/>
<span aria-hidden={true} className="Widget__Brand">
<Logo role="img" className="Widget__logo"/>
</span>
<span className="Widget__Tagline">
<span className="Widget__TaglineContent">
......@@ -93,9 +93,9 @@ const renderNoEndorsements = (
{/* This is needed because <button> elements cannot be flex containers. */}
{/* See https://stackoverflow.com/a/35466231 */}
<span className="Widget__FlexContainer">
<span className="Widget__ButtonContainer">
<span aria-hidden={true} className="Widget__ButtonContainer">
<span className="Widget__Button">
<Logo role="img" aria-label="" className="Widget__logo"/>
<Logo role="img" className="Widget__logo"/>
</span>
</span>
<span className="Widget__Tagline">
......@@ -216,8 +216,8 @@ const renderWithEndorsements = (
const tagline = renderTagline(endorsements, workData, userOrcid);
const buttonOrBrand = (typeof userOrcid !== 'undefined' && Object.keys(endorsements).includes(userOrcid))
? (
<span className="Widget__Brand">
<Logo role="img" aria-label="Endorse" className="Widget__logo"/>
<span aria-hidden={true} className="Widget__Brand">
<Logo role="img" className="Widget__logo"/>
</span>
)
: (
......@@ -226,9 +226,14 @@ const renderWithEndorsements = (
onClick={handleEndorsement}
tabIndex={0}
title={`Endorse "${workData.title}"`}
aria-label={`Endorse "${workData.title}"`}
className="Widget__Button"
>
<Logo role="img" aria-label="" className="Widget__logo"/>
<Logo
role="img"
aria-label=""
className="Widget__logo"
/>
</button>
</span>
);
......
......@@ -10,10 +10,10 @@ exports[`The view, when not logged in, should render consistently when asked to
className="Widget__FlexContainer"
>
<span
aria-hidden={true}
className="Widget__Brand"
>
<svg
aria-label=""
className="Widget__logo"
role="img"
>
......@@ -52,6 +52,7 @@ exports[`The view, when not logged in, should render consistently when endorseme
className="Widget__ButtonContainer"
>
<button
aria-label="Endorse \\"Arbitrary title\\""
className="Widget__Button"
onClick={[Function]}
tabIndex={0}
......@@ -116,6 +117,7 @@ exports[`The view, when not logged in, should render consistently with one endor
className="Widget__ButtonContainer"
>
<button
aria-label="Endorse \\"Arbitrary title\\""
className="Widget__Button"
onClick={[Function]}
tabIndex={0}
......@@ -170,6 +172,7 @@ exports[`The view, when not logged in, should render consistently with two endor
className="Widget__ButtonContainer"
>
<button
aria-label="Endorse \\"Arbitrary title\\""
className="Widget__Button"
onClick={[Function]}
tabIndex={0}
......@@ -234,13 +237,13 @@ exports[`The view, when not logged in, should render consistently without endors
className="Widget__FlexContainer"
>
<span
aria-hidden={true}
className="Widget__ButtonContainer"
>
<span
className="Widget__Button"
>
<svg
aria-label=""
className="Widget__logo"
role="img"
>
......@@ -362,10 +365,10 @@ exports[`The view, when the user is logged in and has endorsed the work, should
className="Widget__FlexContainer"
>
<span
aria-hidden={true}
className="Widget__Brand"
>
<svg
aria-label="Endorse"
className="Widget__logo"
role="img"
>
......@@ -419,10 +422,10 @@ exports[`The view, when the user is logged in and has endorsed the work, should
className="Widget__FlexContainer"
>
<span
aria-hidden={true}
className="Widget__Brand"
>
<svg
aria-label="Endorse"
className="Widget__logo"
role="img"
>
......@@ -466,10 +469,10 @@ exports[`The view, when the user is logged in and has endorsed the work, should
className="Widget__FlexContainer"
>
<span
aria-hidden={true}
className="Widget__Brand"
>
<svg
aria-label="Endorse"
className="Widget__logo"
role="img"
>
......@@ -525,6 +528,7 @@ exports[`The view, when the user is logged in and has not endorsed the work, sho
className="Widget__ButtonContainer"
>
<button
aria-label="Endorse \\"Arbitrary title\\""
className="Widget__Button"
onClick={[Function]}
tabIndex={0}
......@@ -589,6 +593,7 @@ exports[`The view, when the user is logged in and has not endorsed the work, sho
className="Widget__ButtonContainer"
>
<button
aria-label="Endorse \\"Arbitrary title\\""
className="Widget__Button"
onClick={[Function]}
tabIndex={0}
......@@ -643,6 +648,7 @@ exports[`The view, when the user is logged in and has not endorsed the work, sho
className="Widget__ButtonContainer"
>
<button
aria-label="Endorse \\"Arbitrary title\\""
className="Widget__Button"
onClick={[Function]}
tabIndex={0}
......@@ -707,13 +713,13 @@ exports[`The view, when the user is logged in and has not endorsed the work, sho
className="Widget__FlexContainer"
>
<span
aria-hidden={true}
className="Widget__ButtonContainer"
>
<span
className="Widget__Button"
>
<svg
aria-label=""
className="Widget__logo"
role="img"
>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment