VDMDI/CT
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

change layout styles, move BoardPage to separate file

Browse Source
This commit is contained in:
marlon-erler
2024-07-23 12:43:30 +02:00
parent 12947f8063
commit 3aae049106
7 changed files with 277 additions and 223 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/View/ChatPages/taskPage.tsx
+34 -31
View File
@@ -1,6 +1,7 @@
import * as React from "bloatless-react";
import { BoardInfoToEntry } from "../Components/boardEntry";
import { BoardPage } from "./boardPage";
import TaskPageViewModel from "../../ViewModel/Pages/taskPageViewModel";
import { translations } from "../translations";
@@ -13,53 +14,55 @@ export function TaskPage(taskPageViewModel: TaskPageViewModel) {
const selectedBoard = taskPageViewModel.selectedBoard.value;
if (selectedBoard == undefined) {
return [
<div class="content align-center justify-center">
<div class="pane align-center justify-center">
<span class="secondary">
{translations.chatPage.task.noBoardSelected}
</span>
</div>,
];
} else {
return [<div class="toolbar"></div>, <div class="content"></div>];
return BoardPage(selectedBoard);
}
}
);
return (
<div id="task-page">
<div class="pane side">
<div class="toolbar">
<div class="flex-row width-input">
<input
bind:value={taskPageViewModel.newBoardNameInput}
on:enter={taskPageViewModel.createBoard}
placeholder={translations.chatPage.task.newBoardNamePlaceholder}
></input>
<button
class="primary"
aria-label={
translations.chatPage.task.createBoardButtonAudioLabel
}
on:click={taskPageViewModel.createBoard}
toggle:disabled={taskPageViewModel.cannotCreateBoard}
>
<span class="icon">add</span>
</button>
<div class="pane-wrapper side">
<div class="pane">
<div class="toolbar">
<div class="flex-row width-input">
<input
bind:value={taskPageViewModel.newBoardNameInput}
on:enter={taskPageViewModel.createBoard}
placeholder={translations.chatPage.task.newBoardNamePlaceholder}
></input>
<button
class="primary"
aria-label={
translations.chatPage.task.createBoardButtonAudioLabel
}
on:click={taskPageViewModel.createBoard}
toggle:disabled={taskPageViewModel.cannotCreateBoard}
>
<span class="icon">add</span>
</button>
</div>
</div>
<div class="content">
<div
class="grid gap"
style="grid-template-columns: repeat(auto-fill, minmax(12rem, 1fr))"
children:append={[
taskPageViewModel.boardViewModels,
BoardInfoToEntry,
]}
></div>
</div>
</div>
<div class="content">
<div
class="grid gap"
style="grid-template-columns: repeat(auto-fill, minmax(12rem, 1fr))"
children:append={[
taskPageViewModel.boardViewModels,
BoardInfoToEntry,
]}
></div>
</div>
</div>
<div class="pane" children:set={paneContent}></div>
<div class="pane-wrapper" children:set={paneContent}></div>
</div>
);
}