kriszyp / xstyle

A declarative, reactive framework that extends CSS

Home Page:http://kriszyp.github.com/xstyle

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Configure sheet loading behavior (feature request)

jnewman opened this issue · comments

First off, awesome plugin. We're using dgrid in one of our projects and I'm very impressed with the features.

However, I've been leveraging nested imports to wrap the styles in a highly specific protective barrier (for a content management system). This seems to be working ok, but it breaks down with xstyle, since e.g., dgrid loads sheets outside of that barrier.

This being said, I'd really like a means to configure xstyle, wherein I could:

  1. Tell it not to load anything (would be useful if/when the app is built as well).
  2. Tell it to nest an @import inside a selector.

I feel like this might best be handled with a few keys in my require config, but an alternative might be a before load file hook, wherein returning false would prevent the file from loading.

Thanks,
Josh

You should be able to load dgrid.css (and any other dgrid css modules you need) with a normal @import/ (nested or otherwise) and dgrid should refrain from attempting to dynamically load these stylesheets. Is this not working properly?

The issue I'm running into is that less produces @import "/path/to/file.css" for any files that end in .css (see line 2258 in latest). Because of this I'd moved e.g., dgrid.css to dgrid.less. Unfortunately, this is preventing xstyle from knowing the appropriate styles have loaded. (I noticed that adding a # e.g., example.css# at the end allows them to load, but they're not parsed by less and don't actually get applied by FF/IceWeasel or Chrome.)

To prevent them from loading a second time I'm defining xstyle/load-css: 'fakeloader' in my require config (where fakeloader calls the callback immediately in load). I'd much rather work out a way to leverage xstyle's conditional polyfill using a preload hook to get a reference to the file that's planning to load. I might then get the contents via a less plugin, so I can ensure they're wrapped properly.

Perhaps, the real issue is that I need a way to force import and interpretation of css files in less?

I'd be all for working on a less plugin, but an xstyle plugin seems more natural for this case.