0
0
mirror of https://github.com/naturalcrit/homebrewery.git synced 2026-01-05 10:12:41 +00:00

Fix BrewItem locations and overlapping.

This commit is contained in:
G.Ambatte
2021-08-18 18:07:17 +12:00
parent cb8c3a016a
commit a834c79b49
2 changed files with 18 additions and 14 deletions

View File

@@ -104,13 +104,12 @@ const BrewItem = createClass({
const dateFormatString = 'YYYY-MM-DD HH:mm:ss'; const dateFormatString = 'YYYY-MM-DD HH:mm:ss';
return <div className='brewItem'> return <div className='brewItem'>
<h2>{brew.title}</h2> <div className='text'>
<p className='description'>{brew.description}</p> <h2>{brew.title}</h2>
<p className='description'>{brew.description}</p>
</div>
<hr /> <hr />
<div className='info'> <div className='info'>
<span title={`Authors:\n${brew.authors.join('\n')}`}>
<i className='fas fa-user'/> {brew.authors.join(', ')}
</span>
<span title={`Last viewed: ${moment(brew.lastViewed).local().format(dateFormatString)}`}> <span title={`Last viewed: ${moment(brew.lastViewed).local().format(dateFormatString)}`}>
<i className='fas fa-eye'/> {brew.views} <i className='fas fa-eye'/> {brew.views}
</span> </span>
@@ -123,6 +122,10 @@ const BrewItem = createClass({
<i className='fas fa-sync-alt' /> {moment(brew.updatedAt).fromNow()} <i className='fas fa-sync-alt' /> {moment(brew.updatedAt).fromNow()}
</span> </span>
{this.renderGoogleDriveIcon()} {this.renderGoogleDriveIcon()}
<br />
<span title={`Authors:\n${brew.authors.join('\n')}`}>
<i className='fas fa-user'/> {brew.authors.join(', ')}
</span>
</div> </div>
<div className='links'> <div className='links'>

View File

@@ -10,27 +10,28 @@
min-height : 105px; min-height : 105px;
margin-right : 15px; margin-right : 15px;
margin-bottom : 15px; margin-bottom : 15px;
padding : 5px 15px 5px 8px; padding : 5px 15px 2px 8px;
padding-right : 15px; padding-right : 15px;
border : 1px solid #c9ad6a; border : 1px solid #c9ad6a;
border-radius : 5px; border-radius : 5px;
-webkit-column-break-inside : avoid; -webkit-column-break-inside : avoid;
page-break-inside : avoid; page-break-inside : avoid;
break-inside : avoid; break-inside : avoid;
h4{ .text {
margin-bottom : 5px; min-height : 54px;
font-size : 2.2em; h4{
} margin-bottom : 5px;
.description{ font-size : 2.2em;
padding-bottom : 30px; }
} }
.info{ .info{
position: absolute; position: initial;
bottom: 0px; bottom: 2px;
margin-bottom: 4px; margin-bottom: 4px;
font-family : ScalySans; font-family : ScalySans;
font-size : 1.2em; font-size : 1.2em;
&>span{ &>span{
display : float;
margin-right : 12px; margin-right : 12px;
} }
} }