trello-ize title banner h1,p styling

we need it to be different for the hoc banner, so make it need a class name in order to be styled correctly
This commit is contained in:
Matthew Taylor 2016-11-16 08:50:00 -05:00
parent e4231e9d57
commit fe70dd0f9e
9 changed files with 33 additions and 24 deletions

View file

@ -23,7 +23,9 @@ var InformationPage = React.createClass({
<div className="information-page">
<TitleBanner className="masthead">
<div className="inner">
<h1>{this.props.title}</h1>
<h1 className="title-banner-h1">
{this.props.title}
</h1>
</div>
</TitleBanner>
<div className={classes}>

View file

@ -39,7 +39,10 @@ var TeacherBanner = React.createClass({
{this.props.messages['teacherbanner.greeting']},{' '}
{this.props.session.session.user.username}
</h3>,
<p key="subgreeting">
<p
key="subgreeting"
className="title-banner-p"
>
{this.props.messages['teacherbanner.subgreeting']}
</p>
] : []

View file

@ -9,16 +9,16 @@
background-size: cover;
padding: 20px 0;
width: 100%;
h1,
p {
margin: 0 auto;
padding: 5px 0;
text-align: center;
color: $type-white;
}
p {
max-width: 500px;
}
}
.title-banner-h1,
.title-banner-p {
margin: 0 auto;
padding: 5px 0;
text-align: center;
color: $type-white;
}
.title-banner-p {
max-width: 500px;
}

View file

@ -18,8 +18,10 @@ var Developers = React.createClass({
<div className="developers">
<TitleBanner className="masthead">
<div className="inner">
<h1><FormattedMessage id='developers.title' /></h1>
<p className="intro">
<h1 className="title-banner-h1">
<FormattedMessage id='developers.title' />
</h1>
<p className="title-banner-p intro">
<FormattedHTMLMessage id='developers.intro' />
</p>
</div>

View file

@ -137,7 +137,7 @@ var Explore = injectIntl(React.createClass({
<div className='outer'>
<TitleBanner className="masthead">
<div className="inner">
<h1>Explore</h1>
<h1 className="title-banner-h1">Explore</h1>
</div>
</TitleBanner>
<Tabs>

View file

@ -29,10 +29,10 @@ var Hoc = React.createClass({
return (
<div className="hoc">
<TitleBanner className={this.state.bgClass}>
<h1>
<h1 className="title-banner-h1">
<FormattedMessage id='hoc.title' />
</h1>
<p>
<p className="title-banner-p">
<FormattedMessage id='hoc.subTitle' />
</p>

View file

@ -103,7 +103,7 @@ var Search = injectIntl(React.createClass({
<div className='outer'>
<TitleBanner className="masthead">
<div className="inner">
<h1>Search</h1>
<h1 className="title-banner-h1">Search</h1>
<div className="search">
<Form onSubmit={this.onSearchSubmit}>
<Button type="submit" className="btn-search" />

View file

@ -19,9 +19,11 @@ var Landing = injectIntl(React.createClass({
<div className="educators">
<TitleBanner className="masthead">
<div className="inner">
<h1><FormattedMessage id="teacherlanding.title" /></h1>
<h1 className="title-banner-h1">
<FormattedMessage id="teacherlanding.title" />
</h1>
<FlexRow className="masthead-info">
<p className="intro">
<p className="title-banner-p intro">
<FormattedMessage id="teacherlanding.intro" />
</p>
<div className="ted-talk">

View file

@ -61,10 +61,10 @@ var ThingsToTry = injectIntl(React.createClass({
<section className="ttt-section">
<img className="ttt-banner-image" src="/svgs/ttt/resources.svg" alt=""/>
</section>
<h1>
<h1 className="title-banner-h1">
<FormattedMessage id="ttt.title" />
</h1>
<p className="intro">
<p className="intro title-banner-p">
<FormattedHTMLMessage id="ttt.subTitle" />
</p>
</TitleBanner>