Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Markup and styles for upcoming task UI

See original GitHub issue

Issue Description

Problem

hardcode any component you’re working on
test it out without having whole models instantiated
CSS class naming should go as follow, following BEM conventions.

task-board

task-list task-list__title

task-card task-card__title task-card__number task-card__type task-card__time

And the modifiers could be: --inbox, --backlog, --progress, --done (e.g. task__card--done)

Subtasks

task-board (holds the four columns, never taller than window, scrolls left/right to show columns)
task-list (the column)
task-card (the individual task)

References

Progress on: #2 (design repo)

Issue Analytics

State:
Created 6 years ago
Reactions:3
Comments:16 (12 by maintainers)

Top GitHub Comments

1reaction

rluedercommented, Dec 8, 2016

Sounds good! let’s not let semantics paralysis get to us! (btw I checked Trello and they use board, list and card) 👍

1reaction

joshsmithcommented, Dec 8, 2016

I agree that the axis probably would not flip. I do think though that swim lane and lane are too methodology-specific and not as friendly for ESOL speakers. I think either list or column wins out, and prefer list since it matches closer to the TaskList object we’re likely to have on the backend.

Top Results From Across the Web

Task List - Dribbble

Task List. 1,035 inspirational designs, illustrations, and graphic elements from the world's best designers. Want more inspiration?

UI style guide for editor add-ons | Apps Script

Editor add-ons build user interfaces (menus, sidebars, and dialogs) using Apps Script's HTML service. Because the interfaces are developed in HTML and CSS, ......

Bootstrap To Do List - free examples, templates & tutorial

A template of a ToDo list card with ALL, ACTIVE and COMPLETED tasks tabs - for organizing your tasklist. New task... Add.

57 Best To-do List Apps of 2023 for Personal Task Management

Calendar view to keep an eye on all upcoming tasks. Drag and drop tasks in the calendar to ... Multiple text formatting options...

Designing your app with UI templates - Teams - Microsoft Learn

Learn to design your app faster with standardized UI components, layouts, and patterns commonly seen across Microsoft Teams.