button formatting

interface/src/app/main/Scheduler.tsx

@@ -296,7 +296,12 @@ const Scheduler = () => {
                   <Cell stiff>
                     <CircleIcon
                       color={si.active ? 'success' : 'error'}
-                      sx={{ fontSize: ICON_SIZE, verticalAlign: 'middle' }}
+                      sx={{
+                        fontSize: ICON_SIZE,
+                        ml: '4px',
+                        position: 'relative',
+                        top: '2px'
+                      }}
                     />
                   </Cell>
                   <Cell stiff>

interface/src/app/main/SchedulerDialog.tsx

@@ -2,6 +2,7 @@ import { useEffect, useState } from 'react';
 
 import AddIcon from '@mui/icons-material/Add';
 import CancelIcon from '@mui/icons-material/Cancel';
+import CircleIcon from '@mui/icons-material/Circle';
 import DoneIcon from '@mui/icons-material/Done';
 import RemoveIcon from '@mui/icons-material/RemoveCircleOutlined';
 import {
@@ -273,7 +274,15 @@ const SchedulerDialog = ({
             }
             label={LL.ACTIVE()}
           />
+          <CircleIcon
+            color={editItem.active ? 'success' : 'error'}
+            sx={{
+              fontSize: 16,
+              mt: '12px'
+            }}
+          />
         </Grid>
+
         <Grid container>
           {needsTimeField ? (
             <>