1.0.2 • Published 9 months ago

@codewithhridoy/tailwind-browser v1.0.2

Weekly downloads
-
License
MIT
Repository
github
Last release
9 months ago

TailwindCSS :browser

Tailwind browser helps you to develop efficiently for cross-browser platform

GitHub License NPM Version NPM Downloads


📥 Installation

Tailwind.css v3 or newer is required.

#If you use npm
npm install --save-dev @codewithhridoy/tailwind-browser

#If you use yarn
yarn add -D @codewithhridoy/tailwind-browser

#If you use pnpm (preferred)
pnpm add -D @codewithhridoy/tailwind-browser

📦 Usage

Add to plugins in your tailwind.config.js:

module.exports = {
 // ...
 plugins: [
  require("@codewithhridoy/tailwind-browser"),
  // ...other plugins.
 ],
};

Style your components using {browser_name}:{class}, e.g. firefox:bg-red-100, chrome:bg-blue-100, etc.

<div className="firefox:bg-red-400 chrome:bg-blue-400 bg-yellow-400">
 <p>On firefox background should be red, on chrome should be blue and on other browsers it should be yellow</p>
</div>

🔐 Supported browsers

BrowserVariantCSS PropertyExample
Firefoxfirefox:-moz-appearance: nonefirefox:bg-yellow-400
Chromechrome:background: -webkit-named-image(i)chrome:bg-red-400
Safarisafari:-webkit-app-region: inheritsafari:bg-blue-400

⁉️ Issues

If you have any issues with the page please create new issue here

📥 Pull Requests

When submitting a pull request:

  • Clone the repo.
  • Create a branch off of master and give it a meaningful name (e.g. my-awesome-new-feature).
  • Open a pull request on GitHub and describe the feature or fix.

📋 License

This project is licensed under the MIT. See the LICENSE file for details