changed rightbar styles

This commit is contained in:
Maciek Głowacki 2020-11-25 04:10:03 +01:00
parent 578618cdd7
commit 42fb405033
5 changed files with 27 additions and 19 deletions

View File

@ -4,6 +4,7 @@
"private": true, "private": true,
"dependencies": { "dependencies": {
"@material-ui/core": "^4.10.0", "@material-ui/core": "^4.10.0",
"@material-ui/icons": "^4.9.1",
"@material-ui/lab": "^4.0.0-alpha.56", "@material-ui/lab": "^4.0.0-alpha.56",
"axios": "^0.19.2", "axios": "^0.19.2",
"notistack": "^1.0.1", "notistack": "^1.0.1",

View File

@ -6,12 +6,13 @@ import { coursesContext } from '../contexts/CoursesProvider';
import styled from 'styled-components'; import styled from 'styled-components';
import { makeStyles } from '@material-ui/core/styles'; import { makeStyles } from '@material-ui/core/styles';
import { ReactComponent as Bin } from '../assets/bin.svg'; import { ReactComponent as Bin } from '../assets/bin.svg';
import DeleteIcon from '@material-ui/icons/Delete';
const CourseCardWrapper = styled.div` const CourseCardWrapper = styled.div`
position: relative; position: relative;
display: flex; display: flex;
min-height: 40px; min-height: 40px;
background-color: rgb(100, 181, 246); background-color: rgb(166, 226, 208);
align-items: center; align-items: center;
justify-content: center; justify-content: center;
flex-direction: column; flex-direction: column;
@ -23,17 +24,17 @@ const CourseCardWrapper = styled.div`
`; `;
const TitleWrapper = styled.div` const TitleWrapper = styled.div`
font-size: 14px;
font-weight: 550;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
padding: 10px; padding: 10px 10px 10px 2px;
`; `;
const BinIcon = styled(Bin)` const BinIcon = styled(DeleteIcon)`
width: 20px; max-width: 30px;
height: 20px; min-width: 30px;
max-width: 20px;
min-width: 20px;
cursor: pointer; cursor: pointer;
&:hover { &:hover {
fill: white; fill: white;
@ -57,7 +58,7 @@ const ClassGroupStyled = styled.div`
} }
:last-child { :last-child {
border-radius: 0 0 10px 10px; border-radius: 0 0 10px 10px;
} }
`; `;
interface ExpandIconProps { interface ExpandIconProps {
@ -84,14 +85,14 @@ const TypeClass = styled.div`
left: 5px; left: 5px;
color: white; color: white;
`; `;
const useStyles = makeStyles({ const useStyles = makeStyles({
expanded: { expanded: {
maxHeight: '244px', maxHeight: '244px',
overflowY: 'auto', overflowY: 'auto',
'&::-webkit-scrollbar': { '&::-webkit-scrollbar': {
width: '0.3em', width: '0.3em',
borderStyle:'none', borderStyle: 'none',
}, },
'&::-webkit-scrollbar-track': { '&::-webkit-scrollbar-track': {
borderRadius: '10px', borderRadius: '10px',

View File

@ -10,14 +10,14 @@ const RightbarStyled = styled.div`
padding-right: 15px; padding-right: 15px;
text-align: center; text-align: center;
height: 100%; height: 100%;
width: 300px; width: 350px;
overflow-y: scroll; overflow-y: scroll;
::-webkit-scrollbar-track { ::-webkit-scrollbar-track {
border-radius: 10px; border-radius: 10px;
} }
::-webkit-scrollbar { ::-webkit-scrollbar {
width: 5px; width: 5px;
border-style:none; border-style: none;
} }
::-webkit-scrollbar-thumb { ::-webkit-scrollbar-thumb {
border-radius: 10px; border-radius: 10px;
@ -32,7 +32,7 @@ const SaveButton = styled.div`
justify-content: center; justify-content: center;
align-items: center; align-items: center;
user-select: none; user-select: none;
background-color: #417cab; background-color: #244a7c;
border-radius: 10px; border-radius: 10px;
cursor: pointer; cursor: pointer;
height: 40px; height: 40px;

View File

@ -107,7 +107,7 @@ export const Scheduler = () => {
{value} {value}
</TableCell> </TableCell>
) : indexRow === 23 ? ( ) : indexRow === 23 ? (
<TableCell style={{ borderBottom: '2px soli rgb(242, 243, 245)' }} key={`${indexRow}${indexCell}`}> <TableCell style={{ borderBottom: '2px solid rgb(242, 243, 245)' }} key={`${indexRow}${indexCell}`}>
{value} {value}
</TableCell> </TableCell>
) : indexRow === 5 ? ( ) : indexRow === 5 ? (

View File

@ -1476,6 +1476,13 @@
react-is "^16.8.0" react-is "^16.8.0"
react-transition-group "^4.4.0" react-transition-group "^4.4.0"
"@material-ui/icons@^4.9.1":
version "4.9.1"
resolved "https://registry.yarnpkg.com/@material-ui/icons/-/icons-4.9.1.tgz#fdeadf8cb3d89208945b33dbc50c7c616d0bd665"
integrity sha512-GBitL3oBWO0hzBhvA9KxqcowRUsA0qzwKkURyC8nppnC3fw54KPKZ+d4V1Eeg/UnDRSzDaI9nGCdel/eh9AQMg==
dependencies:
"@babel/runtime" "^7.4.4"
"@material-ui/lab@^4.0.0-alpha.56": "@material-ui/lab@^4.0.0-alpha.56":
version "4.0.0-alpha.56" version "4.0.0-alpha.56"
resolved "https://registry.yarnpkg.com/@material-ui/lab/-/lab-4.0.0-alpha.56.tgz#ff63080949b55b40625e056bbda05e130d216d34" resolved "https://registry.yarnpkg.com/@material-ui/lab/-/lab-4.0.0-alpha.56.tgz#ff63080949b55b40625e056bbda05e130d216d34"
@ -9407,14 +9414,13 @@ react-transition-group@^4.4.0:
loose-envify "^1.4.0" loose-envify "^1.4.0"
prop-types "^15.6.2" prop-types "^15.6.2"
react@^16.13.1: react@^17.0.1:
version "16.14.0" version "17.0.1"
resolved "https://registry.yarnpkg.com/react/-/react-16.14.0.tgz#94d776ddd0aaa37da3eda8fc5b6b18a4c9a3114d" resolved "https://registry.yarnpkg.com/react/-/react-17.0.1.tgz#6e0600416bd57574e3f86d92edba3d9008726127"
integrity sha512-0X2CImDkJGApiAlcf0ODKIneSwBPhqJawOa5wCtKbu7ZECrmS26NvtSILynQ66cgkT/RJ4LidJOc3bUESwmU8g== integrity sha512-lG9c9UuMHdcAexXtigOZLX8exLWkW0Ku29qPRU8uhF2R9BN96dLCt0psvzPLlHc5OWkgymP3qwTRgbnw5BKx3w==
dependencies: dependencies:
loose-envify "^1.1.0" loose-envify "^1.1.0"
object-assign "^4.1.1" object-assign "^4.1.1"
prop-types "^15.6.2"
read-pkg-up@^2.0.0: read-pkg-up@^2.0.0:
version "2.0.0" version "2.0.0"