# @divyagnan/rn-style-utils

> Utils to help you quickly prototype a react native app

Latest version **0.1.0** (published 2018-03-14) · MIT license · 0 weekly downloads

## Install

```sh
npm install @divyagnan/rn-style-utils
pnpm add @divyagnan/rn-style-utils
yarn add @divyagnan/rn-style-utils
bun add @divyagnan/rn-style-utils
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.1.0 |
| Published | 2018-03-14 |
| First published | 2018-03-14 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 48.7 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 0 |
| Author | Divyagnan |
| Maintainers | divyagnan |

## Links

- npm: https://www.npmjs.com/package/@divyagnan/rn-style-utils
- Repository: https://github.com/divyagnan/rn-style-utils
- npm.io page: https://npm.io/package/@divyagnan/rn-style-utils

## Recent versions

- 0.1.0 (latest) — 2018-03-14

## README

# @divyagnan/rn-style-utils

> Simple style helpers to make react native prototyping easier

## Example Usage

```jsx
// import the helpers that you want
import { m1, mb78, p50, pt56 } from "@divyagnan/rn-style-utils";

// use the helpers
// you can use the helpers directly
<Text style={m1}>This text will have a margin of 1</Text>;
<Text style={[mb78, pt56]}>
  This text will have a marginBottom of 78 and a paddingTop of 56
</Text>;

// or you can use them with StyleSheet
const styles = StyleSheet.create({
  coolNewStyle: {
    // this style will have a padding of 50
    ...p50
  }
});
```

## Available Helpers

This library exports the following helpers:

#### Margin

* `m[1-100]`- used to apply a `margin` between 1 and 100
  * ex: `m5` sets a margin of 5
* `mt[1-100]`- used to apply a `marginTop` between 1 and 100
  * ex: `mt22` sets a marginTop of 22
* `mb[1-100]`- used to apply a `marginBottom` between 1 and 100
  * ex: `mb88` sets a marginBottom of 88
* `mr[1-100]`- used to apply a `marginRight` between 1 and 100
  * ex: `mr2` sets a marginRight of 2
* `ml[1-100]`- used to apply a `marginLeft` between 1 and 100
  * ex: `ml12` sets a marginLeft of 12

#### Padding

* `p[1-100]`- used to apply a `padding` between 1 and 100
  * ex: `p5` sets a padding of 5
* `pt[1-100]`- used to apply a `paddingTop` between 1 and 100
  * ex: `pt22` sets a paddingTop of 22
* `pb[1-100]`- used to apply a `paddingBottom` between 1 and 100
  * ex: `pb88` sets a paddingBottom of 88
* `pr[1-100]`- used to apply a `paddingRight` between 1 and 100
  * ex: `pr2` sets a paddingRight of 2
* `pl[1-100]`- used to apply a `paddingLeft` between 1 and 100
  * ex: `pl12` sets a paddingLeft of 12

---
_Source: https://npm.io/package/@divyagnan/rn-style-utils · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._