mdb-ui-kit/less/_panels.less

// main: material.less

// Panels mixins

.panel-variant(@border; @heading-text-color; @heading-bg-color; @heading-border) {
  border-color: @border;

  & > .panel-heading {
    color: @heading-text-color;
    background-color: @heading-bg-color;
    border-color: @heading-border;

    + .panel-collapse > .panel-body {
      border-top-color: @border;
    }
    .badge {
      color: @heading-bg-color;
      background-color: @heading-text-color;
    }
  }
  & > .panel-footer {
    + .panel-collapse > .panel-body {
      border-bottom-color: @border;
    }
  }
}



// Contextual variations
.panel-material-red{
    .panel-variant(@panel-material-red-border; @panel-material-red-text; @panel-material-red-heading-bg; @panel-material-red-border);
}

.panel-material-pink{
    .panel-variant(@panel-material-pink-border; @panel-material-pink-text; @panel-material-pink-heading-bg; @panel-material-pink-border);
}

.panel-material-purple{
    .panel-variant(@panel-material-purple-border; @panel-material-purple-text; @panel-material-purple-heading-bg; @panel-material-purple-border);
}

.panel-material-deeppurple{
    .panel-variant(@panel-material-deeppurple-border; @panel-material-deeppurple-text; @panel-material-deeppurple-heading-bg; @panel-material-deeppurple-border);
}

.panel-material-indigo{
    .panel-variant(@panel-material-indigo-border; @panel-material-indigo-text; @panel-material-indigo-heading-bg; @panel-material-indigo-border);
}

.panel-material-blue{
    .panel-variant(@panel-material-blue-border; @panel-material-blue-text; @panel-material-blue-heading-bg; @panel-material-blue-border);
}

.panel-material-lightblue{
    .panel-variant(@panel-material-lightblue-border; @panel-material-lightblue-text; @panel-material-lightblue-heading-bg; @panel-material-lightblue-border);
}

.panel-material-cyan{
    .panel-variant(@panel-material-cyan-border; @panel-material-cyan-text; @panel-material-cyan-heading-bg; @panel-material-cyan-border);
}

.panel-material-teal{
    .panel-variant(@panel-material-teal-border; @panel-material-teal-text; @panel-material-teal-heading-bg; @panel-material-teal-border);
}

.panel-material-green{
    .panel-variant(@panel-material-green-border; @panel-material-green-text; @panel-material-green-heading-bg; @panel-material-green-border);
}

.panel-material-lightgreen{
    .panel-variant(@panel-material-lightgreen-border; @panel-material-lightgreen-text; @panel-material-lightgreen-heading-bg; @panel-material-lightgreen-border);
}

.panel-material-lime{
    .panel-variant(@panel-material-lime-border; @panel-material-lime-text; @panel-material-lime-heading-bg; @panel-material-lime-border);
}

.panel-material-yellow{
    .panel-variant(@panel-material-yellow-border; @panel-material-yellow-text; @panel-material-yellow-heading-bg; @panel-material-yellow-border);
}

.panel-material-amber{
    .panel-variant(@panel-material-amber-border; @panel-material-amber-text; @panel-material-amber-heading-bg; @panel-material-amber-border);
}

.panel-material-orange{
    .panel-variant(@panel-material-orange-border; @panel-material-orange-text; @panel-material-orange-heading-bg; @panel-material-orange-border);
}

.panel-material-deeporange{
    .panel-variant(@panel-material-deeporange-border; @panel-material-deeporange-text; @panel-material-deeporange-heading-bg; @panel-material-deeporange-border);
}

.panel-material-brown{
    .panel-variant(@panel-material-brown-border; @panel-material-brown-text; @panel-material-brown-heading-bg; @panel-material-brown-border);
}

.panel-material-grey{
    .panel-variant(@panel-material-grey-border; @panel-material-grey-text; @panel-material-grey-heading-bg; @panel-material-grey-border);
}

.panel-material-bluegrey{
    .panel-variant(@panel-material-bluegrey-border; @panel-material-bluegrey-text; @panel-material-bluegrey-heading-bg; @panel-material-bluegrey-border);
}