In big sites with have different sections that requires different styles, is a better practice to distribute css files according to the site sections instead make just a large everything.css.

I think it'll be a huge improvement to Omega if this can be done automatically, without need to mess with the .info file or a lot of ifs in template.php.

Comments

danillonunes’s picture

As a proof of concept, a made this code that do basically what I want if included in subtheme_preprocess function.

It loads css files based on theme function being called. Its also used the theme_hook_suggestions array in order to allow a bigger flexibility.

So, for example, when you access http://example.com/node/1, the theme_page function is called with page__node and page__node__1 as theme_hook_suggestions.

This code tries to add in this page files named page.css, page--node.css and page--node--1.css if they are found.

It also looks for files of the Omega's grid system and adds the files above with the properly grid's layouts. So, just like the Omega defaults subtheme-alpha-default.css, subtheme-alpha-default-wide.css, etc, it'll attempt to add the files page--alpha-default.css, page--alpha-default-wide.css, page--node--alpha-default.css, page--node--alpha-default-wide.css, etc.

I think will be great to have this in Omega core. I can do a patch, but I sill don't know if: - more people think it's a good idea; - there's a big performance issue with my actual implementation in hook_preprocess().

function subtheme_preprocess($vars, $hook) {
  /**
   * Dinamically add stylesheets based on theme_hook_suggestions.
   *
   * Add stylesheet files based on available theme_hook_suggestions. This allows
   * to add stylesheets dinamically based on each theme that is being called.
   *
   * For example, from theme('page') of front, which have 'page__front' on the
   * array of theme_hook_suggestions, a stylesheet file 'page--front.css' will be
   * added if it can be found. Stylesheet files are searched with
   * alpha_find_stylesheet(), which assegures that preprocessable files like
   * .sass or .scss can be added.
   *
   * Omega's grids and layouts are also considered, so for a grid named
   * 'alpha_default', a stylesheet named 'page--front--alpha-default-normal.css'
   * will be loaded with media query of the layout called 'normal'.
   *
   * @see alpha_find_stylesheet().
   */
  if (is_array($vars) && !empty($vars['theme_hook_suggestions'])) {
    $theme = 'YOUR_THEME_NAME';
    $theme_hooks = array_merge(array($hook), $vars['theme_hook_suggestions']);

    $grid_name = alpha_theme_get_setting('alpha_grid', 'alpha_default', $theme);
    $grids = alpha_retrieve_grids($theme);
    $grid = $grids[$grid_name];
    $layouts = $grid['layouts'];

    $css_suggestions = array();
    foreach ($theme_hooks as $theme_hook) {
      $filename = str_replace('_', '-', $theme_hook);

      $css_suggestions[$filename] = array(
        'data' => $filename,
        'options' => array(
          'group' => 5000
        )
      );

      foreach ($layouts as $layout) {
        $grid_sanitized = $grid['sanitized'];
        $layout_sanitized = $layout['sanitized'];
        $filename_layout_array = array($filename, "$grid_sanitized");
        $filename_layout = implode('--', $filename_layout_array);

        $css_suggestions[$filename_layout] = array(
          'data' => $filename_layout,
          'options' => array(
            'group' => 5000,
            'media' => $layout['media'],
            'browsers' => array('IE' => 'gte IE 9', '!IE' => TRUE),
            'weight' => $layout['weight'],
            'preprocess_media' => TRUE
          )
        );

        $filename_layout_array = array($filename, "$grid_sanitized-$layout_sanitized");
        $filename_layout = implode('--', $filename_layout_array);

        /**
         * Generate a CSS suggestion that will be added if the CSS file exists.
         * Most of those parameters are copied from Alpha.
         *
         * @see alpha_grid_css().
         */
        $css_suggestions[$filename_layout] = array(
          'data' => $filename_layout,
          'options' => array(
            'group' => 5000,
            'media' => $layout['media'],
            'browsers' => array('IE' => 'gte IE 9', '!IE' => TRUE),
            'weight' => $layout['weight'],
            'preprocess_media' => TRUE
          )
        );
      }
    }

    $css_path = drupal_get_path('theme', $theme) . '/css';
    foreach ($css_suggestions as $filename => $css_suggestion) {
      if ($file = alpha_find_stylesheet($css_path, $filename)) {
        $options = !empty($css_suggestion['options']) ? $css_suggestion['options'] : NULL;
        drupal_add_css($file, $options);
      }
    }
  }
}
avpaderno’s picture

Component: Feature Request » Code
Issue summary: View changes