Edit all these files to make csslist more useful. These file contains many values not used, you must delete all the Css property names that you never use to adapt the list to your needs.
cssProperties.txt:
This file fill the values from the drop-down list that shows the css properties names, edit to make leave only the values you use, for example, if you use only the shorthand BORDER property, you could delete all the BORDER-COLOR-LEFT, BORDER-COLOR-RIGHT, BORDER-STYLE-LEFT etc... to make the drop-down list values easy to use. You can append to the property the type of editor to use, the color editor or a list of values for that property defined in cssList.txt. the syntax is:
property-name:<color>
property-name:listNameForMyListOfValuesDefinedInCssLists
cssLists.txt:
This file defines the values to link to properties in cssProperties.txt
The definition of a list starts always by "list" followed by the name identifier that you wish, the separator between the id of the list and the values is the ":", and the separator between values from the list the "|", Example:
listFloat:left|right|none|inherit
cssGroups.txt:
Sometimes for a property to be compatible in multiple browsers needs to be defined multiple times with different names and all with the same value, for example:
border-radius: 4px;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
To avoid having to modify the same value several times we link properties, the change in the value of one of them will be updated in the other.
To do this add the property names in cssgroups linking together with "+". Using the same example the entry in cssGroups is:
border-radius+-moz-border-radius+-webkit-border-radius
NEW FILE: cssCompress.txt
In this file we create the rules for compress the properties to the shorthand format. How to use:
If the properties to compress are in the four values TOP-RIGHT-BOTTOM-LEFT, we add a line with the common part of the property name (for example "border") with the char '%' where are the changing part of the property, for example for the properties border-top, border-right, border-bottom and border-left, the changing part is at last (-top, -right, -bottom, -left), then we declare the rule as "border%" followed by "=trbl". In the properties border-top-color, border-right-color etc..., the changing part is in the middle, we delare the rule as: "border%-color=trbl"
For non top-right-bottom-left properties the rule definition changes:
We take as example the predefined rule for FONT shorthand:
font=?%-style |?%-variant |?%-weight |+%-size|?/line-height|+ %-family
The first value (font) is the name of the shorthand property followed by the char '=', next are the list of properties that make this shorthand with the char '|' as separator. Every '%' char is replaced by the shorthand name but you can define the rule using the full property name, this two rules are the same:
font=?%-style |?%-variant |?%-weight |+%-size|?/line-height|+ %-family
font=?font-style |?font-variant |?font-weight |+font-size|?/line-height|+ font-family
We define each property as mandatory or optional with the chars '+' and '?', for example in this case '+font-size' is mandatory, if we don't have this property in our css declaration we don't create the shorthand, all the other properties names preceded by '?' are optional.
