mirror of
https://github.com/scratchfoundation/scratch-www.git
synced 2024-11-23 15:47:53 -05:00
Merge pull request #520 from rschamp/bugfix/splash-formatting
Fix line height and wrapping on splash components
This commit is contained in:
commit
623773b39e
3 changed files with 16 additions and 6 deletions
|
@ -30,6 +30,7 @@
|
|||
display: block;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
line-height: normal;
|
||||
|
||||
white-space: nowrap;
|
||||
font-size: .9rem;
|
||||
|
|
|
@ -31,9 +31,16 @@ var News = React.createClass({
|
|||
return (
|
||||
<li key={item.id}>
|
||||
<a href={item.url}>
|
||||
<img src={item.image} width="53" height="53" alt="" />
|
||||
<h4>{item.headline}</h4>
|
||||
<p>{item.copy}</p>
|
||||
<img src={item.image}
|
||||
className="news-image"
|
||||
width="53"
|
||||
height="53"
|
||||
alt=""
|
||||
/>
|
||||
<div className="news-description">
|
||||
<h4>{item.headline}</h4>
|
||||
<p>{item.copy}</p>
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
);
|
||||
|
|
|
@ -17,8 +17,10 @@
|
|||
min-height: 53px;
|
||||
|
||||
a {
|
||||
display: block;
|
||||
display: flex;
|
||||
text-decoration: none;
|
||||
flex-wrap: nowrap;
|
||||
flex-direction: row;
|
||||
|
||||
&:hover {
|
||||
text-decoration: none;
|
||||
|
@ -26,9 +28,8 @@
|
|||
}
|
||||
|
||||
img {
|
||||
display: block;
|
||||
float: left;
|
||||
margin-right: 12px;
|
||||
width: initial;
|
||||
}
|
||||
|
||||
h4 {
|
||||
|
@ -42,6 +43,7 @@
|
|||
display: block;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
line-height: normal;
|
||||
|
||||
color: $type-gray;
|
||||
font-size: .85rem;
|
||||
|
|
Loading…
Reference in a new issue