Untitled
unknown
plain_text
2 years ago
8.0 kB
5
Indexable
import React from "react";
export default function Table() {
return (
<div className="relative overflow-x-auto shadow-md sm:rounded-lg m-20">
<table className="w-full text-sm text-left text-gray-500">
<thead className="text-xs text-gray-700 uppercase bg-gray-300">
<tr>
<th scope="col" className="px-6 py-3">
Id.
</th>
<th scope="col" className="px-6 py-3">
AC Number
</th>
<th scope="col" className="px-6 py-3">
Part Number
</th>
<th scope="col" className="px-6 py-3">
Alternative Part Number
</th>
<th scope="col" className="px-6 py-3">
Description
</th>
<th scope="col" className="px-6 py-3">
UOM
</th>
<th scope="col" className="px-6 py-3">
Add to Chart
</th>
</tr>
</thead>
<tbody>
<tr className="bg-white border-b hover:bg-gray-100">
<th
scope="row"
className="px-6 py-4 font-medium text-gray-900 whitespace-nowrap"
>
1
</th>
<td className="px-6 py-4 text-center">-</td>
<td className="px-6 py-4">INCONEL625-AMS5666-HEX19X2400MM</td>
<td className="px-6 py-4 text-center">-</td>
<td className="px-6 py-4">INCONEL HEX</td>
<td className="px-6 py-4">MM</td>
<td className="px-6 py-4 flex justify-center items-center">
<svg
className="w-5 h-5"
fill="none"
stroke="currentColor"
stroke-width="1.5"
viewBox="0 0 24 24"
xmlns="http://www.w3.org/2000/svg"
aria-hidden="true"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
d="M2.25 3h1.386c.51 0 .955.343 1.087.835l.383 1.437M7.5 14.25a3 3 0 00-3 3h15.75m-12.75-3h11.218c1.121-2.3 2.1-4.684 2.924-7.138a60.114 60.114 0 00-16.536-1.84M7.5 14.25L5.106 5.272M6 20.25a.75.75 0 11-1.5 0 .75.75 0 011.5 0zm12.75 0a.75.75 0 11-1.5 0 .75.75 0 011.5 0z"
></path>
</svg>
</td>
</tr>
<tr className="bg-gray-100 border-b hover:bg-gray-200">
<th
scope="row"
className="px-6 py-4 font-medium text-gray-900 whitespace-nowrap"
>
2
</th>
<td className="px-6 py-4 text-center">-</td>
<td className="px-6 py-4">C64200-ASTM-B150HR50-DIA32X2400MM</td>
<td className="px-6 py-4 text-center">-</td>
<td className="px-6 py-4">COPPER ROD</td>
<td className="px-6 py-4">MM</td>
<td className="px-6 py-4 flex justify-center items-center">
<svg
className="w-5 h-5"
fill="none"
stroke="currentColor"
stroke-width="1.5"
viewBox="0 0 24 24"
xmlns="http://www.w3.org/2000/svg"
aria-hidden="true"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
d="M2.25 3h1.386c.51 0 .955.343 1.087.835l.383 1.437M7.5 14.25a3 3 0 00-3 3h15.75m-12.75-3h11.218c1.121-2.3 2.1-4.684 2.924-7.138a60.114 60.114 0 00-16.536-1.84M7.5 14.25L5.106 5.272M6 20.25a.75.75 0 11-1.5 0 .75.75 0 011.5 0zm12.75 0a.75.75 0 11-1.5 0 .75.75 0 011.5 0z"
></path>
</svg>
</td>
</tr>
<tr className="bg-white border-b hover:bg-gray-100">
<th
scope="row"
className="px-6 py-4 font-medium text-gray-900 whitespace-nowrap"
>
3
</th>
<td className="px-6 py-4 text-center">-</td>
<td className="px-6 py-4">PURE-COPPER-WW-T-775-0.188X0.035X144IN</td>
<td className="px-6 py-4 text-center">-</td>
<td className="px-6 py-4">COPPER TUBE</td>
<td className="px-6 py-4">MM</td>
<td className="px-6 py-4 flex justify-center items-center">
<svg
className="w-5 h-5"
fill="none"
stroke="currentColor"
stroke-width="1.5"
viewBox="0 0 24 24"
xmlns="http://www.w3.org/2000/svg"
aria-hidden="true"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
d="M2.25 3h1.386c.51 0 .955.343 1.087.835l.383 1.437M7.5 14.25a3 3 0 00-3 3h15.75m-12.75-3h11.218c1.121-2.3 2.1-4.684 2.924-7.138a60.114 60.114 0 00-16.536-1.84M7.5 14.25L5.106 5.272M6 20.25a.75.75 0 11-1.5 0 .75.75 0 011.5 0zm12.75 0a.75.75 0 11-1.5 0 .75.75 0 011.5 0z"
></path>
</svg>
</td>
</tr>
<tr className="bg-gray-100 border-b hover:bg-gray-200">
<th
scope="row"
className="px-6 py-4 font-medium text-gray-900 whitespace-nowrap"
>
4
</th>
<td className="px-6 py-4 text-center">-</td>
<td className="px-6 py-4">M27500A16TA1N06</td>
<td className="px-6 py-4 text-center">-</td>
<td className="px-6 py-4">CABLE</td>
<td className="px-6 py-4">MM</td>
<td className="px-6 py-4 flex justify-center items-center">
<svg
className="w-5 h-5"
fill="none"
stroke="currentColor"
stroke-width="1.5"
viewBox="0 0 24 24"
xmlns="http://www.w3.org/2000/svg"
aria-hidden="true"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
d="M2.25 3h1.386c.51 0 .955.343 1.087.835l.383 1.437M7.5 14.25a3 3 0 00-3 3h15.75m-12.75-3h11.218c1.121-2.3 2.1-4.684 2.924-7.138a60.114 60.114 0 00-16.536-1.84M7.5 14.25L5.106 5.272M6 20.25a.75.75 0 11-1.5 0 .75.75 0 011.5 0zm12.75 0a.75.75 0 11-1.5 0 .75.75 0 011.5 0z"
></path>
</svg>
</td>
</tr>
<tr className="bg-white border-b hover:bg-gray-100">
<th
scope="row"
className="px-6 py-4 font-medium text-gray-900 whitespace-nowrap"
>
5
</th>
<td className="px-6 py-4 text-center">-</td>
<td className="px-6 py-4">M22759/8-12-9</td>
<td className="px-6 py-4 text-center">-</td>
<td className="px-6 py-4">CABLE</td>
<td className="px-6 py-4">MM</td>
<td className="px-6 py-4 flex justify-center items-center">
<svg
className="w-5 h-5"
fill="none"
stroke="currentColor"
stroke-width="1.5"
viewBox="0 0 24 24"
xmlns="http://www.w3.org/2000/svg"
aria-hidden="true"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
d="M2.25 3h1.386c.51 0 .955.343 1.087.835l.383 1.437M7.5 14.25a3 3 0 00-3 3h15.75m-12.75-3h11.218c1.121-2.3 2.1-4.684 2.924-7.138a60.114 60.114 0 00-16.536-1.84M7.5 14.25L5.106 5.272M6 20.25a.75.75 0 11-1.5 0 .75.75 0 011.5 0zm12.75 0a.75.75 0 11-1.5 0 .75.75 0 011.5 0z"
></path>
</svg>
</td>
</tr>
</tbody>
</table>
</div>
);
}
Editor is loading...