scratch-www/src/components/extension-landing/tip-box.jsx
Connor Hudson b604b19641 Refactor Extension Landing Pages (#2006)
* Add extension-landing generalized styles, install scratch link component

* Make EV3 page use generalized stuff

* Use OS_ENUM file instead of class variable

* use extension-landing/os-enum in os chooser

* Use extension-landing class in extension-landing.scss

* Use extension-landing styles and components on microbit page

* Add view-specific styles

* Move install scratch link l10n strings to src/l10n.json

* Start moving steps display to its own components

* Finish initial pass at Step, Steps components for extension landing pages

* Create ProjectCard component

* Use new components on InstallScratchLInk component

* Use new components on EV3 page

* allow className prop in Steps component

* Use new components on micro:bit landing page

* imageUrl -> imageSrc in ProjectCard

* Create ExtensionHeader component and use it on micro:bit and EV3 pages

* Fix a spacing issue in the InstallScratchLink component

* Add ExtensionRequirements component

* Use ExtensionRequirements component on landing pages

* Remove requirements l10n string for ev3 page

* Move project card styles out of things-to-try section

* Don't render the number row in a step if compact and number props are not set

* Add ExtensionSection component

* Use ExtensionSection on ev3 and microbit pages

* Move state configuration to ExtensionLanding class

* Move tip box, screenshot styles outside of specific section

* Add TipBox component and use it on the EV3 page

* Use hr element instead of section-separator div

* Remove refactor TODO comments :)
2018-08-21 15:13:49 -04:00

20 lines
449 B
JavaScript

const PropTypes = require('prop-types');
const React = require('react');
const FlexRow = require('../../components/flex-row/flex-row.jsx');
const TipBox = props => (
<div className="tip-box">
<h4>{props.title}</h4>
<FlexRow className="column tip-content">
{props.children}
</FlexRow>
</div>
);
TipBox.propTypes = {
children: PropTypes.node,
title: PropTypes.string
};
module.exports = TipBox;