poprawkiv2
This commit is contained in:
parent
cbc7c6fcfa
commit
a08345b756
@ -8,7 +8,6 @@ import RightBar from "./components/RightBar";
|
||||
|
||||
function App() {
|
||||
const [isOpenTransfer, setOpenTransfer] = useState(false);
|
||||
const [isPolish, setLanguage] = useState(true);
|
||||
const [text, setText] = useState("");
|
||||
|
||||
return (
|
||||
@ -20,11 +19,9 @@ function App() {
|
||||
handleTransfer={(e) => {
|
||||
setOpenTransfer(!isOpenTransfer);
|
||||
}}
|
||||
handleLanguage={(e) => {
|
||||
setLanguage(!isPolish);
|
||||
onLangChange={(e) => {
|
||||
console.log(e);
|
||||
}}
|
||||
isOpenTransfer={isOpenTransfer}
|
||||
isPolish={isPolish}
|
||||
/>
|
||||
<Transfer
|
||||
isOpen={isOpenTransfer}
|
||||
|
@ -12,16 +12,14 @@ import MenuItem from "@material-ui/core/MenuItem";
|
||||
|
||||
interface TopBarProps {
|
||||
handleTransfer: (e: React.MouseEvent) => void;
|
||||
handleLanguage: (e: React.MouseEvent) => void;
|
||||
onLangChange: (lang:boolean) => void;
|
||||
textChangeHandler: (e: React.ChangeEvent<HTMLInputElement>) => void;
|
||||
isOpenTransfer: boolean;
|
||||
isPolish: boolean;
|
||||
|
||||
}
|
||||
|
||||
interface TopBarState {
|
||||
isOpenProfile: boolean;
|
||||
anchorEl: null | HTMLElement;
|
||||
isPolish: boolean;
|
||||
}
|
||||
|
||||
export default class TopBar extends React.Component<TopBarProps, TopBarState> {
|
||||
@ -29,11 +27,12 @@ export default class TopBar extends React.Component<TopBarProps, TopBarState> {
|
||||
super(props);
|
||||
this.handleProfile = this.handleProfile.bind(this);
|
||||
this.handleClose = this.handleClose.bind(this);
|
||||
this.handleLanguage = this.handleLanguage.bind(this);
|
||||
this.onLangChange = this.onLangChange.bind(this);
|
||||
this.handleTransfer = this.handleTransfer.bind(this);
|
||||
this.state = {
|
||||
isOpenProfile: false,
|
||||
anchorEl:null,
|
||||
isPolish:true,
|
||||
};
|
||||
}
|
||||
|
||||
@ -45,8 +44,11 @@ export default class TopBar extends React.Component<TopBarProps, TopBarState> {
|
||||
this.props.handleTransfer(e);
|
||||
}
|
||||
|
||||
handleLanguage(e: React.MouseEvent) {
|
||||
this.props.handleLanguage(e);
|
||||
onLangChange(e: React.MouseEvent) {
|
||||
this.setState({
|
||||
isPolish:!this.state.isPolish,
|
||||
})
|
||||
this.props.onLangChange(this.state.isPolish);
|
||||
}
|
||||
|
||||
handleProfile(e: React.MouseEvent) {
|
||||
@ -95,8 +97,8 @@ export default class TopBar extends React.Component<TopBarProps, TopBarState> {
|
||||
<img
|
||||
className="top-bar__icon"
|
||||
alt="change_language"
|
||||
src={this.props.isPolish ? UK : PL}
|
||||
onClick={this.handleLanguage}
|
||||
src={this.state.isPolish ? UK : PL}
|
||||
onClick={this.onLangChange}
|
||||
/>
|
||||
<img
|
||||
className="top-bar__icon"
|
||||
|
@ -1,16 +1,38 @@
|
||||
.wrapper{
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
text-align: center;
|
||||
align-items: center;
|
||||
height: 80vh;
|
||||
.wrapper {
|
||||
display: flex;
|
||||
|
||||
justify-content: center;
|
||||
text-align: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.transfer{
|
||||
display: flex;
|
||||
width: 80%;
|
||||
height: 70%;
|
||||
background-color: purple;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.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;
|
||||
&__text {
|
||||
font-family: Lato;
|
||||
font-size: 50px;
|
||||
}
|
||||
&__input{
|
||||
width: 300px;
|
||||
height: 45px;
|
||||
background: #D7A700;
|
||||
}
|
||||
&__give{
|
||||
flex-grow: 1;
|
||||
}
|
||||
&__recieve{
|
||||
flex-grow: 1;
|
||||
}
|
||||
&__proposition{
|
||||
flex-grow: 4;
|
||||
}
|
||||
&__add{
|
||||
}
|
||||
}
|
||||
|
@ -34,9 +34,16 @@ export default class Transfer extends React.Component<
|
||||
aria-describedby="simple-modal-description"
|
||||
>
|
||||
<div className="transfer">
|
||||
<button type="button" onClick={this.handleClose}>
|
||||
Close Modal
|
||||
</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 className="transfer__proposition"></div>
|
||||
<button className="transfer__add">chuj</button>
|
||||
</div>
|
||||
</Modal>
|
||||
</div>
|
||||
|
Loading…
Reference in New Issue
Block a user