diff --git a/opentech/static_src/src/sass/apply/components/_comment.scss b/opentech/static_src/src/sass/apply/components/_comment.scss new file mode 100644 index 0000000000000000000000000000000000000000..d09963a1b4f19dacc576c42105ed6ef3f1ca40af --- /dev/null +++ b/opentech/static_src/src/sass/apply/components/_comment.scss @@ -0,0 +1,33 @@ +.comment { + padding-bottom: 20px; + margin-bottom: 20px; + border-bottom: 1px solid $color--light-mid-grey; + + @include media-query(tablet-portrait) { + max-width: 60%; + } + + &:first-of-type { + margin-top: 20px; + } + + &:last-of-type { + padding-bottom: 0; + margin-bottom: 0; + border-bottom: 0; + } + + &__time, + &__user, + &__copy { + margin: 0; + } + + &__time { + font-size: map-get($font-sizes, milli); + } + + &__user { + font-weight: $weight--semibold; + } +} diff --git a/opentech/static_src/src/sass/apply/components/_form.scss b/opentech/static_src/src/sass/apply/components/_form.scss index fc199c84cb030ffdfcb669693c9425de8cb1bb72..e86ab585eb3d953da9b0618b02a399e4c48c2ef9 100644 --- a/opentech/static_src/src/sass/apply/components/_form.scss +++ b/opentech/static_src/src/sass/apply/components/_form.scss @@ -44,5 +44,22 @@ margin-top: 15px; } } + + textarea, + &__textarea { + width: 100%; + padding: 10px; + border: 1px solid lightgrey; + + &--comments { + display: block; + height: 100px; + margin-bottom: 20px; + + @include media-query(tablet-portrait) { + max-width: 60%; + }; + } + } } diff --git a/opentech/static_src/src/sass/apply/components/_wrapper.scss b/opentech/static_src/src/sass/apply/components/_wrapper.scss index 285439ce12bfaf3e4ec8b3cdfae9321a305ecab7..8318ee68f82a687c3aba44942a2cd62cbe6aa09b 100644 --- a/opentech/static_src/src/sass/apply/components/_wrapper.scss +++ b/opentech/static_src/src/sass/apply/components/_wrapper.scss @@ -246,4 +246,12 @@ margin-top: 50px; } } + + &--comments { + padding: 20px; + + @include media-query(tablet-portrait) { + padding: 30px; + } + } } diff --git a/opentech/static_src/src/sass/apply/main.scss b/opentech/static_src/src/sass/apply/main.scss index fc9f45a988474c82d1edb94a9323bd2eccd6d263..e4a86372b041d9af176236fc823545c6e7f34790 100755 --- a/opentech/static_src/src/sass/apply/main.scss +++ b/opentech/static_src/src/sass/apply/main.scss @@ -12,6 +12,7 @@ // Components @import 'components/activity-feed'; +@import 'components/comment'; @import 'components/button'; @import 'components/feed'; @import 'components/grid';