Events performance (#1645)

* rearrange event route and splitted into several components

* useIntersectionObserver

* re-arrange

* searchstring improvement

* added xs tailwind breakpoint

* useOuterClick hook

* cleaned up

* removed some video controls for mobile devices

* lint

* moved hooks to global folder

* moved buttons for small devices

* added button groups

Co-authored-by: Bernt Christian Egeland <cbegelan@gmail.com>
This commit is contained in:
Bernt Christian Egeland
2021-09-03 14:11:23 +02:00
committed by GitHub
parent b8df419bad
commit 00ff76a0b9
18 changed files with 572 additions and 352 deletions

View File

@@ -14,9 +14,9 @@ export function Thead({ children, className, ...attrs }) {
);
}
export function Tbody({ children, className, ...attrs }) {
export function Tbody({ children, className, reference, ...attrs }) {
return (
<tbody className={className} {...attrs}>
<tbody ref={reference} className={className} {...attrs}>
{children}
</tbody>
);
@@ -30,9 +30,10 @@ export function Tfoot({ children, className = '', ...attrs }) {
);
}
export function Tr({ children, className = '', ...attrs }) {
export function Tr({ children, className = '', reference, ...attrs }) {
return (
<tr
ref={reference}
className={`border-b border-gray-200 dark:border-gray-700 hover:bg-gray-100 dark:hover:bg-gray-800 ${className}`}
{...attrs}
>
@@ -49,9 +50,9 @@ export function Th({ children, className = '', colspan, ...attrs }) {
);
}
export function Td({ children, className = '', colspan, ...attrs }) {
export function Td({ children, className = '', reference, colspan, ...attrs }) {
return (
<td className={`p-2 px-1 lg:p-4 ${className}`} colSpan={colspan} {...attrs}>
<td ref={reference} className={`p-2 px-1 lg:p-4 ${className}`} colSpan={colspan} {...attrs}>
{children}
</td>
);