rightbar and transfer

This commit is contained in:
wrzesinski-hubert 2020-06-09 20:07:54 +02:00
parent 69453aa2ce
commit 3fdb9f4e74
8 changed files with 99 additions and 46 deletions

View File

@ -2,6 +2,9 @@ body {
margin: 0px;
padding: 0px;
}
body::-webkit-scrollbar {
display: none;
}
.wraper{
display: flex;
&__rightbar{

View File

@ -114,7 +114,7 @@ export default class Calendar extends React.PureComponent<
startDayHour={8}
endDayHour={20}
excludedDays={[0, 6]}
cellDuration={60}
cellDuration={45}
dayScaleCellComponent={DayScaleCell}
timeTableLayoutComponent={TimeTableLayout}
timeTableCellComponent={TimeTableCell}

View File

@ -0,0 +1,13 @@
.paper {
display: flex;
min-height: 50px;
background-color: rgb(100, 181, 246) !important;
align-items: center;
justify-content: center;
flex-direction: column;
margin-top: 10px;
padding:10px;
border-radius: 10px;
width: 90%;
cursor: pointer;
}

View File

@ -0,0 +1,42 @@
import React from "react";
import "./index.scss";
import Collapse from '@material-ui/core/Collapse';
interface ClassProps {
name:string;
}
interface ClassState {
open: boolean;
}
export default class Class extends React.Component<ClassProps, ClassState> {
constructor(props: ClassProps) {
super(props);
this.Open = this.Open.bind(this);
this.state={
open:false,
};
}
Open(e: React.MouseEvent) {
this.setState({
open:!this.state.open
});
}
render() {
return (
<div className="paper" onClick={this.Open}>{this.props.name}
<Collapse in={this.state.open} timeout="auto" unmountOnExit>
<p>1CB Pn 10.00 A0-1<br></br> dr inż. Michał Ren</p>
<p>1CB Pn 10.00 A0-1<br></br> dr inż. Michał Ren</p>
<p>1CB Pn 10.00 A0-1<br></br> dr inż. Michał Ren</p>
<p>1CB Pn 10.00 A0-1<br></br> dr inż. Michał Ren</p>
</Collapse></div>
);
}
}

View File

@ -8,15 +8,6 @@
text-align: center;
font-family: Lato;
}
.paper {
display: flex;
margin-top: 10px;
height: 60px;
width: 90%;
background-color: #d4a8ff !important;
align-items: center;
justify-content: center;
}
.text {
border-bottom: 1px solid;
}

View File

@ -1,6 +1,7 @@
import React from "react";
import "./index.scss";
import Paper from "@material-ui/core/Paper";
import Class from "../Class";
interface RightBarProps {}
interface RightBarState {}
@ -9,7 +10,6 @@ export default class RightBar extends React.Component<
RightBarProps,
RightBarState
> {
render() {
return (
<div className="shop-cart">
@ -17,16 +17,14 @@ export default class RightBar extends React.Component<
Hubert Wrzesiński<br></br>
Semestr zimowy 2020/2021
</div>
<Paper className="paper">1</Paper>
<Paper className="paper">2</Paper>
<Paper className="paper">3</Paper>
<Paper className="paper">4</Paper>
<Paper className="paper">5</Paper>
<Paper className="paper">6</Paper>
<Paper className="paper">7</Paper>
<Paper className="paper">8</Paper>
<Paper className="paper">9</Paper>
<Paper className="paper">10</Paper>
<Class name="E-gospodarka - narzędzia i bezpieczeństwo" />
<Class name="Algorytmy grafowe" />
<Class name="E-gospodarka - narzędzia i bezpieczeństwo" />
<Class name="Algorytmy grafowe" />
<Class name="E-gospodarka - narzędzia i bezpieczeństwo" />
<Class name="Algorytmy grafowe" />
<Class name="E-gospodarka - narzędzia i bezpieczeństwo" />
<Class name="Algorytmy grafowe" />
</div>
);
}

View File

@ -1,6 +1,5 @@
.wrapper {
display: flex;
justify-content: center;
text-align: center;
align-items: center;
@ -8,31 +7,34 @@
.transfer {
display: flex;
flex-wrap: wrap;
width: 80%;
height: 70%;
padding-top: 40px;
background: rgba(255, 220, 97, 0.48);
border: 1px solid #000000;
justify-content: center;
&__left {
display: flex;
justify-content: space-around;
flex-grow: 1;
}
&__right {
flex-grow: 4;
}
&__text {
font-family: Lato;
font-size: 50px;
}
&__input{
&__input {
width: 300px;
height: 45px;
background: #D7A700;
height: 45px;
background: #d7a700;
}
&__give{
flex-grow: 1;
&__give {
}
&__recieve {
}
&__proposition {
}
&__add {
}
&__recieve{
flex-grow: 1;
}
&__proposition{
flex-grow: 4;
}
&__add{
}
}

View File

@ -34,16 +34,20 @@ export default class Transfer extends React.Component<
aria-describedby="simple-modal-description"
>
<div className="transfer">
<div className="transfer__give">
<div className="transfer__text">Oddam</div>
<input className="transfer__input"></input>
<div className="transfer__left">
{/* <button className="transfer__add">chuj</button> */}
<div className="transfer__give">
<div className="transfer__text">Oddam</div>
<input className="transfer__input"></input>
</div>
<div className="transfer__receive">
<div className="transfer__text">Przyjmę</div>
<input className="transfer__input"></input>
</div>
</div>
<div className="transfer__receive">
<div className="transfer__text">Przyjmę</div>
<input className="transfer__input"></input>
<div className="transfer__right">
<div className="transfer__proposition"></div>
</div>
<div className="transfer__proposition"></div>
<button className="transfer__add">chuj</button>
</div>
</Modal>
</div>