diff --git a/app/styles/layout/us-detail.scss b/app/styles/layout/us-detail.scss index 2b29554e..2f9f7809 100644 --- a/app/styles/layout/us-detail.scss +++ b/app/styles/layout/us-detail.scss @@ -114,34 +114,6 @@ } } -.us-activity-tabs { - @extend %title; - border-bottom: 3px solid $gray-light; - padding: .5rem 0; - li { - @extend %large; - display: inline-block; - &:first-child { - border-right: 1px solid $gray-light; - } - } - a { - @include transition(color .2s ease-in); - color: $gray-light; - padding: 0 2rem; - &.active { - color: $grayer; - } - &:hover { - @include transition(color .2s ease-in); - color: $green-taiga; - } - } - .icon { - margin-right: .5rem; - } -} - .comment-list { padding: 1rem; } diff --git a/app/styles/main.scss b/app/styles/main.scss index 1c90000c..f117b6f8 100755 --- a/app/styles/main.scss +++ b/app/styles/main.scss @@ -60,10 +60,8 @@ $prefix-for-spec: true; @import 'modules/common/colors-table'; @import 'modules/common/category-config'; @import 'modules/common/attachments'; -@import 'modules/common/comments'; -@import 'modules/common/comment-activity'; -@import 'modules/common/activity'; @import 'modules/common/related-tasks'; +@import 'modules/common/history'; //Project modules @import 'modules/home-projects-list'; diff --git a/app/styles/modules/common/activity.scss b/app/styles/modules/common/activity.scss deleted file mode 100644 index 711f9b6b..00000000 --- a/app/styles/modules/common/activity.scss +++ /dev/null @@ -1,51 +0,0 @@ -.activity-single { - @include table-flex; - border-bottom: 2px solid $gray-light; - padding: 2rem 0; - position: relative; - &:first-child { - margin-top: 0; - } - .username { - color: $green-taiga; - margin-bottom: 1rem; - } - .activity-user { - @include table-flex-child(1, 50px, 0); - img { - max-width: 70px; - width: 100%; - } - } - .activity-username { - border-bottom: 1px dotted $gray-light; - color: $green-taiga; - margin-bottom: 1rem; - } - .activity-content { - @include table-flex-child(20, 150px, 0); - } - .us-activity { - background: $whitish; - .activity-inner { - display: none; - } - } - .date { - @extend %small; - color: $gray-light; - margin-left: 1rem; - } -} - -.more-activity { - @extend %small; - border-bottom: 1px solid $gray-light; - color: $gray-light; - display: block; - padding: 1rem; - .prev-activity-num { - color: $green-taiga; - margin-left: .5rem; - } -} diff --git a/app/styles/modules/common/comment-activity.scss b/app/styles/modules/common/comment-activity.scss deleted file mode 100644 index 6042878a..00000000 --- a/app/styles/modules/common/comment-activity.scss +++ /dev/null @@ -1,41 +0,0 @@ -.us-activity { - margin-bottom: 1rem; - padding: 0 1rem; -} - -.activity-title { - display: block; - padding: .5rem; - &:hover { - .icon { - @include transform(rotate(180deg)); - @include transition(all.2s linear); - color: $green-taiga; - } - } - .icon { - @include transform(rotate(0)); - @include transition(all.2s linear); - color: $grayer; - float: right; - } -} - -.activity-inner { - @include table-flex; - border-bottom: 1px solid $gray-light; - padding: 1rem 0; - &:last-child { - border-bottom: 0; - } - .activity-changed, - .activity-fromto { - @include table-flex-child(1, 50px, 0); - } - .activity-changed { - @extend %bold; - } - .activity-fromto { - @extend %small; - } -} diff --git a/app/styles/modules/common/comments.scss b/app/styles/modules/common/history.scss similarity index 54% rename from app/styles/modules/common/comments.scss rename to app/styles/modules/common/history.scss index 59c2fc85..bde6d604 100644 --- a/app/styles/modules/common/comments.scss +++ b/app/styles/modules/common/history.scss @@ -1,3 +1,74 @@ +.history { + margin-bottom: 1rem; + padding: 0 1rem; +} + + +.changes-title { + display: block; + padding: .5rem; + &:hover { + .icon { + @include transform(rotate(180deg)); + @include transition(all.2s linear); + color: $green-taiga; + } + } + .icon { + @include transform(rotate(0)); + @include transition(all.2s linear); + color: $grayer; + float: right; + } +} + +.change-entry { + @include table-flex; + border-bottom: 1px solid $gray-light; + padding: .5rem; + &:last-child { + border-bottom: 0; + } + .activity-changed, + .activity-fromto { + @include table-flex-child(1, 50px, 0); + } + .activity-changed { + @extend %bold; + } + .activity-fromto { + @extend %small; + } +} + +.history-tabs { + @extend %title; + border-bottom: 3px solid $gray-light; + padding: .5rem 0; + li { + @extend %large; + display: inline-block; + &:first-child { + border-right: 1px solid $gray-light; + } + } + a { + @include transition(color .2s ease-in); + color: $gray-light; + padding: 0 2rem; + &.active { + color: $grayer; + } + &:hover { + @include transition(color .2s ease-in); + color: $green-taiga; + } + } + .icon { + margin-right: .5rem; + } +} + .add-comment { @include clearfix; textarea { @@ -37,66 +108,6 @@ a.show-more-comments { } } -.comment-single { - @include table-flex; - border-bottom: 2px solid $gray-light; - padding: 1rem 0; - position: relative; - &:hover { - .delete-comment { - opacity: 1; - @include transition(opacity .2s linear); - } - } - &:first-child { - margin-top: 0; - } - &:last-child { - border: 0; - } - .username { - color: $green-taiga; - display: block; - margin-bottom: 1rem; - } - .comment-user { - @include table-flex-child(1, 50px, 0); - img { - max-width: 70px; - width: 100%; - } - } - .comment-content { - @include table-flex-child(20, 150px, 0); - } - .us-activity { - background: $whitish; - .activity-inner { - display: none; - &.active { - display: flex; - } - } - } - .date { - @extend %small; - color: $gray-light; - } - .delete-comment { - @include transition(all .2s linear); - bottom: 2rem; - color: $grayer; - opacity: 0; - position: absolute; - right: 1.5rem; - &:hover { - @include transition(color .2s linear); - color: $red; - - } - } -} - .more-comments { @extend %small; border-bottom: 1px solid $gray-light; @@ -108,6 +119,7 @@ a.show-more-comments { margin-left: .5rem; } } + .comment-list { &.activeanimation { .comment-single.ng-enter:last-child, @@ -124,3 +136,70 @@ a.show-more-comments { } } } + +.activity-single { + @include table-flex; + border-bottom: 2px solid $gray-light; + padding: 2rem 0; + position: relative; + &:first-child { + margin-top: 0; + } + .username { + color: $green-taiga; + margin-bottom: 0.5rem; + } + .activity-user { + @include table-flex-child(1, 50px, 0); + img { + max-width: 70px; + width: 100%; + } + } + .activity-username { + color: $green-taiga; + margin-bottom: 1rem; + } + + .activity-content { + @include table-flex-child(20, 150px, 0); + } + + .changes { + background: $whitish; + .change-entry { + display: none; + + &.active { + display: flex; + } + } + } + .date { + @extend %small; + color: $gray-light; + margin-left: 1rem; + } + + .wysiwyg { + margin-bottom: 0px; + } + + &.activity { + .change-entry { + display: flex; + } + } +} + +.more-activity { + @extend %small; + border-bottom: 1px solid $gray-light; + color: $gray-light; + display: block; + padding: 1rem; + .prev-activity-num { + color: $green-taiga; + margin-left: .5rem; + } +}