From afbebd0d5d620b2f7396d34bc0c72bcb639c394e Mon Sep 17 00:00:00 2001
From: igoradamenko <mail@igoradamenko.com>
Date: Thu, 3 May 2018 00:22:13 +0300
Subject: [PATCH] improve colors and offsets of comment form

---
 web/app/components/comment/__action/comment__action.scss    | 4 ++--
 web/app/components/comment/_replying/comment_replying.scss  | 5 +++--
 .../input/__button/_type/_send/input__button_type_send.scss | 4 ++--
 web/app/components/input/__buttons/input__buttons.scss      | 2 +-
 web/app/components/input/__field/input__field.scss          | 6 ++++--
 web/app/components/input/input.scss                         | 2 +-
 6 files changed, 13 insertions(+), 10 deletions(-)

diff --git a/web/app/components/comment/__action/comment__action.scss b/web/app/components/comment/__action/comment__action.scss
index 2403bc3e..a324230c 100644
--- a/web/app/components/comment/__action/comment__action.scss
+++ b/web/app/components/comment/__action/comment__action.scss
@@ -2,10 +2,10 @@
   font-size: 14px;
   cursor: pointer;
   user-select: none;
-  color: #8CD4D4;
+  color: #259C9A;
 
   &:hover {
-    color: #0aa;
+    color: #31c7c5;
   }
 
   &:focus {
diff --git a/web/app/components/comment/_replying/comment_replying.scss b/web/app/components/comment/_replying/comment_replying.scss
index fa54e0dc..e5844853 100644
--- a/web/app/components/comment/_replying/comment_replying.scss
+++ b/web/app/components/comment/_replying/comment_replying.scss
@@ -1,5 +1,5 @@
 .comment_replying {
-  border: 3px solid #eee;
+  border: 8px solid #eee;
   padding-bottom: 0;
 
   @media (min-width: 768px) {
@@ -19,9 +19,10 @@
     border-left-width: 0;
     border-right-width: 0;
     border-bottom-width: 0;
+    border-top-width: 8px;
 
     @media (min-width: 768px) {
-      border: 3px solid #eee;
+      border: 12px solid #eee;
     }
   }
 
diff --git a/web/app/components/input/__button/_type/_send/input__button_type_send.scss b/web/app/components/input/__button/_type/_send/input__button_type_send.scss
index 05475e6f..313b0f5a 100644
--- a/web/app/components/input/__button/_type/_send/input__button_type_send.scss
+++ b/web/app/components/input/__button/_type/_send/input__button_type_send.scss
@@ -1,8 +1,8 @@
 .input__button_type_send {
-  background: #0aa;
+  background: #259C9A;
   color: #fff;
 
   &:hover, &:focus {
-    background: #06c5c5;
+    background: #0aa;
   }
 }
diff --git a/web/app/components/input/__buttons/input__buttons.scss b/web/app/components/input/__buttons/input__buttons.scss
index 91718a82..599e19a7 100644
--- a/web/app/components/input/__buttons/input__buttons.scss
+++ b/web/app/components/input/__buttons/input__buttons.scss
@@ -1,3 +1,3 @@
 .input__buttons {
-  margin-top: 4px;
+  margin-top: 8px;
 }
diff --git a/web/app/components/input/__field/input__field.scss b/web/app/components/input/__field/input__field.scss
index ad177ea6..e9929f94 100644
--- a/web/app/components/input/__field/input__field.scss
+++ b/web/app/components/input/__field/input__field.scss
@@ -2,7 +2,8 @@
   $lineHeight: 1.4;
   $fontSize: 16px;
   $paddingVrt: 10px;
-  $height: $fontSize * $lineHeight + $paddingVrt * 2;
+  $lines: 3;
+  $height: $fontSize * $lineHeight * $lines + $paddingVrt * 2;
 
   box-sizing: border-box;
   width: 100%;
@@ -12,11 +13,12 @@
   font-family: 'PT Sans', Helvetica, Arial, sans-serif;
   font-size: $fontSize;
   line-height: $lineHeight;
+  background: #fff;
   border: 0;
   resize: none;
 
   &:focus {
-    box-shadow: inset 0 0 0 2px #0aa;
+    box-shadow: inset 0 0 0 2px #259C9A;
     outline: none;
   }
 
diff --git a/web/app/components/input/input.scss b/web/app/components/input/input.scss
index 84ecf657..8a524a07 100644
--- a/web/app/components/input/input.scss
+++ b/web/app/components/input/input.scss
@@ -2,7 +2,7 @@
   position: relative;
   display: block;
   font-size: 0;
-  border: 3px solid #eee;
+  border: 12px solid #eee;
   border-radius: 2px;
   background: #eee;
 }