You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
110 lines
3.2 KiB
110 lines
3.2 KiB
{
|
|
|
|
// Package Name (Name Type)
|
|
"Name" : "Semantic Button",
|
|
|
|
// Version #
|
|
"Version" : "0.1",
|
|
|
|
// Type of element
|
|
"Type" : "button",
|
|
|
|
// Type of definition
|
|
"Definition" : "Element",
|
|
|
|
// ID of UI components that must be included
|
|
"Dependencies" : [],
|
|
|
|
// list of required components in "name type" format
|
|
"Coupling" : ["semantic icon", "semantic loader"],
|
|
|
|
// List of mutually exclusive types with their koan generators <https://github.com/zodoz/jquery-ZenCoding>
|
|
"Types": {
|
|
"Singular": {
|
|
"Standard" : ".ui.button",
|
|
"Icon" : ".ui.icon.button > i.add.icon",
|
|
"Labeled Icon" : ".ui.icon.button > i.add.icon",
|
|
"Social" : [
|
|
".ui.facebook.button > i.facebook.icon",
|
|
".ui.twitter.button > i.twitter.icon"
|
|
]
|
|
},
|
|
"Plural": {
|
|
"Standard" : ".ui.buttons > .button+.button+.button",
|
|
"Icon" : ".ui.buttons > ( (.button > i.icon.user) + (.button > i.icon.heart) + (.button > i.icon.lab))",
|
|
"Conditional" : ".ui.buttons > .button+.or+.button",
|
|
"Vertical" : ".vertical.ui.buttons > .button+.button+.button"
|
|
}
|
|
},
|
|
|
|
// Set of states that an element can occupy
|
|
"States": {
|
|
"Hover" : "hover",
|
|
"Down" : "down",
|
|
"Active" : "active",
|
|
"Loading" : "loading",
|
|
"Disabled" : "disabled"
|
|
},
|
|
|
|
// Sets of variations of an element
|
|
"Variations" : {
|
|
"Circular" : "circular",
|
|
"Toggle" : "toggle",
|
|
"Fluid" : "fluid",
|
|
"Size" : [
|
|
"mini",
|
|
"tiny",
|
|
"small",
|
|
"medium",
|
|
"large",
|
|
"huge",
|
|
"massive"
|
|
],
|
|
"Color" : [
|
|
"black",
|
|
"green",
|
|
"red",
|
|
"blue",
|
|
"green",
|
|
"red",
|
|
"teal"
|
|
],
|
|
"Feedback": [
|
|
"positive",
|
|
"negative"
|
|
],
|
|
"Attached" : [
|
|
"attached top",
|
|
"attached bottom",
|
|
"attached left",
|
|
"attached right"
|
|
]
|
|
},
|
|
|
|
// Used with generators to create example content
|
|
"Text": {
|
|
".button" : ["Button", "Follow", "Submit"]
|
|
},
|
|
|
|
// Your module may optionally include a text definition of its variations to help clarify their purpose. This may include the definition of types or variations
|
|
"Definition": {
|
|
"Standard" : "A simple button",
|
|
"Icon" : "A button icon is formatted to contain only an icon",
|
|
"Labeled Icon" : "A button can have an icon and a label",
|
|
"Social" : "A button can be formatted to link to a social website",
|
|
|
|
"Hover" : "A button can change to show a user has hovered their mouse",
|
|
"Down" : "A button can change when pressed using touch or mouse events",
|
|
"Active" : "A button can show it is currently the active user selection",
|
|
"Loading" : "A button can show a loading indicator",
|
|
"Disabled" : "A button can show it is currently unable to be interacted with",
|
|
|
|
"Attached" : "A button can attach to other content",
|
|
"Circular" : "A button can be circular",
|
|
"Color" : "A button can have different colors",
|
|
"Fluid" : "A button can be fluid",
|
|
"Ordinality" : "A button can blend into a page",
|
|
"Size" : "A button can vary in size",
|
|
"Toggle" : "A button can be formatted to toggle on and off"
|
|
}
|
|
}
|