open-index/open-npm huggingface dataset:
npm package: @gleox/ckeditor5
Description: A customized, IIFE-ready redistribution of CKEditor 5.
Latest version: 48.0.0

# ckeditor-redist

A customized, IIFE-ready redistribution of CKEditor 5.

Inspired by [filament-ckeditor-field](https://github.com/Kahu-Software-LLC/filament-ckeditor-field).
npm package: @glg-dev/react-modal
Description: A modal component for your React app
Author: glg-dev
Latest version: 1.0.6

# react-modal plugin

A library of React components created using `create-react-app`.

## Installation

Run the following command:```npm install @glg-dev/react-modal```

## How to use

```
import React, { useState } from 'react';
import { Modal } from "@glg-dev/react-modal";

const App = () => {

  const [display, setDisplay] = useState(false)
  const yourTitle = "Write your title"
  cont message = "Your message here

  return (
    <div>
      <button onClick={() => setDisplay(true)}>
        Show modal
      </button>
      <Modal 
        title={yourTitle} 
        content={message} 
        hideModal={() => setDisplay(false)}
        visible={display}
      />

    </div>
  );
};

export default App;
```

## How to custom
If you want add your own style, copy and edit the following snippet:
```
:root {
  --modal-font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
  --modal-text-color: #000;
  --modal-text-decoration: none;
  --modal-z-index: 100;
  --modal-wrapper-bg: rgba(0, 0, 0, 0.7);
  --modal-container-bg: #FFF;
  --modal-container-border-radius: 1rem;
  --modal-container-shadow: rgba(0, 0, 0, 0.1) 0px 0px 15px, rgba(0, 0, 0, 0.3) 0px 0px 15px;
  --modal-container-padding: 2rem;
  --modal-elements-gap: 1rem;
  --modal-close-button-color: black;
  --modal-close-button-border-radius: 50%;
  --modal-title-font-size: 1.5rem;
  --modal-content-font-size: 1rem;}
```