datalore/buzzword-bingo
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 1 Wiki Activity

Made Bingo resize with screen size

Browse Source
This commit is contained in:
datalore 2023-11-05 13:26:41 +01:00
parent 96e9a5c169
commit 75d6ceacb0
2 changed files with 2 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/app/components/bingo.tsx
View File

@ -13,7 +13,7 @@ export default function Bingo({size, items}: Props){
rows[i] = activeItems.slice(i * size, (i + 1) * size);
}
return(
<table className='w-1/2 table bg-primary text-primary-content m-auto'>
<table className='w-1/2 table table-xs sm:table-sm md:table-md bg-primary text-primary-content m-auto'>
<tbody>
{rows.map((item, index) => <BingoRow key={index} items={item}/>)}
</tbody>

2
src/app/components/bingoitem.tsx
View File

@ -9,6 +9,6 @@ export default function BingoItem({text}: Props){
const [clicked, setClicked] = React.useState(false);
return(
<td><a className={clsx("btn btn-ghost w-full", {"bg-primary-focus":clicked})} onClick={() => setClicked(!clicked)}>{text}</a></td>
<td><a className={clsx("btn btn-xs sm:btn-sm md:btn-md btn-ghost w-full", {"bg-primary-focus":clicked})} onClick={() => setClicked(!clicked)}>{text}</a></td>
);
}