Skip to content

GitLab

S
scratch-www
Commit e2894dd1 authored by carljbowman's avatar carljbowman
Browse files
Options

Fix photo credit typographic styles

parent 3ab4eb18
Show whitespace changes
Inline Side-by-side
Showing with 108 additions and 103 deletions
src/views/annual-report/annual-report.jsx
View file @ e2894dd1
......@@ -1519,9 +1519,9 @@ class AnnualReport extends React.Component {
</div>
<div className="blm-image">
<img src="/images/annual-report/initiatives/BLM Hero.svg" />
<b>
<span className="photo-credit">
<FormattedMessage id="annualReport.communityArtwork" />
</b>
</span>
</div>
<div className="blm-projects">
<Grid
......@@ -1684,11 +1684,9 @@ class AnnualReport extends React.Component {
<div className="pizza-img">
<img src="/images/annual-report/initiatives/schools/CPS Story/Pizza.svg" />
</div>
<div className="photo-credit">
<p>
<span className="photo-credit">
<FormattedMessage id="annualReport.familyNightsPhotoCredit" />
</p>
</div>
</span>
</div>
<div className="inner schools">
<h4>
......@@ -1786,12 +1784,14 @@ class AnnualReport extends React.Component {
<div className="conferences-hero-and-caption">
{/* eslint-disable-next-line max-len */}
<img src="/images/annual-report/initiatives/schools/Conferences Story/Scratch Conferences Hero.png" />
<span className="photo-credit">
<FormattedMessage
id="annualReport.conferencesHeroImageCaption"
values={{
photoCredit: 'Carmelo Presicce'
}}
/>
</span>
</div>
</MediaQuery>
</div>
......@@ -1799,12 +1799,14 @@ class AnnualReport extends React.Component {
<MediaQuery maxWidth={frameless.mobile - 1}>
<div className="conferences-hero-and-caption">
<div className="conferences-hero" />
<span className="photo-credit">
<FormattedMessage
id="annualReport.conferencesHeroImageCaption"
values={{
photoCredit: 'Carmelo Presicce'
}}
/>
</span>
</div>
</MediaQuery>
<div className="inner schools-conferences bottom">
......@@ -1813,12 +1815,14 @@ class AnnualReport extends React.Component {
<div className="conference-image-and-caption left">
{/* eslint-disable-next-line max-len */}
<img src="/images/annual-report/initiatives/schools/Conferences Story/Latin America Conference.png" />
<span className="photo-credit">
<FormattedMessage
id="annualReport.conferencesLatinAmericaImageCaption"
values={{
photoCredit: 'Scratch al Sur'
}}
/>
</span>
</div>
<div className="conference-title-and-description">
<h4>
......@@ -1887,24 +1891,28 @@ class AnnualReport extends React.Component {
<div className="conference-image-and-caption">
{/* eslint-disable-next-line max-len */}
<img src="/images/annual-report/initiatives/schools/Conferences Story/Europe Conference.png" />
<span className="photo-credit">
<FormattedMessage
id="annualReport.conferencesEuropeImageCaption"
values={{
photoCredit: 'Raspberry Pi'
}}
/>
</span>
</div>
</div>
<div className="schools-conferences-region">
<div className="conference-image-and-caption left">
{/* eslint-disable-next-line max-len */}
<img src="/images/annual-report/initiatives/schools/Conferences Story/Africa Conference.png" />
<span className="photo-credit">
<FormattedMessage
id="annualReport.conferencesAfricaImageCaption"
values={{
photoCredit: 'Carmelo Presicce'
}}
/>
</span>
</div>
<div className="conference-title-and-description">
<h4>
......
src/views/annual-report/annual-report.scss
View file @ e2894dd1
......@@ -41,6 +41,13 @@ p {
line-height: 2em;
}
.photo-credit {
font-size: 0.875rem;
line-height: 1.125rem;
text-align: center;
margin-top: 1rem;
}
@media #{$small} {
.inner {
width: $cols4;
......@@ -1230,17 +1237,6 @@ p {
}
}
}
.photo-credit {
padding-bottom: 0px;
padding-top: 0px;
p {
font-size: 0.875rem;
line-height: 1.125rem;
font-weight: bold;
}
}
}
&.schools-conferences {
......@@ -1395,8 +1391,6 @@ p {
margin-bottom: 24px;
img {
margin-bottom: 22px;
@media #{$medium-and-smaller} {
width: 460px;
}
......@@ -1983,9 +1977,12 @@ p {
.blm-image {
max-width: 380px;
font-size: .875rem;
text-align: center;
span {
margin-top: 1rem;
}
@media #{$small} {
img {
width: 300px;
......
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