mirror of
https://github.com/scratchfoundation/scratch-www.git
synced 2024-11-23 15:47:53 -05:00
Merge pull request #525 from mewtaylor/issue/conference-tweaks
For GH-497: conference tweaks for fallout from schedule/typography
This commit is contained in:
Matthew Taylor
commit
6eeebe05c3
10 changed files with 107 additions and 40 deletions
|
|
@ -71,7 +71,7 @@ var ConferenceFooter = React.createClass({
|
|||
</li>
|
||||
</FlexRow>
|
||||
</FlexRow>
|
||||
<p>
|
||||
<p className="legal">
|
||||
Scratch is a project of the Lifelong Kindergarten Group at the MIT Media Lab.
|
||||
</p>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -50,7 +50,7 @@
|
|||
}
|
||||
|
||||
li {
|
||||
margin-bottom: .5rem;
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -41,6 +41,20 @@
|
|||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: $mobile - 1) {
|
||||
.inner {
|
||||
> ul {
|
||||
li {
|
||||
&.right {
|
||||
ul {
|
||||
flex-flow: row nowrap;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: $tablet - 1) {
|
||||
height: 100px;
|
||||
|
||||
|
|
|
|||
|
|
@ -14,14 +14,11 @@
|
|||
|
||||
.thumbnail-title,
|
||||
#{$extras} {
|
||||
line-height: normal;
|
||||
word-wrap: break-word;
|
||||
|
||||
a {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
line-height: normal;
|
||||
white-space: nowrap;
|
||||
}
|
||||
word-wrap: break-word;
|
||||
}
|
||||
|
||||
.thumbnail-title {
|
||||
|
|
|
|||
|
|
@ -46,25 +46,29 @@ var ConferenceDetails = React.createClass({
|
|||
] : [
|
||||
<h2>{this.props.conferenceDetails.Title}</h2>,
|
||||
<ul className="logistics">
|
||||
{this.props.conferenceDetails.fetching ? [] : [
|
||||
<li>
|
||||
<img src="/svgs/conference/schedule/presenter-icon.svg" alt="presenter icon" />
|
||||
{this.props.conferenceDetails.Presenter}
|
||||
</li>
|
||||
</li>,
|
||||
<li>
|
||||
<img src="/svgs/conference/schedule/time-icon.svg" alt="time icon" />
|
||||
{this.props.conferenceDetails.Start} – {this.props.conferenceDetails.End}
|
||||
</li>
|
||||
</li>,
|
||||
<li>
|
||||
<img src="/svgs/conference/schedule/event-icon.svg" alt="event icon" />
|
||||
{this.props.conferenceDetails.Type}
|
||||
</li>
|
||||
</li>,
|
||||
<li>
|
||||
<img src="/svgs/conference/schedule/location-icon.svg" alt="location icon" />
|
||||
{this.props.conferenceDetails.Location}
|
||||
</li>
|
||||
]}
|
||||
</ul>,
|
||||
<div className="description">
|
||||
<p>
|
||||
{this.props.conferenceDetails.Description}
|
||||
</p>
|
||||
</div>,
|
||||
<div className="back">
|
||||
{this.props.conferenceDetails.fetching ? [] : [
|
||||
|
|
|
|||
|
|
@ -1,12 +1,18 @@
|
|||
@import "../../../frameless";
|
||||
|
||||
#view {
|
||||
@media only screen and (max-width: $tablet - 1) {
|
||||
margin-top: 100px;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: $desktop - 1) {
|
||||
text-align: left;
|
||||
}
|
||||
}
|
||||
|
||||
.details {
|
||||
width: $cols8;
|
||||
|
||||
&.inner {
|
||||
margin-top: 2rem;
|
||||
|
||||
|
|
@ -41,3 +47,10 @@
|
|||
margin: 2rem 0;
|
||||
}
|
||||
}
|
||||
|
||||
//8 columns
|
||||
@media only screen and (max-width: $desktop - 1) {
|
||||
.details {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -19,15 +19,20 @@ var ConferenceSplash = React.createClass({
|
|||
Many Paths, Many Styles
|
||||
</h1>
|
||||
<h3>
|
||||
Scratch Conference 2016 | Cambridge, MA, USA
|
||||
August 4 - 6, 2016 | Cambridge, MA, USA
|
||||
</h3>
|
||||
<p>
|
||||
<a href="//scratchconference2016.eventbrite.com">
|
||||
<a href="/conference/schedule">
|
||||
<Button>
|
||||
Register Now
|
||||
See the Schedule
|
||||
</Button>
|
||||
</a>
|
||||
</p>
|
||||
<p className="sub-button">
|
||||
<b>
|
||||
We're sold out! <a href="//scratchconference2016.eventbrite.com">Join the Waitlist</a>
|
||||
</b>
|
||||
</p>
|
||||
</TitleBanner>
|
||||
<section className="inner">
|
||||
<FlexRow>
|
||||
|
|
|
|||
|
|
@ -25,6 +25,19 @@
|
|||
p {
|
||||
margin-top: 3rem;
|
||||
|
||||
&.sub-button {
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
||||
b {
|
||||
margin-top: 2rem;
|
||||
|
||||
a {
|
||||
text-decoration: underline;
|
||||
color: $type-white;
|
||||
}
|
||||
}
|
||||
|
||||
a {
|
||||
|
||||
button {
|
||||
|
|
|
|||
|
|
@ -262,6 +262,17 @@ var ConferencePlan = React.createClass({
|
|||
<div className="long">
|
||||
<h2>FAQ</h2>
|
||||
<dl>
|
||||
<dt>
|
||||
The conference is sold out. What can I do?
|
||||
</dt>
|
||||
<dd>
|
||||
Scratch@MIT is sold out and at capacity. However, you can{' '}
|
||||
<a href="//scratchconference2016.eventbrite.com">
|
||||
join the waitlist
|
||||
</a>. People on the waitlist will be notified of openings on{' '}
|
||||
a first come, first served basis.
|
||||
</dd>
|
||||
|
||||
<dt>
|
||||
Who is this conference for?
|
||||
</dt>
|
||||
|
|
@ -279,18 +290,6 @@ var ConferencePlan = React.createClass({
|
|||
Proposal submissions are now closed.
|
||||
</dd>
|
||||
|
||||
<dt>
|
||||
How much does it cost to register?
|
||||
</dt>
|
||||
<dd>
|
||||
Through May 1, registration is $150 per ticket (Early Bird rate).{' '}
|
||||
After May 1, registration increases to $250 per ticket. You can register{' '}
|
||||
for the conference through the{' '}
|
||||
<a href="https://www.eventbrite.com/e/scratchmit-2016-registration-21793477879">
|
||||
registration form
|
||||
</a>.
|
||||
</dd>
|
||||
|
||||
<dt>
|
||||
I can only attend one day of the conference. Do you offer single-day{' '}
|
||||
registration?
|
||||
|
|
|
|||
|
|
@ -102,6 +102,28 @@
|
|||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: $mobile - 1) {
|
||||
.sub-nav {
|
||||
flex-wrap: nowrap;
|
||||
}
|
||||
|
||||
.inner {
|
||||
h2 {
|
||||
&.breaking-title {
|
||||
margin: 2rem 0 2rem;
|
||||
height: 100%;
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
}
|
||||
|
||||
.agenda-item {
|
||||
h3 {
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: $tablet - 1) {
|
||||
.inner {
|
||||
h2 {
|
||||
|
|
|
|||
Loading…
Reference in a new issue