From 3b3e8033696e408e699b911c042361d62ce7b7ac Mon Sep 17 00:00:00 2001 From: Frederic Guillot Date: Sun, 19 Feb 2017 17:08:00 -0500 Subject: Redesign task list view --- assets/sass/_task_board_age.sass | 18 ----------- assets/sass/_task_board_category.sass | 15 --------- assets/sass/_task_board_date.sass | 13 -------- assets/sass/_task_board_icons.sass | 22 ------------- assets/sass/_task_category.sass | 28 ++++++++++++++++ assets/sass/_task_date.sass | 13 ++++++++ assets/sass/_task_icon_age.sass | 22 +++++++++++++ assets/sass/_task_icons.sass | 43 ++++++++++++++++++++++++ assets/sass/_task_list.sass | 61 +++++++++++++++++++++++++++++++++++ assets/sass/app.sass | 9 +++--- 10 files changed, 172 insertions(+), 72 deletions(-) delete mode 100644 assets/sass/_task_board_age.sass delete mode 100644 assets/sass/_task_board_category.sass delete mode 100644 assets/sass/_task_board_date.sass delete mode 100644 assets/sass/_task_board_icons.sass create mode 100644 assets/sass/_task_category.sass create mode 100644 assets/sass/_task_date.sass create mode 100644 assets/sass/_task_icon_age.sass create mode 100644 assets/sass/_task_icons.sass create mode 100644 assets/sass/_task_list.sass (limited to 'assets/sass') diff --git a/assets/sass/_task_board_age.sass b/assets/sass/_task_board_age.sass deleted file mode 100644 index 1e91880f..00000000 --- a/assets/sass/_task_board_age.sass +++ /dev/null @@ -1,18 +0,0 @@ -@import variables - -.task-board-age - display: inline-block - -span - &.task-board-age-total - border: #666 1px solid - padding: 1px 3px 1px 3px - border-top-left-radius: 3px - border-bottom-left-radius: 3px - &.task-board-age-column - border: #666 1px solid - border-left: none - margin-left: -5px - padding: 1px 3px 1px 3px - border-top-right-radius: 3px - border-bottom-right-radius: 3px diff --git a/assets/sass/_task_board_category.sass b/assets/sass/_task_board_category.sass deleted file mode 100644 index 37a4ea47..00000000 --- a/assets/sass/_task_board_category.sass +++ /dev/null @@ -1,15 +0,0 @@ -@import variables - -.task-board-category-container - text-align: right - margin-top: 8px - margin-bottom: 8px - -.task-board-category - font-weight: 500 - color: color('dark') - border: 1px solid #555 - padding: 1px 2px 1px 2px - border-radius: 4px - &:hover - opacity: 0.6 diff --git a/assets/sass/_task_board_date.sass b/assets/sass/_task_board_date.sass deleted file mode 100644 index d0aa1f9c..00000000 --- a/assets/sass/_task_board_date.sass +++ /dev/null @@ -1,13 +0,0 @@ -@import variables - -.task-board-date - font-weight: bold - color: color('dark') - -span - &.task-board-date-today - opacity: 1.0 - color: link-color('primary') - &.task-board-date-overdue - opacity: 1.0 - color: color('error') diff --git a/assets/sass/_task_board_icons.sass b/assets/sass/_task_board_icons.sass deleted file mode 100644 index ae58f108..00000000 --- a/assets/sass/_task_board_icons.sass +++ /dev/null @@ -1,22 +0,0 @@ -@import variables - -.task-board-icons - font-size: size('small') - margin-top: 7px - text-align: right - a - opacity: 0.5 - span - opacity: 0.5 - margin-left: 4px - a - &:hover - opacity: 1.0 - font-weight: bold - .task-board-icons-row - line-height: 22px - .task-score - font-weight: bold - -.flag-milestone - color: green diff --git a/assets/sass/_task_category.sass b/assets/sass/_task_category.sass new file mode 100644 index 00000000..b60aeffa --- /dev/null +++ b/assets/sass/_task_category.sass @@ -0,0 +1,28 @@ +@import variables + +.task-board-category-container + text-align: right + margin-top: 8px + margin-bottom: 8px + +.task-board-category + border: 1px solid #555 + a + &:hover + text-decoration: underline + +.task-list-category + background: bg-color('light') + border: 1px solid #ccc + a + text-decoration: none + color: color('dark') + &:hover + color: link-color('primary') + +.task-board-category, .task-list-category + font-size: size('compact') + font-weight: 500 + color: color('dark') + padding: 1px 3px 1px 2px + border-radius: 3px diff --git a/assets/sass/_task_date.sass b/assets/sass/_task_date.sass new file mode 100644 index 00000000..f4b74004 --- /dev/null +++ b/assets/sass/_task_date.sass @@ -0,0 +1,13 @@ +@import variables + +.task-date + font-weight: 500 + color: color('dark') + +span + &.task-date-today + opacity: 1.0 + color: link-color('primary') + &.task-date-overdue + opacity: 1.0 + color: color('error') diff --git a/assets/sass/_task_icon_age.sass b/assets/sass/_task_icon_age.sass new file mode 100644 index 00000000..8bc8ef91 --- /dev/null +++ b/assets/sass/_task_icon_age.sass @@ -0,0 +1,22 @@ +@import variables + +.task-icon-age + display: inline-block + +span + &.task-icon-age-total + border: 1px solid #e5e5e5 + padding: 1px 3px 1px 3px + border-top-left-radius: 3px + border-bottom-left-radius: 3px + &.task-icon-age-column + border: 1px solid #e5e5e5 + border-left: none + margin-left: -5px + padding: 1px 3px 1px 3px + border-top-right-radius: 3px + border-bottom-right-radius: 3px + +.task-board + span.task-icon-age-total, span.task-icon-age-column + border-color: #666 diff --git a/assets/sass/_task_icons.sass b/assets/sass/_task_icons.sass new file mode 100644 index 00000000..394ed148 --- /dev/null +++ b/assets/sass/_task_icons.sass @@ -0,0 +1,43 @@ +@import variables + +.task-board-icons, .task-list-icons + font-size: size('small') + text-align: right + + a + text-decoration: none + &:hover + color: link-color('hover') + i + color: link-color('hover') + + .task-score + font-weight: bold + + .flag-milestone + color: green + +.task-board-icons + margin-top: 7px + a + opacity: 0.5 + span + opacity: 0.5 + margin-left: 4px + a + &:hover + opacity: 1.0 + font-weight: bold + + .task-board-icons-row + line-height: 22px + +.task-list-icons + line-height: 22px + a, span, i + color: color('light') + opacity: 1.0 + span + margin-left: 5px + @include sm-device + text-align: left \ No newline at end of file diff --git a/assets/sass/_task_list.sass b/assets/sass/_task_list.sass new file mode 100644 index 00000000..258dfb0d --- /dev/null +++ b/assets/sass/_task_list.sass @@ -0,0 +1,61 @@ +@import variables + +.task-list + font-size: size('compact') + +.task-list-header + background: bg-color('primary') + border: 1px solid #e5e5e5 + border-radius: 5px 5px 0 0 + line-height: 35px + padding-left: 3px + padding-right: 3px + text-align: right + +.task-list-row + padding-left: 3px + padding-right: 3px + border-bottom: 1px solid #e5e5e5 + border-right: 1px solid #e5e5e5 + + &:nth-child(odd) + background: bg-color('lighter') + + &:last-child + border-radius: 0 0 5px 5px + + &:hover + background: map-get($highlight-colors, 'background') + border-bottom: 1px solid map-get($highlight-colors, 'border') + border-right: 1px solid map-get($highlight-colors, 'border') + + .task-list-title + font-weight: 500 + &.task-closed + text-decoration: line-through + a + font-style: italic + a + color: color('primary') + text-decoration: none + &:hover, &:focus + text-decoration: underline + + .task-list-details + color: color('light') + font-weight: 300 + line-height: 30px + + .task-list-avatars + display: inline-block + float: left + @include sm-device + float: none + display: block + .task-avatar-assignee + font-weight: 300 + color: color('light') + &:hover + .task-avatar-assignee + font-weight: 400 + color: color('dark') diff --git a/assets/sass/app.sass b/assets/sass/app.sass index d2c414ea..52e6cac7 100644 --- a/assets/sass/app.sass +++ b/assets/sass/app.sass @@ -33,11 +33,12 @@ @import board @import task_board @import task_board_saving_state -@import task_board_category @import task_board_avatar -@import task_board_icons -@import task_board_age -@import task_board_date +@import task_icons +@import task_icon_age +@import task_category +@import task_date +@import task_list @import task_tags @import task_summary @import task_form -- cgit v1.2.3