From b15b5b8614899e3e63a87bd70ff971fa8a85bb87 Mon Sep 17 00:00:00 2001
From: Ray Schamp <ray@scratch.mit.edu>
Date: Tue, 5 Jul 2016 12:03:27 -0400
Subject: [PATCH] Add style to general error messages

Resolves #647
---
 src/components/forms/general-error.jsx  | 4 +++-
 src/components/forms/general-error.scss | 9 +++++++++
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 src/components/forms/general-error.scss

diff --git a/src/components/forms/general-error.jsx b/src/components/forms/general-error.jsx
index bca50e20d..d9e20463b 100644
--- a/src/components/forms/general-error.jsx
+++ b/src/components/forms/general-error.jsx
@@ -1,6 +1,8 @@
 var Formsy = require('formsy-react');
 var React = require('react');
 
+require('./general-error.scss');
+
 /*
  * A special formsy-react component that only outputs
  * error messages. If you want to display errors that
@@ -12,7 +14,7 @@ module.exports = Formsy.HOC(React.createClass({
     render: function () {
         if (!this.props.showError()) return null;
         return (
-            <p className="error">
+            <p className="general-error">
                 {this.props.getErrorMessage()}
             </p>
         );
diff --git a/src/components/forms/general-error.scss b/src/components/forms/general-error.scss
new file mode 100644
index 000000000..c5da01c49
--- /dev/null
+++ b/src/components/forms/general-error.scss
@@ -0,0 +1,9 @@
+@import "../../colors";
+
+.general-error {
+    border: 1px solid $active-gray;
+    border-radius: 4px;
+    background-color: $ui-orange;
+    padding: 1rem;
+    color: $type-white;
+}