Fix/setting buttons unclickable area (#379)

* Move "onClick" handler to "ListItemButton" - LibrarySettings "global update categories"

Clicks were only handled on the button content leading to a small area around the content to not handle the clicks, thus, not opening the dialog

* Move "onClick" handler to "ListItemButton" - Settings "manga item width"

Clicks were only handled on the button content leading to a small area around the content to not handle the clicks, thus, not opening the dialog

src/screens/Settings.tsx

@@ -139,17 +139,15 @@ export default function Settings() {
                     </ListItemSecondaryAction>
                 </ListItem>
                 <SearchSettings />
-                <ListItemButton>
+                <ListItemButton
+                    onClick={() => {
+                        handleDialogOpenItemWidth();
+                    }}
+                >
                     <ListItemIcon>
                         <ViewModuleIcon />
                     </ListItemIcon>
-                    <ListItemText
+                    <ListItemText primary={t('settings.label.manga_item_width')} secondary={`px:${ItemWidth}`} />
-                        primary={t('settings.label.manga_item_width')}
-                        secondary={`px:${ItemWidth}`}
-                        onClick={() => {
-                            handleDialogOpenItemWidth();
-                        }}
-                    />
                 </ListItemButton>
                 <ListItem>
                     <ListItemIcon>

src/screens/settings/LibrarySettings.tsx

@@ -145,7 +145,7 @@ export default function LibrarySettings() {
                     </ListSubheader>
                 }
             >
-                <ListItemButton>
+                <ListItemButton onClick={() => setIsDialogOpen(true)}>
                     <ListItemText
                         primary={t('category.title.categories')}
                         secondary={
@@ -163,7 +163,6 @@ export default function LibrarySettings() {
                             </>
                         }
                         secondaryTypographyProps={{ style: { display: 'flex', flexDirection: 'column' } }}
-                        onClick={() => setIsDialogOpen(true)}
                     />
                 </ListItemButton>
             </List>