cm-admin 0.8.9 → 0.9.1

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 51174128fc2fd12fde48837a9271d8e51bb84d847379c6052080cf3de2c8745f
-  data.tar.gz: 9b2381f05a97106e9b3a1d8e117d71721a8d55ff080dcee96a38d77d819f0bf4
+  metadata.gz: 785e0d596039b668a8011b689eab464ebf3c0b6133d802d115d80a2916e93e09
+  data.tar.gz: 3cd13d18882cf7bdc31438c95498010ea776eeb3f9fdc3667a92b875800cb09b
 SHA512:
-  metadata.gz: 4ecc29569a31a996554a0360d3bbc52942f30b90692c5de67afdb7f1e6c79ebfab25736892a0093e9ef209821ee3950fad8df69934b36626151ca4af6d7dde10
-  data.tar.gz: 28018ef669025bb8b62d5127036efca2bfb32e944761089f74b17c9eccbed9f5f3db932ac9fe94fb50b120b2b5c8c3829e78b2b1cecf1478809577d8651c3dc8
+  metadata.gz: 66e662348351cdc07436a127fae08df52f430e31ec8e0410fd9b3c76307d111c261cd1349d0d4f6497b605a34ee2622ab113a8d909792e03065cbf66c33afc68
+  data.tar.gz: '0914c2ce34558dbe09a7b10e4f6777d46c37ec3fb0aeae30b5c9fefc45a2611236b21d32d36e8f94f653c0c1fa37346f97e7f6ec33ceff8aa0376a1b5e5a7783'

data/.github/workflows/.stylelintrc.json

@@ -0,0 +1,3 @@
+{
+"extends": "stylelint-config-standard"
+}

data/.github/workflows/linters.yml

@@ -0,0 +1,31 @@
+# .github/workflows/linters.yml
+name: linters
+on: [pull_request]
+
+jobs:
+  linters:
+    name: runner / linters
+    runs-on: ubuntu-latest
+    steps:
+      - name: Check out code
+        uses: actions/checkout@v1
+      - uses: ruby/setup-ruby@477b21f02be01bcb8030d50f37cfec92bfa615b6
+        with:
+          ruby-version: 3.0.0
+      - name: rubocop
+        uses: reviewdog/action-rubocop@v1
+        with:
+          rubocop_version: 1.30.0
+          rubocop_extensions: rubocop-rails:2.14.2
+          github_token: ${{ secrets.GITHUB_TOKEN }}
+          reporter: github-pr-check # Possible values are github-pr-check, github-pr-review
+      - name: reek
+        uses: reviewdog/action-reek@v1
+        with:
+          reek_version: 6.1.1
+      - name: runner / stylelint
+        run: npx stylelint **/*.scss
+      - name: coffeelint
+        uses: reviewdog/action-coffeelint@v1
+        with:
+          reporter: github-pr-review

data/Gemfile

@@ -5,8 +5,12 @@ gem 'pagy', '~> 4.11.0'
 gem 'pundit'
 gem 'rake', '~> 12.0'
 gem 'rspec', '~> 3.0'
-gem 'rubocop'
 gem 'slim'
 
+group :development do
+  gem 'rubocop', '~> 1.35.1', require: false
+  gem 'rubocop-rails', '~> 2.15.2', require: false
+  gem 'rubocop-performance', '~> 1.14.3', require: false
+end
 # Specify your gem's dependencies in cm_admin.gemspec
 gemspec

data/Gemfile.lock

@@ -1,7 +1,7 @@
 PATH
   remote: .
   specs:
-    cm-admin (0.8.9)
+    cm-admin (0.9.1)
       caxlsx_rails
       cocoon (~> 1.2.15)
       csv-importer (~> 0.8.2)
@@ -61,18 +61,21 @@ GEM
     i18n (1.11.0)
       concurrent-ruby (~> 1.0)
     ice_nine (0.11.2)
+    json (2.6.2)
     local_time (2.1.0)
     loofah (2.19.0)
       crass (~> 1.0.2)
       nokogiri (>= 1.5.9)
     marcel (1.0.2)
     method_source (1.0.0)
+    mini_portile2 (2.8.0)
     minitest (5.16.2)
-    nokogiri (1.13.9-arm64-darwin)
+    nokogiri (1.13.9)
+      mini_portile2 (~> 2.8.0)
       racc (~> 1.4)
     pagy (4.11.0)
     parallel (1.22.1)
-    parser (3.1.2.0)
+    parser (3.1.2.1)
       ast (~> 2.4.1)
     pundit (2.2.0)
       activesupport (>= 3.0.0)
@@ -96,7 +99,7 @@ GEM
       zeitwerk (~> 2.5)
     rainbow (3.1.1)
     rake (12.3.3)
-    regexp_parser (2.5.0)
+    regexp_parser (2.6.1)
     rexml (3.2.5)
     rspec (3.10.0)
       rspec-core (~> 3.10.0)
@@ -111,17 +114,25 @@ GEM
       diff-lcs (>= 1.2.0, < 2.0)
       rspec-support (~> 3.10.0)
     rspec-support (3.10.2)
-    rubocop (1.30.1)
+    rubocop (1.35.1)
+      json (~> 2.3)
       parallel (~> 1.10)
-      parser (>= 3.1.0.0)
+      parser (>= 3.1.2.1)
       rainbow (>= 2.2.2, < 4.0)
       regexp_parser (>= 1.8, < 3.0)
       rexml (>= 3.2.5, < 4.0)
-      rubocop-ast (>= 1.18.0, < 2.0)
+      rubocop-ast (>= 1.20.1, < 2.0)
       ruby-progressbar (~> 1.7)
       unicode-display_width (>= 1.4.0, < 3.0)
-    rubocop-ast (1.18.0)
+    rubocop-ast (1.23.0)
       parser (>= 3.1.1.0)
+    rubocop-performance (1.14.3)
+      rubocop (>= 1.7.0, < 2.0)
+      rubocop-ast (>= 0.4.0)
+    rubocop-rails (2.15.2)
+      activesupport (>= 4.2.0)
+      rack (>= 1.1)
+      rubocop (>= 1.7.0, < 2.0)
     ruby-progressbar (1.11.0)
     rubyzip (2.3.2)
     semantic_range (3.0.0)
@@ -134,7 +145,7 @@ GEM
     tilt (2.0.10)
     tzinfo (2.0.4)
       concurrent-ruby (~> 1.0)
-    unicode-display_width (2.1.0)
+    unicode-display_width (2.3.0)
     virtus (2.0.0)
       axiom-types (~> 0.1)
       coercible (~> 1.0)
@@ -144,7 +155,7 @@ GEM
       rack-proxy (>= 0.6.1)
       railties (>= 5.2)
       semantic_range (>= 2.3.0)
-    zeitwerk (2.6.4)
+    zeitwerk (2.6.6)
 
 PLATFORMS
   ruby
@@ -156,7 +167,9 @@ DEPENDENCIES
   pundit
   rake (~> 12.0)
   rspec (~> 3.0)
-  rubocop
+  rubocop (~> 1.35.1)
+  rubocop-performance (~> 1.14.3)
+  rubocop-rails (~> 2.15.2)
   slim
 
 BUNDLED WITH

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

@@ -59,7 +59,7 @@
       padding: 6px 12px;
       @include font($size: $t3-text, $color: #555555);
       background-color: $white;
-      border: 1px solid #ccc;
+      border: 1px solid $grey-regular-clr;
       border-radius: $radius-2;
       box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
       transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;

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

@@ -163,10 +163,10 @@
   border-radius: $circle;
 }
 .border-top {
-  border-top: 1px solid #ccc;
+  border-top: 1px solid $grey-regular-clr;
 }
 .border-bottom {
-  border-bottom: 1px solid #ccc;
+  border-bottom: 1px solid $grey-regular-clr;
 }
 
 //common styles gose here
@@ -185,7 +185,7 @@
 }
 
 .error-text {
-  font-size: 14px;
+  font-size: $t4-text;
   color: $error-clr;
   margin: 5px 0;
   animation: shakeError 0.82s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;

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

@@ -1,9 +1,8 @@
 @import "../helpers/index.scss";
 
 .cm-filters-v2 {
-  min-height: 64px;
   padding: 16px 24px;
-  background-color: $white;
+  background-color: transparent;
   z-index: 1;
   &__inner {
     @include flex(row, flex-start, center, wrap);
@@ -13,10 +12,8 @@
       }
     }
     .add-filter-btn {
-      font-size: $t4-text;
+      @include font($size: $t4-text, $color: $primary-text-clr, $weight: 600);
       line-height: 22px;
-      font-weight: 600;
-      color: $primary-text-clr;
       cursor: pointer;
       span {
         margin-right: 4px;
@@ -27,10 +24,8 @@
     }
     .clear-btn {
       position: relative;
-      font-size: $t4-text;
+      @include font($size: $t4-text, $color: $ink-lighter-clr, $weight: 600);
       line-height: 22px;
-      font-weight: 600;
-      color: $ink-lighter-clr;
       margin-left: 32px;
       cursor: pointer;
       &::before {
@@ -77,7 +72,7 @@
       input {
         width: 100%;
         height: 39px;
-        border: 1px solid #ccc;
+        border: 1px solid $grey-regular-clr;
         border-radius: $radius-4;
         box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
         &:focus {
@@ -94,7 +89,7 @@
           //single-select-styles
           .select2-selection--single {
             height: 39px;
-            border: 1px solid #ccc;
+            border: 1px solid $grey-regular-clr;
             border-radius: $radius-4;
             box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
             &:focus {
@@ -121,7 +116,7 @@
           //multi-select-styles
           .select2-selection--multiple {
             max-height: 39px;
-            border: 1px solid #ccc;
+            border: 1px solid $grey-regular-clr;
             border-radius: $radius-4;
             box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
             overflow-y: auto;
@@ -153,14 +148,14 @@
 
       .filter-rangepicker {
         padding: 6px 12px;
-        color: #172b4d;
-        font-size: 16px;
+        color: $primary-text-clr;
+        font-size: $t3-text;
       }
 
       .field-area {
         display: block;
         padding: 6px 12px;
-        font-size: 16px;
+        font-size: $t3-text;
         color: #555555;
       }
       .search-icon {
@@ -173,7 +168,7 @@
         position: absolute;
         top: 10px;
         right: 15px;
-        font-size: 20px;
+        font-size: $t1-text;
         color: $brand-color;
       }
     }
@@ -183,8 +178,7 @@
     text-align: right;
     .filter-btn {
       padding: 5px 10px;
-      color: $white;
-      font-size: 16px;
+      @include font($size: $t3-text, $color: $white);
       background-color: $brand-color;
       border: none;
       border-radius: $radius-4;

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

@@ -33,6 +33,121 @@
   }
 }
 
+//cocoon field styles
+.fields-group {
+  display: flex;
+  align-items: center;
+  margin: 16px 0;
+  .field-item {
+    margin: 0 5px;
+    label {
+      @include font($size: $t4-text, $color: $primary-text-clr, $weight: bold);
+      margin-bottom: 4px;
+    }
+    input {
+      width: 100%;
+      padding: 5px 10px;
+      border: 1px solid #c1c7d0;
+      border-radius: $radius-2;
+      &:focus {
+        border-color: #66afe9 !important;
+        outline: 0 !important;
+        box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6) !important;
+      }
+    }
+  }
+  .field-remove {
+    margin-top: 25px;
+    a {
+      @include font($size: $t1-text, $color: #ff5656);
+      @include transition-linear;
+      &:hover {
+        transform: scale(1.1);
+      }
+    }
+  }
+}
+
+.add-field-btn {
+  font-size: $t4-text;
+  margin: 10px 0;
+}
+
+// Nested form styles
+.nested-field-wrapper {
+  .nested-field-label {
+    @include font($size: $t4-text, $color: $primary-text-clr);
+    line-height: 22px;
+    margin: 0 0 4px;
+    span {
+      color: $ink-lightest-clr;
+      margin-left: 4px;
+    }
+  }
+  .nested-single-field {
+    display: grid;
+    grid-template-columns: 1fr 32px;
+    align-items: center;
+    width: 352px;
+    margin-bottom: 8px;
+    .field-remove-action {
+      font-size: $t3-text;
+      text-align: center;
+      a {
+        color: $primary-text-clr;
+        &:hover {
+          color: $primary-text-clr;
+        }
+      }
+    }
+  }
+}
+
+// Nested form Accordion styles
+.nested-form-accordion {
+  .accordion-item {
+    margin-bottom: 8px;
+    border: 1px solid $grey-light-clr;
+    border-radius: $radius-4;
+  }
+  .accordion-item:not(:first-of-type) {
+    border-top: 1px solid $grey-light-clr;
+  }
+  .accordion-item:first-of-type {
+    margin-top: 4px;
+    border-radius: $radius-4;
+  }
+  .accordion-item:last-of-type {
+    margin-bottom: 0;
+    border-radius: $radius-4;
+  }
+  .accordion-header {
+    position: relative;
+    display: flex;
+    .accordion-delete-btn {
+      position: absolute;
+      top: 14px;
+      right: 48px;
+      z-index: 9;
+    }
+  }
+  .accordion-button {
+    border-radius: $radius-4;
+    &:focus {
+      border-color: transparent;
+      box-shadow: none;
+    }
+    &:not(.collapsed) {
+      color: inherit;
+      background-color: transparent;
+      box-shadow: none;
+    }
+    &:not(.collapsed)::after {
+      background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23212529'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
+    }
+  }
+}
+
 //Old form code
 .form-wrapper {
   // margin-top: 60px;
@@ -76,14 +191,12 @@
     .form-field {
       margin-bottom: 20px;
       .form-label {
-        font-weight: 600;
-        color: #172b4d;
-        font-size: 14px;
+        @include font($size: $t4-text, $color: $primary-text-clr, $weight: 600);
         margin-bottom: 0.5rem;
       }
       .form-input {
         label {
-          @include font($size: $t4-text, $color: #172b4d, $weight: bold);
+          @include font($size: $t4-text, $color: $primary-text-clr, $weight: bold);
         }
         input {
           width: 100%;
@@ -129,16 +242,12 @@
       }
 
       .radio-label {
-        color: #172b4d;
-        font-size: 16px;
-        font-weight: 600;
+        @include font($size: $t3-text, $color: $primary-text-clr, $weight: 600);
         margin-left: 8px;
       }
 
       .checkbox-label {
-        color: #172b4d;
-        font-size: 16px;
-        font-weight: 600;
+        @include font($size: $t3-text, $color: $primary-text-clr, $weight: 600);
         margin-left: 8px;
       }
     }
@@ -154,43 +263,3 @@
     }
   }
 }
-
-//cocoon field styles
-.fields-group {
-  display: flex;
-  align-items: center;
-  margin: 16px 0;
-  .field-item {
-    margin: 0 5px;
-    label {
-      @include font($size: $t4-text, $color: #172b4d, $weight: bold);
-      margin-bottom: 4px;
-    }
-    input {
-      width: 100%;
-      padding: 5px 10px;
-      border: 1px solid #c1c7d0;
-      border-radius: $radius-2;
-      &:focus {
-        border-color: #66afe9 !important;
-        outline: 0 !important;
-        box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6) !important;
-      }
-    }
-  }
-  .field-remove {
-    margin-top: 25px;
-    a {
-      @include font($size: $t1-text, $color: #ff5656);
-      @include transition-linear;
-      &:hover {
-        transform: scale(1.1);
-      }
-    }
-  }
-}
-
-.add-field-btn {
-  font-size: 14px;
-  margin: 10px 0;
-}

data/app/assets/stylesheets/cm_admin/base/main-nav.scss

@@ -15,9 +15,8 @@
   &__lhs {
     .bread-crumb-area {
       .breadcrumb-text {
-        font-size: $t4-text;
+        @include font($size: $t4-text, $color: $ink-lighter-clr);
         line-height: 22px;     
-        color: $ink-lighter-clr;
         margin: 0 0 16px;
         a {
           color: inherit;
@@ -26,16 +25,13 @@
     }
     .nav-title-area {
       .title-text {
-        font-size: 24px;
-        font-weight: 600;
+        @include font($size: $font-size(24), $color: $primary-text-clr, $weight: 600);
         line-height: 32px;
-        color: $primary-text-clr;
         margin: 0 0 8px;
       }
       .title-sub-text {
-        font-size: $t4-text;
+        @include font($size: $t4-text, $color: $primary-text-clr);
         line-height: 22px;
-        color: $primary-text-clr;
         margin: 0;
       }
     }

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

@@ -6,8 +6,9 @@
   left: 225px;
   display: flex;
   justify-content: space-between;
-  min-height: 140px;
-  padding: 24px 24px 16px;
+  align-items: flex-start;
+  min-height: 102px;
+  padding: 24px;
   background-color: $white;
   z-index: 2;
   &__lhs {

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

@@ -15,9 +15,8 @@
       position: absolute;
       top: 8px;
       right: 16px;
-      font-size: $t4-text;
+      @include font($size: $t4-text, $color: $ink-lighter-clr);
       line-height: 22px;
-      color: $ink-lighter-clr;
       cursor: pointer;
     }
   }
@@ -28,7 +27,7 @@
       font-size: $t4-text;
       line-height: 22px;
       span:nth-child(1) {
-        color: #828282;
+        color: $grey-dark-clr;
       }
       span:nth-child(2) {
         margin-left: 8px;
@@ -42,9 +41,8 @@
     padding: 4px 16px;
     box-shadow: inset 0px 1px 0px rgba(148, 151, 155, 0.15);
     .select {
-      font-size: $t6-text;
+      @include font($size: $t6-text, $color: $ink-lighter-clr);
       line-height: 16px;
-      color: $ink-lightest-clr;
       cursor: pointer;
       .move-arrow {
         font-size: 10px;
@@ -67,7 +65,7 @@
     }
   }
   .active-item {
-    background: #D9DEE3;
+    background: $grey-light-clr;
     width: 100%;
     height: 40px;
     float: left;

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

@@ -64,14 +64,14 @@ a {
   opacity: 1 !important;
 }
 
-.page-container {
+.cm-page-container {
   height: 100vh;
 }
 
 .sticky-container {
   position: sticky;
   top: 0;
-  background-color: #fff;
+  background-color: $white;
   z-index: 4;
 }
 
@@ -88,6 +88,7 @@ a {
     width: 480px;
   }
 }
+
 .input-wrapper.disabled {
   input:disabled {
     background-color: $grey-lightest-clr;
@@ -96,6 +97,7 @@ a {
     color: $ink-lightest-clr;
   }
 }
+
 .nested-fields .select2 {
   width: 320px !important;
 }
@@ -117,3 +119,46 @@ a {
   opacity: 0;
   z-index: -1;
 }
+
+//select 2 styles
+.select2-container {
+  .selection {
+    .select2-selection {
+      padding: 8px 16px;
+      background-color: $white;
+      border: 1px solid $grey-light-clr;
+      border-radius: $radius-4;
+      height: 40px;
+      .select2-selection__rendered {
+        padding-left: 0;
+        @include font($size: $t4-text, $color: $primary-text-clr);
+        line-height: 22px;
+      }
+      .select2-selection__arrow {
+        top: 6px;
+      }
+    }
+  }
+  .select2-dropdown {
+    border: 1px solid $grey-lighter-clr;
+    box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.16);
+    border-radius: $radius-4;
+    .select2-results {
+      .select2-results__options {
+        .select2-results__option {
+          padding: 9px 16px;
+          @include font($size: $t4-text, $color: $primary-text-clr);
+          line-height: 22px;
+        }
+      }
+      .select2-results__option--highlighted.select2-results__option--selectable {
+        background: $grey-lighter-clr;
+        color: $primary-text-clr;   
+      }
+      .select2-results__option--selected {
+        color: $brand-color !important;   
+        background-color: $grey-lighter-clr !important;
+      }
+    }
+  }
+}