From e179a5a94d16f63e96f627e2b02c1d7e755bd130 Mon Sep 17 00:00:00 2001
From: Chris Lawton <chris.lawton@torchbox.com>
Date: Thu, 1 Mar 2018 10:58:49 +0000
Subject: [PATCH] styling for comments form
---
.../src/sass/apply/components/_comment.scss | 33 +++++++++++++++++++
.../src/sass/apply/components/_form.scss | 17 ++++++++++
.../src/sass/apply/components/_wrapper.scss | 8 +++++
opentech/static_src/src/sass/apply/main.scss | 1 +
4 files changed, 59 insertions(+)
create mode 100644 opentech/static_src/src/sass/apply/components/_comment.scss
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 000000000..d09963a1b
--- /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 fc199c84c..e86ab585e 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 285439ce1..8318ee68f 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 fc9f45a98..e4a86372b 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';
--
GitLab