Centered modal button

src/js/components/Modal.js

@@ -114,7 +114,7 @@ class Modal extends React.Component{
 							</label>
 						</div>
 					</div>
-					<button type="submit" className="primary">Save</button>
+					<button type="submit" className="primary centered">Save</button>
 				</form>
 			</div>
 		)

src/scss/components/_modal.scss

@@ -33,6 +33,22 @@
 		width: 70%;
 		color: #FFFFFF;
 
+		h1 {
+			font-size: 30px;
+			font-weight: 300;
+			padding-bottom: 30px;
+		}
+
+		form {
+			.field {
+				padding-bottom: 20px;
+			}
+
+			button[type="submit"]{
+				margin-top: 50px;
+			}
+		}
+
 		.playlists {
 			@include clearfix();
 

src/scss/global/_forms.scss

@@ -88,6 +88,15 @@ input[type="submit"] {
 		}
 	}
 
+	&.centered {
+		display: block;
+		min-width: 200px;
+		margin: 0 auto;
+		text-align: center;
+		padding-left: 30px;
+		padding-right: 30px;
+	}
+
 	&[disabled],
 	&[disabled="disabled"] {
 		background: $light_grey !important;
@@ -117,7 +126,7 @@ input[type="submit"] {
 		float: left;
 		
 		input {
-			width: 60%;
+			width: 100%;
 		}
 
 		.text {
@@ -132,7 +141,7 @@ input[type="submit"] {
 		input{
 			display: none;
 		}
-		
+
 		.input {
 			padding-top: 4px;
 		}