From d7c20ba6e8f0675ad2fcd4fb41419de005ae3979 Mon Sep 17 00:00:00 2001
From: Hassan Abouelela <47495861+HassanAbouelela@users.noreply.github.com>
Date: Sat, 16 Jan 2021 22:31:50 +0300
Subject: Rewrites Components For Accessibility

Makes major changes to the structuring of checkboxes, and ranges to be
more accessible to all users.

Signed-off-by: Hassan Abouelela <47495861+HassanAbouelela@users.noreply.github.com>
---
 src/commonStyles.tsx | 23 ++++++++++++++++++++++-
 1 file changed, 22 insertions(+), 1 deletion(-)

(limited to 'src/commonStyles.tsx')

diff --git a/src/commonStyles.tsx b/src/commonStyles.tsx
index 5053846..71bbd13 100644
--- a/src/commonStyles.tsx
+++ b/src/commonStyles.tsx
@@ -14,6 +14,24 @@ const unselectable = css`
   user-select: none;
 `;
 
+const hiddenInput = css`
+  position: absolute;
+  opacity: 0;
+  height: 0;
+  width: 0;
+`;
+
+const multiSelectInput = css`
+  display: inline-block;
+  position: relative;
+
+  margin: 1rem 0.5rem 0 0;
+  border: whitesmoke 0.2rem solid;
+
+  background-color: whitesmoke;
+  transition: background-color 300ms;
+`;
+
 const textInputs = css`
   display: inline-block;
   width: min(20rem, 90%);
@@ -32,8 +50,11 @@ const textInputs = css`
   border-radius: 8px;
 `;
 
+
 export {
     selectable,
     unselectable,
-    textInputs
+    hiddenInput,
+    multiSelectInput,
+    textInputs,
 };
-- 
cgit v1.2.3