Updated button styling.

These are now defined as `button--positive`, `button--negative`, and `button--info` to better describe the sort of meaning a button has
jedi58 · May 17, 2016 · 69ddd64 · 69ddd64
1 parent e4477e2
commit 69ddd64
Show file tree

Hide file tree

Showing 2 changed files with 41 additions and 4 deletions.
diff --git a/resources/assets/scss/shared/_buttons.scss b/resources/assets/scss/shared/_buttons.scss
@@ -1,11 +1,43 @@
+$button--positive--active-color: #393;
+$button--positive--hover-color: lighten($button--positive--active-color, 10);
+$button--negative--active-color: #900;
+$button--negative--hover-color: lighten($button--negative--active-color, 10);
+$button--info--active-color: #999;
+$button--info--hover-color: lighten($button--info--active-color, 10);
+
+
 .button {
 	border-radius: 5px;
 	font-size: 1.05em;
 	padding: 10px 20px;
 
+	&.button--positive {
+		background-color: $button--positive--active-color;
+		border:1px solid $button--positive--active-color;
+		color: #fff;
+
+		&:hover {
+			background-color: $button--positive--hover-color;
+		}
+	}
+
+	&.button--negative {
+		background-color: $button--negative--active-color;
+		border: 1px solid $button--negative--active-color;
+		color: #fff;
+
+		&:hover {
+			background-color: $button--negative--hover-color;
+		}
+	}
+
 	&.button--info {
-		background-color: #393;
-		border:1px solid #393;
+		background-color: $button--info--active-color;
+		border: 1px solid $button--info--active-color;
 		color: #fff;
+
+		&:hover {
+			background-color: $button--info--hover-color;
+		}
 	}
 }
diff --git a/src/Inachis/CoreBundle/Controller/AccountController.php b/src/Inachis/CoreBundle/Controller/AccountController.php
@@ -69,7 +69,7 @@ public static function getSignin($request, $response, $service, $app)
             )))
             ->addComponent(new ButtonType(array(
                 'type' => 'submit',
-                'cssClasses' => 'button button--info',
+                'cssClasses' => 'button button--positive',
                 'label' => 'Login'
             ))),
             'data' => array(
@@ -107,8 +107,13 @@ public static function getForgotPassword($request, $response, $service, $app)
             //->addComponent(new ReCaptchaType(array()))
             ->addComponent(new ButtonType(array(
                 'type' => 'submit',
-                'cssClasses' => 'button button--info',
+                'cssClasses' => 'button button--positive',
                 'label' => 'Reset password'
+            )))
+            ->addComponent(new ButtonType(array(
+                'type' => 'button',
+                'cssClasses' => 'button button--negative',
+                'label' => 'Cancel'
             ))),
             'data' => array(
                 "resetEmailAddress" => $request->paramsPost()->get('resetEmailAddress')