From 88bb2dca686de463c896aff7cb97a62936a85819 Mon Sep 17 00:00:00 2001
From: bendtherules <abhasbhattacharya2@gmail.com>
Date: Mon, 30 Mar 2020 22:44:34 +0530
Subject: [PATCH] NewTaskList - Add a11y label

---
 src/features/TaskList/NewTaskListPrompt.js |  4 +++-
 src/index.css                              | 13 +++++++++++++
 2 files changed, 16 insertions(+), 1 deletion(-)

diff --git a/src/features/TaskList/NewTaskListPrompt.js b/src/features/TaskList/NewTaskListPrompt.js
index 111cd2d..d8a65df 100644
--- a/src/features/TaskList/NewTaskListPrompt.js
+++ b/src/features/TaskList/NewTaskListPrompt.js
@@ -11,8 +11,10 @@ export function NewTaskListPrompt() {
 
   return (
     <div className={styles.listContainer}>
+      <label className="sr-only" for="createNewList">Create new list</label>
       <input
-         className={styles.newListInput}
+        id="createNewList"
+        className={styles.newListInput}
         type="text"
         placeholder="+ Create list"
         value={newListname}
diff --git a/src/index.css b/src/index.css
index 1796f5d..d494206 100644
--- a/src/index.css
+++ b/src/index.css
@@ -21,3 +21,16 @@ code {
   font-family: source-code-pro, Menlo, Monaco, Consolas, "Courier New",
     monospace;
 }
+
+/* Only show for screen readers */
+.sr-only {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  padding: 0;
+  margin: -1px;
+  overflow: hidden;
+  clip: rect(0, 0, 0, 0);
+  white-space: nowrap; /* added line */
+  border: 0;
+}