modal_react_tailwind_responsive

Modal

A modal made for npm, built using Javascript, React (components) and tailwindcss (style);

Installation

npm i modal_react_tailwind_responsive

Technologies

React : 18.2.0 version;
Node.js : 19.8.1 version;
Tailwind CSS : 3.0.2 version;

Getting Started

Dependencies

React
Tailwind CSS

How to use

React

npm start to start React

Tailwind CSS

tailwind.config.js- you will find all of the Tailwind settings, an essential file;

./src/App.js

In the App file the Home component is imported where all the other components of the modal are present;

function App() {
  return (
    <>
    <Home/>
    </>
  );
}

./src/components/Home

• In the home file you will find the functions to open and close the modal
  

• The component of the buttons and the modal

Home style

To facilitate the styling with tailwind all colors, fonts, and font sizes were removed, so that when it comes time to use the library it is flexible;

To add styles follow the Tailwind link and customize as you like: https://tailwindcss.com/

./src/components/Button

Button style

To change the text of the button that open the modal go to ./src/components/Home

To change the button text inside the modal go to ./src/components/Modal

./src/components/Modal

Under ./src/components/Modal are all the functions, styles and text from within the modal;

This modal is completely responsive

npm library link : https://www.npmjs.com/package/modal_react_tailwind_responsive