Fix #6 : Merge pull request #16 from mandy6720/fix-slider-on-small-sc…

…reen

Makes fixed stuff on top always have higher z-index

app/README.md

@@ -1,5 +1,10 @@
 This project was bootstrapped with [Create React App](https://github.com/facebook/create-react-app).
 
+## Installation
+
+From the root of the repo, run `cd app && npm install`.
+Once installation is finished, you can run the following commands to run your project locally. Note: if you don't have yarn installed globally, you can run `npm i -g yarn` to do a global install or add `npx` at the start of your commands, e.g. `npx yarn start`
+
 ## Available Scripts
 
 In the project directory, you can run:

app/src/Slider.jsx

@@ -13,7 +13,7 @@ import './Slider.scss';
 // Use special non-intrusive zIndex for the Slider tooltip
 const useStyles = makeStyles((theme) => ({
   popper: {
-    zIndex: 1,
+    zIndex: 1200
   },
   tooltip: {
     fontSize: '1rem',

app/src/Widget/List.jsx

@@ -41,7 +41,7 @@ const useStyles = (theme) => ({
   fixed: {
     position: 'sticky',
     top: 0,
-    zIndex: 1,
+    zIndex: 1200,
     padding: 0,
     // Not using it, adds a scrolling slider to the container on some screens
     paddingBottom: 1,