steffo/todocolors
steffo/todocolors
1
Fork 0
mirror of https://github.com/Steffo99/todocolors.git synced 2024-11-22 16:24:19 +00:00
Code Activity

Tweak task group column size

Browse source
This commit is contained in:
Steffo 2023-08-03 17:41:24 +02:00
parent 9a4a857e9c
commit e771b49351
Signed by: steffo
GPG key ID: 2A24051445686895
3 changed files with 16 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
todoblue/src/app/board/[board]/BoardMain.tsx
View file

@ -10,13 +10,13 @@ export function BoardMain() {
switch(websocketState) { switch(websocketState) {
case undefined: case undefined:
return <BoardMainIcon icon={<FontAwesomeIcon icon={faGear} spin/>} text={"Caricamento..."}/> return <BoardMainIcon icon={<FontAwesomeIcon size={"4x"} icon={faGear} spin/>} text={"Caricamento..."}/>
case WebSocket.CONNECTING: case WebSocket.CONNECTING:
return <BoardMainIcon icon={<FontAwesomeIcon icon={faArrowsSpin} spin/>} text={"Connessione..."}/> return <BoardMainIcon icon={<FontAwesomeIcon size={"4x"} icon={faArrowsSpin} spin/>} text={"Connessione..."}/>
case WebSocket.OPEN: case WebSocket.OPEN:
return <BoardMainTaskGroups/> return <BoardMainTaskGroups/>
case WebSocket.CLOSING: case WebSocket.CLOSING:
case WebSocket.CLOSED: case WebSocket.CLOSED:
return <BoardMainIcon icon={<FontAwesomeIcon icon={faExclamationCircle}/>} text={"Errore"} className={"red"}/> return <BoardMainIcon icon={<FontAwesomeIcon size={"4x"} icon={faExclamationCircle}/>} text={"Errore"} className={"red"}/>
} }
} }

11
todoblue/src/app/board/[board]/BoardMainTaskGroups.module.css Normal file
View file

@ -0,0 +1,11 @@
.boardMainTaskGroups {
display: flex;
gap: 8px;
justify-content: center;
flex-wrap: wrap;
}
.boardMainTaskGroups > div {
flex-basis: 240px;
flex-shrink: 0;
}

3
todoblue/src/app/board/[board]/BoardMainTaskGroups.tsx
View file

@ -1,12 +1,13 @@
import {TaskGroupColumn} from "@/app/board/[board]/TaskGroupColumn" import {TaskGroupColumn} from "@/app/board/[board]/TaskGroupColumn"
import {useBoardContext} from "@/app/board/[board]/useBoardContext" import {useBoardContext} from "@/app/board/[board]/useBoardContext"
import style from "./BoardMainTaskGroups.module.css"
export function BoardMainTaskGroups() { export function BoardMainTaskGroups() {
const {taskGroups} = useBoardContext() const {taskGroups} = useBoardContext()
return ( return (
<main className={"chapter-5"}> <main className={style.boardMainTaskGroups}>
{taskGroups.map((tg) => <TaskGroupColumn taskGroup={tg}/>)} {taskGroups.map((tg) => <TaskGroupColumn taskGroup={tg}/>)}
</main> </main>
) )