Name of variable or property with percent value should contain (height,top,bottom,vertical,width,left,right,horizontal) to define base for percent calculation

[sushmitg]

I have following code :

const styles = EStyleSheet.create({

  $gridGap: '3.28%', /* 3.28% = 10 according to 375 mobile width  */

  grid: {
    paddingBottom: heightPercentageToDP('2.5%'),
    flexDirection: 'row',
    lexWrap: 'wrap',
    overflow: 'hidden',
    marginRight: '-1 * $gridGap',
  },

  row: {
    width: '50%',
    paddingRight: '$gridGap',
    marginBottom: dpToHeightPercent(20)
  },

  $cardWidth: '50% - $gridGap' /* col width minus paddingRight */,

  shopCard__ctaBtn: {
    width: '0.2 * $cardWidth',
  },
});

This is not working. Throwing following error: Error: Name of variable or property with percent value should contain (height,top,bottom,vertical,width,left,right,horizontal) to define base for percent calculation

[stale[bot]]

Is this still relevant? If so, what is blocking it? Is there anything you can do to help move it forward?

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs.