Skip to content

v0.2.0

Latest
Compare
Choose a tag to compare
@dev-afzalansari dev-afzalansari released this 19 Feb 17:19

v0.2.0

Version 0.2.0 is available with new Reverse Condition Props option which will allow you to set shorthands and accept tokens for a specific condition within a single prop as an object. Useful for configuring hover and focus condition. Example below.

Before

<s.button 
    borderColor='#000'
    color={{ default: '#FFF', hover: '#000' }}
    backgroundColor={{ default: '#000', hover: '#FFF' }}
  > 
    Submit
</s.button>

After

<s.button 
    borderColor='#000'
    color='#FFF' 
    backgroundColor='#000' 
    _h={{ color: '#000', backgroundColor: '#FFF' }} // hover - needs to be configured see APIs
  > 
    Submit
</s.button>

See docs.