vinhnglx / active_bootstrap_skin Goto Github PK

View Code? Open in Web Editor NEW

134.0 7.0 28.0 34 KB

Bootstrap skin for Active Admin :rocket: :rocket: :rocket:

License: MIT License

Ruby 15.49% Shell 1.17% CSS 75.60% JavaScript 7.74%

bootstrap3-theme activeadmin activeadmin-themes activeadmin-resource rubygems

active_bootstrap_skin's Introduction

ActiveBootstrapSkin

Bootstrap skin for Active Admin.

Installation

Add the gem to your Gemfile:

# Note: The gem require the bootstrap-sass gem. So we need to add bootstrap-sass to Gemfile

gem 'bootstrap-sass'
gem 'active_bootstrap_skin'

Usage

Don't forget you have to config the bootstraps-sass first.
In the active_admin.scss file, you include active_bootstrap_skin. Note: You have to comment the active admin stylesheets.

// Active Admin's got SASS!
// @import "active_admin/mixins";
// @import "active_admin/base";

// Active Bootstrap
@import "active_bootstrap_skin";

In the active_admin.js file, you require active_bootstrap_skin.

//= require active_admin/base
//= require bootstrap-sprockets

//= require active_bootstrap_skin

Screens

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 code of conduct.

active_bootstrap_skin's People

Contributors

Stargazers

Watchers

active_bootstrap_skin's Issues

#wrapper div padding 5px

Whats the purpose of the 5px left and right padding applied to all div inside #wrapper ?

It adds various padding inside the admin (a table index has about 25px padding around the actual table) and mess up with bootstrap grid.

It's added on top of the scss file :

#wrapper {
  ...
  div {
    padding-left: 5px;
    padding-right: 5px;
  }
}

Images

Scopes are floating right if batch_actions are enabled

That's the weired behaviour i mentioned last time.
as soon batch_actions are enabled, those scopes are pushed to the right.

if batch_actions = false everything is working fine.

Total site Style broken :(

http://prntscr.com/bx8o4d

Dropdowns not working

I was checking the code of the dropdowns and it's showing like this

<li class="has_nested" id="example">
<a href="#">Example</a>           
   <ul>
       <li id="model1"><a href="/admin/">Model1</a></li>
       <li id="model2"><a href="/admin/alumno_induccions">Model2</a></li>
     </ul>
 </li>

So, it should be like this:

<li class="dropdown" id="example"> <-notice the class
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button">Example</a> <-- added css class, data-toggle and role          
   <ul class="dropdown-menu"> <-- notice the class
       <li id="model1"><a href="/admin/">Model1</a></li>
       <li id="model2"><a href="/admin/alumno_induccions">Model2</a></li>
     </ul>
 </li>

But I only modified that using the web inspector, How can I make permanent?

Not Turbolinks 5 compatable

The page needs to be refreshed to load properly under Rails 5 / Turbolinks 5.

This looks like it could be the issue: https://github.com/vinhnglx/active_bootstrap_skin/blob/master/app/assets/javascripts/active_bootstrap_skin.js#L1

active_admin.js.coffee instead of .js

active_admin.js.coffee instead of .js is created with active_admin

//= require active_bootstrap_skin

should be

#= require active_bootstrap_skin

right?

Getting Error Sass::SyntaxError - Undefined variable: "$filter-field-seperator-width"

I am using activeadmin (1.0.0). I found active_bootstrap_skin pretty simple using in my new project but when I try it on my existing project it crashed let me share logs.
sass::SyntaxError - Undefined variable: "$filter-field-seperator-width".:
sass (3.4.19) lib/sass/script/tree/variable.rb:49:in _perform' sass (3.4.19) lib/sass/script/tree/node.rb:50:inperform'
sass (3.4.19) lib/sass/tree/visitors/perform.rb:395:in visit_prop' sass (3.4.19) lib/sass/tree/visitors/base.rb:36:invisit'
sass (3.4.19) lib/sass/tree/visitors/perform.rb:158:in block in visit' sass (3.4.19) lib/sass/stack.rb:79:inblock in with_base'
sass (3.4.19) lib/sass/stack.rb:115:in with_frame' sass (3.4.19) lib/sass/stack.rb:79:inwith_base'
sass (3.4.19) lib/sass/tree/visitors/perform.rb:158:in visit' sass (3.4.19) lib/sass/tree/visitors/perform.rb:431:inblock (2 levels) in visit_rule'
sass (3.4.19) lib/sass/tree/visitors/perform.rb:431:in block in visit_rule' sass (3.4.19) lib/sass/tree/visitors/perform.rb:179:inwith_environment'
sass (3.4.19) lib/sass/tree/visitors/perform.rb:429:in visit_rule' sass (3.4.19) lib/sass/tree/visitors/base.rb:36:invisit'
sass (3.4.19) lib/sass/tree/visitors/perform.rb:158:in block in visit' sass (3.4.19) lib/sass/stack.rb:79:inblock in with_base'
sass (3.4.19) lib/sass/stack.rb:115:in with_frame' sass (3.4.19) lib/sass/stack.rb:79:inwith_base'
sass (3.4.19) lib/sass/tree/visitors/perform.rb:158:in visit' sass (3.4.19) lib/sass/tree/visitors/perform.rb:431:inblock (2 levels) in visit_rule'
sass (3.4.19) lib/sass/tree/visitors/perform.rb:431:in block in visit_rule' sass (3.4.19) lib/sass/tree/visitors/perform.rb:179:inwith_environment'
sass (3.4.19) lib/sass/tree/visitors/perform.rb:429:in visit_rule' sass (3.4.19) lib/sass/tree/visitors/base.rb:36:invisit'
sass (3.4.19) lib/sass/tree/visitors/perform.rb:158:in block in visit' sass (3.4.19) lib/sass/stack.rb:79:inblock in with_base'
sass (3.4.19) lib/sass/stack.rb:115:in with_frame' sass (3.4.19) lib/sass/stack.rb:79:inwith_base'
sass (3.4.19) lib/sass/tree/visitors/perform.rb:158:in visit' sass (3.4.19) lib/sass/tree/visitors/perform.rb:431:inblock (2 levels) in visit_rule'
sass (3.4.19) lib/sass/tree/visitors/perform.rb:431:in block in visit_rule' sass (3.4.19) lib/sass/tree/visitors/perform.rb:179:inwith_environment'
sass (3.4.19) lib/sass/tree/visitors/perform.rb:429:in visit_rule' sass (3.4.19) lib/sass/tree/visitors/base.rb:36:invisit'
sass (3.4.19) lib/sass/tree/visitors/perform.rb:158:in block in visit' sass (3.4.19) lib/sass/stack.rb:79:inblock in with_base'
sass (3.4.19) lib/sass/stack.rb:115:in with_frame' sass (3.4.19) lib/sass/stack.rb:79:inwith_base'
sass (3.4.19) lib/sass/tree/visitors/perform.rb:158:in visit' sass (3.4.19) lib/sass/tree/visitors/perform.rb:431:inblock (2 levels) in visit_rule'
sass (3.4.19) lib/sass/tree/visitors/perform.rb:431:in block in visit_rule' sass (3.4.19) lib/sass/tree/visitors/perform.rb:179:inwith_environment'
sass (3.4.19) lib/sass/tree/visitors/perform.rb:429:in visit_rule' sass (3.4.19) lib/sass/tree/visitors/base.rb:36:invisit'
sass (3.4.19) lib/sass/tree/visitors/perform.rb:158:in block in visit' sass (3.4.19) lib/sass/stack.rb:79:inblock in with_base'
sass (3.4.19) lib/sass/stack.rb:115:in with_frame' sass (3.4.19) lib/sass/stack.rb:79:inwith_base'
sass (3.4.19) lib/sass/tree/visitors/perform.rb:158:in visit' sass (3.4.19) lib/sass/tree/visitors/perform.rb:326:inblock (2 levels) in visit_import'
sass (3.4.19) lib/sass/tree/visitors/perform.rb:326:in block in visit_import' sass (3.4.19) lib/sass/stack.rb:88:inblock in with_import'
sass (3.4.19) lib/sass/stack.rb:115:in with_frame' sass (3.4.19) lib/sass/stack.rb:88:inwith_import'
sass (3.4.19) lib/sass/tree/visitors/perform.rb:323:in visit_import' sass (3.4.19) lib/sass/tree/visitors/base.rb:36:invisit'
sass (3.4.19) lib/sass/tree/visitors/perform.rb:158:in block in visit' sass (3.4.19) lib/sass/stack.rb:79:inblock in with_base'
sass (3.4.19) lib/sass/stack.rb:115:in with_frame' sass (3.4.19) lib/sass/stack.rb:79:inwith_base'
sass (3.4.19) lib/sass/tree/visitors/perform.rb:158:in visit' sass (3.4.19) lib/sass/tree/visitors/base.rb:52:inblock in visit_children'
sass (3.4.19) lib/sass/tree/visitors/base.rb:52:in visit_children' sass (3.4.19) lib/sass/tree/visitors/perform.rb:167:inblock in visit_children'
sass (3.4.19) lib/sass/tree/visitors/perform.rb:179:in with_environment' sass (3.4.19) lib/sass/tree/visitors/perform.rb:166:invisit_children'
sass (3.4.19) lib/sass/tree/visitors/base.rb:36:in block in visit' sass (3.4.19) lib/sass/tree/visitors/perform.rb:186:invisit_root'
sass (3.4.19) lib/sass/tree/visitors/base.rb:36:in visit' sass (3.4.19) lib/sass/tree/visitors/perform.rb:157:invisit'
sass (3.4.19) lib/sass/tree/visitors/perform.rb:8:in visit' sass (3.4.19) lib/sass/tree/root_node.rb:36:incss_tree'
sass (3.4.19) lib/sass/tree/root_node.rb:20:in render' sass (3.4.19) lib/sass/engine.rb:278:inrender'
compass-rails (3.0.0) lib/compass-rails/patches/sass_importer.rb:48:in evaluate' tilt (2.0.1) lib/tilt/template.rb:96:inrender'
sprockets (3.5.2) lib/sprockets/legacy_tilt_processor.rb:25:in call' sprockets (3.5.2) lib/sprockets/processor_utils.rb:75:incall_processor'
sprockets (3.5.2) lib/sprockets/processor_utils.rb:57:in block in call_processors' sprockets (3.5.2) lib/sprockets/processor_utils.rb:56:incall_processors'
sprockets (3.5.2) lib/sprockets/loader.rb:134:in load_from_unloaded' sprockets (3.5.2) lib/sprockets/loader.rb:60:inblock in load'
sprockets (3.5.2) lib/sprockets/loader.rb:318:in fetch_asset_from_dependency_cache' sprockets (3.5.2) lib/sprockets/loader.rb:44:inload'
sprockets (3.5.2) lib/sprockets/cached_environment.rb:20:in block in initialize' sprockets (3.5.2) lib/sprockets/cached_environment.rb:47:inload'
sprockets (3.5.2) lib/sprockets/bundle.rb:23:in block in call' sprockets (3.5.2) lib/sprockets/utils.rb:183:indfs'
sprockets (3.5.2) lib/sprockets/bundle.rb:24:in call' sprockets (3.5.2) lib/sprockets/processor_utils.rb:75:incall_processor'
sprockets (3.5.2) lib/sprockets/processor_utils.rb:57:in block in call_processors' sprockets (3.5.2) lib/sprockets/processor_utils.rb:56:incall_processors'
sprockets (3.5.2) lib/sprockets/loader.rb:134:in load_from_unloaded' sprockets (3.5.2) lib/sprockets/loader.rb:60:inblock in load'
sprockets (3.5.2) lib/sprockets/loader.rb:318:in fetch_asset_from_dependency_cache' sprockets (3.5.2) lib/sprockets/loader.rb:44:inload'
sprockets (3.5.2) lib/sprockets/cached_environment.rb:20:in block in initialize' sprockets (3.5.2) lib/sprockets/cached_environment.rb:47:inload'
sprockets (3.5.2) lib/sprockets/base.rb:66:in find_asset' sprockets (3.5.2) lib/sprockets/environment.rb:30:infind_asset'
sprockets (3.5.2) lib/sprockets/base.rb:92:in []' sprockets-rails (2.3.3) lib/sprockets/rails/helper.rb:230:inlookup_asset_for_path'
sprockets-rails (2.3.3) lib/sprockets/rails/helper.rb:190:in check_errors_for' sprockets-rails (2.3.3) lib/sprockets/rails/helper.rb:159:inblock in stylesheet_link_tag'
sprockets-rails (2.3.3) lib/sprockets/rails/helper.rb:158:in `stylesheet_link_tag'

top menu navbar not becomes droppable

hi! nice work!

i have a trouble with top navigation menu - it simply not collapses to parent categories. all child links are just placed under the parent one...

File to import not found or unreadable: active_bootstrap_skin

Tried it out - no luck right off the bat:

File to import not found or unreadable: active_bootstrap_skin

activeadmin scopes (aka tabs at the top of index table) are just styleless ul-li bulleted list

there is nothing to say more )

ul.scopes > li.scope > a

i have last activeadmin, rails 4, ruby 2.2.1, active_bootstrap_skin 0.1.1

bootstrap-sass dependency security updates (to >= 3.4.1)

Name: bootstrap-sass
Version: 3.3.7
Advisory: CVE-2016-10735
Criticality: Medium
URL: https://blog.getbootstrap.com/2018/12/13/bootstrap-3-4-0/
Title: XSS vulnerability via data-target in bootstrap-sass
Solution: upgrade to >= 3.4.0

Name: bootstrap-sass
Version: 3.3.7
Advisory: CVE-2019-8331
Criticality: Medium
URL: https://blog.getbootstrap.com/2019/02/13/bootstrap-4-3-1-and-3-4-1/
Title: XSS vulnerability in bootstrap-sass
Solution: upgrade to >= 3.4.1

.without_sidebar floats and has 50%

Why is #active_admin_content.without_sidebargetting width: 50% and float: left?

I believe we shouldn't give this container any style and let the user decide what todo. With sidebar i get the point of 75%/25% , because the sidebar needs space, but without it should be 100% and no float. so then we can decide if we need 100% width, making a row , container or whatever.

Recommend Projects

React

A declarative, efficient, and flexible JavaScript library for building user interfaces.
Vue.js

🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
Typescript

TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
TensorFlow

An Open Source Machine Learning Framework for Everyone
Django

The Web framework for perfectionists with deadlines.
Laravel

A PHP framework for web artisans
D3

Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

javascript

JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
web

Some thing interesting about web. New door for the world.
server

A server is a program made to process requests and deliver data to clients.
Machine learning

Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Visualization

Some thing interesting about visualization, use data art
Game

Some thing interesting about game, make everyone happy.

Recommend Org

Facebook

We are working to build community through open source technology. NB: members must have two-factor auth.
Microsoft

Open source projects and samples from Microsoft.
Google

Google ❤️ Open Source for everyone.
Alibaba

Alibaba Open Source for everyone
D3

Data-Driven Documents codes.
Tencent

China tencent open source team.