react-simple-dropdown icon indicating copy to clipboard operation
react-simple-dropdown copied to clipboard

Transitions with react-simple-dropdown.

Open Extra-lightwill opened this issue 9 years ago • 1 comments

What would be the best way to implement a dropdown with transitions (e.g. http://codepen.io/shshaw/pen/gsFch) using this library?

Extra-lightwill avatar Jan 24 '17 11:01 Extra-lightwill

@Extra-lightwill You'd want to use CSS transitions—much like the ones in that codepen—to get the effect you want.

This component uses the .dropdown--active class to define whether or not the dropdown should be showing. By default this is a simple display: none toggle, but you can override that behavior and do something else entirely.

.dropdown {
  display: block; /* override default behavior */
  opacity: 0;
  transition: opacity 250ms;
}

.dropdown--active {
  opacity: 1;
}

takempf avatar Jan 30 '17 00:01 takempf