0
0
mirror of https://github.com/naturalcrit/homebrewery.git synced 2026-01-10 07:02:39 +00:00

Apply Gazook89's thumbnail style

This commit is contained in:
G.Ambatte
2022-09-21 18:38:45 +12:00
parent a179f8d124
commit f218f48f0f
2 changed files with 11 additions and 15 deletions

View File

@@ -102,8 +102,7 @@ const BrewItem = createClass({
return <div className='brewItem'> return <div className='brewItem'>
{brew.thumbnail ? {brew.thumbnail ?
<div className='thumbnail'> <div className='thumbnail' style={{ backgroundImage: `url(${brew.thumbnail})` }} >
<img className='thumbnailImage' src={brew.thumbnail} ></img>
</div> : </div> :
<></> <></>
} }

View File

@@ -20,19 +20,16 @@
box-shadow : 0px 4px 5px 0px #333; box-shadow : 0px 4px 5px 0px #333;
background-color : #cab2802e; background-color : #cab2802e;
.thumbnail { .thumbnail {
width: 80px; position: absolute;
height: 100px; width: 150px;
border: 2px solid #58180D; height: 100%;
border-radius: 8px; top: 0;
float: left; right: 0;
margin-right: 5px; z-index: -1;
display: flex; background-size: cover;
img.thumbnailImage { mask-image: linear-gradient(80deg, #0000 20%, #050 40%);
width : 100%; -webkit-mask-image: linear-gradient(80deg, #0000 20%, #050 40%);
height : 100%; opacity: 50%;
object-fit : cover;
border-radius : inherit;
}
} }
.text { .text {
min-height : 54px; min-height : 54px;