Hi,

I looking for custom css with the themeroller files (http://jquerymobile.com/themeroller/)
I already created a subtheme

If I define in my info file this
stylesheets[all][] = 'styles/myCustomFile.css'

This file is called BEFORE the jquery CSS files (jquery.mobile-1.0.1.min.css and jquery.mobile.structure-1.0.1.min.css)

Of course I would like this file is called AFTER.

I also tried to write a hook in my template file (in my subtheme)

function myInfoFile_preprocess_html(&$vars) {

   $css_options = array(
      'type' => 'file', 
      'group' => CSS_THEME, 
      'every_page' => TRUE, 
      'media' => 'all', 
      'preprocess' => FALSE, 
    );
	
  drupal_add_css(path_to_theme().'/styles/myCustomFile.css', array_merge($css_options, array('weight' => 100)));
   
   $vars['styles'] = drupal_get_css();
 
}

But the file myCustomFile.css is also called BEFORE the jquery CSS files

Is there a solution?

Comments

ibozo’s picture

ibozo CreditAttribution: ibozo commented

I forgotten to describe my config :

- Drupal 7.22
- jQuery Mobile module 7.x-2.0-beta1
- Libraries API 7.x-2.1
- mobile_jquery theme 7.x-2.0-beta1

And I have installed Drupal 7 with WAMP server

mserinjane’s picture

mserinjane CreditAttribution: mserinjane commented

Hi Ibozo

The css files that are overriding your custom (themeroller) files are located inside the libraries directory. A way to make sure your (sub)theme css file(s) get applied is to first add them into your (sub)theme info file, like this:

stylesheets[all][] = 'css/themerollertest.css'

And then, also in your same (sub)theme info file, to exclude those files that you don't want, like this:

exclude[css][] = 'sites/all/libraries/jquery.mobile-1.0.1/jquery.mobile-1.0.1.min.css'
exclude[css][] = 'sites/all/libraries/jquery.mobile-1.0.1/jquery.mobile-1.0.1.css'

Please note that you will need to include the path parts 'sites/all/libraries' when excluding these files from your subtheme. http://drupal.org/node/1596696#comment-7027650

I hope this helps :)