LightWindCSS for devs

Where start?

To start a config file create a .json file. You can use the template below:

{
    "values": {
        "name": { "valName": "val", "valName": "val", "valName": "val" }
    },
    "screens": {
        "name": { "min" : "min val", "max" : "max val" }
    },
    "selectors": {
        "name": { "selector": ":selector" }
    },
    "proprieties": {
        "valueOnly": {
            "name": { "css": "css code" }
        },
        "valueKey": {
            "name": { "propriety": ["prop"], "values": "val" },
            "name": { "propriety": ["prop", "prop"], "values": "val" }
        }
    }
}

To complete correctly the config file, you should respect some rules.

1. Screens

The screens values are the named screen break points, which enables you to use this feature in LightWindCss.

2. Selectors

The selectors are the name, with the name of the selector just after the name.

3. Proprieties

The proprieties are some values divided to the values using only a name to use some CSS and the key name with a value.

3.1 Values only proprieties

To create a new value only propriety create a new object and name it however you want and inside of it create a propriety named css where you write the CSS code.

3.2 Paramable values proprieties

To create a new paramable value create a new object with a array named propriety and another one with a pointer name to a values set.

4. Values

You can create objects of named values which will be replace in the future in the framework.