Merge pull request #9819 from twbs/bs3_panel_base_class

BS3: Refactor panels to require default class

4 files changed, 15 insertions, 10 deletions

diff --git a/less/mixins.less b/less/mixins.less
index 633d02455..3f230205b 100644
--- a/less/mixins.less
+++ b/less/mixins.less
@@ -340,7 +340,7 @@
 
 // Panels
 // -------------------------
-.panel-variant(@border; @heading-text-color; @heading-bg-color; @heading-border) {
+.panel-variant(@border; @heading-text-color; @heading-bg-color; @heading-border;) {
   border-color: @border;
   & > .panel-heading {
     color: @heading-text-color;
diff --git a/less/panels.less b/less/panels.less
index e39fa3adf..0f454fea0 100644
--- a/less/panels.less
+++ b/less/panels.less
@@ -7,7 +7,7 @@
 .panel {
   margin-bottom: @line-height-computed;
   background-color: @panel-bg;
-  border: 1px solid @panel-border;
+  border: 1px solid transparent;
   border-radius: @panel-border-radius;
   .box-shadow(0 1px 1px rgba(0,0,0,.05));
 }
@@ -71,8 +71,7 @@
 // Optional heading
 .panel-heading {
   padding: 10px 15px;
-  background-color: @panel-heading-bg;
-  border-bottom: 1px solid @panel-border;
+  border-bottom: 1px solid transparent;
   .border-top-radius(@panel-border-radius - 1);
 }
 
@@ -90,7 +89,7 @@
 .panel-footer {
   padding: 10px 15px;
   background-color: @panel-footer-bg;
-  border-top: 1px solid @panel-border;
+  border-top: 1px solid @panel-inner-border;
   .border-bottom-radius(@panel-border-radius - 1);
 }
 
@@ -114,13 +113,13 @@
   .panel-heading {
     border-bottom: 0;
     + .panel-collapse .panel-body {
-      border-top: 1px solid @panel-border;
+      border-top: 1px solid @panel-inner-border;
     }
   }
   .panel-footer {
     border-top: 0;
     + .panel-collapse .panel-body {
-      border-bottom: 1px solid @panel-border;
+      border-bottom: 1px solid @panel-inner-border;
     }
   }
 
@@ -132,6 +131,9 @@
 
 
 // Contextual variations
+.panel-default {
+  .panel-variant(@panel-default-border; @panel-default-text; @panel-default-heading-bg; @panel-default-border);
+}
 .panel-primary {
   .panel-variant(@panel-primary-border; @panel-primary-text; @panel-primary-heading-bg; @panel-primary-border);
 }
diff --git a/less/theme.less b/less/theme.less
index 380be4076..92469c429 100644
--- a/less/theme.less
+++ b/less/theme.less
@@ -211,7 +211,7 @@
 }
 
 // Apply the mixin to the panel headings only
-.panel-heading                    { .panel-heading-styles(@panel-heading-bg); }
+.panel-default > .panel-heading   { .panel-heading-styles(@panel-default-heading-bg); }
 .panel-primary > .panel-heading   { .panel-heading-styles(@panel-primary-heading-bg); }
 .panel-success > .panel-heading   { .panel-heading-styles(@panel-success-heading-bg); }
 .panel-info > .panel-heading      { .panel-heading-styles(@panel-info-heading-bg); }
diff --git a/less/variables.less b/less/variables.less
index f2274b7f1..eadd78fb8 100644
--- a/less/variables.less
+++ b/less/variables.less
@@ -486,11 +486,14 @@
 // Panels
 // -------------------------
 @panel-bg:                    #fff;
-@panel-border:                #ddd;
+@panel-inner-border:          #ddd;
 @panel-border-radius:         @border-radius-base;
-@panel-heading-bg:            #f5f5f5;
 @panel-footer-bg:             #f5f5f5;
 
+@panel-default-text:          @gray-dark;
+@panel-default-border:        #ddd;
+@panel-default-heading-bg:    #f5f5f5;
+
 @panel-primary-text:          #fff;
 @panel-primary-border:        @brand-primary;
 @panel-primary-heading-bg:    @brand-primary;