Files
tabler/shared/components/modals/NewTaskModalContent.astro
T

52 lines
1.9 KiB
Plaintext

---
import Button from '@ui/Button.astro'
import Datepicker from '@ui/Datepicker.astro'
import FormGroup from '@ui/FormGroup.astro'
import Select from '@ui/Select.astro'
---
<div class="modal-header">
<h4 class="modal-title" id="modal-new-task-title">New task</h4>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<form>
<FormGroup label="Task name" for="task-name" class="mb-4">
<input class="form-control" id="task-name" type="text" placeholder="Enter task name" />
</FormGroup>
<FormGroup label="Description" for="task-description" class="mb-4">
<textarea class="form-control" id="task-description" rows="3" placeholder="Enter task description"></textarea>
</FormGroup>
<div class="row">
<div class="col-md-6">
<FormGroup label="Assigned to" for="select-task-assigned" class="mb-4">
<Select key="people" id="task-assigned" indicator="avatar" />
</FormGroup>
</div>
<div class="col-md-6">
<FormGroup label="Priority" for="task-priority" class="mb-4">
<select class="form-select" id="task-priority">
<option value="low">Low</option>
<option value="medium" selected>Medium</option>
<option value="high">High</option>
</select>
</FormGroup>
</div>
</div>
<div class="row">
<div class="col-md-6">
<FormGroup label="Due date" for="datepicker-task-due-date" class="mb-4">
<Datepicker layout="icon" id="task-due-date" />
</FormGroup>
</div>
<div class="col-md-6">
<FormGroup label="Category / Tags" for="select-task-category" class="mb-4">
<Select key="tags" id="task-category" />
</FormGroup>
</div>
</div>
<Button type="submit" text="Create task" color="primary" block class="mt-4" />
</form>
</div>