Merge pull request #9819 from twbs/bs3_panel_base_class

BS3: Refactor panels to require default class

1 files changed, 15 insertions, 29 deletions

diff --git a/customize.html b/customize.html
index 41f9dd4a8..b1f662cfe 100644
--- a/customize.html
+++ b/customize.html
@@ -931,83 +931,69 @@ base_url: "../"
     </div>
 
     <h2 id="variables-panels-wells">Panels and wells</h2>
-    <h3>Default panel styles</h3>
+    <h3>Common panel styles</h3>
     <div class="row">
       <div class="col-lg-6">
         <label>@panel-bg</label>
         <input type="text" class="form-control" placeholder="#fff" data-var="@panel-bg">
-        <p class="help-block">Panel body background color</p>
-        <label>@panel-heading-bg</label>
-        <input type="text" class="form-control" placeholder="#f5f5f5" data-var="@panel-heading-bg">
-        <p class="help-block">Panel heading background color</p>
-        <label>@panel-footer-bg</label>
-        <input type="text" class="form-control" placeholder="#f5f5f5" data-var="@panel-footer-bg">
-        <p class="help-block">Panel footer background color</p>
+        <label>@panel-inner-border</label>
+        <input type="text" class="form-control" placeholder="#ddd" data-var="@panel-inner-border">
+        <p class="help-block">Border color for elements within panels</p>
       </div>
       <div class="col-lg-6">
-        <label>@panel-border</label>
-        <input type="text" class="form-control" placeholder="#ddd" data-var="@panel-border">
-        <p class="help-block">Panel border color</p>
         <label>@panel-border-radius</label>
         <input type="text" class="form-control" placeholder="@border-radius-base" data-var="@panel-border-radius">
-        <p class="help-block">Panel border radius</p>
+        <label>@panel-footer-bg</label>
+        <input type="text" class="form-control" placeholder="#f5f5f5" data-var="@panel-footer-bg">
       </div>
     </div>
     <h3>Contextual panel colors</h3>
     <div class="row">
       <div class="col-lg-6">
+        <h4>Default</h4>
+        <label>@panel-default-text</label>
+        <input type="text" class="form-control" placeholder="@gray-dark" data-var="@panel-default-text">
+        <label>@panel-default-border</label>
+        <input type="text" class="form-control" placeholder="#ddd" data-var="@panel-default-border">
+        <label>@panel-default-heading-bg</label>
+        <input type="text" class="form-control" placeholder="#f5f5f5" data-var="@panel-default-heading-bg">
         <h4>Primary</h4>
         <label>@panel-primary-text</label>
         <input type="text" class="form-control" placeholder="#fff" data-var="@panel-primary-text">
-        <p class="help-block">Primary text color</p>
         <label>@panel-primary-border</label>
         <input type="text" class="form-control" placeholder="@brand-primary" data-var="@panel-primary-border">
-        <p class="help-block">Primary border color</p>
         <label>@panel-primary-heading-bg</label>
         <input type="text" class="form-control" placeholder="@brand-primary" data-var="@panel-primary-heading-bg">
-        <p class="help-block">Primary heading background color</p>
         <h4>Success</h4>
         <label>@panel-success-text</label>
         <input type="text" class="form-control" placeholder="@state-success-text" data-var="@panel-success-text">
-        <p class="help-block">Success text color</p>
         <label>@panel-success-border</label>
         <input type="text" class="form-control" placeholder="@state-success-border" data-var="@panel-success-border">
-        <p class="help-block">Success border color</p>
         <label>@panel-success-heading-bg</label>
         <input type="text" class="form-control" placeholder="@state-success-bg" data-var="@panel-success-heading-bg">
-        <p class="help-block">Success heading background color</p>
+      </div>
+      <div class="col-lg-6">
         <h4>Info</h4>
         <label>@panel-info-text</label>
         <input type="text" class="form-control" placeholder="@state-info-text" data-var="@panel-info-text">
-        <p class="help-block">Info text color</p>
         <label>@panel-info-border</label>
         <input type="text" class="form-control" placeholder="@state-info-border" data-var="@panel-info-border">
-        <p class="help-block">Info border color</p>
         <label>@panel-info-heading-bg</label>
         <input type="text" class="form-control" placeholder="@state-info-bg" data-var="@panel-info-heading-bg">
-        <p class="help-block">Info heading background color</p>
-      </div>
-      <div class="col-lg-6">
         <h4>Warning</h4>
         <label>@panel-warning-text</label>
         <input type="text" class="form-control" placeholder="@state-warning-text" data-var="@panel-warning-text">
-        <p class="help-block">Warning text color</p>
         <label>@panel-warning-border</label>
         <input type="text" class="form-control" placeholder="@state-warning-border" data-var="@panel-warning-border">
-        <p class="help-block">Warning border color</p>
         <label>@panel-warning-heading-bg</label>
         <input type="text" class="form-control" placeholder="@state-warning-bg" data-var="@panel-warning-heading-bg">
-        <p class="help-block">Warning heading background color</p>
         <h4>Danger</h4>
         <label>@panel-danger-text</label>
         <input type="text" class="form-control" placeholder="@state-danger-text" data-var="@panel-danger-text">
-        <p class="help-block">Danger text color</p>
         <label>@panel-danger-border</label>
         <input type="text" class="form-control" placeholder="@state-danger-border" data-var="@panel-danger-border">
-        <p class="help-block">Danger border color</p>
         <label>@panel-danger-heading-bg</label>
         <input type="text" class="form-control" placeholder="@state-danger-bg" data-var="@panel-danger-heading-bg">
-        <p class="help-block">Danger heading background color</p>
       </div>
     </div>