active_bootstrap_skin 0.1.2 → 0.1.3

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: 1f63ec1e9855409b9c6d083345307a199ab5e8a2
-  data.tar.gz: 66ef0dd8f74e810e68e7e6d59a37689fa825bb94
+  metadata.gz: 359cc07d65f7374b505b041b4bb4110ae0af1cdc
+  data.tar.gz: e9fef4a9d758eeafb04bba32ce234ec7e245c998
 SHA512:
-  metadata.gz: 019ca89510462a48d925b997785aa2fb033bb47e660afe02d0f0d2b1cd3f889c75e2d7d91414baebc9a06575a4cbc7ed3958c978ebeaedb3a4799253c51767a8
-  data.tar.gz: db4fadeedb636959b89a72aba1b5894a88be508dec038ebd63875333f335c8b26eef65f441bf3780b6d94d87fc7e77e764f4c0df7896d0ce5a3152a74cb09f36
+  metadata.gz: 045ca6cb6e04a538a3c912b2058651f07c28200cda9c55046ad4e564d6c0e5f5dd3cafb5e4285aa75ed0087fef910aeb459a60490ac15e22f99396c998170808
+  data.tar.gz: 95f7415dde1061edbfc77c219a40e370031da8233f3d47a6dbf414611278005a6b4163a6cd6875bcc2b56afb6ca694926b74f9b990629a05712ee4d6e9a20ba1

data/README.md

@@ -19,7 +19,7 @@ gem 'active_bootstrap_skin'
 
 - In the `active_admin.scss` file, you include `active_bootstrap_skin`. **Note: You have to comment the active admin stylesheets.**
 
-```
+```css
 // Active Admin's got SASS!
 // @import "active_admin/mixins";
 // @import "active_admin/base";
@@ -28,6 +28,15 @@ gem 'active_bootstrap_skin'
 @import "active_bootstrap_skin";
 ```
 
+- In the `active_admin.js` file, you require `active_bootstrap_skin`.
+
+```javascript
+//= require active_admin/base
+//= require bootstrap-sprockets
+
+//= require active_bootstrap_skin
+```
+
 ## Screens
 
 ![Login](https://cloud.githubusercontent.com/assets/1997137/14111523/49c1e80c-f5f5-11e5-9fd4-d1700428b167.png)
@@ -36,6 +45,10 @@ gem 'active_bootstrap_skin'
 
 ![Admin Responsive](https://cloud.githubusercontent.com/assets/1997137/14111613/8fd64eb4-f5f5-11e5-9024-0d0dbf4c4b88.png)
 
+![Admin viewport](https://cloud.githubusercontent.com/assets/1997137/15280259/d47272f4-1b58-11e6-86e8-b35836557890.png)
+
+![Admin dropdown](https://cloud.githubusercontent.com/assets/1997137/15280303/57980aea-1b59-11e6-9cda-b58573a03f84.png)
+
 ## Contributing
 
 Bug reports and pull requests are welcome on GitHub at https://github.com/vinhnglx/active_bootstrap_skin. This project is intended to be a safe, welcoming space for collaboration, and contributors are expected to adhere to the [Contributor Covenant](http://contributor-covenant.org/) code of conduct.

data/app/assets/javascripts/active_bootstrap_skin.js

@@ -0,0 +1,28 @@
+$(document).ready(function() {
+  // Add meta view port
+  $('head').append('<meta name="viewport" content="width=device-width, initial-scale=1">');
+
+  // Dropdown menus
+  $(window).resize(function(){
+    if ($(window).width() <= 768) {
+      $('#tabs').addClass('collapse');
+    } else {
+      $('#tabs').removeClass('collapse');
+    }
+  });
+
+  html_responsive = ' \
+    <ul class="header-item tabs mobile"> \
+      <li> \
+        <button class="navbar-toggle button_mobile_burger" type="button" data-toggle="collapse" href="#tabs" aria-expanded="true" aria-controls="tabs"> \
+          <span class="sr-only">Toggle navigation</span> \
+          <span class="icon-bar"></span> \
+          <span class="icon-bar"></span> \
+          <span class="icon-bar"></span> \
+        </button> \
+      </li> \
+    </ul> \
+  '
+
+  $(html_responsive).insertAfter('#site_title');
+});

data/app/assets/stylesheets/active_bootstrap_skin.scss

@@ -2,6 +2,12 @@
 
 #wrapper {
   @extend .container-fluid;
+  padding-left: 0px;
+  padding-right: 0px;
+  div {
+    padding-left: 5px;
+    padding-right: 5px;
+  }
 }
 
 .flash {
@@ -14,7 +20,7 @@
 }
 
 .flash_notice {
-  @extend .alert-success;
+  @extend .alert-success
 }
 
 #error_explanation {
@@ -49,10 +55,31 @@
 #header {
   @extend .navbar;
   @extend .navbar-inverse;
+  border-radius: 0px;
+
+  .mobile {
+    display: none;
+  }
 
   @media (max-width: 768px) {
+    .button_mobile_burger {
+      margin-top: 0;
+    }
+
     #site_title {
-      float: none;
+      float: left;
+    }
+
+    #utility_nav {
+      display: none;
+    }
+
+    #tabs {
+      clear: both;
+    }
+
+    .mobile {
+      display: block;
     }
 
     .header-item.tabs {
@@ -81,9 +108,7 @@
     @extend .nav;
     @extend .navbar-nav;
 
-    li.current {
-      @extend .active;
-    }
+    li.current { @extend .active; }
   }
 
 
@@ -114,19 +139,12 @@
   .filter_form_field {
     @extend .form-group;
 
-    input,select {
-      @extend .form-control;
-    }
+    input,select { @extend .form-control; }
   }
 
   .buttons {
-    input, a {
-      @extend .btn;
-      @extend .btn-default;
-    }
-    input[type="submit"] {
-      @extend .btn-primary;
-    }
+    input, a { @extend .btn; @extend .btn-default; }
+    input[type="submit"] { @extend .btn-primary; }
   }
 }
 
@@ -135,17 +153,13 @@
   @extend .row;
 
   &.without_sidebar {
-    #main_content_wrapper {
-      @extend .col-lg-6;
-    }
+    #main_content_wrapper { @extend .col-md-6; }
   }
 
   &.with_sidebar {
-    #main_content_wrapper {
-       @extend .col-lg-9;
-    }
+    #main_content_wrapper { @extend .col-md-9; }
     #sidebar {
-      @extend .col-lg-3;
+      @extend .col-md-3;
       input {
         margin-top: 10px;
       }
@@ -183,11 +197,11 @@
   }
 
   .ui-datepicker-prev {
-    @extend .pull-left;
+    float: left;
   }
 
   .ui-datepicker-next {
-    @extend .pull-right;
+    float: right;
   }
 
   .ui-datepicker-today {
@@ -201,15 +215,14 @@
 }
 
 /* Tables */
-.index_table {
-  @extend .table;
-}
-.attributes_table table {
-  @extend .table;
-}
+.index_as_table { @extend .table-responsive; }
+.index_table      { @extend .table; }
+.attributes_table table { @extend .table; }
 
 /* Forms */
 form {
+  //@extend form[role="form"];
+
   .inputs, .actions {
     ol {
       padding-left: 0;
@@ -239,6 +252,7 @@ form {
   }
 
   label.label {
+    /* The label class has a different meaning in bootstrap */
     display: inline-block;
     font-weight: bold;
 

data/lib/active_bootstrap_skin/version.rb

@@ -1,3 +1,3 @@
 module ActiveBootstrapSkin
-  VERSION = "0.1.2"
+  VERSION = "0.1.3"
 end

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: active_bootstrap_skin
 version: !ruby/object:Gem::Version
-  version: 0.1.2
+  version: 0.1.3
 platform: ruby
 authors:
 - Vinh Nguyen
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2016-04-05 00:00:00.000000000 Z
+date: 2016-05-17 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: bundler
@@ -69,6 +69,7 @@ files:
 - Rakefile
 - active_bootstrap_skin.gemspec
 - app/assets/images/.gitkeep
+- app/assets/javascripts/active_bootstrap_skin.js
 - app/assets/stylesheets/active_bootstrap_skin.scss
 - bin/console
 - bin/setup