Suzangithub

## Applied Visual Design: Adjust the Color of Various Elements to Complementary Colors
<style>
  body {
    background-color: white;
  }
  header {
    background-color: #09A7A1;
    color: white;
    padding: 0.25em;
  }
  h2 {

## Applied Visual Design: Push Elements Left or Right with the float Property
<head>
  <style>
  #left {
    float: left;
    width: 50%;
  }
  #right {
    float: right;
    width: 40%;
  }

## Applied Visual Design: Use the text-transform Property to Make Text Uppercase
<style>
  h4 {
    text-align: center;
    background-color: rgba(45, 45, 45, 0.1);
    padding: 10px;
    font-size: 27px;

  }
  p {
    text-align: justify;

## Applied Visual Design: Adjust the background-color Property of Text
<style>
  h4 {
    text-align: center;
    background-color: rgba(45, 45, 45, 0.1);
    padding: 10px;
  }
  p {
    text-align: justify;
  }
  .links {

## Applied Visual Design: Create Visual Balance Using the text-align Property
<style>
  h4 {text-align: center;

  }
  p {text-align: justify;

  }
  .links {
    margin-right: 20px;


## React: Review Using Props with Stateless Functional Components
class CampSite extends React.Component {
  constructor(props) {
    super(props);
  }
  render() {
    return (
      <div>
        <Camper/>
      </div>
    );

## React: Access Props Using this.props
class ReturnTempPassword extends React.Component {
  constructor(props) {
    super(props);

  }
  render() {
    return (
        <div>
            { /* change code below this line */ }


## React: Use PropTypes to Define the Props You Expect
const Items = (props) => {
  return <h1>Current Quantity of Items in Cart: {props.quantity}</h1>
};

// change code below this line

Items.propTypes =
  {quantity: PropTypes.number.isRequired}
;

## React: Override Default Props
const Items = (props) => {
  return <h1>Current Quantity of Items in Cart: {props.quantity}</h1>
}

Items.defaultProps = {
  quantity: 0
}

class ShoppingCart extends React.Component {
  constructor(props) {

## React: Use Default Props
const ShoppingCart = (props) => {
  return (
    <div>
      <h1>Shopping Cart Component</h1>
    </div>
  )
};
// change code below this line

ShoppingCart.defaultProps = {
	<style>
	body {
	background-color: white;
	}
	header {
	background-color: #09A7A1;
	color: white;
	padding: 0.25em;
	}
	h2 {
	<head>
	<style>
	#left {
	float: left;
	width: 50%;
	}
	#right {
	float: right;
	width: 40%;
	}
	<style>
	h4 {
	text-align: center;
	background-color: rgba(45, 45, 45, 0.1);
	padding: 10px;
	font-size: 27px;

	}
	p {
	text-align: justify;
	<style>
	h4 {text-align: center;

	}
	p {text-align: justify;

	}
	.links {
	margin-right: 20px;
	class CampSite extends React.Component {
	constructor(props) {
	super(props);
	}
	render() {
	return (
	<div>
	<Camper/>
	</div>
	);
	class ReturnTempPassword extends React.Component {
	constructor(props) {
	super(props);

	}
	render() {
	return (
	<div>
	{ /* change code below this line */ }
	const Items = (props) => {
	return <h1>Current Quantity of Items in Cart: {props.quantity}</h1>
	};

	// change code below this line

	Items.propTypes =
	{quantity: PropTypes.number.isRequired}
	;
	const Items = (props) => {
	return <h1>Current Quantity of Items in Cart: {props.quantity}</h1>
	}

	Items.defaultProps = {
	quantity: 0
	}

	class ShoppingCart extends React.Component {
	constructor(props) {
	const ShoppingCart = (props) => {
	return (
	<div>
	<h1>Shopping Cart Component</h1>
	</div>
	)
	};
	// change code below this line

	ShoppingCart.defaultProps = {