partial: last batch of components

new-lamassu-admin/src/components/buttons/FeatureButton.jsx

@@ -1,47 +1,19 @@
-import { makeStyles } from '@mui/styles'
 import classnames from 'classnames'
 import React, { memo } from 'react'
 
-import baseButtonStyles from './BaseButton.styles'
-
-const { baseButton, primary } = baseButtonStyles
-
-const styles = {
-  featureButton: {
-    extend: baseButton,
-    width: baseButton.height,
-    borderRadius: baseButton.height / 2,
-    display: 'flex',
-    padding: 0
-  },
-  primary,
-  buttonIcon: {
-    margin: 'auto',
-    '& svg': {
-      width: 16,
-      height: 16,
-      overflow: 'visible',
-      '& g': {
-        strokeWidth: 1.8
-      }
-    }
-  },
-  buttonIconActive: {} // required to extend primary
-}
-
-const useStyles = makeStyles(styles)
+import classes from './FeatureButton.module.css'
 
 const FeatureButton = memo(
   ({ className, Icon, InverseIcon, children, ...props }) => {
-    const classes = useStyles()
-
-    const classNames = {
-      [classes.featureButton]: true,
-      [classes.primary]: true
-    }
-
     return (
-      <button className={classnames(classNames, className)} {...props}>
+      <button
+        className={classnames(
+          classes.baseButton,
+          classes.roundButton,
+          classes.primary,
+          className
+        )}
+        {...props}>
         {Icon && (
           <div className={classes.buttonIcon}>
             <Icon />