Can't get narrow stylesheet to load in Omega commerce sub-sub-theme

Question

I've got a sub-sub-theme of Omega, namely, a subtheme of omega_kickstart_theme, which is in turn a subtheme of omega_kickstart, which is a subtheme of omega.

Here's my .info file (pastebin).

I've stuck the file freshstop-omega-alpha-default-narrow.css in the /css folder, and that's supposed to be all she wrote. It's supposed to load for the narrow layout.

But when I resize my browser and check for this file, it's not there, nor are its styles. Cache cleared, css aggregation off, etc. Firefox.

I've also tried freshstop_omega-alpha-default-narrow.css (note underscore instead of dash).

Hmm. Any deeper tips? Place to start debugging?

Answer 1

So it turns out freshstop-omega-alpha-default-narrow.css actually IS being added, just not at the breakpoint that I expected.

The problem is that I'm thinking from a more "mobile second" perspective. Here's the stylesheet cascade:

• global.css
• example-alpha-default.css
• example-alpha-default-narrow.css
• example-alpha-default-normal.css
• example-alpha-default-wide.css

"Narrow" is included at 720px and wider, while global.css is included at all sizes. If one wants to target just mobile or smaller, one would have to create a new media query.

More information here: https://groups.drupal.org/node/156719