init crater

resources/assets/sass/components/cards.scss

@@ -0,0 +1,112 @@
+// cards.scss - Custom Cards
+
+.card {
+    margin-bottom: 1.5rem;
+    border: none;
+    box-shadow: $shadow;
+
+    .card-header {
+
+        @include clearfix;
+        position: relative;
+        border-bottom: 1px solid $ls-color-gray--light;
+
+        i {
+            width: 1.3em;
+        }
+
+        h6 {
+            font-size: 1rem;
+            font-weight: normal;
+            margin: 0;
+        }
+
+        h3 {
+            font-weight: normal;
+            margin: 0;
+            font-size: $font-size-section-title;
+        }
+
+        h5 {
+            margin: 0;
+            font-weight: normal;
+        }
+
+        &.bg-dark {
+            background-color: $ls-color-secondary;
+            color: $white;
+        }
+
+        .caption {
+            display: inline-block;
+            padding: 8px 0;
+        }
+
+        .actions {
+            float: right;
+            margin: auto;
+        }
+
+    }
+
+    .card-body {
+        padding: 30px;
+    }
+
+    .section-semi-title {
+        font-size: $font-size-semi-section-title;
+        text-transform: uppercase;
+        font-weight: 400;
+    }
+
+    .card-footer {
+        background-color: $white;
+    }
+
+    &.with-tabs .card-header {
+        padding: 0;
+
+        .caption {
+            padding: 20px;
+        }
+
+        .actions {
+            padding-right: 20px;
+        }
+
+        .nav-tabs {
+            border-bottom: none;
+        }
+
+        .nav-link {
+            padding: 1em 1.5em;
+        }
+    }
+
+    .bg-primary,
+    .bg-info,
+    .bg-primary,
+    .bg-dark,
+    .bg-success,
+    .bg-danger,
+    .bg-warning {
+
+        h3, h5, h6 {
+            color: $white;
+        }
+
+    }
+
+}
+
+
+@media (max-width: 992px) {
+
+    .card
+    .card-body {
+        padding: 15px;
+    }
+
+}
+
+