@medyll/cssfabric 0.0.10

package/src/_generated/export.variables.json

@@ -0,0 +1,756 @@
+{
+    "cssfabric": {
+        "modules": {
+            "animation": {
+                "_data": {
+
+                    "attention_props": [],
+                    "in_out_props": {
+                        "back": []
+                    }
+                }
+
+                ,
+                "_metadata": {
+                    "title": "animation", "description": "cssfabric simplest animation module"
+                }
+
+                ,
+                "_docs": {
+                    "attention_props": "", "in_out_props": ""
+                }
+            }
+
+            ,
+            "base": {
+                "_data": {
+
+                    "cfg-has-dimension-strict": true,
+                    "CFG_HAS_DIMENSION_MIN": true,
+                    "CFG_HAS_DIMENSION_MAX": true,
+                    "size_step": "0.5rem",
+                    "sizes": {
+                        "tiny": 32, "small": 64, "medium": 128, "large": 256, "full": "100%"
+                    }
+                }
+
+                ,
+                "_metadata": {
+                    "title": "base", "tag": "base", "description": "cssfabric base config variables"
+                }
+
+                ,
+                "_docs": []
+            }
+
+            ,
+            "box": {
+                "_data": {
+
+                    "unit-config": "rem",
+                    "border-unit-config": "px",
+                    "unit-size-config": 0.5,
+                    "unit-border-size-config": 1,
+                    "sizes-config": 32,
+                    "border-sizes-px-config": 5,
+                    "shadows-steps": 10,
+                    "shadows_step_multiplier": 2,
+                    "position-shorthand-config": "pos",
+                    "display-shorthand-config": "dsp",
+                    "shadow-shorthand-config": "shad",
+                    "border-shorthand-config": "border",
+                    "padding-shorthand-config": "pad",
+                    "margin-shorthand-config": "marg",
+                    "cssProps": {
+                        "borderShorthands": {
+                            "_": ["top", "bottom", "left", "right"], "t": "top", "b": "bottom", "l": "left", "r": "right", "all": ["top", "bottom", "left", "right"], "u": ["bottom", "left", "right"], "ii": ["left", "right"], "tb": ["top", "bottom"]
+                        }
+
+                        ,
+                        "positionProps": {
+                            "abs": "absolute", "rel": "relative", "stat": "static", "fix": "fixed", "sticky": "sticky"
+                        }
+
+                        ,
+                        "displayProps": {
+                            "block": "block", "none": "none", "inline": "inline", "block-inline": "inline-block", "flex-inline": "inline-flex", "tbl": "table", "tbl-row": "table-row", "tbl-cell": "table-cell", "tbl-column": "table-column"
+                        }
+                    }
+                }
+
+                ,
+                "_metadata": {
+                    "title": "box", "tag": "box", "description": "cssfabric box module to set heights, paddings, margins and shadows on all html elements"
+                }
+
+                ,
+                "_docs": {
+                    "attributes": {
+                        "padding": {
+
+                            "tag": "pad",
+                            "keys": ["_",
+                            "t",
+                            "b",
+                            "l",
+                            "r",
+                            "all",
+                            "u",
+                            "ii",
+                            "tb"],
+                            "values": {
+                                "_": "_", "1": "0.5rem", "2": "1rem", "3": "1.5rem", "4": "2rem", "5": "2.5rem", "6": "3rem", "7": "3.5rem", "8": "4rem", "9": "4.5rem", "10": "5rem", "11": "5.5rem", "12": "6rem", "13": "6.5rem", "14": "7rem", "15": "7.5rem", "16": "8rem", "17": "8.5rem", "18": "9rem", "19": "9.5rem", "20": "10rem", "21": "10.5rem", "22": "11rem", "23": "11.5rem", "24": "12rem", "25": "12.5rem", "26": "13rem", "27": "13.5rem", "28": "14rem", "29": "14.5rem", "30": "15rem", "31": "15.5rem", "32": "16rem"
+                            }
+
+                            ,
+                            "levels": {
+                                "_": ["_", 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30, 31, 32]
+                            }
+
+                            ,
+                            "about": "padding properties for html elements"
+                        }
+
+                        ,
+                        "margin": {
+
+                            "tag": "marg",
+                            "keys": ["_",
+                            "t",
+                            "b",
+                            "l",
+                            "r",
+                            "all",
+                            "u",
+                            "ii",
+                            "tb"],
+                            "values": {
+                                "_": "_", "1": "0.5rem", "2": "1rem", "3": "1.5rem", "4": "2rem", "5": "2.5rem", "6": "3rem", "7": "3.5rem", "8": "4rem", "9": "4.5rem", "10": "5rem", "11": "5.5rem", "12": "6rem", "13": "6.5rem", "14": "7rem", "15": "7.5rem", "16": "8rem", "17": "8.5rem", "18": "9rem", "19": "9.5rem", "20": "10rem", "21": "10.5rem", "22": "11rem", "23": "11.5rem", "24": "12rem", "25": "12.5rem", "26": "13rem", "27": "13.5rem", "28": "14rem", "29": "14.5rem", "30": "15rem", "31": "15.5rem", "32": "16rem"
+                            }
+
+                            ,
+                            "levels": {
+                                "_": ["_", 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30, 31, 32]
+                            }
+
+                            ,
+                            "about": "margin properties for html elements"
+                        }
+
+                        ,
+                        "border": {
+
+                            "tag": "border",
+                            "keys": ["_",
+                            "t",
+                            "b",
+                            "l",
+                            "r",
+                            "all",
+                            "u",
+                            "ii",
+                            "tb"],
+                            "values": {
+                                "_": "_", "1": "1px", "2": "2px", "3": "3px", "4": "4px", "5": "5px"
+                            }
+
+                            ,
+                            "levels": {
+                                "_": ["_", 1, 2, 3, 4, 5]
+                            }
+
+                            ,
+                            "about": "border properties for html elements"
+                        }
+
+                        ,
+                        "shadow": {
+
+                            "tag": "shad",
+                            "values": {
+                                "2": "0.83333333331.724137931", "4": "1.66666666673.4482758621", "8": "3.33333333336.8965517241", "16": "6.666666666713.7931034483", "32": "13.333333333327.5862068966", "64": "26.666666666755.1724137931", "128": "53.3333333333110.3448275862", "256": "106.6666666667220.6896551724"
+                            }
+
+                            ,
+                            "levels": {
+                                "_": [2, 4, 8, 16, 32, 64, 128, 256]
+                            }
+
+                            ,
+                            "about": "applying shadows give depth and levels to your design"
+                        }
+                    }
+                }
+            }
+
+            ,
+            "color": {
+                "_data": {
+                    "gray-config": {
+                        "start": "#f4f4f4", "end": "#999", "steps": 8
+                    }
+
+                    ,
+                    "color-types-config": ["color",
+                    "bg",
+                    "bg-themed",
+                    "border-color"],
+                    "theme": {
+                        "primary": "#0288d1", "foreground": "#282230", "background": "#f1f1f1"
+                    }
+
+                    ,
+                    "scheme": {
+                        "discrete": "#ccc", "success": "green", "info": "#ffdd57", "warning": "#e6b905", "alert": "#ff7300", "error": "red"
+                    }
+
+                    ,
+                    "palette": {
+                        "yellow": "#ffb900", "orange": "#d83b01", "red": "#d13438", "magenta": "#b4009e", "purple": "#5c2d91", "green": "#107c10", "teal": "#008272", "blue": "#0078d4", "dark": "#323232"
+                    }
+
+                    ,
+                    "gray": "getGraySteps(8, #f4f4f4, #999)"
+                }
+
+                ,
+                "_metadata": {
+                    "title": "color", "title_tag": "its about colors", "description": "cssfabric color system: its about colors"
+                }
+
+                ,
+                "_docs": {
+                    "attributes": {
+                        "color": {
+
+                            "tag": "color",
+                            "keys": ["scheme",
+                            "palette",
+                            "gray"],
+                            "levelsLinked": {
+                                "scheme": ["discrete", "success", "info", "warning", "alert", "error"], "palette": ["yellow", "orange", "red", "magenta", "purple", "green", "teal", "blue", "dark"], "gray": ["getGraySteps(8, #f4f4f4, #999)"]
+                            }
+
+                            ,
+                            "levelsDeclin": {
+                                "palette": ["_", "lighter", "light", "dark", "darker", "complement"]
+                            }
+
+                            ,
+                            "about": "color for text level html elements"
+                        }
+
+                        ,
+                        "background-color": {
+
+                            "tag": "bg",
+                            "keys": ["scheme",
+                            "palette",
+                            "gray"],
+                            "levelsLinked": {
+                                "scheme": ["discrete", "success", "info", "warning", "alert", "error"], "palette": ["yellow", "orange", "red", "magenta", "purple", "green", "teal", "blue", "dark"], "gray": ["getGraySteps(8, #f4f4f4, #999)"]
+                            }
+
+                            ,
+                            "levelsDeclin": {
+                                "palette": ["_", "lighter", "light", "dark", "darker", "complement"]
+                            }
+
+                            ,
+                            "about": "background colors"
+                        }
+
+                        ,
+                        "background-themed": {
+
+                            "tag": "bg-themed",
+                            "keys": ["scheme",
+                            "palette",
+                            "gray"],
+                            "levelsLinked": {
+                                "gray": ["getGraySteps(8, #f4f4f4, #999)"], "scheme": ["discrete", "success", "info", "warning", "alert", "error"], "palette": ["yellow", "orange", "red", "magenta", "purple", "green", "teal", "blue", "dark"]
+                            }
+
+                            ,
+                            "levelsDeclin": {
+                                "palette": ["_", "lighter", "light", "dark", "darker", "complement"]
+                            }
+
+                            ,
+                            "about": "same as background-color, but with added contrasted color to text"
+                        }
+
+                        ,
+                        "border-color": {
+
+                            "tag": "border-color",
+                            "keys": ["palette",
+                            "gray"],
+                            "levelsLinked": {
+                                "gray": ["getGraySteps(8, #f4f4f4, #999)"], "scheme": ["discrete", "success", "info", "warning", "alert", "error"], "palette": ["yellow", "orange", "red", "magenta", "purple", "green", "teal", "blue", "dark"]
+                            }
+
+                            ,
+                            "about": "border colors are slightly darker to maximize surrounding effect"
+                        }
+                    }
+                }
+            }
+
+            ,
+            "flex": {
+                "_data": {
+
+                    "moduleName": "flex",
+                    "moduleNameShort": "flex",
+                    "horCode": "h",
+                    "vertCode": "v",
+                    "gridFullWidth": "main",
+                    "grow-shrink-steps": 4,
+                    "cssProps": {
+                        "flexWrap": {
+                            "wrap": "wrap", "wrap-reverse": "wrap-reverse"
+                        }
+
+                        ,
+                        "grid-justify": {
+                            "start": "flex-start", "end": "flex-end", "between": "space-between", "stretch": "stretch", "center": "flex-center"
+                        }
+
+                        ,
+                        "grid-items": {
+                            "baseline": "baseline", "stretch": "stretch", "start": "flex-start", "center": "center", "end": "flex-end"
+                        }
+
+                        ,
+                        "grid-content": {
+                            "start": "flex-start", "center": "center", "end": "flex-end", "between": "space-between", "equal": "space-evenly"
+                        }
+                    }
+
+                    ,
+                    "cssItemsProps": {
+                        "self": {
+                            "start": "flex-start", "end": "flex-end", "stretch": "stretch"
+                        }
+                    }
+                }
+
+                ,
+                "_metadata": {
+                    "title": "flex", "tag": "flex", "description": "cssfabric flex system module"
+                }
+
+                ,
+                "_docs": {
+                    "attributes": {
+                        "grid": {
+
+                            "tag": "flex",
+                            "keys": ["v",
+                            "h"],
+                            "classNames": {
+                                "align": ["top", "middle", "bottom", "left", "right", "center", "middle-center", "stretch"], "grid": ["wrap", "wrap-reverse"]
+                            }
+
+                            ,
+                            "about": "a classic grid system, and hey, it gets height !"
+                        }
+
+                        ,
+                        "self": {
+                            "tag": "self", "keys": ["start", "end", "stretch"], "about": "grid children specific classnames"
+                        }
+                    }
+                }
+            }
+
+            ,
+            "grid": {
+                "_data": {
+
+                    "moduleName": "grid",
+                    "moduleNameShort": "grid",
+                    "horCode": "h",
+                    "vertCode": "v",
+                    "gridFullWidth": "main",
+                    "grow-shrink-steps": 4,
+                    "cssProps": {
+                        "flexWrap": {
+                            "wrap": "wrap", "wrap-reverse": "wrap-reverse"
+                        }
+
+                        ,
+                        "grid-justify": {
+                            "start": "flex-start", "end": "flex-end", "between": "space-between", "stretch": "stretch", "center": "flex-center"
+                        }
+
+                        ,
+                        "grid-items": {
+                            "baseline": "baseline", "stretch": "stretch", "start": "flex-start", "center": "center", "end": "flex-end"
+                        }
+
+                        ,
+                        "grid-content": {
+                            "start": "flex-start", "center": "center", "end": "flex-end", "between": "space-between", "equal": "space-evenly"
+                        }
+                    }
+
+                    ,
+                    "cssItemsProps": {
+                        "self": {
+                            "start": "flex-start", "end": "flex-end", "stretch": "stretch"
+                        }
+                    }
+                }
+
+                ,
+                "_metadata": {
+                    "title": "grid", "tag": "grid", "description": "cssfabric flex grid system module"
+                }
+
+                ,
+                "_docs": {
+                    "attributes": {
+                        "grid": {
+
+                            "tag": "grid",
+                            "keys": ["v",
+                            "h"],
+                            "classNames": {
+                                "align": ["top", "middle", "bottom", "left", "right", "center", "middle-center", "stretch"], "grid": ["wrap", "wrap-reverse"]
+                            }
+
+                            ,
+                            "about": "a classic grid system, and hey, it gets height !"
+                        }
+
+                        ,
+                        "self": {
+                            "tag": "self", "keys": ["start", "end", "stretch"], "about": "grid children specific classnames"
+                        }
+                    }
+                }
+            }
+
+            ,
+            "menu": {
+                "_data": {
+
+                    "menu_class_name": "menu",
+                    "menu_class_name_short": "ul",
+                    "orientations": {
+                        "v": "vertical", "h": "horizontal"
+                    }
+
+                    ,
+                    "menu_item_class_name": "menu-item",
+                    "menu_item_class_name_short": "li",
+                    "menu_item_disabled_tag": "disabled",
+                    "menu_item_selected_tag": "selected",
+                    "menu_dropdown_tag": "drop",
+                    "menu_dropdown_open": "open",
+                    "menu_dropdown_close": "close"
+                }
+
+                ,
+                "_metadata": {
+                    "title": "menu", "tag": "ul", "description": "cssfabric menu module to set menu style"
+                }
+
+                ,
+                "_docs": {
+                    "attributes": {
+                        "menu": {
+                            "tag": "menu", "keys": ["h", "v"]
+                        }
+                    }
+                }
+            }
+
+            ,
+            "overflow": {
+                "_data": {
+
+                    "overflow_props": ["overflow",
+                    "overflow-x",
+                    "overflow-y"],
+                    "overflow_values": ["visible",
+                    "hidden",
+                    "clip",
+                    "scroll",
+                    "auto"],
+                    "cssProps": {
+                        "overflow": {
+                            "visible": "visible", "hidden": "hidden", "clip": "clip", "scroll": "scroll", "_": "auto"
+                        }
+                    }
+                }
+
+                ,
+                "_metadata": {
+                    "title": "overflow", "tag": "flow", "description": "cssfabric overflow module to set overflow styles on all html elements"
+                }
+
+                ,
+                "_docs": {
+                    "attributes": {
+                        "overflow": {
+                            "tag": "flow", "keys": ["visible", "hidden", "clip", "scroll", "auto"]
+                        }
+
+                        ,
+                        "overflowX": {
+                            "tag": "flowX", "keys": ["visible", "hidden", "clip", "scroll", "auto"]
+                        }
+
+                        ,
+                        "overflowY": {
+                            "tag": "flowY", "keys": ["visible", "hidden", "clip", "scroll", "auto"]
+                        }
+                    }
+                }
+            }
+
+            ,
+            "scale": {
+                "_data": {
+
+                    "weight-config": "1em",
+                    "unit-tag-config": {
+                        "width": "w", "height": "h"
+                    }
+
+                    ,
+                    "grid-ratios-config": [5,
+                    12],
+                    "defined-step-size": 2,
+                    "defined-step-unit": "rem",
+                    "defined-steps": [1,
+                    2,
+                    4,
+                    8,
+                    16,
+                    24,
+                    32,
+                    48,
+                    64],
+                    "cssProps": {
+                        "size": {
+                            "full": "100%", "mid": "50%", "quarter": "25%", "tiers": "33%"
+                        }
+
+                        ,
+                        "content": {
+                            "content-max": "max-content", "content-min": "min-content"
+                        }
+
+                        ,
+                        "defined-steps": [1,
+                        2,
+                        4,
+                        8,
+                        16,
+                        24,
+                        32,
+                        48,
+                        64]
+                    }
+                }
+
+                ,
+                "_metadata": {
+                    "title": "scale", "tag": "scale", "description": "cssfabric scale module to set dimensions and ratios on all html elements"
+                }
+
+                ,
+                "_docs": {
+                    "attributes": {
+                        "scale": {
+
+                            "tag": "scale",
+                            "keys": ["w",
+                            "h"],
+                            "levels": {
+                                "_size": ["full", "mid", "quarter", "tiers"], "_content": ["content-max", "content-min"], "_defined-steps": [1, 2, 4, 8, 16, 24, 32, 48, 64], "_grid-5": ["1-5", "2-5", "3-5", "4-5", "5-5"], "_grid-12": ["1-12", "2-12", "3-12", "4-12", "5-12", "6-12", "7-12", "8-12", "9-12", "10-12", "11-12", "12-12"]
+                            }
+                        }
+                    }
+                }
+            }
+
+            ,
+            "table": {
+                "_data": {
+                    "className": "table", "classNameShort": "tbl", "table_class_name": "table", "table_class_name_short": "tbl", "table-bg-color-head": "#f4f4f4", "table-bg-color-strip-main": "#ededed", "table-bg-color-strip-second": "#f5f5f5", "table-border-color-header": "#ccc", "table-border-color-main": "#ededed", "table-border-color-second": "#f5f5f5"
+                }
+
+                ,
+                "_metadata": {
+                    "title": "table", "tag": "table", "description": "cssfabric table module to set different table styles"
+                }
+
+                ,
+                "_docs": {
+                    "attributes": {
+                        "table": {
+
+                            "tag": "table",
+                            "classNames": {
+                                "_": ["bg-strip-2", "bg-strip-5"], "_pos": ["sticky", "layout"], "_deco": ["h-line", "v-line", "border"]
+                            }
+
+                            ,
+                            "about": "is a table"
+                        }
+                    }
+                }
+            }
+
+            ,
+            "text": {
+                "_data": {
+
+                    "moduleName": "text",
+                    "moduleNameShort": "text",
+                    "title-size-declination-config": 6,
+                    "font-size-unit-config": "rem",
+                    "font-sizes-h1-rem-config": 3.1,
+                    "font-size-h-min-rem-config": 1,
+                    "text-ellipsis-tag-config": "ellipsis",
+                    "cssProps": {
+                        "textTransform": {
+                            "cap": "capitalize", "up": "uppercase", "low": "lowercase", "none": "none", "full": "full-width"
+                        }
+
+                        ,
+                        "fontWeight": {
+                            "50": 50, "100": 100, "300": 400, "500": 500, "900": 900, "light": "lighter", "cap": "normal", "bold": "bold", "bolder": "bolder"
+                        }
+
+                        ,
+                        "textAlign": {
+                            "l": "left", "r": "right", "center": "center", "justify": "justify"
+                        }
+                    }
+
+                    ,
+                    "scheme": {
+                        "discrete": "#ccc", "success": "green", "info": "#ffdd57", "warning": "#e6b905", "alert": "#ff7300", "error": "red"
+                    }
+
+                    ,
+                    "palette": {
+                        "yellow": "#ffb900", "orange": "#d83b01", "red": "#d13438", "magenta": "#b4009e", "purple": "#5c2d91", "green": "#107c10", "teal": "#008272", "blue": "#0078d4", "dark": "#323232"
+                    }
+
+                    ,
+                    "gray": "getGraySteps(8, #f4f4f4, #999)"
+                }
+
+                ,
+                "_metadata": {
+                    "title": "text", "tag": "text", "description": "cssfabric text module to set text style on all html elements"
+                }
+
+                ,
+                "_docs": {
+                    "attributes": {
+                        "text-transform": {
+                            "tag": "text", "keys": ["cap", "up", "low", "none", "full"]
+                        }
+
+                        ,
+                        "font-weight": {
+                            "tag": "text", "keys": [50, 100, 300, 500, 900, "light", "cap", "bold", "bolder"]
+                        }
+
+                        ,
+                        "text-align": {
+                            "tag": "text", "keys": ["l", "r", "center", "justify"]
+                        }
+
+                        ,
+                        "text-shadow": {
+                            "tag": "text-shad", "keys": ["palette"]
+                        }
+                    }
+
+                    ,
+                    "classNames": {
+                        "_": {
+                            "et": "ellipsis"
+                        }
+                    }
+                }
+            }
+
+            ,
+            "theme": {
+                "_data": {
+
+                    "moduleName": "theme",
+                    "moduleNameShort": "theme",
+                    "color-default-config": {
+                        "primary": "#0288d1", "foreground": "#282230", "background": "#f1f1f1"
+                    }
+
+                    ,
+                    "declinations-config": ["primary",
+                    "secondary",
+                    "tertiary"],
+                    "theme-level-config": ["light",
+                    "lighter",
+                    "dark",
+                    "darker",
+                    "complement",
+                    "invert"],
+                    "theme-properties-apply-config": ["text",
+                    "bg",
+                    "border"],
+                    "color": {
+                        "primary": "#0288d1", "primary-light": "#23b0fd", "primary-lighter": "#6ecbfe", "primary-dark": "#02679e", "primary-darker": "#01466c", "primary-complement": "#d14b02", "primary-invert": "#fd772e", "secondary": "#d14b02", "secondary-light": "#fd7023", "secondary-lighter": "#fea16e", "secondary-dark": "#9e3902", "secondary-darker": "#6c2701", "secondary-complement": "#0288d1", "secondary-invert": "#2eb4fd", "tertiary": "#0288d1", "tertiary-light": "#23b0fd", "tertiary-lighter": "#6ecbfe", "tertiary-dark": "#02679e", "tertiary-darker": "#01466c", "tertiary-complement": "#d14b02", "tertiary-invert": "#fd772e"
+                    }
+                }
+
+                ,
+                "_metadata": {
+                    "title": "theme", "description": ""
+                }
+
+                ,
+                "_docs": {
+                    "attributes": {
+                        "theme": {
+
+                            "tag": "theme",
+                            "keys": ["text",
+                            "bg",
+                            "border"],
+                            "levels": {
+                                "primary": ["_", "light", "lighter", "dark", "darker", "complement", "invert"], "secondary": ["_", "light", "lighter", "dark", "darker", "complement", "invert"], "tertiary": ["_", "light", "lighter", "dark", "darker", "complement", "invert"]
+                            }
+                        }
+                    }
+                }
+            }
+
+            ,
+            "zindex": {
+                "_data": {
+                    "z_groups": ["a", "b", "c", "d", "e", "f", "g"]
+                }
+
+                ,
+                "_metadata": {
+                    "title": "zindex", "tag": "zI", "description": "cssfabric zindex module to set z-index on all html elements"
+                }
+
+                ,
+                "_docs": {
+                    "z_groups": "_"
+                }
+            }
+        }
+    }
+}