📅 You're Invited: Meet the Socket team at RSAC (April 28 – May 1).RSVP →

tailwindcss-safe-area

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

tailwindcss-safe-area - npm Package Compare versions

Comparing version

to
0.1.3

{
"name": "tailwindcss-safe-area",
"version": "0.1.2",
"version": "0.1.3",
"main": "src/index.js",
"license": "MIT",
"repository": "https://github.com/mvllow/tailwindcss-safe-area",
"keywords": [
"tailwindcss",
"safe-area-inset",
"margin",
"padding"
],
"prettier": {

@@ -8,0 +14,0 @@ "printWidth": 100,

# tailwindcss-safe-area
A plugin that provides utilities for adding env(safe-area-inset-{top,right,bottom,left})
Safe area inset utilities using the existing padding/margin syntax
## Installation
## Getting started
Install the plugin from npm:
```sh
# Using npm
npm install tailwindcss-safe-area
# Using Yarn
yarn add tailwindcss-safe-area
npm install --dev tailwindcss-safe-area
```

@@ -34,4 +28,3 @@

> Shares the same api as margin (`m`) & padding (`p`)
> Examples: `m-safe` `px-safe` `pb-safe`
This plugin extends the padding and margin utilities.

@@ -53,1 +46,13 @@ Use the `*-safe` utilities:

```
## Provided utilities
| Utilities | Styles |
| ------------------ | ------------------------------------------------- |
| `m-safe, p-safe` | `env(safe-area-inset-{top, right, bottom, left})` |
| `mx-safe, px-safe` | `env(safe-area-inset-{right, left})` |
| `my-safe, py-safe` | `env(safe-area-inset-{top, bottom})` |
| `mt-safe, pt-safe` | `env(safe-area-inset-top)` |
| `mr-safe, pr-safe` | `env(safe-area-inset-right)` |
| `mb-safe, pb-safe` | `env(safe-area-inset-bottom)` |
| `ml-safe, pl-safe` | `env(safe-area-inset-left)` |