arctic_admin 2.0.2 → 3.2.1

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 8bc13d2e0f8e5e7337f8c1d6c8a46c7557561eed3a74f94bdfd99e94fbd8f766
-  data.tar.gz: 7fe30e1460359a4751323396f305b2a87ca8e2aee3b2aa06b9a23875b9597d47
+  metadata.gz: e6f913893bfeb6224b1dd113545dca1818da6e987d64c516d03381aa48828daf
+  data.tar.gz: 220f72694714143f5c79c791003fba0838ce3bbf5ed2f60675b319dcdadbecff
 SHA512:
-  metadata.gz: 7beeaab724f5eef9a330727e648d0cc9018e51370a5bc68713bf59c2b1fe70c39e8ec46dcccf5b41bf85804f7ba54438a606f41ac0ea37bf44c0da2cbd8beb13
-  data.tar.gz: 4d3b0832045e0faa205fa4db68689cb6f70468c4ee95cc93b256e4c9b10701fea89f9d7fe154e4bd057b499a93b1147901d063857612f404160fb1bd79990921
+  metadata.gz: 41cd46ed6aaed2bf349f9ef27237b42e48869d8e025ab497e3ef39bae4fa64ece63428895f32b3c8526aec84000397d37ee643316b850faad18ed7f08a652597
+  data.tar.gz: ae67be0074df46fd0c19bef15866132936bd1c06900785b7654b22ac2cd8a58c6677bcf23b129dcf4f1e0647c929ba357df7d752675b17530527f74ce1be9f23

data/Readme.md

@@ -1,6 +1,8 @@
 # ArcticAdmin
 [![Gem Version](https://img.shields.io/gem/v/arctic_admin.svg)](https://rubygems.org/gems/arctic_admin)
 [![Gem Downloads](https://img.shields.io/gem/dt/arctic_admin.svg)](https://rubygems.org/gems/arctic_admin)
+[![Gem Version](https://img.shields.io/npm/v/arctic_admin.svg)](https://www.npmjs.com/package/arctic_admin)
+[![Gem Downloads](https://img.shields.io/npm/dt/arctic_admin.svg)](https://www.npmjs.com/package/arctic_admin)
 
 Simple theme for ActiveAdmin :ok_hand:
 
@@ -49,7 +51,7 @@ Then restart your webserver if it was previously running.
 :exclamation: **Remove the line `@import "active_admin/base"`**
 
 If you prefer [SCSS](http://sass-lang.com/documentation/file.SASS_REFERENCE.html), add this to your
-`active_admin.css.scss` file:
+`active_admin.scss` file:
 
 ```scss
 @import "arctic_admin/base";
@@ -57,7 +59,7 @@ If you prefer [SCSS](http://sass-lang.com/documentation/file.SASS_REFERENCE.html
 
 If you use the
 [Sass indented syntax](http://sass-lang.com/docs/yardoc/file.INDENTED_SYNTAX.html),
-add this to your `active_admin.css.sass` file:
+add this to your `active_admin.sass` file:
 
 ```sass
 @import arctic_admin/base
@@ -73,6 +75,41 @@ In your `active_admin.js`, include the js file:
 
 :exclamation:  **Remove the line `//= require active_admin/base`**
 
+## Use with webpacker
+
+### 1 - Preparation
+
+Install the assets from npm or yarn
+
+```
+yarn add arctic_admin
+```
+
+
+### 2 - CSS
+
+In your `app/javascript/stylesheets/active_admin.scss`, add the line:
+
+```scss
+@import '~arctic_admin/src/scss/main';
+```
+
+Remove:
+
+```scss
+@import "~@activeadmin/activeadmin/src/scss/mixins";
+@import "~@activeadmin/activeadmin/src/scss/base";
+```
+
+### 3 - JS
+
+In your `app/javascript/packs/active_admin.js`, add the line:
+
+```js
+import 'arctic_admin'
+```
+
+
 ### Customization
 
 For this, you need to use sass to custom the theme.
@@ -80,7 +117,7 @@ For this, you need to use sass to custom the theme.
 You can even change basic color of the theme by placing some other variables:
 
 If you use the [SCSS](http://sass-lang.com/documentation/file.SASS_REFERENCE.html), add this to your
-`active_admin.css.scss` file:
+`active_admin.scss` file:
 
 ```scss
 $primary-color: #2dbb43;
@@ -90,7 +127,7 @@ $primary-color: #2dbb43;
 
 If you use the
 [Sass indented syntax](http://sass-lang.com/docs/yardoc/file.INDENTED_SYNTAX.html),
-add this to your `active_admin.css.sass` file:
+add this to your `active_admin.sass` file:
 
 ```sass
 $primary-color: #2dbb43

data/app/assets/javascripts/arctic_admin/base.js

@@ -1,72 +1,4 @@
 //= require jquery
 //= require jquery_ujs
 //= require active_admin/base
-
-$(function() {
-  $(document).on('click touchstart', '#sidebar', function(e) {
-    var position = $(this).position();
-    var width = $(this).width();
-    var target = e.target;
-    if ((e.pageX < position.left) && (target.tagName != 'SELECT') && (target.tagName != 'OPTION')) {
-      if ($(this).css('right') == '0px') {
-        $(this).css('position', 'fixed');
-        $(this).animate({
-          right: "-="+width
-        }, 600, function() {
-          $(this).removeAttr('style');
-          animationFilterDone = true;
-        });
-      } else {
-        $(this).animate({
-          right: "+="+width
-        }, 600, function() {
-          $(this).css('position', 'absolute');
-          animationFilterDone = true;
-        });
-      }
-    }
-  });
-
-  var animationDone = true;
-  $(document).on('click touchstart', '#utility_nav', function(e) {
-    var position = $(this).position();
-    var tabs = $('#tabs');
-    var width = Math.round(tabs[0].getBoundingClientRect().width);
-
-    if (e.pageX < (position.left + 40)) {
-      if(animationDone == true) {
-        animationDone = false;
-        if (tabs.css('left') == '0px') {
-          tabs.animate({
-            left: "-="+width
-          }, 400, function() {
-            animationDone = true;
-          });
-        } else {
-          tabs.animate({
-            left: "+="+width
-          }, 400, function() {
-            animationDone = true;
-          });
-        }
-      }
-    }
-  });
-
-  $(document).on('click touchstart', 'body', function(e) {
-    var tabs = $('#tabs');
-    var width = Math.round(tabs[0].getBoundingClientRect().width);
-    if (tabs.css('left') == '0px') {
-      if (e.pageX > width && e.pageY > 60) {
-        if(animationDone == true) {
-          animationDone = false;
-          tabs.animate({
-            left: "-="+width
-          }, 400, function() {
-            animationDone = true;
-          });
-        }
-      }
-    }
-  });
-});
+//= require ./main

data/app/assets/javascripts/arctic_admin/main.js

@@ -0,0 +1,99 @@
+$(function () {
+  var animationFilterDone = true
+  $(document).on('click touchstart', '#sidebar', function (e) {
+    if (animationFilterDone == true) {
+      var position = $(this).position()
+      var width = $(this).width()
+      var target = e.target
+      if (
+        e.pageX < position.left &&
+        target.tagName != 'SELECT' &&
+        target.tagName != 'OPTION'
+      ) {
+        if ($(this).css('right') == '0px') {
+          $(this).css('position', 'fixed')
+          $(this).animate(
+            {
+              right: '-=' + width
+            },
+            600,
+            function () {
+              $(this).removeAttr('style')
+              animationFilterDone = true
+            }
+          )
+        } else {
+          $(this).animate(
+            {
+              right: '+=' + width
+            },
+            600,
+            function () {
+              $(this).css('position', 'absolute')
+              animationFilterDone = true
+            }
+          )
+        }
+      }
+    }
+  })
+
+  var animationDone = true
+  $(document).on('click touchstart', '#utility_nav', function (e) {
+    var position = $(this).position()
+    var tabs = $('#tabs')    
+    var width = (tabs.length==0)? 0 : Math.round(tabs[0].getBoundingClientRect().width)    
+    if (e.pageX < position.left + 40) {
+      if (animationDone == true) {
+        animationDone = false
+        if (tabs.css('left') == '0px') {
+          tabs.animate(
+            {
+              left: '-=' + width
+            },
+            400,
+            function () {
+              animationDone = true
+            }
+          )
+        } else {
+          tabs.animate(
+            {
+              left: '+=' + width
+            },
+            400,
+            function () {
+              animationDone = true
+            }
+          )
+        }
+      }
+    }
+  })
+
+  $(document).on('click touchstart', 'body', function (e) {
+    var tabs = $('#tabs')
+    var width = (tabs.length==0)? 0 : Math.round(tabs[0].getBoundingClientRect().width)
+    if (tabs.css('left') == '0px') {
+      if (e.pageX > width && e.pageY > 60) {
+        if (animationDone == true) {
+          animationDone = false
+          tabs.animate(
+            {
+              left: '-=' + width
+            },
+            400,
+            function () {
+              animationDone = true
+            }
+          )
+        }
+      }
+    }
+  })
+
+  $(document).on('click', '#tabs .has_nested', function (e) {
+    e.stopPropagation()
+    $(this).toggleClass('open')
+  })
+})

data/app/assets/stylesheets/arctic_admin/_common.scss

@@ -2,6 +2,11 @@ code {
   display: block;
   background-color: #272822;
   padding: 5px;
-  margin: 10px 0;
   color: white;
 }
+
+hr {
+  border: 1px solid $border-color;
+  color: $primary-color;
+  margin: 10px auto 25px auto;
+}

data/app/assets/stylesheets/arctic_admin/_main.scss

@@ -0,0 +1,54 @@
+@import 'reset';
+
+@import './variables/variables';
+
+@import './mixins/mixins';
+
+@import 'common';
+@import 'buttons';
+@import 'grid';
+
+@import './components/columns';
+@import './components/comments';
+@import './components/date_picker';
+@import './components/dialogs';
+@import './components/flash';
+@import './components/form';
+@import './components/inputs';
+@import './components/pagination';
+@import './components/panel_contents';
+@import './components/select2';
+@import './components/status_tag';
+@import './components/tables';
+@import './components/tabs';
+
+@import './layouts/filter';
+@import './layouts/footer';
+@import './layouts/header';
+@import './layouts/main_content';
+@import './layouts/sidebar';
+@import './layouts/wrapper';
+
+@import './pages/form';
+@import './pages/index';
+@import './pages/login';
+@import './pages/show';
+body {
+  font-family: $font-family-body;
+  background-color: $body-background;
+  color: $text-color;
+}
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+  margin-top: 0;
+}
+
+a {
+  color: $primary-color;
+  text-decoration: none;
+}

data/app/assets/stylesheets/arctic_admin/components/_date_picker.scss

@@ -35,4 +35,4 @@
       text-align: center;
     }
   }
-}
+}

data/app/assets/stylesheets/arctic_admin/components/_form.scss

@@ -40,7 +40,7 @@
     
     .inline-hints {
       margin: 5px 0 20px 25%;
-      font-size: 14px;
+      font-size: $font-size;
       font-style: italic;
     }
 
@@ -48,7 +48,7 @@
       color: $error;
       margin-top: 5px;
       margin-bottom: 20px;
-      font-size: 14px;
+      font-size: $font-size;
     }
 
     label.error {

data/app/assets/stylesheets/arctic_admin/components/_inputs.scss

@@ -8,9 +8,9 @@ input[type="number"], textarea {
 
   display: block;
   width: 100%;
-  height: 36px;
+  height: $input-height;
   padding: 6px 12px;
-  font-size: 14px;
+  font-size: $font-size;
   line-height: 1.57142857;
   color: $text-color;
   background-color: #fff;
@@ -88,7 +88,7 @@ select {
   border: 1px solid $border-color;
   outline: 0;
   border-radius: $border-radius;
-  font-size: 14px;
+  font-size: $font-size;
   color: #5a5a5a;
   @include transition(border-color ease-in-out .15s);
 

data/app/assets/stylesheets/arctic_admin/components/_select2.scss

@@ -0,0 +1,50 @@
+.select2-container--default .select2-selection--single .select2-selection__rendered{
+  line-height: $input-height; 
+  color: $text-color; 
+  font-size: $font-size;
+}
+
+.select2-container .select2-selection--single{ 
+  height: $input-height;
+  outline: 0;
+}
+
+.select2-container--default .select2-selection--single .select2-selection__arrow{ 
+  height: $input-height;
+}
+
+.select2-container--default .select2-selection--single { 
+  border-color: $border-color;
+}
+
+.select2-container .select2-selection--single .select2-selection__rendered{ 
+  padding-left: 12px;
+}
+
+.select2-dropdown{
+  border-color: $border-color; 
+}
+
+.select2-container--default .select2-results__option--highlighted[aria-selected]{
+  background-color: $primary_color;
+}
+
+.select2-container--default .select2-search--dropdown .select2-search__field{
+  border-color: $border-color;
+}
+
+.select2-container--default .select2-results__option[aria-selected=true]{
+  background_color: $body-background;
+}
+
+.select2-search--dropdown .select2-search__field{
+  padding-left: 12px;
+}
+
+.select2-results{
+  font-size: $font-size;
+}
+
+.select2-results__option{
+  padding-left: 12px;
+}

data/app/assets/stylesheets/arctic_admin/components/_status_tag.scss

@@ -6,12 +6,12 @@
   padding: 3px 5px 2px 5px;
   font-size: 0.8em;
   border-radius: $border-radius;
-}
 
-.status_tag.ok, .status_tag.published, .status_tag.complete, .status_tag.completed, .status_tag.green {
-  background-color: $status-tag-background-valid-color;
-}
+  &.ok, &.published, &.complete, &.completed, &.green, &.yes {
+    background-color: $status-tag-background-valid-color;
+  }
 
-.status_tag.cancel, .status_tag.red {
-  background-color: $status-tag-background-error-color;
-}
+  &.cancel, &.red, &.no {
+    background-color: $status-tag-background-error-color;
+  }
+}

data/app/assets/stylesheets/arctic_admin/components/_tables.scss

@@ -46,7 +46,7 @@ tbody tr {
   }
 
   th {
-    font-size: 14px;
+    font-size: $font-size;
   }
 
   td {

data/app/assets/stylesheets/arctic_admin/components/_tabs.scss

@@ -2,11 +2,11 @@
   border: 1px solid $border-color;
 
   .nav {
-    text-align: center;
     border-bottom: 1px solid $border-color;
     
     li {
       display: inline-block;
+      text-align: center;
       @include outline();
 
       a {

data/app/assets/stylesheets/arctic_admin/layouts/_filter.scss

@@ -22,7 +22,7 @@
     }
 
     .input {
-      margin-bottom: 15px;
+      margin-bottom: 10px;
 
       input, select {
         height: 30px;

data/app/assets/stylesheets/arctic_admin/layouts/_header.scss

@@ -14,11 +14,11 @@ body.active_admin.logged_in {
   }
 
   #active_admin_content {
-    padding: 30px 0;
+    padding: 20px 0;
     @include clear-fix();
 
     @media screen and (min-width: $lg-width) {
-      padding: 30px 25px;
+      padding: 20px 25px;
     }
   }
 }

data/app/assets/stylesheets/arctic_admin/layouts/_sidebar.scss

@@ -23,7 +23,7 @@
 
   li {
     width: 100%;
-    font-size: 14px;
+    font-size: $font-size;
     line-height: 38px;
     cursor: pointer;
 
@@ -59,10 +59,6 @@
           color: $text-color;
         }
       }
-      
-      &:hover ul {
-        display: block;
-      }
 
       ul {
         border-top: 1px solid $sidebar-border-color;

data/app/assets/stylesheets/arctic_admin/mixins/_prefix_mixins.scss

@@ -58,6 +58,6 @@
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
-  font: 900 normal normal 14px/1 'Font Awesome 5 Free';
+  font: 900 normal normal 14px/1 'Font Awesome 5 Free', 'Font Awesome 5 Pro';
   content: $code-icon;
 }

data/app/assets/stylesheets/arctic_admin/pages/_form.scss

@@ -17,7 +17,7 @@ body.logged_in {
         margin: auto 0;
         padding-top: 8px;
         text-align: right;
-        font-size: 14px;
+        font-size: $font-size;
 
         @media screen and (min-width: $sm-width) {
           padding-bottom: 0;
@@ -85,7 +85,7 @@ body.logged_in {
         }
 
         label {
-          font-size: 14px;
+          font-size: $font-size;
           cursor: pointer;
           padding: 5px 5px 5px 0;
         }

data/app/assets/stylesheets/arctic_admin/pages/_index.scss

@@ -6,7 +6,7 @@ body.index {
 
   .table_tools {
     margin-bottom: 20px;
-    font-size: 14px;
+    font-size: $font-size;
 
     &:after {
       content: '';
@@ -47,7 +47,7 @@ body.index {
   }
 
   #index_footer {
-    font-size: 14px;
+    font-size: $font-size;
   }
 
   .sortable {
@@ -62,7 +62,7 @@ body.index {
       @include transform(translateY(-50%));
 
       @media screen and (min-width: $md-width) {
-        font-size: 14px/1;
+        font-size: $font-size/1;
       }
     }
 
@@ -76,13 +76,16 @@ body.index {
   }
 
   .table_actions {
+    margin-bottom: -4px;
+
     .member_link {
       @include primary-button($primary-color, white);
-      padding: 2px 9px;
+      padding: 4px 8px;
       margin-right: 4px;
+      margin-bottom: 4px;
     }
   }
-  
+
   .scopes {
     .scope {
       @include group-button($primary-color);
@@ -113,4 +116,4 @@ body.index {
       padding: 15px 10px;
     }
   }
-}
+}

data/app/assets/stylesheets/arctic_admin/variables/_size.scss

@@ -6,4 +6,7 @@ $lg-screen-header-width: calc(100% - 250px) !default;
 $filter-width: 230px !default;
 $screen-filter-width: calc(100% - 230px) !default;
 $lg-filter-width: 270px !default;
-$lg-screen-filter-width: calc(100% - 270px) !default;
+$lg-screen-filter-width: calc(100% - 270px) !default;
+
+$font-size: 14px !default;
+$input-height: 36px !default;

data/lib/arctic_admin/version.rb

@@ -1,3 +1,3 @@
 module ArcticAdmin
-  VERSION = "2.0.2"
+  VERSION = "3.2.1"
 end

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: arctic_admin
 version: !ruby/object:Gem::Version
-  version: 2.0.2
+  version: 3.2.1
 platform: ruby
 authors:
 - Clément Prod'homme
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2019-04-02 00:00:00.000000000 Z
+date: 2020-10-01 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: bundler
@@ -47,7 +47,7 @@ dependencies:
         version: 1.1.0
     - - "<"
       - !ruby/object:Gem::Version
-        version: '2.0'
+        version: '3.0'
   type: :runtime
   prerelease: false
   version_requirements: !ruby/object:Gem::Requirement
@@ -57,7 +57,7 @@ dependencies:
         version: 1.1.0
     - - "<"
       - !ruby/object:Gem::Version
-        version: '2.0'
+        version: '3.0'
 - !ruby/object:Gem::Dependency
   name: jquery-rails
   requirement: !ruby/object:Gem::Requirement
@@ -78,14 +78,14 @@ dependencies:
     requirements:
     - - "~>"
       - !ruby/object:Gem::Version
-        version: 5.6.1
+        version: '5.0'
   type: :runtime
   prerelease: false
   version_requirements: !ruby/object:Gem::Requirement
     requirements:
     - - "~>"
       - !ruby/object:Gem::Version
-        version: 5.6.1
+        version: '5.0'
 description: A responsive theme for Active Admin
 email: 
 executables: []
@@ -111,11 +111,13 @@ files:
 - app/assets/fonts/Lato-Regular.woff
 - app/assets/fonts/Lato-Regular.woff2
 - app/assets/javascripts/arctic_admin/base.js
+- app/assets/javascripts/arctic_admin/main.js
 - app/assets/stylesheets/arctic_admin/_base.scss
 - app/assets/stylesheets/arctic_admin/_buttons.scss
 - app/assets/stylesheets/arctic_admin/_common.scss
 - app/assets/stylesheets/arctic_admin/_fonts.scss
 - app/assets/stylesheets/arctic_admin/_grid.scss
+- app/assets/stylesheets/arctic_admin/_main.scss
 - app/assets/stylesheets/arctic_admin/_reset.scss
 - app/assets/stylesheets/arctic_admin/components/_columns.scss
 - app/assets/stylesheets/arctic_admin/components/_comments.scss
@@ -126,6 +128,7 @@ files:
 - app/assets/stylesheets/arctic_admin/components/_inputs.scss
 - app/assets/stylesheets/arctic_admin/components/_pagination.scss
 - app/assets/stylesheets/arctic_admin/components/_panel_contents.scss
+- app/assets/stylesheets/arctic_admin/components/_select2.scss
 - app/assets/stylesheets/arctic_admin/components/_status_tag.scss
 - app/assets/stylesheets/arctic_admin/components/_tables.scss
 - app/assets/stylesheets/arctic_admin/components/_tabs.scss
@@ -150,7 +153,7 @@ files:
 - app/assets/stylesheets/arctic_admin/variables/_variables.scss
 - lib/arctic_admin.rb
 - lib/arctic_admin/version.rb
-homepage: https://github.com/cle61/arctic_admin
+homepage: https://github.com/cprodhomme/arctic_admin
 licenses:
 - MIT
 metadata: {}