function layout_breakpoint_get_css in Layout 7

Build CSS for the breakpoints with media queries.

@todo Figure out a good way to avoid equal max/min-weights in subsequent breakpoints if that is a problem.

Parameters

boolean $include_media_queries: Whether generate one flat CSS without media queries (useful for administration), or wrap breakpoints with media queries (for frontend).

2 calls to layout_breakpoint_get_css()

theme_layout_responsive in plugins/layouts/responsive.inc

Draw the responsive layout.

theme_layout_responsive_admin in plugins/layouts/responsive.inc

Draw the responsive layout admin interface.

File

./layout.module, line 275

Responsive layout builder tool for Panels.

Code

function layout_breakpoint_get_css($include_media_queries = TRUE) {
  $breakpoints = layout_breakpoint_load_all();
  $breakpoint_css = array();
  $min_width = 0;
  $breakpoint_count = count($breakpoints);
  $breakpoint_index = 0;
  foreach ($breakpoints as $name => $breakpoint) {
    if ($include_media_queries) {

      // Build the media query for this breakpoint. The first item should have a
      // min-width of 0, and the last item should have no max-width
      // (open-ended to infinity). Mid-items should both have a min-width and a
      // max-width. A breakpoint specifies the max-width for the previous breakpoint
      // (if any).
      $breakpoint_css[$breakpoint_index]['media-query'] = '@media screen and (min-width:' . $breakpoint->width . ')';
      if ($breakpoint_index > 0) {
        $breakpoint_css[$breakpoint_index - 1]['media-query'] .= ' and (max-width: ' . $breakpoint->width . ')';
      }

      // Get grid CSS from gridbuilder and apply some extra indentation.
      $breakpoint_css[$breakpoint_index]['css'] = '  ' . str_replace("\n", "\n  ", gridbuilder_get_css($breakpoint->grid_name, '.panel-responsive', '.rld-span-' . $name . '_'));
      $breakpoint_index++;
    }
    else {
      $breakpoint_css[$breakpoint_index]['css'] = gridbuilder_get_css($breakpoint->grid_name, NULL, NULL, TRUE);
    }
  }

  // Build CSS based on media query information.
  $built_css = '';
  foreach ($breakpoint_css as $data) {
    if (isset($data['media-query'])) {
      $built_css .= $data['media-query'] . " {\n" . $data['css'] . "\n}";
    }
    else {
      $built_css .= $data['css'] . "\n";
    }
  }
  return $built_css;
}