Grails Twitter Bootstrap Plugin Issue with navbar-fixed-top

Posted by Philip Tenn on Stack Overflow See other posts from Stack Overflow or by Philip Tenn
Published on 2012-09-12T15:20:50Z Indexed on 2012/09/12 15:38 UTC
Read the original article Hit count: 309

I am using Grails 2.1.0 and Twitter Bootstrap Plugin 2.1.1 and am encountering an issue with navbar-fixed-top.

In order to get the Navbar fixed to the top of the page to behave correctly during resize, the Twitter Bootstrap Docs states:

Add .navbar-fixed-top and remember to account for the hidden area underneath it by adding at least 40px padding to the . Be sure to add this after the core Bootstrap CSS and before the optional responsive CSS.

How can I do this when using the Grails Plugin for Twitter Bootstrap?

Here is what I have tried:

main.gsp

<head>
  ...
  <r:require modules="bootstrap-css"/>
  <style type="text/css">
    body {
      padding-top: 60px;
      padding-bottom: 40px;
    }
    .sidebar-nav {
      padding: 9px 0;
    }
  </style>
  <r:require modules="bootstrap-responsive-css"/>
  <r:layoutResources/>
</head>

The problem is that Grails Plugin for Twitter Bootstrap takes the content of bootstrap.css and bootstrap-responsive.css and combines them into the following merged file: static/bundle-bundle_bootstrap_head.css.

Thus, I am not able to put the body padding style "after core Bootstrap CSS and before Responsive CSS" as per Twitter Bootstrap docs.

Here is the View Source HTML that I get from the main.gsp above

<style type="text/css">
  body {
    padding-top: 60px;
    padding-bottom: 40px;
  }
  .sidebar-nav {
    padding: 9px 0;
  }
</style>

<link href="/homes/static/bundle-bundle_bootstrap_head.css" type="text/css" 
    rel="stylesheet" media="screen, projection" />

If there is no way to do this, I could always just drop the Grails Twitter Bootstrap Plugin and manually download Twitter Bootstrap and put it my Grails Project's web-app/css, web-app/images, and web-app/js. However, I would like to be able to use the Grails Twitter Bootstrap Plugin.

Thank you very much in advance, I appreciate it!

© Stack Overflow or respective owner

Related posts about grails

Related posts about twitter-bootstrap