Adjustments to the create group form to match mockup specs.

Strip out css for form input from component css file.
Created global form input css.
Padding adjustments.

app/javascript/gabsocial/features/groups/create/index.js

@@ -75,7 +75,8 @@ class Create extends React.PureComponent {
 			<form className='group-form' onSubmit={this.handleSubmit}>
 				<div>
 					<input
-						className='group-form__input'
+						className='standard'
+						type='text'
 						value={title}
 						disabled={disabled}
 						onChange={this.handleTitleChange}
@@ -84,7 +85,8 @@ class Create extends React.PureComponent {
 				</div>
 				<div>
 					<input
-						className='group-form__input'
+						className='standard'
+						type='text'
 						value={description}
 						disabled={disabled}
 						onChange={this.handleDescriptionChange}

app/javascript/gabsocial/features/groups/edit/index.js

@@ -106,7 +106,8 @@ class Edit extends React.PureComponent {
 			<form className='group-form' onSubmit={this.handleSubmit}>
 				<div>
 					<input
-						className='group-form__input'
+						className='standard'
+						type='text'
 						value={title}
 						disabled={disabled}
 						onChange={this.handleTitleChange}
@@ -116,7 +117,8 @@ class Edit extends React.PureComponent {
 					
 				<div>
 					<input
-						className='group-form__input'
+						className='standard'
+						type='text'
 						value={description}
 						disabled={disabled}
 						onChange={this.handleDescriptionChange}

app/javascript/styles/application.scss

@@ -19,6 +19,7 @@
 
 // COMPONENTS
 @import 'gabsocial/components/buttons';
+@import 'gabsocial/components/inputs';
 @import 'gabsocial/components/tabs-bar';
 @import 'gabsocial/components/dropdown-menu';
 @import 'gabsocial/components/modal';

app/javascript/styles/gabsocial/components/group-form.scss

@@ -1,44 +1,18 @@
 .group-form {
-    padding: 15px;
+	padding: 20px;
 	@include gab-container-standards();
-    .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;
-        }
-    }
-
 	.group-form__file-label {
 		font-size: 13px;
 		color: $secondary-text-color;
 		cursor: pointer;
-
-        &:hover {
-            color: $primary-text-color;
-        }
-
+		&:hover {color: $primary-text-color;}
 		.fa {
 			font-size: 18px;
 			margin-right: 5px;
 			transform: translatey(2px);
 		}
-
-        &.group-form__file-label--selected {
-            color: $primary-text-color;
+		&.group-form__file-label--selected {color: $primary-text-color;}
 	}
-    }
-
 	.group-form__file {
 		width: 1px;
 		height: 1px;

app/javascript/styles/gabsocial/components/inputs.scss

@@ -0,0 +1,34 @@
+input {
+	&.standard {
+		&[type='text'] {
+			border: 1px solid;
+			corner-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;	
+			}
+		}
+	}
+}
+
+
+// .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;
+//     }
+// }