JSFiddle - React, Tailwind, and code Playground

by kasperfish

HTML

<div class='boo'></div>

CSS

.boo {
  position: relative;
  width: 20em; min-height: 10em;
  background: rgba(0,0,0,0) url(http://placekitten.com/320/160);
  transition: background-color 1s;
    left:0;
}
.boo:hover {
  background-color: rgba(0,0,0,.5);
      transition: 1s;
    left: 0;
}
.boo:before {
  position: absolute;
  top: 20; right: 0; bottom: 0; left: 0;
  background-color: inherit;
  content: ' ';
}