From d59583915cca24d53a11251c54ca7caf6b5edb4e Mon Sep 17 00:00:00 2001 From: Nicu Tofan Date: Mon, 18 Jun 2018 23:25:56 +0300 Subject: Initial implementation for subtasks --- client/components/cards/subtasks.styl | 139 ++++++++++++++++++++++++++++++++++ 1 file changed, 139 insertions(+) create mode 100644 client/components/cards/subtasks.styl (limited to 'client/components/cards/subtasks.styl') diff --git a/client/components/cards/subtasks.styl b/client/components/cards/subtasks.styl new file mode 100644 index 00000000..2d18407c --- /dev/null +++ b/client/components/cards/subtasks.styl @@ -0,0 +1,139 @@ +.js-add-subtask + color: #8c8c8c + +textarea.js-add-subtask-item, textarea.js-edit-subtasks-item + overflow: hidden + word-wrap: break-word + resize: none + height: 34px + +.delete-text + color: #8c8c8c + text-decoration: underline + word-wrap: break-word + float: right + padding-top: 6px + &:hover + color: inherit + +.subtasks-title + .checkbox + float: left + width: 30px + height 30px + font-size: 18px + line-height: 30px + + .title + font-size: 18px + line-height: 25px + + .subtasks-stat + margin: 0 0.5em + float: right + padding-top: 6px + &.is-finished + color: #3cb500 + + .js-delete-subtasks + @extends .delete-text + + +.js-confirm-subtasks-delete + background-color: darken(white, 3%) + position: absolute + float: left; + width: 60% + margin-top: 0 + margin-left: 13% + padding-bottom: 2% + padding-left: 3% + padding-right: 3% + z-index: 17 + border-radius: 3px + + p + position: relative + margin-top: 3% + width: 100% + text-align: center + span + font-weight: bold + + i + font-size: 2em + + .js-subtasks-delete-buttons + position: relative + padding: left 2% right 2% + .confirm-subtasks-delete + margin-left: 12% + float: left + .toggle-delete-subtasks-dialog + margin-right: 12% + float: right + +#card-details-overlay + top: 0 + bottom: -600px + right: 0 + +.subtasks + background: darken(white, 3%) + + &.placeholder + background: darken(white, 20%) + border-radius: 2px + + &.ui-sortable-helper + box-shadow: -2px 2px 8px rgba(0, 0, 0, .3), + 0 0 1px rgba(0, 0, 0, .5) + transform: rotate(4deg) + cursor: grabbing + + +.subtasks-item + margin: 0 0 0 0.1em + line-height: 18px + font-size: 1.1em + margin-top: 3px + display: flex + background: darken(white, 3%) + + &.placeholder + background: darken(white, 20%) + border-radius: 2px + + &.ui-sortable-helper + box-shadow: -2px 2px 8px rgba(0, 0, 0, .3), + 0 0 1px rgba(0, 0, 0, .5) + transform: rotate(4deg) + cursor: grabbing + + &:hover + background-color: darken(white, 8%) + + .check-box + margin: 0.1em 0 0 0; + &.is-checked + border-bottom: 2px solid #3cb500 + border-right: 2px solid #3cb500 + + .item-title + flex: 1 + padding-left: 10px; + &.is-checked + color: #8c8c8c + font-style: italic + & .viewer + p + margin-bottom: 2px + +.js-delete-subtasks-item + margin: 0 0 0.5em 1.33em + @extends .delete-text + padding: 12px 0 0 0 + +.add-subtask-item + margin: 0.2em 0 0.5em 1.33em + display: inline-block -- cgit v1.2.3-1-g7c22