Drupalcss The Drupal Style Sheet

Some of the style information that applies to a Drupal site is considered so basic that it is not left to the theme, but is instead stored in a misc/drupal.css file, which applies to every page loaded in every Drupal site. The file contains style rules that apply to elements that directly affect functionality, such as menu styles, tabs, auto-complete fields, and collapsible fieldsets. These are elements that need styles to be useful to the end user and generally don't need to be changed on every Drupal site.

Seeing Drupal.css Styling

To get a feel for the role that drupal.css plays on your site, you can try a small exercise. Rename the themes folder to _themes and click around your site for a while. Are you surprised that your site still works? Don't forget that all of the basic functions to generate HTML are in the core include and module files, and that the themes, which you've effectively hidden from Drupal by renaming the themes folder, are intended only to shape that output or modify it if needed. What you will notice in this new, themeless world, is that not all elements are without styling. Figure 5-7 shows some examples of items styled by drupal.css.

► create content □ my account T administer

□ access control

□ blocks list add user search

Figure 5-7. Menu items, tabs, auto-complete fields, and collapsible fieldsets styled by drupal.css

Figure 5-7. Menu items, tabs, auto-complete fields, and collapsible fieldsets styled by drupal.css

These styles come directly from misc/drupal.css. If you wish to change any of them, you shouldn't edit the drupal.css file directly, for several reasons:

• Upgrading to a newer Drupal version will be difficult. You will need to remember that you made the changes and merge your altered file with the newer file that comes with the upgrade.

• As I will discuss in the next chapter, several sites can be run from one codebase. If you change drupal.css, the changes will affect all of the sites you run on that particular codebase.

• It isn't necessary to change drupal.css. The nature of CSS means that writing the same or more specific rule in another style sheet, such as your theme's style.css, will override the rule in drupal.css.

If what you are interested in achieving is modifying or altering the rules defined in drupal.css, the best method is to copy the rules into style.css in your theme and change them there.

Removing drupal.css

Sometimes, you might want to get rid of drupal.css altogether for a site. Perhaps you want to view the site on a device for which none of the styles make sense, and instead of overriding them all, you simply want to avoid loading the style sheet to begin with.

Deleting drupal.css will cause 404 Not Found errors to be written to your logs every time a page loads, so don't do that. The solution relies on the very techniques that this chapter has been discussing all along, namely overriding themable functions. The function in question is named theme_stylesheet_import, is found in includes/theme.inc, and is responsible for printing the tags that import style sheets.

To block drupal.css from being loaded, you need to override the theme_stylesheet_import function in your theme's template.php file. For Bluemarine, this will be themes/bluemarine/ template.php, and the function will be named phptemplate_stylesheet_import. Here is the modified function:

function phptemplate_stylesheet_import($stylesheet, $media = 'all') { if ($stylesheet != 'misc/drupal.css') { return theme_stylesheet_import($stylesheet, $media);

Comparing this to the original function, you will see that the difference lies with the if clause, which checks to see if misc/drupal.css is being loaded. While this may seem like a lot of work to do just to avoid loading one style sheet, it is the recommended method to achieve the goal, as it guarantees your upgrade path and doesn't interfere with Drupal's ability to host multiple sites on one codebase.

Was this article helpful?

0 0

Post a comment