cm-admin 1.1.7 → 1.1.9

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 5aba23127b4e8223782b919d0c5c767b156262e55198835fb738c72fd9c5fa68
-  data.tar.gz: 89a3df2239cc6a56eb3360afe1502654c2ad83b1921c5f8f7dedcc1d8eaf3407
+  metadata.gz: e07101649ddc2392e7d61139cbbd68d863b22703ec2537cd9e6d3195cc53f5c9
+  data.tar.gz: a11705aaa45d84749296de25055339207b33f202a467eac3b38d2c60aa667f59
 SHA512:
-  metadata.gz: 66c416a85d9e84c5d9122adc0a14d8728ce51934711839db9a261ddba9aeae8d13d3033f3e06f3c359b5a3c7a62ed74c2d253aa1c038865ba77486f7ddc6fbf7
-  data.tar.gz: 5d91df86bb2cb64be4158688473c316c8e3c16b77bb11ed7a0a1e683f7e2af67e84b7240a45262ab79384cf1fdc238880f2da02525686ba73d43f9c5c98253c2
+  metadata.gz: da131f09f37cabf79ef6ce2c23604cb412053be927ea9c79666f3f356d7618ddfdc6faed36c657821e2c60757c67aa5fc1bfddf838705d861f76898ae0c235f8
+  data.tar.gz: 6f0354f7eac71e8f691152e23f0653a228fff5e9b2407d51cff6320cf07cf8de01a46a08835717c6e7d7ececf5655f2942a870b73ea48321f3797b4bc82dbced

data/.gitignore

@@ -11,3 +11,4 @@ public/cm-admin-packs/
 # rspec failure tracking
 .rspec_status
 .rubocop-*
+.DS_Store

data/.vscode/settings.json

@@ -0,0 +1,3 @@
+{
+  "cSpell.words": ["cmad"]
+}

data/Gemfile.lock

@@ -1,7 +1,7 @@
 PATH
   remote: .
   specs:
-    cm-admin (1.1.7)
+    cm-admin (1.1.9)
       caxlsx_rails
       cocoon (~> 1.2.15)
       csv-importer (~> 0.8.2)

data/app/assets/javascripts/cm_admin/scaffolds.js

@@ -16,7 +16,6 @@ import 'bootstrap'
 import '@popperjs/core'
 import 'flatpickr'
 import 'jgrowl'
-jqueryJgrowl()
 import Select2 from "select2"
 Select2()
 
@@ -37,6 +36,7 @@ document.addEventListener("turbo:load", function () {
     mode: 'range'
   })
   $('.select-2').select2();
+  jqueryJgrowl()
 });
 
 $(document).on('click', '.menu-item', function(e) {

data/app/assets/stylesheets/cm_admin/base/navbar.scss

@@ -1,57 +1,31 @@
 @import "../helpers/index.scss";
+@import "bootstrap/scss/bootstrap";
 
-.cm-navbar {
-  top: 0;
-  right: 0;
-  left: 225px;
-  display: flex;
-  justify-content: space-between;
-  align-items: flex-start;
-  min-height: 102px;
-  padding: 24px;
-  background-color: $white;
-  z-index: 2;
-  &__lhs {
-    .bread-crumb-area {
-      .breadcrumb-text {
-        @include font($size: $t4-text, $color: $ink-lighter-clr);
-        line-height: 22px;
-        margin: 0 0 16px;
-        a {
-          color: inherit;
-        }
-      }
-    }
-    .nav-title-area {
-      .title-text {
-        @include font($size: 24px, $color: $primary-text-clr, $weight: 600);
-        line-height: 32px;
-        margin: 0 0 8px;
-      }
-      .title-sub-text {
-        @include font($size: $t4-text, $color: $primary-text-clr);
-        line-height: 22px;
-        margin: 0;
-      }
+.entity-header {
+  @extend .d-flex.justify-content-between.align-items-start.p-4;
+  min-height: 109px; // Height needs to be removed once all the layouts are revamped
+  background-color: var(--bs-white);
+  &__info {
+    .breadcrumb {
+      @include font($size: $t4-text, $color: var(--bs-tertiary-color));
+      line-height: 22px;
     }
   }
 
-  &__rhs {
-    display: flex;
-    align-items: center;
-
+  &__actions {
+    @extend .d-flex.align-items-start;
     .export-container {
       position: relative;
       .export-popup {
         top: 45px;
         width: 156px;
         padding: 8px 0;
-        animation: fadeIn .2s ease-in-out;
+        animation: fadeIn 0.2s ease-in-out;
         .popup-option {
           padding: 8px 16px;
           @include font($size: $t4-text, $color: $primary-text-clr);
           line-height: 22px;
-          transition: all .2s linear;
+          transition: all 0.2s linear;
           cursor: pointer;
           &:hover {
             background-color: $grey-lighter-clr;

data/app/assets/stylesheets/cm_admin/base/quicksearch.scss

@@ -52,16 +52,15 @@
         }
       }
     }
-    .enter-btn {
+    .enter-text {
       @include font($size: $t6-text, $color: $ink-lightest-clr, $weight: 600);
       line-height: 16px;
       margin: 0 8px 0 24px;
-      padding: 0;
     }
-    .open-btn {
+    .open-text {
       @include font($size: $t6-text, $color: $ink-lightest-clr);
       line-height: 16px;
-      padding: 0;
+      margin: 0;
     }
   }
   .active-item {

data/app/assets/stylesheets/cm_admin/base/show.scss

@@ -1,25 +1,14 @@
 @import "../helpers/index.scss";
+@import "bootstrap/scss/bootstrap";
 
 .show-page {
   overflow: auto;
 
-  &__tabs {
-    .cm-tabs-bar {
-      background-color: $white;
-      width: 100%;
-      .nav-pills {
-        margin-left: 10px;
-      }
+  &__header {
+    .tabs {
+      @extend .nav.nav-pills.ml-2;
       .nav-link {
-        position: static;
-        left: 0%;
-        right: 0%;
         @include font($size: $t4-text, $color: $ink-lighter-clr);
-        line-height: 22px;
-        flex: none;
-        order: 0;
-        flex-grow: 0;
-        background-color: $white;
         border-radius: 0px;
       }
       .nav-link.active {

data/app/assets/stylesheets/cm_admin/base/table.scss

@@ -34,21 +34,13 @@
       line-height: 22px;
       margin: 0;
     }
-    &__column-action {
-      .column-btn {
-        padding: 4px 8px;
-        span:nth-child(2) {
-          margin: 0 0 0 4px;
-        }
-      }
-    }
   }
 
   //Table UI styles
   .new-admin-table {
     min-width: 720px;
     max-width: fit-content;
-    // max-height: calc(100vh - 240px); Height is dynamic 
+    // max-height: calc(100vh - 240px); Height is dynamic
     overflow: auto;
     .cm-table {
       table-layout: fixed;
@@ -170,10 +162,6 @@
                   padding: 0px;
                 }
               }
-              .tool-btn {
-                background-color: transparent;
-                border: none;
-              }
             }
           }
         }
@@ -236,7 +224,7 @@
         &__name {
           @include font($size: $t4-text, $color: $primary-text-clr);
           line-height: 22px;
-          margin-left: 4px;         
+          margin-left: 4px;
           p {
             margin: 0;
           }

data/app/assets/stylesheets/cm_admin/cm_admin.css.scss

@@ -26,6 +26,7 @@
  *= require 'cm_admin/dependency/bootstrap.min'
  *= require 'cm_admin/dependency/flatpickr.min'
  *= require 'cm_admin/dependency/fontawesome.all'
+ *= require 'cm_admin/dependency/jquery-jgrowl.min'
  *= require 'cm_admin/scaffold'
  *= require_self
  */

data/app/assets/stylesheets/cm_admin/components/_buttons.scss

@@ -1,148 +1,42 @@
-@import '../helpers/index.scss';
+@import "../helpers/index.scss";
+@import "bootstrap/scss/bootstrap";
 
-.cta-btn {
-  padding: 5px 10px;
-  @include font($size: $t4-text, $color: $white, $weight: bold);
-  background-color: $brand-color;
-  border: none;
-  border-radius: $radius-4;
-  transition: all .2s linear;
-  &:hover {
-    color: $white;
-    background: $cta-hover-gradient;
-    transform: scale(1.05);
-  }
-  &:focus {
-    outline: 3px auto rgba(47, 128, 237, 0.3);
-    outline-offset: 1px;
-  }
-  &.disabled {
-    color: $disabled-clr;
-    background: $grey-lighter-clr;
-    cursor: not-allowed !important;
-    &:hover {
-      background-color: $grey-lighter-clr;
-    }
+// Custom style for icon btn
+.btn-icon {
+  i {
+    margin-right: 4px;
   }
 }
 
-.primary-btn {
-  padding: 5px 10px;
-  @include font($size: $t4-text, $color: $brand-color, $weight: bold);
-  background-color: $white;
-  border: 1px solid $brand-color;
-  border-radius: $radius-4;
-  transition: all .2s linear;
-  &:hover {
-    color: $brand-color;
-    background-color: #E6E4FA;
-    transform: scale(1.05);
-  }
-  &:focus {
-    outline: 3px auto rgba(47, 128, 237, 0.3);
-    outline-offset: 2px;
-  }
-  &.disabled {
-    color: $disabled-clr;
-    background: $white;
-    border: 1px solid $grey-regular-clr;
-    cursor: not-allowed !important;
-    &:hover {
-      background-color: $white;
-    }
-  }
+// New buttons with bootstrap button styles
+.cm-admin .btn-cta {
+  @include button-variant($primary, $primary);
+  @extend .btn.btn-sm.btn-icon;
 }
 
-.secondary-btn {
-  padding: 5px 10px;
-  @include font($size: $t4-text, $color: $primary-text-clr, $weight: bold); 
-  background-color: $white;
-  border: 1px solid $ink-regular-clr;
-  border-radius: $radius-4;
-  transition: all .2s linear;
-  &:hover {
-    color: $primary-text-clr;
-    background-color: $grey-light-clr;
-    transform: scale(1.05);
-  }
-  &:focus {
-    outline: 3px auto rgba(47, 128, 237, 0.3);
-    outline-offset: 2px;
-  }
-  &.disabled {
-    color: $disabled-clr;
-    background: $white;
-    border: 1px solid $grey-regular-clr;
-    cursor: not-allowed !important;
-    &:hover {
-      background-color: $white;
-    }
-  }
-  span:nth-child(2) {
-    margin: 0 4px 0 8px;
-  }
-  span:nth-child(3) {
-    @include font($size: 10px, $color: $ink-lighter-clr, $weight: bold); 
-  }
+.cm-admin .btn-primary {
+  @extend .btn.btn-outline-primary.btn-sm.btn-icon;
 }
 
-.gray-border-btn {
-  padding: 5px 10px;
-  @include font($size: $t4-text, $color: $primary-text-clr, $weight: bold); 
-  background-color: $white;
-  border: 1px solid $ink-regular-clr;
-  border-radius: $radius-4;
-  transition: all .2s linear;
-  &:hover {
-    color: $primary-text-clr;
-    background-color: $grey-light-clr;
-    transform: scale(1.05);
-  }
-  &:focus {
-    outline: 3px auto rgba(47, 128, 237, 0.3);
-    outline-offset: 2px;
-  }
-  &.disabled {
-    color: $disabled-clr;
-    background: $white;
-    border: 1px solid $grey-regular-clr;
-    cursor: not-allowed !important;
-    &:hover {
-      background-color: $white;
-    }
-  }
+.cm-admin .btn-secondary {
+  @extend .btn.btn-outline-secondary.btn-sm.btn-icon;
 }
 
-.ghost-btn {
-  padding: 5px 10px;
-  @include font($size: $t4-text, $color: $primary-text-clr, $weight: bold); 
-  background-color: transparent;
-  border: none;
-  border-radius: $radius-4;
-  transition: all .2s linear;
-  &:hover {
-    color: $primary-text-clr;
-    background: $grey-light-clr;
-    transform: scale(1.05);
-  }
-  &:focus {
-    outline: 3px auto rgba(47, 128, 237, 0.3);
-  }
-  &.disabled {
-    color: $disabled-clr;
-    background: $grey-light-clr;
-    border: none;
-    cursor: not-allowed !important;
-    &:hover {
-      background-color: $grey-light-clr;
-    }
-  }
+.cm-admin .btn-ghost {
+  @extend .btn.btn-light.btn-sm.btn-icon;
 }
 
-.text-btn {
-  border: none;
-  background-color: transparent;
-  &:focus {
-    outline: none;
-  }
+.cm-admin .btn-danger {
+  @extend .btn.btn-outline-danger.btn-sm.btn-icon;
+}
+
+.cm-admin .btn-link {
+  @extend .btn.btn-link.btn-sm.btn-icon;
+  text-decoration: underline;
 }
+
+// button mixin - We can use if needed
+// @include button-variant($background: #6554e0, $border: #6554e0);
+
+//Outline button mixin - We can use if needed
+// @include button-outline-variant($color: #6554e0);