{"size": 780, "ext": "js", "max_stars_repo_path": "src/scenes/InstructionsScene.js", "max_stars_repo_name": "rico-rico-hoy/frutinder", "max_stars_repo_stars_event_min_datetime": "2019-04-28T08:17:31.000Z", "max_stars_repo_stars_event_max_datetime": "2019-12-11T21:36:01.000Z", "max_issues_repo_path": "src/scenes/InstructionsScene.js", "max_issues_repo_name": "rico-rico-hoy/frutinder", "max_issues_repo_issues_event_min_datetime": "2019-04-29T11:59:40.000Z", "max_issues_repo_issues_event_max_datetime": "2020-04-02T11:12:24.000Z", "max_forks_repo_path": "src/scenes/InstructionsScene.js", "max_forks_repo_name": "rico-rico-hoy/frutinder", "max_forks_repo_forks_event_min_datetime": null, "max_forks_repo_forks_event_max_datetime": null}
{"max_stars_count": 4, "max_issues_count": 10, "max_forks_count": null, "avg_line_length": 30.0, "max_line_length": 126, "alphanum_fraction": 0.6846153846}
import React from "react";
import styled from "styled-components";

import MenuContainer from "../components/MenuContainer";
import PrimaryButton from "../components/PrimaryButton";

const StartGameButton = styled(PrimaryButton)``;

export default ({ onStart }) => (
  <MenuContainer>
    <h2>
      ¿Cómo se juega?
    </h2>
    <p>
      Irás viendo tarjetas con una imagen y el nombre de una fruta o verdura.
    </p>
    <p>
      Arrastra la tarjeta a la <strong>derecha</strong> si piensas que esa fruta o verdura <strong>está de temporada</strong>.
    </p>
    <p>
      Arrastra la tarjeta a la <strong>izquierda</strong> si piensas que <strong>no está de temporada</strong>.
    </p>
    <StartGameButton onClick={onStart}>Empezar</StartGameButton>
  </MenuContainer>
)
