diff --git a/src/index.js b/src/index.js index 9164995..078e24d 100644 --- a/src/index.js +++ b/src/index.js @@ -8,3 +8,5 @@ import "bootstrap-icons/font/bootstrap-icons.scss" import "bootstrap/scss/bootstrap.scss" import * as bootstrap from "bootstrap" + +import "./scss/list.scss" diff --git a/src/scss/list.scss b/src/scss/list.scss new file mode 100644 index 0000000..fade689 --- /dev/null +++ b/src/scss/list.scss @@ -0,0 +1,46 @@ +// task list view stylesheet + +$list-img-max-size: 5rem; + +.task { + [aria-label=TaskAssignee] { + img.avatar { + max-height: $list-img-max-size; + max-width: $list-img-max-size; + margin-bottom: 1rem; + } + } + + [aria-label=TaskDetails] { + div:first-of-type { + margin-bottom: 0.5rem; + } + } + + [aria-label=TaskActions] { + .disabled { + pointer-events: none; + color: var(--bs-secondary-color); + } + } + + // action buttons + [aria-label=complete] { + color: var(--bs-success); + } + + [aria-label=reopen] { + color: var(--bs-warning); + } + + [aria-label=delete] { + color: var(--bs-danger); + } +} + +.task[data-task-completed=true] { + .task-detail-ref { + color: var(--bs-secondary-color) !important; + text-decoration: line-through !important; + } +} diff --git a/src/views/_template.hbs b/src/views/list_view.hbs similarity index 78% rename from src/views/_template.hbs rename to src/views/list_view.hbs index 6b4fbbf..91f37b5 100644 --- a/src/views/_template.hbs +++ b/src/views/list_view.hbs @@ -1,5 +1,5 @@ - + - {{title}} | {{site}} + {{title}} | Task Tracker +{{! TODO: add header/navbar }}
- + {{>partials/list_main}}
diff --git a/src/views/partials/list_main.hbs b/src/views/partials/list_main.hbs new file mode 100644 index 0000000..ded18c1 --- /dev/null +++ b/src/views/partials/list_main.hbs @@ -0,0 +1,74 @@ +
+
+
+

 task list

+
+
+ + + + + + + + + + + {{! repeating tasks block }} + {{>list_task + pk="a76e9fac-f8ca-45ca-ae57-063459443ff0" + summary="Shield at the holodeck was the energy of assimilation, lowered to a chemical c-beam." + description="The creature is more transformator now than starship. solid and always quirky. + energy at the wormhole was the life of ellipse, grabed to a mysterious proton. + adventure at the space station was the flight of honor, translated to a unrelated hur'q. + Mermaids reproduce from pressures like sub-light hur'qs?" + assignee_image="https://i.pravatar.cc/?u=DoraHeadstrong@dayrep.com" + assignee_first_name="Dora" + assignee_last_name="Headstrong" + completed=false + can_edit=false + }} + {{>list_task + pk="a76e9fac-f8ca-45ca-ae57-063459443ff0" + summary="Sensor at the universe was the pattern of love, empowered to a futile alien." + description="The nanomachine is more admiral now than processor. senior and patiently dead. + pattern at the center was the death of attitude, loved to a biological ship. + sensor at the space station was the assimilation of resistance, destroyed to an ancient crew. + The collective admiral finally manifests the planet?" + assignee_image="https://i.pravatar.cc/?u=PippinSackville-Baggins@jourrapide.com" + assignee_first_name="Pippin" + assignee_last_name="Sackville-Baggins" + completed=false + can_edit=true + }} + {{>list_task + pk="a76e9fac-f8ca-45ca-ae57-063459443ff0" + summary="Flight at the ready room was the vision of alignment, empowered to a quirky vogon." + description="The particle is more creature now than transformator. virtual and rudely lunar. + starlight travel at the ready room was the powerdrain of faith, evacuated to a most unusual moon. + courage at the alpha quadrant was the ionic cannon of tragedy, invaded to a modern space suit. + The seismic admiral patiently fights the proton?" + assignee_image="https://i.pravatar.cc/?u=TobyMugwort@armyspy.com" + assignee_first_name="Toby" + assignee_last_name="Mugwort" + completed=true + can_edit=true + }} + +
task list
AssigneeTask SummaryActions
+
+ +
+
diff --git a/src/views/partials/list_task.hbs b/src/views/partials/list_task.hbs new file mode 100644 index 0000000..db28f79 --- /dev/null +++ b/src/views/partials/list_task.hbs @@ -0,0 +1,26 @@ + + + avatar +
+ {{assignee_first_name}} {{assignee_last_name}} + + +
+ {{summary}} +
+

{{description}}

+ + +
+ {{#if completed}} + {{! TODO: patch-status ? }} + {{else}} + {{! TODO: patch-status? }} + {{/if}} + +
+ + diff --git a/webpack.config.js b/webpack.config.js index 7423693..2087a21 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -30,8 +30,11 @@ module.exports = { plugins: [ new MiniCSSExtractPlugin({filename:"css/main.min.css"}), new HTMLWebpackPlugin({ - template: path.resolve(__dirname, "src/views/_template.hbs"), - filename: "index.html" + template: path.resolve(__dirname, "src/views/list_view.hbs"), + filename: "tasks/task_list.html", + templateParameters: { + title: "Tasks List", + } }) ], module: {