How to set MEDIA attribute for stylesheet?

[sfmskywalker]

For mobile devices I want to include certain stylesheets and set the "media" attribute.
Currently I don't see how to do that using Cassette and am forced to usedirectly the element.

[andrewdavey]

This is a missing feature. I would think this needs to be configurable at the module level.

In web.config, something like this perhaps:

<cassette>
  <styles>
    <add path="styles/mobile" media="only screen and (max-device-width: 480px)" />
  </styles>
</cassette>

?

[sfmskywalker]

That would work out great for me, and is consistent with how everything else is configured in Cassette.

[andrewdavey]

I'll leave this open, until the feature is implemented.

[sfmskywalker]

Great :)

[andrewdavey]

In Cassette 0.6, the StylesheetModule class has a Media property. So it's now a matter of assigning the property in the configuration. A simple example is:

moduleSource.Add(new DirectorySource<StylesheetModule>("styles/mobile")
{
    FilePattern = "*.css",
    CustomizeModule = m => m.Media = "your-media-query-here"
});

However, I assume you'd rather use on PerSubDirectorySource<StylesheetModule> for all stylesheets and then set the media of a select few modules? So maybe we need to add something like:

/// after adding the module source...
moduleSource.Customize<StylesheetModule>("styles/mobile", m =>m.Media = "etc");

[sfmskywalker]

Great enhancements with 0.6!

I currently just use the DirectorySource class, but you you're right that I'd rather use the PerSubDirectorySource to save me from explicitly specifying each subfolder under /css.
I didn't realize I could then customize a module afterwards. Now I do :)

Thanks!