lshcomment 1.0.0

package/src/assets/css/core/_callout.scss

@@ -0,0 +1,55 @@
+.callout {
+  position: relative;
+  padding: 0 $spacer;
+  margin: $spacer 0;
+  border: 0 solid $border-color;
+  border-left-width: .25rem;
+
+  @if $enable-rounded {
+    border-radius: .25rem;
+  }
+
+  .chart-wrapper {
+    position: absolute;
+    top: 18px;
+    left: 45%;
+    float: right;
+    width: 100px;
+  }
+}
+
+.callout-bordered {
+  border: 1px solid $border-color;
+  border-left-width: .25rem;
+}
+.callout code {
+  border-radius: .25rem;
+}
+.callout h4 {
+  margin-top: 0;
+  margin-bottom: .25rem;
+}
+.callout p:last-child {
+  margin-bottom: 0;
+}
+.callout + .callout {
+  margin-top: - .25rem;
+}
+
+.callout-default {
+  border-left-color: $text-muted;
+
+  h4 {
+    color: $text-muted;
+  }
+}
+
+@each $color, $value in $theme-colors {
+  &.callout-#{$color} {
+    border-left-color: $value;
+
+    h4 {
+      color: $value;
+    }
+  }
+}

package/src/assets/css/core/_card.scss

@@ -0,0 +1,191 @@
+.card {
+    margin-bottom: 1.5 * $spacer;
+    // Cards with color accent
+    @each $color,
+    $value in $theme-colors {
+        &.bg-#{$color} {
+            border-color: darken($value, 12.5%);
+            .card-header {
+                background-color: darken($value, 3%);
+                border-color: darken($value, 12.5%);
+            }
+        }
+    }
+}
+
+.text-white .text-muted {
+    color: rgba(255, 255, 255, .6) !important;
+}
+
+.card-header {
+    .icon-bg {
+        display: inline-body;
+        padding: $card-spacer-y $card-spacer-x !important;
+        margin-top: -$card-spacer-y;
+        margin-right: $card-spacer-x;
+        margin-bottom: -$card-spacer-y;
+        margin-left: -$card-spacer-x;
+        line-height: inherit;
+        color: $card-icon-color;
+        vertical-align: bottom;
+        background: $card-icon-bg;
+        border-right: $card-border-width solid $card-border-color;
+    }
+    .nav.nav-tabs {
+        margin-top: -$card-spacer-y;
+        margin-bottom: -$card-spacer-y;
+        border-bottom: 0;
+        .nav-item {
+            border-top: 0;
+        }
+        .nav-link {
+            padding: $card-spacer-y $card-spacer-x / 2;
+            color: $text-muted;
+            border-top: 0;
+            &.active {
+                color: $body-color;
+                background: #fff;
+            }
+        }
+    }
+    &.card-header-inverse {
+        color: #fff;
+    }
+    .btn {
+        margin-top: - $input-btn-padding-y;
+    }
+    .btn-sm {
+        margin-top: - $input-btn-padding-y-sm;
+    }
+    .btn-lg {
+        margin-top: - $input-btn-padding-y-lg;
+    }
+}
+
+//
+.card-footer {
+    ul {
+        display: table;
+        width: 100%;
+        padding: 0;
+        margin: 0;
+        table-layout: fixed;
+        li {
+            display: table-cell;
+            padding: 0 $card-spacer-x;
+            text-align: center;
+        }
+    }
+}
+
+[class*="card-outline-"] {
+    .card-body {
+        background: #fff !important;
+    }
+    &.card-outline-top {
+        border-top-width: 2px;
+        border-right-color: $border-color;
+        border-bottom-color: $border-color;
+        border-left-color: $border-color;
+    }
+}
+
+// Cards with color accent
+@each $color,
+$value in $theme-colors {
+    .card-accent-#{$color} {
+        @include card-accent-variant($value);
+    }
+}
+
+// Card Actions
+.card-header {
+    >i {
+        margin-right: $spacer / 2;
+    }
+    .card-actions {
+        position: absolute;
+        top: 0;
+        right: 0;
+        //height: inherit;
+        a,
+        button {
+            display: block;
+            float: left;
+            width: 50px;
+            padding: $card-spacer-y 0;
+            margin: 0 !important;
+            color: $body-color;
+            text-align: center;
+            background: transparent;
+            border: 0;
+            border-left: 1px solid $border-color;
+            box-shadow: 0;
+            &:hover {
+                text-decoration: none;
+            }
+            [class^="icon-"],
+            [class*=" icon-"] {
+                display: inline-body;
+                vertical-align: middle;
+            }
+            i {
+                display: inline-body;
+                transition: .4s;
+            }
+            .r180 {
+                transform: rotate(180deg);
+            }
+        }
+        .input-group {
+            width: 230px;
+            margin: 6px;
+            .input-group-addon {
+                background: #fff;
+            }
+            input {
+                border-left: 0;
+            }
+        }
+    }
+}
+
+.card-full {
+    margin-top: - $spacer;
+    margin-right: - $grid-gutter-width / 2;
+    margin-left: - $grid-gutter-width / 2;
+    border: 0;
+    border-bottom: $card-border-width solid $border-color;
+}
+
+@include media-breakpoint-up(md) {
+    .card-columns {
+        &.cols-1 {
+            column-count: 1;
+            margin-bottom: 1.0rem !important;
+            .card {
+                margin-bottom: 0.5rem;
+            }
+        }
+    }
+}
+
+@include media-breakpoint-up(sm) {
+    .card-columns {
+        &.cols-2 {
+            column-count: 2;
+        }
+    }
+}
+
+.card {
+    &.drag,
+    .drag {
+        cursor: move;
+    }
+}
+
+.card-placeholder {
+    background: rgba(0, 0, 0, .025);
+    border: 1px dashed $gray-300;
+}

package/src/assets/css/core/_charts.scss

@@ -0,0 +1,9 @@
+.chart-wrapper {
+  canvas {
+    width: 100% !important;
+  }
+}
+// scss-lint:disable QualifyingElement
+base-chart.chart {
+  display: block !important;
+}

package/src/assets/css/core/_dropdown.scss

@@ -0,0 +1,69 @@
+// Links, buttons, and more within the dropdown menu
+.dropdown-item {
+  position: relative;
+  padding: 10px 20px;
+  border-bottom: 1px solid $dropdown-border-color;
+
+  &:last-child {
+    border-bottom: 0;
+  }
+
+  i {
+    display: inline-block;
+    width: 20px;
+    margin-right: 10px;
+    margin-left: -10px;
+    color: $dropdown-border-color;
+    text-align: center;
+  }
+
+  .badge {
+    position: absolute;
+    right: 10px;
+    margin-top: 2px;
+  }
+}
+
+// Dropdown section headers
+.dropdown-header {
+  padding: 8px 20px;
+  background: $dropdown-divider-bg;
+  border-bottom: 1px solid $dropdown-border-color;
+
+  .btn {
+    margin-top: -7px;
+    color: $dropdown-header-color;
+
+    &:hover {
+      color: $body-color;
+    }
+
+    &.pull-right {
+      margin-right: -20px;
+    }
+  }
+}
+
+.dropdown-menu-lg {
+  width: 250px;
+}
+.app-header {
+  .navbar-nav {
+    .dropdown-menu {
+      position: absolute;
+    }
+    // Menu positioning
+    //
+    // Add extra class to `.dropdown-menu` to flip the alignment of the dropdown
+    // menu with the parent.
+    .dropdown-menu-right {
+      right: 0;
+      left: auto; // Reset the default from `.dropdown-menu`
+    }
+
+    .dropdown-menu-left {
+      right: auto;
+      left: 0;
+    }
+  }
+}

package/src/assets/css/core/_footer.scss

@@ -0,0 +1,8 @@
+.app-footer {
+  min-height: $footer-height;
+  padding: 0 $spacer;
+  line-height: $footer-height;
+  color: $footer-color;
+  background: $footer-bg;
+  @include borders($footer-borders);
+}

package/src/assets/css/core/_grid.scss

@@ -0,0 +1,15 @@
+.row.row-equal {
+  padding-right: ($grid-gutter-width / 4);
+  padding-left:  ($grid-gutter-width / 4);
+  margin-right: ($grid-gutter-width / -2);
+  margin-left:  ($grid-gutter-width / -2);
+
+  [class*="col-"] {
+    padding-right: ($grid-gutter-width / 4);
+    padding-left:  ($grid-gutter-width / 4);
+  }
+}
+
+.main .container-fluid {
+  padding: 0 30px;
+}

package/src/assets/css/core/_input-group.scss

@@ -0,0 +1,6 @@
+.input-group-addon,
+.input-group-btn {
+  min-width: 40px;
+  white-space: nowrap;
+  vertical-align: middle; // Match the inputs
+}

package/src/assets/css/core/_input.scss

@@ -0,0 +1,26 @@
+// input style
+.el-input .el-input__inner {
+    border-radius: 0 !important;
+}
+
+.el-input.is-disabled .el-input__inner {
+    background-color: #c2cfd6 !important;
+    border-radius: 0 !important;
+}
+
+.el-input__icon {
+    color: #536c79 !important;
+}
+
+.el-input {
+    width: 100% !important;
+}
+
+.input-box input {
+    border: 1px solid #f86c6b;
+}
+.input-box p {
+    margin-top: .25rem;
+    font-size: .875rem;
+    color: #f86c6b;
+}