Implement keyboard accessibility

varunsingh87 · varunsingh87 · commit f413a839ace4 · 2020-12-30T13:44:08.000-05:00
* Remove all `outline: none`'s - needed when the user is Tabbing
diff --git a/components/AccountBanner/accountBanner.module.css b/components/AccountBanner/accountBanner.module.css
@@ -35,7 +35,6 @@ ul.accountMenu {
 	width: 100%;
 	border: none;
 	background: none;
-	outline: none;
 	font-size: 1rem;
 	font-family: "Segoe UI";
 	text-align: center;
diff --git a/components/BrandHeader/brandHeader.module.css b/components/BrandHeader/brandHeader.module.css
@@ -7,7 +7,6 @@
 	display: flex;
 	flex-flow: row nowrap;
 	align-items: center;
-	outline: none;
 }
 
 .brandNameContainer span {
diff --git a/components/FetchError/fetchError.module.css b/components/FetchError/fetchError.module.css
@@ -12,7 +12,6 @@
 
 .fetchError button {
     border: none;
-    outline: none;
     background: none;
     padding: 1em;
 }
diff --git a/components/Jotting/jotting.module.css b/components/Jotting/jotting.module.css
@@ -3,7 +3,6 @@
     font-size: 1rem;
     background: none;
     border: none;
-    outline: none;
     text-align: left;
     padding: 1em;
     width: 100%;
@@ -48,7 +47,6 @@
 
 .jottingOptionsBar button {
     background: none;
-    outline: none;
     border: none;
     margin: 0 1em;
 }
diff --git a/components/SearchBar/searchBar.module.css b/components/SearchBar/searchBar.module.css
@@ -11,7 +11,6 @@
 .container * {
 	border: none;
 	background: none;
-	outline: none;
 }
 
 .container button {
diff --git a/components/ShareeList/shareeList.module.css b/components/ShareeList/shareeList.module.css
@@ -0,0 +1,13 @@
+.shareeList {
+    display: flex;
+    height: 100%;
+    padding: 1em;
+    align-content: stretch;
+    align-items: center;
+    justify-content: flex-start;
+    flex-flow: column nowrap;
+}
+
+.item {
+    line-height: 2em;
+}
diff --git a/pages/Home/home.module.css b/pages/Home/home.module.css
@@ -34,25 +34,32 @@
 
 .jottingContent {
 	grid-row: 1 / 2;
-	grid-column: 1 / -2;
+	grid-column: 1 / -3;
 }
 
 .shareMenu {
+	display: flex;
 	grid-row: 1 / 2;
 	grid-column: 4 / -1;
 	border: 4px solid black;
 	background-color: white;
-	display: flex;
 	flex-direction: column;
 	align-items: center;
 }
 
-.shareList {
-	height: 50%;
-}
-
 .shareMenu > button {
 	font-size: 2em;
 	width: 200px;
+	margin-bottom: 10px;
+}
+
+.shareMenu > input[type="text"] {
+	display: block;
+	border: 1px solid orange;
+	border-radius: 25px;
+	padding: 1em;
+	font-size: 1em;
+	margin: 10px 0;
+	width: 90%;
 }
 
diff --git a/pages/Login/login.module.css b/pages/Login/login.module.css
@@ -120,7 +120,6 @@
 
 .form fieldset input {
   border: none;
-  outline: none;
   font-size: 16px;
   font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
 }

Original file line number	Diff line number	Diff line change
`@@ -7,7 +7,6 @@`
`7`	`7`	`display: flex;`
`8`	`8`	`flex-flow: row nowrap;`
`9`	`9`	`align-items: center;`
`10`		`- outline: none;`
`11`	`10`	`}`
`12`	`11`
`13`	`12`	`.brandNameContainer span {`
Original file line number	Diff line number	Diff line change
`@@ -12,7 +12,6 @@`
`12`	`12`
`13`	`13`	`.fetchError button {`
`14`	`14`	`border: none;`
`15`		`- outline: none;`
`16`	`15`	`background: none;`
`17`	`16`	`padding: 1em;`
`18`	`17`	`}`
Original file line number	Diff line number	Diff line change
`@@ -11,7 +11,6 @@`
`11`	`11`	`.container * {`
`12`	`12`	`border: none;`
`13`	`13`	`background: none;`
`14`		`- outline: none;`
`15`	`14`	`}`
`16`	`15`
`17`	`16`	`.container button {`
Original file line number	Diff line number	Diff line change
`@@ -120,7 +120,6 @@`
`120`	`120`
`121`	`121`	`.form fieldset input {`
`122`	`122`	`border: none;`
`123`		`- outline: none;`
`124`	`123`	`font-size: 16px;`
`125`	`124`	`font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;`
`126`	`125`	`}`