Add alert for customizer errors

2 files changed, 32 insertions, 2 deletions

diff --git a/assets/css/docs.css b/assets/css/docs.css
index e792ae2cf..da126d165 100644
--- a/assets/css/docs.css
+++ b/assets/css/docs.css
@@ -193,6 +193,27 @@ body {
   font-weight: normal;
 }
 
+/* Alerts */
+.bs-customizer-alert {
+  position: fixed;
+  top: 51px;
+  left: 0;
+  right: 0;
+  z-index: 1030;
+  padding: 15px 0;
+  color: #fff;
+  background-color: #d9534f;
+  box-shadow: inset 0 1px 0 rgba(255,255,255,.25);
+  border-bottom: 1px solid #b94441;
+}
+.bs-customizer-alert .close {
+  margin-top: -2px;
+  color: #fff;
+  text-shadow: none;
+}
+.bs-customizer-alert p {
+  margin-bottom: 0;
+}
 
 
 /* Docs pages and sections
diff --git a/customize.html b/customize.html
index dccd4df8d..ccccdae51 100644
--- a/customize.html
+++ b/customize.html
@@ -6,8 +6,17 @@ lead: Customize Bootstrap's components, LESS variables, and jQuery plugins to ge
 base_url: "../"
 ---
 
-<!-- Customize
-================================================== -->
+
+<!-- Customizer errors -->
+<div class="bs-customizer-alert" style="display: none;">
+  <div class="container">
+    <button type="button" class="close pull-right">&times;</button>
+    <p class="bs-customizer-alert-text"></p>
+  </div>
+</div>
+
+
+<!-- Customizer form -->
 <form class="bs-customizer" role="form">
   <div class="bs-docs-section" id="less-section">
     <div class="page-header">