kaminari-bootstrap conflicts with active admin - ruby-on-rails-3

My rails project utilizes Twitter Bootstrap for the main site's look and feel. In order to make kaminari fit in a bit better, I added the kaminari-bootstrap gem. So far, so good.
The problem is that the kaminari-bootstrap HTML breaks the pagination in active_admin.
The ideal thing would be to find a way to only enable kaminari-bootstrap for the main site, and not for active admin.

try this may be it helpful, in your application.css remove your active_admin.css . then restart your server.
write in your active_admin.css.scss file -
#import "active_admin/mixins";
#import "active_admin/base";
and then try

Related

Easiest way to change when Bootstrap navbar collapses (using bootstrap gem)

I've got a rails app using the bootstrap-sass gem. I'd like to change the width the navbar collapses from tablet (979px) to phone (769px). Overriding a media query isn't a tidy solution.
I've edited #navbarCollapseWidth in variables.less and built bootstrap, then copied the contents bootstrap-responsive.css into responsive.scss in gems...vendor/assets/stylesheets/bootstrap. Now however, I've lost the ability to update the gem without losing my changes.
What's the best method here? I'd like to make what I think is a simple change but keep my gem update-able. Perhaps using #import "bootstrap-responsive-mine"; in application.css.scss then manually updating that file when I need to?
Did you read some info about configuration this gem?
Import "bootstrap" in your SCSS file of choice to get all of Bootstrap's styles, mixins and variables!
#import "bootstrap";
Need to configure a variable or two? Simply define the value of the
variable you want to change before importing Bootstrap. Sass will
respect your existing definition rather than overwriting it with the
Bootstrap defaults.
$navbarCollapseWidth: 769px;
#import "bootstrap";
Or that is not what you need?

Is it possible to re-skin activeadmin to work with JQuery-Mobile?

I've got an app that's using JQueryMobile and it's using the awesome ActiveAdmin extensively as well. While I love the ease and simplicity of the ActiveAdmin interface, I'd really like consistency with the rest of my app.
Is it possible (i.e. using standard ActiveAdmin and not modifying its sources) to re-skin ActiveAdmin to use the JQuery-Mobile look and feel?
Its very possible to reskin ActiveAdmin, though it would be a bit of a job to do, and there would likely be quite a number of things that can't perfectly be built to match a mobile presentation, especially if you don't want to get into overriding markup rendering.
You can always simply start adding styles of your own to the active_admin.css file that is generated for you. If you'd like to start without any of ActiveAdmin's styles at all, you can comment out the two sass imports in that css file:
#import "active_admin/mixins";
#import "active_admin/base";
Or at least just the base file. It may be intriguing to you in itself, or informative about the organization of the markup, to view your current admin pages without the base css, or with css turned off in your browser altogether. From that vantage point, you could begin to think through how the bare markup could be restyled to match a mobile presentation.

Twitter Bootstrap Rails - how can I separate my styles from bootstrap_and_overrides.less

I'm using the twitter-bootstrap-rails gem for styles in my app.
At the moment, I'm writing all my style ruls inside bootstrap_and_overrides.css.less, and this turns messy and redundant as the application grows.
I'd like to split the less code to smaller files that will be required on a per page basis, but still be able to use the bootstrap colors and mixins. I found that after I split it into another file, I couldn't use these components anymore. I guess I'm probably not including it correctly or in the proper order - thoughts? thanks.
look at https://github.com/twitter/bootstrap/blob/master/less/bootstrap.less
you should be able to use #import "override-forms.less" in your bootstrap_and_overrides.css.less for example.

In Rails 3, using Formtastic 2, how can I replace the built in ordered list with div's?

In my Rails 3 application I'm using Twitter Bootstrap as a frame work for developing an in house project management system. I'm using Formtastic to help me with forms since it save a lot of time and code. My problem is getting the Formtastic code to output the forms in a way that correspond with Bootstrap's conventions. I've read a few items I found on Google suggesting that I should monkey patch Formtastic, but I haven't been able to do this successfully.
How can I customize Formtastic's output to use div's around each field so I can use Bootstrap with it?
Thank you for looking.
Well, today I tried forking formtastic and making it compatible with bootstrap... The markup is incredibly tightly coupled to the code, so I gave up and switched to simple_form instead. Works fine with the advice in Rails: Using simple_form and integrating Twitter Bootstrap
You can use the formtastic-bootstrap gem. You should be able to drop this in and it will generate HTML that will work naturally with Twitter Bootstrap.
If you use the SCSS files from the one of the scss-twitter-bootstrap projects, you can simply comment out or remove the include for the forms part of the CSS.
Simply copy them in to app/stylesheets (Rails 3.0) or app/assets/stylesheets and comment out:
// #import "forms.scss";
Don't forget to add the formtastic CSS back in:
<%= stylesheet_link_tag 'formtastic', 'formtastic_changes' %>

Solve IE6 static content caching issues on IIS6

I'm currently experiencing problems with static content - most noticeably jQuery datepicker images, but also other static files - which results in images/static content loaded many times - I can clearly see it in IE6 status bar (not to mention SLOW rendering).
The problem and possible solutions seems to be described here: http://www.explainth.at/en/tricks/flickfix.shtml. However, I use IIS6 not Apache, and static files that I don't want to feed through php or asp.
How do I make IE6 cache static images properly? How do I add custom response header for specific files/folders?
Hm, let met re-phrase it. I'm not sure it is caused by the bugs above. Actually, I tried appcmd to apply cacheControlMode/etc and it doesn't seem to work. As far as I remember, IE6 also does not cache for XMLHttpRequest calls? So, the biggest problem that I need to solve is:
in jQuery calendar, moving mouse over image buttons (prev/next) causes them to be reloaded-refreshed
in jQuery dialog, each dialog('open') causes images from theme (like header background) to be re-loaded/refreshed
etc
This link probably gives a better explanation: http://ajaxian.com/archives/internet-explorer-and-ajax-image-caching-woes
How do I solve this - that is, without feeding images through ASP.NET to setup headers?
Thanks everybody for listening, the trick with appcmd seems to work ;-) The problem was that I used jQuery theme from googleapis... which obviously was not affected by appcmd ;-) Moving theme to local folder did the trick. These are the commands:
\Windows\system32\inetsrv\appcmd.exe set config "Default Web Site/images" -section:system.webServer/staticContent -clientCache.cacheControlMode:UseMaxAge
\Windows\system32\inetsrv\appcmd.exe set config "Default Web Site/images" -section:system.webServer/staticContent -clientCache.cacheControlMaxAge:"01:00:00"
from http://forums.iis.net/t/1067723.aspx