Elements - Copy this React, Tailwind Component to your project

Create a periodic table so that after adding all elements it should properly reassemble a periodic table using the grid property with Element Hovering over an element reveals a popup or side panel with detailed information including atomic number, symbol, atomic weight, electron configuration, and more. Color Coding: Use color codes to represent different categories like metals, nonmetals, metalloids, and rare earth elements. Include a legend for easy reference. and when ever i click on the element it opens in a new tab with /elements/{element name}