Package detail

BarCard Function

Documentation: https://barcard-components.netlify.com

Intro

Pairs nicely with @barcard/components.

Installation

yarn add @barcard/functions

Usage

1. Styles

2. colors - an object that contains the default colors used by BarCard. Additionally, contains some 'helper' colors (opaque, white25, white75, white80, etc)

3. fonts - an object that contains the default fonts used by BarCard. Encapsulates the concept of font-weight as we use a single font (Open Sans)

4. Scale

5. scale(size) - takes a number, and scales it up/down based on the deviceWidth. Primarily designed for mobile, needs to adjusted to work for web (screens larger than 414px). For web, it just returns (size * 1) for now.

6. scaleFont(size) - similar to scale, but meant to encapsulate the fact that font sizes should not scale linearly like most elements. Not really used.

7. verticalScale and moderateScale are also exported, but not used.

8. Helpers

9. totTileCase(str) - takes 'a thing' and returns 'A Thing'

10. hexToRgba(hex, opacity) - takes a hex string (#16CCD9), and opacity (0.5), and returns an rgba string (essentially, an easy way to add opacity to hex values)
11. toCurrency(float)- takes '14.99997' and returns '14.99'. Or, takes '15' and returns '15.00'. does not add the currency symbol
12. hashMap(arr, key) - takes an array, and makes an object hash
13. getImgUrl(handle) - takes an image handle (from filestack) and returns the url (specific to our image cdn)