prep for testing by users

src/components/CourseCard.tsx

@@ -1,11 +1,10 @@
-import React, { useState, useContext, useEffect } from 'react';
+import React, { useState, useContext } from 'react';
 import Collapse from '@material-ui/core/Collapse';
 import { ReactComponent as Expand } from '../assets/expand.svg';
 import { Course, Group, GroupType } from '../types/index';
 import { coursesContext } from '../contexts/CoursesProvider';
 import styled, { css } from 'styled-components';
 import { makeStyles } from '@material-ui/core/styles';
-import { ReactComponent as Bin } from '../assets/bin.svg';
 import DeleteIcon from '@material-ui/icons/Delete';
 import { useMemo } from 'react';
 

src/components/Dropdown.tsx

@@ -34,7 +34,7 @@ const CourseContainer = styled.div`
   background-color: #f2f4f7;
   font-size: 16px;
   font-weight: 500;
-  /* scroll-snap-align: end; */
+  scroll-snap-align: end;
   :hover {
     background-color: #eceef4;
     cursor: pointer;

src/components/SchedulerRow.tsx

@@ -1,11 +1,10 @@
-import React, { Fragment, MouseEvent, useState, useEffect, useRef, useContext, useMemo } from 'react';
+import React, { Fragment, MouseEvent, useState, useEffect,  useContext } from 'react';
 import { GroupType, SchedulerEvent } from '../types';
 import styled, { css } from 'styled-components/macro';
 import Popover from '@material-ui/core/Popover';
 import { makeStyles, createStyles, Theme } from '@material-ui/core/styles';
 import { MONDAY_TO_FRIDAY } from '../constants';
 import { coursesContext } from '../contexts/CoursesProvider';
-import { ClickAwayListener, Popper } from '@material-ui/core';
 
 const useStyles = makeStyles((theme: Theme) =>
   createStyles({

src/components/Topbar.tsx

@@ -30,9 +30,8 @@ const LogoWrapper = styled.div`
 const Logo = styled.img`
   width: 70px;
   height: 70px;
-  @media only screen and (max-width: 670px) {
+  @media only screen and (max-width: 1533px) {
-    width: 60px;
+    flex: auto;
-    height: 60px;
   }
 `;
 
@@ -40,9 +39,13 @@ const Text = styled.div`
   margin-left: 10px;
   font-size: 1.4rem;
   user-select: none;
-  @media only screen and (max-width: 670px) {
+  @media only screen and (max-width: 1533px) {
     display: none;
   }
+  @media only screen and (max-width: 1828px) {
+    margin-right: 10px;
+    text-align: center;
+  }
 `;
 
 const FlexboxColumn = styled.div`
@@ -52,12 +55,13 @@ const FlexboxColumn = styled.div`
 `;
 
 const InputWrapper = styled.div`
-  width: 95%;
+  width: 100%;
   display: flex;
   margin-top: 15px;
   max-height: 40px;
   background-color: #f2f4f7;
-  border-radius: 0 6px 6px 0;
+  border-radius: 6px 6px 6px 6px;
+  padding-left: 6px;
   &:hover {
     background-color: #ffffff;
   }
@@ -66,28 +70,6 @@ const InputWrapper = styled.div`
   }
 `;
 
-const SelectSearch = styled.select`
-  display: flex;
-  background-color: #f2f4f7;
-  margin-left: 5px;
-  outline: none;
-  border-style: none;
-  align-items: center;
-  &:hover ~ input {
-    background-color: #ffffff;
-  }
-`;
-
-const SelectOption = styled.option`
-  background-color: #f2f4f7;
-  outline: none;
-  border-style: none;
-  align-items: center;
-  &:hover ~ input {
-    background-color: #ffffff;
-  }
-`;
-
 const Input = styled.input`
   font-family: 'Roboto', sans-serif;
   font-size: 18px;
@@ -146,7 +128,6 @@ export default function ({ handleTransfer }: TopbarProps) {
   const [anchorEl, setAnchorEl] = useState<HTMLImageElement | null>(null);
   const [open, setOpen] = useState(false);
   const [input, setInput] = useState('');
-  const [value, setValue] = useState('przedmiot');
 
   const onLangChange = () => setIsPolish(!isPolish);
 
@@ -162,8 +143,6 @@ export default function ({ handleTransfer }: TopbarProps) {
 
   const handleCloseDropdown = () => setOpen(false);
 
-  const Change = (e: any) => setValue(e.target.value);
-
   useEffect(() => {
     if (clearInput) {
       setInput('');
@@ -180,7 +159,7 @@ export default function ({ handleTransfer }: TopbarProps) {
       <FlexboxColumn>
         <ClickAwayListener onClickAway={handleCloseDropdown}>
           <Flexbox>
-            <SelectMenu />
+            {/* <SelectMenu /> */}
 
             <InputWrapper>
               {/* <SelectSearch value={value} onChange={Change}>