Skip to content

sebastien-d-me/nice-looking-select

Repository files navigation

Nice Looking Select - Sébastien D

Nice Looking Select logo

📖 Description

Generate nice drop-down lists (<select>).

👀 Preview

Before open

After open

📜Installation

npm i react-nice-looking-select

⚙️ Use

  1. Import the plugin in your project like this :
import NiceLookingSelect from "react-nice-looking-select";
  1. Set your options :
const options = [
    "Hamburger",
    "Fries",
    "Pizza",
    "Pasta",
    "Tenders",
    "Hot-Dog",
    "Kebab",
    "Tacos"
]
  1. In the return :
<NiceLookingSelect options={options} parameter={parameter} />
  1. Retrieve the selected value : You need to retrieve the element containing the class "selected-item--YOUR_ID_SELECT".

As on the picture below : Code

🎨 Personalize

  1. Put this into your file :
const parameter = {
    "backgroundColor": "#2D2D2D",
    "borderRadius": "10px",
    "centerOptions": true,
    "centerTitle": true,
    "chevronsColor": "#E5E5E5",
    "columnsNumber": 2,
    "fontColor": "#E5E5E5",
    "hoverColor": "#4ED8E0",
    "id": "select-meal",
    "showChevrons": true,
    "title": "Select your favorite meal"
}

📝 License

MIT © sebastien-d-me

About

Generate nice drop-down lists.

Topics

Resources

License

Stars

Watchers

Forks