From 48b66e4352f7e209b3d640c3380a62573400090b Mon Sep 17 00:00:00 2001
From: Dank Gabs <dankgabs@protonmail.com>
Date: Mon, 22 Jul 2019 23:22:42 -0400
Subject: [PATCH] Adjustments made to the standard form text input and textarea
 for both themes.

---
 .../gabsocial/features/groups/create/index.js |  2 +-
 .../gabsocial/features/groups/edit/index.js   |  2 +-
 app/javascript/styles/gabsocial/_mixins.scss  |  8 ++-
 .../gabsocial/components/group-form.scss      |  8 +++
 .../styles/gabsocial/components/inputs.scss   | 49 +++++++------------
 5 files changed, 36 insertions(+), 33 deletions(-)

diff --git a/app/javascript/gabsocial/features/groups/create/index.js b/app/javascript/gabsocial/features/groups/create/index.js
index 97b376a8..28079f97 100644
--- a/app/javascript/gabsocial/features/groups/create/index.js
+++ b/app/javascript/gabsocial/features/groups/create/index.js
@@ -84,7 +84,7 @@ class Create extends React.PureComponent {
 					/>
 				</div>
 				<div>
-					<input
+					<textarea
 						className='standard'
 						type='text'
 						value={description}
diff --git a/app/javascript/gabsocial/features/groups/edit/index.js b/app/javascript/gabsocial/features/groups/edit/index.js
index fbb1cbbf..70f5205d 100644
--- a/app/javascript/gabsocial/features/groups/edit/index.js
+++ b/app/javascript/gabsocial/features/groups/edit/index.js
@@ -116,7 +116,7 @@ class Edit extends React.PureComponent {
 				</div>
 					
 				<div>
-					<input
+					<textarea
 						className='standard'
 						type='text'
 						value={description}
diff --git a/app/javascript/styles/gabsocial/_mixins.scss b/app/javascript/styles/gabsocial/_mixins.scss
index 069c6efd..57319a29 100644
--- a/app/javascript/styles/gabsocial/_mixins.scss
+++ b/app/javascript/styles/gabsocial/_mixins.scss
@@ -15,7 +15,13 @@
 	}
 }
 
-
+// SHORTCUTS
+@mixin input-placeholder($color) {
+	&::-webkit-input-placeholder {color: $color;}
+	&::-moz-placeholder {color: $color;}
+	&:-ms-input-placeholder {color: $color;}
+	&:-moz-placeholder {color: $color;}
+}
 
 // OLDER MIXINS
 @mixin avatar-radius() {
diff --git a/app/javascript/styles/gabsocial/components/group-form.scss b/app/javascript/styles/gabsocial/components/group-form.scss
index b6a19b1b..bfffbf8d 100644
--- a/app/javascript/styles/gabsocial/components/group-form.scss
+++ b/app/javascript/styles/gabsocial/components/group-form.scss
@@ -1,6 +1,14 @@
 .group-form {
 	padding: 20px;
 	@include gab-container-standards();
+	input[type=text],
+	textarea {
+		&.standard {
+			width: 100%;
+			margin: 0 0 10px;
+		}
+	}
+	textarea {height: 88px;}
 	.group-form__file-label {
 		font-size: 13px;
 		color: $secondary-text-color;
diff --git a/app/javascript/styles/gabsocial/components/inputs.scss b/app/javascript/styles/gabsocial/components/inputs.scss
index df5bd1de..9a9d7509 100644
--- a/app/javascript/styles/gabsocial/components/inputs.scss
+++ b/app/javascript/styles/gabsocial/components/inputs.scss
@@ -1,34 +1,23 @@
-input {
+input[type='text'],
+textarea {
 	&.standard {
-		&[type='text'] {
-			border: 1px solid;
-			border-radius: 4px;
-			@include font-size(16);
-			border-color: $gab-placeholder-accent;
-			background: $gab-background-container;
-			body.theme-gabsocial-light & {
-				border-color: $gab-secondary-text;
-				background: $gab-background-base-light;	
-			}
+		box-sizing: border-box;
+		padding: 7px 10px;
+		border: 1px solid;
+		border-radius: 4px;
+		@include font-size(16);
+		@include line-height(18);
+		color: $gab-brand-default;
+		border-color: $gab-placeholder-accent;
+		background: $gab-background-container;
+		@include input-placeholder($gab-placeholder-accent);
+		body.theme-gabsocial-light & {
+			color: $gab-placeholder-accent;
+			border-color: $gab-secondary-text;
+			background: $gab-background-base-light;	
+			@include input-placeholder($gab-secondary-text);
 		}
+		&:focus {outline: none;}
 	}
 }
-
-
-// .group-form__input {
-//     height: 40px;
-//     padding: 0 15px;
-//     display: block;
-//     color: $primary-text-color;
-//     background: none;
-//     border: 1px solid $secondary-text-color;
-//     border-radius: 4px;
-//     margin-bottom: 10px;
-//     width: 100%;
-//     box-sizing: border-box;
-
-//     &:focus {
-//         outline: none;
-//         border-color:  $primary-text-color;
-//     }
-// }
\ No newline at end of file
+textarea.standard {resize: vertical;}
\ No newline at end of file