filip(fix): apply EAA amends

Author: fstoqnov-iohk

docs/docusaurus.config.js

@@ -161,7 +161,7 @@ const config = {
       navbar: {
         title: "Hydra Head protocol",
         logo: {
-          alt: "Hydra Head protocol",
+          alt: "Hydra Head logo",
           src: "img/hydra.png",
           style: { height: 27, marginTop: 2.5 },
           srcDark: "img/hydra-white.png",
@@ -272,7 +272,7 @@ const config = {
         theme: lightCodeTheme,
         darkTheme: darkCodeTheme,
         additionalLanguages: ["haskell"],
-      }
+      },
     }),
 
   markdown: {

docs/src/components/homepage/Carousel/Carousel.tsx

@@ -21,7 +21,11 @@ const CarouselEntry: FC<Props> = ({ idx, src, description }) => {
   return (
     <div className="flex items-center gap-6 h-full justify-center">
       <div className="basis-[40%]">
-        <img src={src} className="w-full rounded-lg object-cover" />
+        <img
+          src={src}
+          className="w-full rounded-lg object-cover"
+          alt={`How it works panel ${idx}`}
+        />
       </div>
       <div className="flex flex-col gap-4 max-w-md justify-center">
         <h4 className="text-2xl text-primary font-medium">How it works</h4>
@@ -52,11 +56,17 @@ type ControlProps = {
 const Controls: FC<ControlProps> = ({ showing, handlePrev, handleNext }) => {
   return (
     <div className="inline-flex gap-4">
-      <button onClick={handlePrev} disabled={showing < 1}>
+      <button
+        onClick={handlePrev}
+        disabled={showing < 1}
+        aria-label="Previous slide"
+      >
         <Arrow
           className={clsx(
             "rotate-180 rounded-full",
-            showing < 1 ? "text-primary-lightest" : "text-primary hover:bg-primary/15"
+            showing < 1
+              ? "text-primary-lightest"
+              : "text-primary hover:bg-primary/15"
           )}
         />
       </button>
@@ -72,6 +82,7 @@ const Controls: FC<ControlProps> = ({ showing, handlePrev, handleNext }) => {
       <button
         onClick={handleNext}
         disabled={showing > HowItWorksCarouselContent.length - 2}
+        aria-label="Next slide"
       >
         <Arrow
           className={clsx(

docs/src/components/homepage/CaseStudies.tsx

@@ -54,6 +54,7 @@ const CaseStudies: FC = () => {
                   : FeaturedCaseStudy.src
               }
               className="tablet:rounded-2xl rounded-none"
+              alt="Case studies blocks"
             />
           </motion.div>
         </div>

docs/src/components/homepage/Features.tsx

@@ -27,7 +27,7 @@ const Feature: FC<Props> = ({ icon, title, description, index }) => {
     >
       <div className="inline-flex gap-3 border-b pb-4 border-gray [&>*:first-child]:mt-1">
         {icon}
-        <h6 className="text-2xl">{title}</h6>
+        <span className="text-2xl">{title}</span>
       </div>
       <p>{description}</p>
     </motion.div>
@@ -38,8 +38,8 @@ const Features: FC = () => {
   return (
     <section className="component bg-white">
       <div className="pageContainer">
-        <motion.h5
-          className="text-base text-primary pb-14"
+        <motion.h2
+          className="text-base text-primary pb-14 section-label"
           initial="hidden"
           whileInView="visible"
           viewport={{ once: true }}
@@ -50,7 +50,7 @@ const Features: FC = () => {
           }}
         >
           / FEATURES
-        </motion.h5>
+        </motion.h2>
         <motion.div className="grid laptop:grid-cols-3 laptop:grid-rows-2 laptop:grid-flow-row tablet:grid-rows-3 tablet:grid-flow-col gap-x-6 tablet:gap-y-6 laptop:gap-y-14 gap-y-14">
           {FeatureList.map((props, idx) => (
             <Feature key={idx} index={idx} {...props} />

docs/src/components/homepage/Properties.tsx

@@ -47,7 +47,7 @@ const Properties: FC = () => {
       }}
     >
       <div className="component pageContainer flex flex-col">
-        <h5 className="text-base text-white">/ PROPERTIES</h5>
+        <h3 className="text-base text-white section-label">/ PROPERTIES</h3>
         <div className="flex flex-col laptop:flex-row justify-between">
           <div className="pt-14 laptop:pr-14 flex flex-col gap-8">
             {PropertiesContent.map((props, idx) => (

docs/src/components/homepage/WhyHydraHead.tsx

@@ -21,9 +21,9 @@ const WhyHydraHead: FC = () => {
     >
       <div className="grid laptop:flex laptop:flex-row laptop:gap-6">
         <div className="flex flex-col basis-[41%] pt-4 order-2 laptop:-order-1 laptop:w-[472px] laptop:pt-0">
-          <h4 className="text-2xl text-primary font-medium pb-4">
+          <h3 className="text-2xl text-primary font-medium pb-4">
             {WhyHydraHeadContent.title}
-          </h4>
+          </h3>
           <p>{WhyHydraHeadContent.descriptionParagraphOne}</p>
 
           <motion.div
@@ -58,6 +58,7 @@ const WhyHydraHead: FC = () => {
         <div className="hidden basis-[59%] -order-1 laptop:order-2 tablet:block">
           <img
             src="hydra-docs-landing-graphic.png"
+            alt="Hydra Head blockchain flowchart"
             className="border-b border-solid border-primary laptop:border-none"
           />
         </div>

docs/src/css/custom.css

@@ -104,6 +104,10 @@ h4 {
   font-family: "Lexend";
 }
 
+.section-label {
+  font-family: "Inter";
+}
+
 h5,
 h6 {
   font-family: "Inter";

docs/src/theme/Navbar/Content/index.js

@@ -74,6 +74,7 @@ export default function NavbarContent() {
             target="_blank"
             rel="noopener noreferrer"
             className="hover:text-primary-light mx-3 py-1"
+            aria-label="Github link"
           >
             <GithubSmall />
           </a>
@@ -82,6 +83,7 @@ export default function NavbarContent() {
             target="_blank"
             rel="noopener noreferrer"
             className="hover:text-primary-light mx-3 py-1"
+            aria-label="Discord link"
           >
             <Discord />
           </a>

docs/src/theme/Navbar/MobileSidebar/PrimaryMenu/index.js

@@ -37,6 +37,7 @@ export default function NavbarMobilePrimaryMenu() {
         target="_blank"
         rel="noopener noreferrer"
         className="hover:text-primary-light mx-3 py-1 inline-flex gap-3"
+        aria-label="Github link"
       >
         <GithubSmall /> Github
       </a>
@@ -45,6 +46,7 @@ export default function NavbarMobilePrimaryMenu() {
         target="_blank"
         rel="noopener noreferrer"
         className="hover:text-primary-light mx-3 py-1 inline-flex gap-3"
+        aria-label="Discord link"
       >
         <Discord className="mt-1" /> Discord
       </a>