JezK
Edit File: tablepress-custom.css
/* ==== Base Table Layout ==== */ .tablepress { width: 100%; border-collapse: collapse; font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; font-size: 15px; background-color: #ffffff; border: 1px solid #e5e7eb; box-shadow: 0 2px 5px rgba(0,0,0,0.05); border-radius: 6px; overflow: hidden; } /* ==== Header Styling ==== */ .tablepress thead th { background-color: #1e293b; color: #ffffff; font-weight: 600; text-align: left; padding: 14px 18px; border-bottom: 2px solid #0f172a; } /* ==== Body Cell Styling ==== */ .tablepress tbody td { padding: 12px 16px; border-bottom: 1px solid #e5e7eb; color: #1f2937; } /* ==== Alternating Row Colors ==== */ .tablepress tbody tr:nth-child(even) { background-color: #f9fafb; } /* ==== Hover Effect on Rows ==== */ .tablepress tbody tr:hover td { background-color: #e0f2fe; } /* ==== Footer Styling (if used) ==== */ .tablepress tfoot th { background-color: #1e293b; color: white; padding: 12px 16px; border-top: 2px solid #0f172a; } /* ==== First Column Emphasis (optional) ==== */ .tablepress .column-1 { font-weight: 600; color: #111827; } /* ==== Custom Row Highlight (row 2 example) ==== */ .tablepress .row-2 td { background-color: #fef9c3; } /* ==== Responsive Fixes (Optional) ==== */ @media screen and (max-width: 768px) { .tablepress { font-size: 14px; } }