feat: add new server log page

new-lamassu-admin/src/components/inputs/Switch.js

@@ -0,0 +1,73 @@
+import React, { memo } from 'react'
+import { makeStyles } from '@material-ui/core/styles'
+import Switch from '@material-ui/core/Switch'
+
+import { secondaryColor, offColor, disabledColor, disabledColor2 } from '../../styling/variables'
+
+const useStyles = makeStyles(theme => ({
+  root: {
+    width: 32,
+    height: 20,
+    padding: 0,
+    margin: theme.spacing(1)
+  },
+  switchBase: {
+    padding: 2,
+    '&$disabled': {
+      color: disabledColor2,
+      '& + $track': {
+        backgroundColor: disabledColor,
+        opacity: 1
+      }
+    },
+    '&$checked': {
+      color: theme.palette.common.white,
+      '& + $track': {
+        backgroundColor: secondaryColor,
+        opacity: 1,
+        border: 'none'
+      }
+    },
+    '&$focusVisible $thumb': {
+      border: '6px solid #fff'
+    }
+  },
+  thumb: {
+    width: 16,
+    height: 16
+  },
+  track: {
+    borderRadius: 17,
+    border: 'none',
+    backgroundColor: offColor,
+    opacity: 1,
+    transition: theme.transitions.create(['background-color', 'border'])
+  },
+  disabled: {
+  },
+  checked: {
+  },
+  focusVisible: {
+  }
+}))
+
+const SwitchInput = memo(({ ...props }) => {
+  const classes = useStyles()
+  return (
+    <Switch
+      focusVisibleClassName={classes.focusVisible}
+      disableRipple
+      classes={{
+        root: classes.root,
+        switchBase: classes.switchBase,
+        thumb: classes.thumb,
+        track: classes.track,
+        checked: classes.checked,
+        disabled: classes.disabled
+      }}
+      {...props}
+    />
+  )
+})
+
+export default SwitchInput