title: How to style hover in react-native?
body: <p>In reactjs I could just <code>import styles from './styles.css'</code> with a stylesheet containing <code>.button</code>, <code>. button:hover</code>, <code>. button:active</code> and it works.</p>
  <p>Online converters turn this stylesheet into <code>&quot;button&quot;</code>, <code>&quot;button_hover&quot;</code>, <code>&quot;button_active&quot;</code> styles, but making a <code>StyleSheet</code> from those in react-native doesn't work.</p>
  <p>How can I change element style on hover and <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/:active" rel="nofollow noreferrer">active</a>?</p>
  <pre><code>.button {
    background: #ff4931;
    box-shadow: 0 0 4px rgba(0, 0, 0, 0.3);
    transition: all 200ms ease;
  }
  
  .button:hover {
    transition: all 100ms ease;
    transform: scale(1.05);
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.5);
  }
  
  .button:active {
    transition: all 50ms ease;
    transform: scale(1.03);
    background: #e5432d;
  }
  </code></pre>