From 580a50b63f662a74f60eba85da97fc8c53a430c1 Mon Sep 17 00:00:00 2001
From: 39zde <git@39z.de>
Date: Thu, 10 Oct 2024 14:31:58 +0200
Subject: [PATCH] replace aria description for aria labels with
 data-description prop

---
 index.html | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/index.html b/index.html
index c00a81d..699a974 100644
--- a/index.html
+++ b/index.html
@@ -31,7 +31,7 @@ <h1 role="heading">
         <small>Creates a Zip or Gzip Archive, from any file type.</small>
     </header>
     <main>
-        <aside aria-expanded="false" aria-describedby="Drawer,which shows the available keyboard shortcuts">
+        <aside aria-expanded="false" data-description="Drawer,which shows the available keyboard shortcuts">
             <label class="toggle-shortcuts-label" for="toggle-shortcuts" tabindex="-1"
                 title="Show/Hide keyboard shortcuts">
                 <input id="toggle-shortcuts" type="checkbox" aria-controls="shortcuts" role="checkbox"
@@ -99,12 +99,12 @@ <h3>Compress the file</h3>
             </output>
             <form class="steps">
                 <label for="compression-file-input" tabindex="0" title="1. File Selection" aria-keyshortcuts="1"
-                    aria-describedby="Step 1: File Upload. Press 1 to focus, then press 'Enter' or 'o' to open the file explorer to pick one or more files">
+                    data-description="Step 1: File Upload. Press 1 to focus, then press 'Enter' or 'o' to open the file explorer to pick one or more files">
                     <h2>1. File Selection</h2>
                     <input tabindex="-1" type="file" multiple id="compression-file-input" aria-keyshortcuts="o">
                 </label>
                 <label for="compression-type-input" tabindex="0" title="2. Compression Type" aria-keyshortcuts="2"
-                    aria-describedby="Step 2: Compression type selection. Press 2 to focus, then press 'Enter' or 's' to cycle through the available options">
+                    data-description="Step 2: Compression type selection. Press 2 to focus, then press 'Enter' or 's' to cycle through the available options">
                     <h2>2. Compression Type</h2>
                     <select id="compression-type-input" tabindex="-1" aria-keyshortcuts="s">
                         <option value="gzip">
@@ -116,7 +116,7 @@ <h2>2. Compression Type</h2>
                     </select>
                 </label>
                 <label for="compression-start-input" tabindex="0" title="3. Start" aria-keyshortcuts="3"
-                    aria-describedby="Step 3: Start the compression. Press 3 to focus, then press 'Enter' or 'c' to compress or decompress the selected files. Decopmression ignores the compression type input and picks the correct format, if supported. Processed files will be saved to the download folder.">
+                    data-description="Step 3: Start the compression. Press 3 to focus, then press 'Enter' or 'c' to compress or decompress the selected files. Decopmression ignores the compression type input and picks the correct format, if supported. Processed files will be saved to the download folder.">
                     <h2>3. Start</h2>
                     <input id="compression-start-input" type="button" value="Go" tabindex="-1" disabled
                         aria-keyshortcuts="c">