From 556d7086d102b2e8659dfe9de0290d6c5ddf7460 Mon Sep 17 00:00:00 2001
From: Aria Moradi <aria.moradi007@gmail.com>
Date: Mon, 15 Nov 2021 19:33:04 +0330
Subject: [PATCH] migrate LibraryOptions to Mui 5 (#83)

---
 src/components/library/LibraryOptions.tsx | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/src/components/library/LibraryOptions.tsx b/src/components/library/LibraryOptions.tsx
index 7bc1b00f..8d58bee2 100644
--- a/src/components/library/LibraryOptions.tsx
+++ b/src/components/library/LibraryOptions.tsx
@@ -11,16 +11,17 @@ import FilterListIcon from '@mui/icons-material/FilterList';
 import { Drawer, FormControlLabel, IconButton } from '@mui/material';
 import useLibraryOptions from 'util/useLibraryOptions';
 import ThreeStateCheckbox from 'components/util/ThreeStateCheckbox';
+import { Box } from '@mui/system';
 
 function Options() {
     const {
         downloaded, setDownloaded, unread, setUnread,
     } = useLibraryOptions();
     return (
-        <div style={{ display: 'flex', flexDirection: 'column' }}>
+        <Box sx={{ display: 'flex', flexDirection: 'column' }}>
             <FormControlLabel control={<ThreeStateCheckbox name="Unread" checked={unread} onChange={setUnread} />} label="Unread" />
             <FormControlLabel control={<ThreeStateCheckbox name="Downloaded" checked={downloaded} onChange={setDownloaded} />} label="Downloaded" />
-        </div>
+        </Box>
     );
 }