Add alert for customizer errors

diff --git a/assets/css/docs.css b/assets/css/docs.css
index e792ae2cfd52c0fc1c4d0e922e08f8ff1b8d0948..da126d165fe3728bbf32b4d1ee2fc4aa35a0c19a 100644 (file)
--- 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 dccd4df8d816b25c7492f0b906d657fa6473d1db..ccccdae51ed3ac95473bda3a9ba5ba8581d87461 100644 (file)
--- 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">