Fun with table 🏓

Flexible & responsive table for React

A super user-friendly experience, start to use your table also on mobile!

🖥️ On desktop as a classic table

📱 On mobile as collapsable rows

• ☝️
• 🚀 Link
• 🕹️ Demo
• 🛠️ How to
• 😊 Collaborators
• 🍕 Pizza time

---

🚀 Links:

• 👉 NPM Package
  
  

• 👉 GitHub Repository
  
  

• 👉 CodePen

• 👉 GitHub Page

---

🕹️ Demo

▶️ Video demo

---

🪜 Demo table

Try me: 🚀 TRY WOW STYLE 😈 DARK MODE

Resize the window to check 😉

---

🛠️ How to

🔧 Installation

Install by NPM

npm i responsive-table-react

Here you can find the package on NPM: responsive-table-react

---

🔬 Instruction

Simple and high settable table for all devices, CSS only; create your component with a super tiny code.

Import with:

import { ResponsiveTable } from "responsive-table-react";

Const example:

const columns = [
    {
      "id": "name",
      "text": "Name"
    },
    {
      "id": "surname",
      "text": "Surname"
    }
  ]

  const data = [
    {
      "name": "Mark",
      "surname": "Garsin"
    },
    {
      "name": "Gabriel",
      "surname": "Betappi"
    },
    {
      "name": "Gustav",
      "surname": "Mahler",
    }
  ]

  return (
    <ResponsiveTable columns={columns} data={data} />
  )

---

🌊 Props

Set the designOptions:

• Add the border: bordered?: boolean // es: bordered?: true
• Add the dark mode: dark?: boolean // es: dark?: true
• Set the master color: color?: string // es: color?: #CC0000

---

😊 Collaborators

Funny time with:

• 🦁 Gabriele
• 🦊 Marco
• 🐻‍❄️ Gustavo
• 🐰 Stefano

---

🍕 Give us a pizza

If you like this component and you want to support us... PIZZAAA TIME!!! 😋😋😋

---