#1659 can tab through delete and add

Author: msereeyothin

src/frontend/src/pages/FinancePage/ReimbursementRequestForm/ReimbursementProductTable.tsx

@@ -144,15 +144,27 @@ const ReimbursementProductTable: React.FC<ReimbursementProductTableProps> = ({
                               {errors.reimbursementProducts?.[product.index]?.cost?.message}
                             </FormHelperText>
                           </FormControl>
-                          <IconButton onClick={() => removeProduct(product.index)}>
+                          <IconButton
+                            sx={{
+                              '&:focus': {
+                                backgroundColor: '#f5f5f5'
+                              }
+                            }}
+                            onClick={() => removeProduct(product.index)}
+                          >
                             <Delete />
                           </IconButton>
                         </Box>
                       </ListItem>
                     ))}
                   </Box>
                   <Button
-                    sx={{ margin: '4px' }}
+                    sx={{
+                      margin: '4px',
+                      '&:focus': {
+                        backgroundColor: '#fdf8f8'
+                      }
+                    }}
                     startIcon={<Add />}
                     onClick={() =>
                       appendProduct({