diff --git a/src/App.scss b/src/App.scss index 5461a4a..6724890 100644 --- a/src/App.scss +++ b/src/App.scss @@ -56,7 +56,9 @@ a { text-decoration: none; text-decoration-color: inherit; transition: ease 0.4s; + outline: none; + &:focus, &:hover { color: $primary-light; text-decoration: underline; diff --git a/src/pages/home/index.tsx b/src/pages/home/index.tsx index 4f5c560..bb3115f 100644 --- a/src/pages/home/index.tsx +++ b/src/pages/home/index.tsx @@ -136,7 +136,7 @@ export const HomePage = () => { const [sort, setSort] = useState('desc') return ( -
+
@@ -212,26 +212,27 @@ export const HomePage = () => { borderBottomLeftRadius: 0 }} variant={'contained'} - aria-label="Submit Search" + aria-label="submit search" >
-
-
- - {isDragActive ? ( -

Drop the files here ...

- ) : ( -

Click or drag files to upload!

- )} -
-
+ + {isDragActive ? ( +

Drop the files here ...

+ ) : ( +

Click or drag files to upload!

+ )} +
{Object.keys(parsedSigits) .filter((s) => { diff --git a/src/pages/home/style.module.scss b/src/pages/home/style.module.scss index 6b74e76..63917a0 100644 --- a/src/pages/home/style.module.scss +++ b/src/pages/home/style.module.scss @@ -76,6 +76,7 @@ inset: 15px; } + &:focus, &.isDragActive, &:hover { &::before { @@ -83,6 +84,14 @@ background: rgba(0, 0, 0, 0.15); } } + + // Override button styles + padding: 0; + border: none; + outline: none; + letter-spacing: 1px; + font-weight: 500; + font-family: inherit; } .submissions { diff --git a/src/theme/index.ts b/src/theme/index.ts index a7a37d4..8cc008f 100644 --- a/src/theme/index.ts +++ b/src/theme/index.ts @@ -33,6 +33,9 @@ export const theme = extendTheme({ boxShadow: 'unset', lineHeight: 'inherit', borderRadius: '4px', + ':focus': { + textDecoration: 'none' + }, ':hover': { background: 'var(--primary-light)', boxShadow: 'unset'