How can I hide the title when hovering over the first child in my preview div items? I want to change the opacity of the title to zero on hover. Is there a simple way to achieve this effect?
Currently, the layout looks like this -
<div className="collection-preview">
<h1 className="title">{title.toUpperCase()}</h1>
<div className="preview">
{
movies
? (movieData.map(({id, ...otherProps}) => <CollectionItem key={id} {...otherProps} />))
: null
}
{
tvshow
? (tvData.map(({id, ...otherProps}) => <CollectionItem key={id} {...otherProps} />))
: null
}
</div>
</div>