1 files changed, 11 insertions, 17 deletions

diff --git a/src/App.js b/src/App.js
index a02ad84..9983022 100644
--- a/src/App.js
+++ b/src/App.js
@@ -40,11 +40,10 @@ import AccountCircleIcon from '@material-ui/icons/AccountCircle';
 import StoreIcon from '@material-ui/icons/Store';
 import LibraryBooksIcon from '@material-ui/icons/LibraryBooks';
 import HelpOutlineIcon from '@material-ui/icons/HelpOutline';
-import Button from '@material-ui/core/Button';
 import NavigateNextIcon from '@material-ui/icons/NavigateNext';
 import NavigateBeforeIcon from '@material-ui/icons/NavigateBefore';
 import Grow from '@material-ui/core/Grow';
-import { CarouselProvider, Slider, Slide, ButtonBack, ButtonNext, DotGroup } from 'pure-react-carousel';
+import { CarouselProvider, Slider, Slide, ButtonBack, ButtonNext } from 'pure-react-carousel';
 import { useWindowDimensions } from './utils.js';
 import 'pure-react-carousel/dist/react-carousel.es.css';
 import 'fontsource-roboto';
@@ -60,6 +59,7 @@ const StyledBadge = withStyles((theme) => ({
 
 function StoreItemDetails(props) {
    const { t } = useTranslation();
+
    const classes = makeStyles((theme) => ({
    }))();
 
@@ -77,6 +77,7 @@ function StoreItemDetails(props) {
 
 function StoreItem(props) {
    const { t } = useTranslation();
+
    const classes = makeStyles((theme) => ({
       media: { height: 180,  position: 'relative' },
       cat: { position: 'absolute', bottom: 4, left: 4 },
@@ -152,9 +153,11 @@ function StoreItemSkeleton(props) {
 
 function StoreSeparator(props) {
    const { t } = useTranslation();
+
    const classes = makeStyles((theme) => ({
       root: { margin: 4 },
    }))();
+
    return (
       <div className={classes.root}>
          <Typography variant="h6">{t(props.title)}</Typography>
@@ -167,6 +170,7 @@ function StoreCarousel(props) {
    const { height, width } = useWindowDimensions();
    const cols = Math.floor(width / 240);
    const tw = (cols > 1 ? (cols * 240 > width - 18 ? 240 - 20 : 240) : '100%')
+
    const classes = makeStyles((theme) => ({
       root: { paddingLeft: cols > 1 ? 18 : 4, paddingRight: cols > 1 ? 18 : 4 },
       tile: { width: tw, marginRight: 'auto', marginLeft: 'auto' },
@@ -174,8 +178,10 @@ function StoreCarousel(props) {
       prev: { position: 'absolute', left: cols > 1 ? -15 : -4, top: '50%', backgroundColor: 'rgba(0, 0, 0, 0.5)', color: 'white' },
       next: { position: 'absolute', right: cols > 1 ? -15 : -4, top: '50%', backgroundColor: 'rgba(0, 0, 0, 0.5)', color: 'white' },
    }))();
+
    var skeletons = [];
    for (var i = 0; props.loading && i < cols; i += 1) skeletons.push({});
+
    return (
       <div className={classes.root}>
          <StoreSeparator title={props.name}/>
@@ -209,14 +215,17 @@ function StoreList(props) {
    const { height, width } = useWindowDimensions();
    const cols = Math.floor(width / 240);
    const tw = (cols > 1 ? (cols * 240 > width - 18 ? 240 - 20 : 240) : '100%')
+
    const classes = makeStyles((theme) => ({
       list: { justifyContent: 'space-evenly', maxWidth: '100%' },
       tile: { width: tw, marginRight: 'auto', marginLeft: 'auto' },
    }))();
+
    var extra = [];
    for (var i = 0; i < cols - (props.data.length % cols); i += 1) extra.push({key: i});
    var skeletons = [];
    for (var i2 = 0; props.loading && i2 < cols * (Math.floor(height / 240)) - cols * 2; i2 += 1) skeletons.push({key: i2});
+
    return (
       <div className={props.className} style={{ paddingLeft: cols > 1 ? 18 : 4, paddingRight: cols > 1 ? 18 : 4 }}>
          <StoreSeparator title={props.name}/>
@@ -414,24 +423,9 @@ export default function Main() {
       },
    }), [prefersDarkMode]);
 
-   const GlobalCss = withStyles({
-      '@global': {
-         '#keywords-popup': {
-            padding: 0,
-         },
-         '.KeywordList li': {
-            display: 'inline-block',
-            verticalAlign: 'top',
-            marginLeft: 4,
-            marginRight: 4,
-         },
-      }
-   })(() => null);
-
    return (
       <>
          <CssBaseline/>
-         <GlobalCss />
          <ThemeProvider theme={theme}>
             <StoreView/>
          </ThemeProvider>