I've generated a subtheme 'test' and modified a .grid rule in my subtheme's default-wide.css. The css file is loading.

But I notice that the rules defined by alpha are taking precedence over any equivalent rules defined in my subtheme css. It appears that alpha's css files are @imported after the equivalent css file in my subtheme:

<style type="text/css" media="all and (min-width: 1220px)">@import url("http://test.localhost/sites/test/themes/test/css/test-alpha-default.css?lvyhjt");
@import url("http://test.localhost/sites/test/themes/test/css/test-alpha-default-wide.css?lvyhjt");
@import url("http://test.localhost/sites/all/themes/omega/alpha/css/grid/alpha_default/wide/alpha-default-wide-12.css?lvyhjt");</style>

Is there a preferred method to manipulate this css load order? Or am I limited to using more specific rules to override defaults (ick):

body .grid-3, body .grid-6 { ... }

Thanks

Comments

kim.le’s picture

kim.le CreditAttribution: kim.le commented

I'm also having the same problem where I need my sidebar region to "grow" columns to stay big enough for my 300px wide ad when it's in narrow layout versus the normal layout. I thought to just change the .grid widths but the default alpha css loaded my subtheme thus rendering cascading mute.

John Pitcairn’s picture

John Pitcairn CreditAttribution: John Pitcairn commented

Followup: use hook_css_alter in template.php - #1258478: custom-alpha-default-xx how to?

Cellar Door’s picture

Cellar Door CreditAttribution: Cellar Door commented
Version: 7.x-3.0-rc5 » 7.x-3.x-dev

This issue is also elsewhere in the queue as well. The grid files loading last are intended that way by the maintainers to allow for them to take precedence in creating the grid and creating the uniformed layout.

I think the solution to this issue would be to have a way to modify the grid w/o having to use the global/default/narrow/normal/wide stylesheets. The wiki on the omega groups has a more in-depth way to create a custom grid but smaller changes like this through a UI I think would be a great 4.x feature to look into.

I'm moving the issue to the dev version to allow for the continued development of the solution for this there and until then the wiki on how to create custom grids will be ported over to the official docs page to allow for clarification on how the best practice for this is done.

Mark_L6n’s picture

Mark_L6n CreditAttribution: Mark_L6n commented

Is this still being worked on? It seems strange that the width of the grid is not made available to our subtheme stylesheets, due to the default theme stylesheets being loaded after them.
In my case, I'm trying to place a background image for the entire header section. However, the <header> section is full-screen width, not grid-width. Only when you get to a header sub-region does the grid-width appear, for ex. in <div class="grid-12 region region-menu" id="region-menu">.