component: add BurgerIngredient into Burger component
This commit is contained in:
parent
ffeb447dc1
commit
0d456766b0
31
src/components/Burger/Burger.css
Normal file
31
src/components/Burger/Burger.css
Normal file
@ -0,0 +1,31 @@
|
||||
.Burger {
|
||||
width: 100%;
|
||||
margin: auto;
|
||||
height: 250px;
|
||||
overflow: scroll;
|
||||
text-align: center;
|
||||
font-weight: bold;
|
||||
font-size: 1.2em;
|
||||
}
|
||||
|
||||
|
||||
@media (min-width: 400px) and (min-height: 400px) {
|
||||
.Burger {
|
||||
width: 350px;
|
||||
height: 300px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 500px) and (min-height: 401px) {
|
||||
.Burger {
|
||||
width: 450px;
|
||||
height: 400px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1000px) and (min-height: 700px) {
|
||||
.Burger {
|
||||
width: 700px;
|
||||
height: 600px;
|
||||
}
|
||||
}
|
17
src/components/Burger/Burger.js
Normal file
17
src/components/Burger/Burger.js
Normal file
@ -0,0 +1,17 @@
|
||||
import React from 'react'
|
||||
|
||||
import classes from './Burger.css';
|
||||
import BurgerIngredient from './BurgerIngredient/BurgerIngredient';
|
||||
|
||||
const burger = () => {
|
||||
return (
|
||||
<div className={classes.Burger}>
|
||||
<BurgerIngredient type="bread-top" />
|
||||
<BurgerIngredient type="meat" />
|
||||
<BurgerIngredient type="cheese" />
|
||||
<BurgerIngredient type="bread-bottom" />
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default burger;
|
@ -1,7 +1,7 @@
|
||||
import React, { Component } from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
|
||||
import classes from './burgerIngredient.css';
|
||||
import classes from './BurgerIngredient.css';
|
||||
|
||||
class BurgerIngredient extends Component {
|
||||
render() {
|
||||
@ -43,4 +43,4 @@ BurgerIngredient.PropTypes = {
|
||||
type: PropTypes.string.isRequired
|
||||
};
|
||||
|
||||
export default burgerIngredient;
|
||||
export default BurgerIngredient;
|
@ -1,17 +1,18 @@
|
||||
import React, { Component } from 'react';
|
||||
|
||||
import Aux from '../../hoc/Auxiliary';
|
||||
import Burger from '../../components/Burger/Burger';
|
||||
|
||||
class BurgerBuilder extends Component {
|
||||
|
||||
render() {
|
||||
return (
|
||||
<Aux>
|
||||
<div>Burger</div>
|
||||
<Burger />
|
||||
<div>Build Controls</div>
|
||||
</Aux>
|
||||
);
|
||||
}
|
||||
}
|
||||
};
|
||||
};
|
||||
|
||||
export default BurgerBuilder;
|
||||
|
Loading…
Reference in New Issue
Block a user