diff --git a/src/components/ItemTableFilter/ItemTableFilter.js b/src/components/ItemTableFilter/ItemTableFilter.js
index f17101b..7dfcfa9 100644
--- a/src/components/ItemTableFilter/ItemTableFilter.js
+++ b/src/components/ItemTableFilter/ItemTableFilter.js
@@ -1,12 +1,15 @@
import React from 'react';
import PropTypes from 'prop-types';
-import { Box, FormControl, InputLabel, makeStyles, OutlinedInput,} from "@material-ui/core";
+import { Box, FormControl, InputLabel, makeStyles, OutlinedInput, Paper } from "@material-ui/core";
export default function ItemTableFilter({ label, onChange }) {
const useStyles = makeStyles({
filterContainer: {
overflowX: "hidden"
},
+ paperStyles: {
+ overflow: "hidden"
+ }
});
const classes = useStyles();
@@ -15,19 +18,21 @@ export default function ItemTableFilter({ label, onChange }) {
// See: https://github.itap.purdue.edu/ECN/webqueue2/issues/156
return (
-
- {label}
-
-
+
+
+ {label}
+
+
+
);
};
diff --git a/src/components/QueueSelector/QueueSelector.js b/src/components/QueueSelector/QueueSelector.js
index e39fb87..072471d 100644
--- a/src/components/QueueSelector/QueueSelector.js
+++ b/src/components/QueueSelector/QueueSelector.js
@@ -1,6 +1,6 @@
import React, { useState, useEffect } from "react";
import PropTypes from "prop-types";
-import { TextField, Checkbox, InputAdornment, Box, useTheme } from "@material-ui/core";
+import { TextField, Checkbox, InputAdornment, useTheme, Paper, makeStyles } from "@material-ui/core";
import { Autocomplete } from "@material-ui/lab";
import CheckBoxOutlineBlankIcon from '@material-ui/icons/CheckBoxOutlineBlank';
import CheckBoxIcon from '@material-ui/icons/CheckBox';
@@ -17,14 +17,14 @@ const getQueueCounts = async (access_token) => {
if (access_token === null){
return undefined
}
-
+
let myHeaders = new Headers();
myHeaders.append("Authorization", `Bearer ${access_token}`);
let requestOptions = { headers: myHeaders };
const apiResponse = await fetch(`${process.env.PUBLIC_URL}/api/data/get_queues`, requestOptions);
const queueCountJson = await apiResponse.json();
-
+
return queueCountJson;
};
@@ -38,6 +38,12 @@ export default function QueueSelector({ open, setOpen, value, setValue }) {
const activeQueues = cookies['active-queues'] !== undefined ? cookies['active-queues'].split(',') : [];
const theme = useTheme();
+ const useStyles = makeStyles({
+ Paper_root: {
+ margin: theme.spacing(1)
+ }
+ });
+ const classes = useStyles();
// Prepopulate Active Queues from Cookies
useEffect( _ => {
@@ -86,7 +92,7 @@ export default function QueueSelector({ open, setOpen, value, setValue }) {
// Set active-queues cookie to csv of selected queue names
const activeQueueOptions = {
- path: "/",
+ path: "/",
expires: (_ => {
let expiration_date = new Date();
expiration_date.setDate(expiration_date.getDate() + 365);
@@ -112,8 +118,8 @@ export default function QueueSelector({ open, setOpen, value, setValue }) {
);
return(
- // Box is used for margin because Autocomplete CSS overrides don't work as expected.
-
+ // Paper is used for margin because Autocomplete CSS overrides don't work as expected.
+
(
- Active Queues:
+ Active Queues:
{params.InputProps.startAdornment}
>
@@ -160,7 +166,7 @@ export default function QueueSelector({ open, setOpen, value, setValue }) {
multiple
autoHighlight
/>
-
+
);
};