chris/frigate
1
0
Fork 0
forked from Github/frigate
Code Pull Requests Packages Activity

feat(web): layout & auto-update debug page

Browse Source
This commit is contained in:
Paul Armstrong
2021-01-18 10:49:00 -08:00
committed by Blake Blackshear
parent 26ba29b538
commit 18db6daf0a
4 changed files with 108 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

30
web/src/components/Table.jsx
View File

@@ -1,29 +1,31 @@
import { h } from 'preact';
export function Table({ children }) {
return <table className="table-auto border-collapse text-gray-900 dark:text-gray-200">{children}</table>;
export function Table({ children, className }) {
return (
<table className={`table-auto border-collapse text-gray-900 dark:text-gray-200 ${className}`}>{children}</table>
);
}
export function Thead({ children }) {
return <thead className="">{children}</thead>;
export function Thead({ children, className }) {
return <thead className={`${className}`}>{children}</thead>;
}
export function Tbody({ children }) {
return <tbody className="">{children}</tbody>;
export function Tbody({ children, className }) {
return <tbody className={`${className}`}>{children}</tbody>;
}
export function Tfoot({ children }) {
return <tfoot className="">{children}</tfoot>;
export function Tfoot({ children, className }) {
return <tfoot className={`${className}`}>{children}</tfoot>;
}
export function Tr({ children, index }) {
return <tr className={`${index % 2 ? 'bg-gray-200 ' : ''}`}>{children}</tr>;
export function Tr({ children, className, index }) {
return <tr className={`${index % 2 ? 'bg-gray-200 ' : ''} ${className}`}>{children}</tr>;
}
export function Th({ children }) {
return <th className="border-b-2 border-gray-400 p-4 text-left">{children}</th>;
export function Th({ children, className }) {
return <th className={`border-b-2 border-gray-400 p-4 text-left ${className}`}>{children}</th>;
}
export function Td({ children }) {
return <td className="p-4">{children}</td>;
export function Td({ children, className }) {
return <td className={`p-4 ${className}`}>{children}</td>;
}