Styling of home

components/shared/Button/Button.module.css

@@ -0,0 +1,13 @@
+.root {
+    padding: 1em;
+    border: 0;
+    background-color: var(--md-sys-color-secondary);
+    border-radius: 4px;
+    color: var(--md-sys-color-on-secondary);
+    transition: box-shadow 0.075s linear;
+}
+
+.root:hover,
+.root:focus-visible {
+    box-shadow: 2px 2px 5px 1px rgba(0 0 0 / 50%);
+}

components/shared/Button/Button.tsx

@@ -0,0 +1,13 @@
+import { ButtonHTMLAttributes, FC } from 'react'
+import cx from 'classnames'
+import styles from './Button.module.css'
+
+type Props = ButtonHTMLAttributes<HTMLButtonElement>
+
+export const Button: FC<Props> = ({ className, children, ...rest }) => {
+  return (
+    <button className={cx(styles.root, className)} {...rest}>
+      {children}
+    </button>
+  )
+}