Commit 9a5560bd authored by Karishma Chadha's avatar Karishma Chadha

Don't show scratch-jr-transition images on small screens. Fix lint issue.

parent a8058aa0
...@@ -860,9 +860,11 @@ class AnnualReport extends React.Component { ...@@ -860,9 +860,11 @@ class AnnualReport extends React.Component {
<img src="/images/annual-report/reach/translated-illustration.svg" /> <img src="/images/annual-report/reach/translated-illustration.svg" />
</div> </div>
</div> </div>
<MediaQuery minWidth={frameless.mobile}>
<div className="scratch-jr-transition-img"> <div className="scratch-jr-transition-img">
<img src="/images/annual-report/reach/horizontal-command.svg" /> <img src="/images/annual-report/reach/horizontal-command.svg" />
</div> </div>
</MediaQuery>
</div> </div>
<div className="reach-scratch-jr"> <div className="reach-scratch-jr">
<div className="inner"> <div className="inner">
...@@ -888,9 +890,11 @@ class AnnualReport extends React.Component { ...@@ -888,9 +890,11 @@ class AnnualReport extends React.Component {
</h4> </h4>
</div> </div>
</div> </div>
<MediaQuery minWidth={frameless.mobile}>
<div className="scratch-jr-transition-img"> <div className="scratch-jr-transition-img">
<img src="/images/annual-report/reach/horizontal-loop.svg" /> <img src="/images/annual-report/reach/horizontal-loop.svg" />
</div> </div>
</MediaQuery>
</div> </div>
<div <div
className="initiatives-section" className="initiatives-section"
......
...@@ -741,6 +741,10 @@ p { ...@@ -741,6 +741,10 @@ p {
img { img {
max-width: 380px; max-width: 380px;
} }
@media #{$small} {
margin-bottom: 64px;
}
} }
@media #{$intermediate-and-smaller} { @media #{$intermediate-and-smaller} {
...@@ -801,9 +805,6 @@ p { ...@@ -801,9 +805,6 @@ p {
@media #{$medium} { @media #{$medium} {
margin-left: 32px; margin-left: 32px;
} }
@media #{$small} {
margin-left: -8px;
}
} }
} }
...@@ -817,10 +818,6 @@ p { ...@@ -817,10 +818,6 @@ p {
@media #{$medium} { @media #{$medium} {
margin-right: 12px; margin-right: 12px;
} }
@media #{$small} {
margin-right: -36px;
overflow: hidden;
}
} }
} }
...@@ -869,6 +866,10 @@ p { ...@@ -869,6 +866,10 @@ p {
width: 100%; width: 100%;
} }
} }
@media #{$small} {
padding: 84px 0 52px 0;
}
} }
.initiatives-section { .initiatives-section {
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment