activeadmin_materialize_theme 0.2.1 → 0.2.2

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 73d91734349b706cb684ac0196aff67e7ceb0ab8791d9714f314b71e478b8ef3
-  data.tar.gz: 83f097a8dc60379bc077fd22f22d7c28fc0ad3870583ae19e2a3ef7c9c7e5962
+  metadata.gz: aa0196437fae5e331eb7f3fe534cc27505fa1589312d6f8c341ed51d638d3cd8
+  data.tar.gz: d4b25e2d9494610de3c62f7044a4f7778d29e83c9582aa429293efe60ca387b2
 SHA512:
-  metadata.gz: 1eca31457583662f4f0fbdf63901a36caa28129471d7b7b3abec6418e0fa0513e73ac62bd21b4abe53a0c5d995845b1f929d22a867a2338fb0120d10a84cfd4e
-  data.tar.gz: c96c3b708fa7b57ec49d0b3e875f2f40cce03b3155b2adfa035e7e1ae715cb7c1f21f2957aebfc6fdb5d6bd27caa072a19542fa680e898d6ad2336713f853202
+  metadata.gz: ad3aa1a0605f1ebbb306c4ec3071578e09ed10b06fd7df628e05a9c87e9e8208afd2a255d562543a9e2702bc0163d7dde391a2733b09eb3ee679d4a36f987693
+  data.tar.gz: 9eb0ef5a98080ddb0ef059c128eb7dc90874e8dc7fd5d725421b66209da4f73b2aa8f253904f972a205caf182f989281b9c7d06ec40e194f409c69ba9e4ee90f

data/app/assets/javascripts/activeadmin_materialize_theme.js

@@ -2,9 +2,9 @@
 
 (function () {
   // --- functions -------------------------------------------------------------
-  function addClassToElements(class_name, elements) {
+  function addClassToElements(elements, class_name) {
     document.querySelectorAll(elements).forEach(
-      (el) => el.className += ' ' + class_name
+      (el) => el.classList.add(class_name)
     )
   }
 
@@ -13,10 +13,13 @@
       const checkbox = el.querySelector('[type="checkbox"]')
       const label = document.createElement('label')
       const span = document.createElement('span')
+      span.className = 'aa_mt_checkbox'
       label.appendChild(span)
       el.appendChild(label)
       label.insertBefore(checkbox, span)
     })
+    const selector = 'body.active_admin .resource_selection_toggle_cell >label, body.active_admin .choices >label'
+    document.querySelectorAll(selector).forEach((el) => prepareCheckbox(el))
   }
 
   function initDropdowns() {
@@ -34,21 +37,14 @@
   }
 
   function initFormFields() {
-    addClassToElements('input-field', 'body.active_admin .formtastic .input')
-    addClassToElements('materialize-textarea', 'body.active_admin .formtastic textarea')
-    document.querySelectorAll('body.active_admin .input-field.boolean > label').forEach((el) => {
-      const text = el.lastChild
-      if (text.nodeType == Node.TEXT_NODE) {
-        const span = document.createElement('span')
-        span.innerHTML = text.textContent
-        text.replaceWith(span)
-      }
-    })
+    addClassToElements('body.active_admin .formtastic .input', 'input-field')
+    addClassToElements('body.active_admin .formtastic textarea', 'materialize-textarea')
+    document.querySelectorAll('body.active_admin .input-field.boolean > label').forEach((el) => prepareCheckbox(el))
   }
 
   function initNestedMenu() {
     let nested_menu_cnt = 0
-    addClassToElements('dropdown-content', '.menu_item.has_nested >ul')
+    addClassToElements('body.active_admin .menu_item.has_nested >ul', 'dropdown-content')
     document.querySelectorAll('.menu_item.has_nested').forEach((el) => {
       nested_menu_cnt += 1
       el.childNodes.forEach((node) => {
@@ -63,12 +59,31 @@
     })
   }
 
+  function initTabs() {
+    document.querySelectorAll('body.active_admin .formtastic >.tabs').forEach(
+      (el) => el.classList.remove('tabs')
+    )
+    addClassToElements('body.active_admin .formtastic .nav-tabs', 'tabs')
+    addClassToElements('body.active_admin .formtastic .nav-tabs >li', 'tab')
+  }
+
+  function prepareCheckbox(el) {
+    const text = el.lastChild
+    if (text.nodeType == Node.TEXT_NODE) {
+      const span = document.createElement('span')
+      span.innerHTML = text.textContent
+      span.className = 'aa_mt_checkbox'
+      text.replaceWith(span)
+    }
+  }
+
   function setup() {
-    addClassToElements('no-autoinit', 'body.active_admin #header >.tabs')
+    addClassToElements('body.active_admin #header >.tabs', 'no-autoinit')
     initCheckboxes()
     initDropdowns()
     initFormFields()
     initNestedMenu()
+    initTabs()
     M.AutoInit()
   }
 

data/app/assets/stylesheets/activeadmin_materialize_theme/base.scss

@@ -10,6 +10,12 @@ body.active_admin {
     @extend .btn;
   }
 
+  .aa_mt_checkbox {
+    padding-left: 2.5rem;
+    padding-right: 1.5rem;
+    vertical-align: middle;
+  }
+
   .col-selectable {
     text-align: center;
   }
@@ -90,11 +96,6 @@ body.active_admin {
     content: ' ↓';
   }
 
-  .resource_selection_cell span {
-    padding: 0 1rem;
-    vertical-align: middle;
-  }
-
   .ui-dialog {
     @extend .modal;
 

data/app/assets/stylesheets/activeadmin_materialize_theme/components/form.scss

@@ -14,6 +14,11 @@ body.active_admin {
       padding: 0;
     }
 
+    h3 {
+      font-size: 2.2rem;
+      margin: 0.4rem 0 0 0;
+    }
+
     .actions ol, .inputs ol {
       list-style-type: none;
       margin: 0;
@@ -21,7 +26,7 @@ body.active_admin {
     }
 
     .actions {
-      margin: 3rem 0 0.5rem 0 !important;
+      margin: 2rem 0 0.5rem 0 !important;
 
       a {
         @extend .btn;
@@ -55,6 +60,15 @@ body.active_admin {
       }
     }
 
+    >.errors {
+      @extend .z-depth-2;
+
+      background: color('red', 'base');
+      color: #fff;
+      margin: 0.7rem 0;
+      padding: 1rem;
+    }
+
     .field_with_errors {
       >input {
         border-bottom: 1px solid color('materialize-red', 'base');
@@ -70,9 +84,9 @@ body.active_admin {
       margin: 0;
     }
 
-    >.inputs {
+    .inputs {
       position: relative;
-      margin-bottom: 3rem;
+      margin-bottom: 2rem;
 
       >legend {
         display: block;
@@ -109,11 +123,6 @@ body.active_admin {
       padding: 2rem;
       position: relative;
 
-      >h3 {
-        font-size: 2.2rem;
-        margin: 0.4rem 0 0 0;
-      }
-
       >.has_many_add {
         background-color: color('cyan', 'base');
         margin-top: 0.4rem;
@@ -127,5 +136,11 @@ body.active_admin {
         margin-bottom: 2rem;
       }
     }
+
+    .nav-tabs {
+      @extend .z-depth-1;
+
+      margin-bottom: 2rem;
+    }
   }
 }

data/app/assets/stylesheets/activeadmin_materialize_theme/components/layout_index.scss

@@ -22,6 +22,28 @@ body.active_admin.index {
       padding-bottom: 0.3rem !important;
       padding-top: 0.3rem !important;
     }
+
+    .aa_mt_checkbox {
+      padding: 0 1rem !important;
+    }
+  }
+
+  .index_as_grid {
+    >table {
+      display: block;
+
+      tbody {
+        display: block;
+      }
+
+      tr {
+        display: flex;
+      }
+
+      img {
+        width: 100%;
+      }
+    }
   }
 
   .paginated_collection {
@@ -40,16 +62,17 @@ body.active_admin.index {
     }
 
     >.scopes {
+      display: inline-block;
+    }
+
+    .table_tools_segmented_control {
       border: 1px solid #ddd;
       border-radius: 0.5rem;
       display: inline-block;
+      margin: 0 0 0 2rem;
       vertical-align: middle;
 
-      >ul {
-        margin: 0;
-      }
-
-      .scope {
+      >li {
         display: inline-block;
         padding: 0.2rem 1rem;
 

data/lib/activeadmin_materialize_theme/version.rb

@@ -1,5 +1,5 @@
 # frozen_string_literal: true
 
 module ActiveadminMaterializeTheme
-  VERSION = '0.2.1'
+  VERSION = '0.2.2'
 end

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: activeadmin_materialize_theme
 version: !ruby/object:Gem::Version
-  version: 0.2.1
+  version: 0.2.2
 platform: ruby
 authors:
 - Mattia Roccoberton
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2020-09-12 00:00:00.000000000 Z
+date: 2020-09-13 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: activeadmin