changed rightbar styles
This commit is contained in:
parent
578618cdd7
commit
42fb405033
@ -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",
|
||||||
|
@ -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',
|
||||||
|
@ -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;
|
||||||
|
@ -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 ? (
|
||||||
|
16
yarn.lock
16
yarn.lock
@ -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"
|
||||||
|
Loading…
Reference in New Issue
Block a user