Commit before setting up a new deployment environment

static/scss/material-kit-pro/badges/_badge-circle.scss

@@ -0,0 +1,29 @@
+//
+// Circle badge
+//
+
+
+// General styles
+
+.badge-circle {
+    text-align: center;
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    border-radius: $badge-circle-border-radius;
+    padding: 0 !important;
+    width: $badge-circle-width;
+    height: $badge-circle-height;
+    font-size: $badge-circle-font-size;
+    font-weight: $badge-circle-font-weight;
+
+    &.badge-md {
+        width: $badge-circle-md-width;
+        height: $badge-circle-md-height;
+    }
+
+    &.badge-lg {
+      width: $badge-circle-lg-width;
+      height: $badge-circle-lg-height;
+    }
+}

static/scss/material-kit-pro/badges/_badge-dot.scss

@@ -0,0 +1,42 @@
+//
+// Dot badge
+//
+
+
+// General styles
+
+.badge-dot {
+    padding-left: 0;
+    padding-right: 0;
+    background: transparent;
+    font-weight: $font-weight-normal;
+    font-size: $font-size-sm;
+    text-transform: none;
+
+    strong {
+        color: $gray-800;
+    }
+
+    i {
+        display: inline-block;
+        vertical-align: middle;
+        width: $badge-dot-icon-width;
+        height: $badge-dot-icon-height;
+        border-radius: $badge-dot-icon-radius;
+        margin-right: $badge-dot-icon-margin-right;
+    }
+
+    &.badge-md {
+        i {
+            width: $badge-dot-md-icon-width;
+            height: $badge-dot-md-icon-height;
+        }
+    }
+
+    &.badge-lg {
+        i {
+            width: $badge-dot-lg-icon-width;
+            height: $badge-dot-lg-icon-height;
+        }
+    }
+}

static/scss/material-kit-pro/badges/_badge-floating.scss

@@ -0,0 +1,17 @@
+//
+// Badge floating
+//
+
+
+.btn {
+    .badge-floating {
+        position: absolute;
+        top: -$badge-floating-top;
+        transform: translateY($badge-floating-top);
+        border: $badge-floating-border solid;
+
+        &.badge:not(.badge-circle) {
+            transform: $badge-floating-transform;
+        }
+    }
+}

static/scss/material-kit-pro/badges/_badge.scss

@@ -0,0 +1,93 @@
+//
+// Badge
+//
+
+
+// General styles
+
+.badge {
+
+
+    a {
+        color: $white;
+    }
+}
+
+
+// Size variations
+
+.badge-sm{
+  padding: $badge-sm-padding;
+  font-size: $badge-sm-font-size;
+  border-radius: $border-radius-md;
+}
+
+.badge-md {
+    padding: $badge-md-padding;
+}
+
+.badge-lg {
+    padding: $badge-lg-padding;
+}
+
+
+// Multiple inline badges
+
+.badge-inline {
+    margin-right: $badge-inline-margin-right;
+
+    + span {
+        top: $badge-inline-span-top;
+        position: relative;
+
+        > a {
+            text-decoration: underline;
+        }
+    }
+}
+
+
+// Color fixes
+
+.badge-default {
+    color: $white;
+}
+
+.badge.badge-secondary {
+    background-color: lighten($secondary, 32%);
+    color: $gray-600;
+}
+
+
+// Badge spacing inside a btn with some text
+
+.btn {
+    .badge {
+        &:not(:first-child) {
+            margin-left: $badge-btn-margin;
+        }
+        &:not(:last-child) {
+            margin-right: $badge-btn-margin;
+        }
+    }
+}
+
+// Colors
+//
+// Contextual variations (linked badges get darker on :hover).
+
+@each $color, $value in $theme-colors {
+  .badge-#{$color} {
+    @include badge-variant($value);
+  }
+}
+
+
+
+// card-pricing badge position
+
+.card {
+  >.badge {
+    margin-top: $card-badge-position !important;
+  }
+}