@pageboard/html 0.14.18 → 0.14.20

package/elements/accordion.js

@@ -6,7 +6,7 @@ exports.accordion = {
 	contents: "fold+",
 	html: '<element-accordion class="ui accordion"></element-accordion>',
 	stylesheets: [
-		'../lib/components/accordion.css',
+		'../ui/components/accordion.css',
 		'../ui/accordion.css'
 	],
 	scripts: [

package/elements/card.js

@@ -10,7 +10,7 @@ exports.cards = {
 	properties: {
 		columns: {
 			title: 'Column count',
-			description: 'How many cards should exist in a row - zero for unknown',
+			description: 'How many cards should exist in a row\nzero for unknown',
 			type: 'integer',
 			minimum: 0,
 			default: 0

package/elements/fieldsets.js

@@ -148,6 +148,6 @@ exports.fieldlist_button = {
 	},
 	html: '<button type="button" class="ui [full|alt:fluid:] [icon] [compact] [float|post:%20floated] button" value="[type]">Label</button>',
 	stylesheets: [
-		'../lib/components/button.css',
+		'../ui/components/button.css',
 	]
 };

package/elements/form.js

@@ -1,6 +1,6 @@
 exports.query_form = {
-	priority: 0, // scripts must run before 'query' scripts
 	title: 'Form Query',
+	priority: 0, // scripts must run before 'query' scripts
 	icon: '<i class="write icon"></i>',
 	group: 'block form',
 	menu: "form",
@@ -56,7 +56,7 @@ exports.query_form = {
 		action="[redirection.url][redirection.parameters|as:query]"
 		autocomplete="off" class="ui form"></form>`,
 	stylesheets: [
-		'../lib/components/form.css',
+		'../ui/components/form.css',
 		'../ui/form.css'
 	],
 	scripts: [ // for asynchronous submits and automatic triggers
@@ -66,8 +66,8 @@ exports.query_form = {
 };
 
 exports.api_form = {
-	priority: 0, // scripts must run before 'query' scripts
 	title: 'Form Submit',
+	priority: 0, // scripts must run before 'query' scripts
 	icon: '<i class="write icon"></i>',
 	group: 'block form',
 	menu: "form",
@@ -79,7 +79,7 @@ exports.api_form = {
 	properties: {
 		name: {
 			title: 'Name',
-			description: 'Trigger query submit|toggle=<name>\nExpose endpoint /.api/form/<name>',
+			description: "Used by query 'submit' or 'toggle'\nExposes /.api/form/$name",
 			type: 'string',
 			format: 'id',
 			nullable: true
@@ -186,7 +186,7 @@ exports.api_form = {
 		notfound="[notfound.url][notfound.parameters|as:query]"
 		class="ui form [hidden]"></form>`,
 	stylesheets: [
-		'../lib/components/form.css',
+		'../ui/components/form.css',
 		'../ui/form.css'
 	],
 	scripts: [ // for asynchronous submits and automatic triggers

package/elements/grid.js

@@ -36,7 +36,7 @@ exports.grid = {
 		},
 		columns: {
 			title: 'Columns Count',
-			description: 'Between 1 and 16, set to 0 to unknown - works well with doubling',
+			description: 'Between 1 and 16, 0 for auto\nworks well with doubling',
 			type: "integer",
 			default: 0,
 			minimum: 0,
@@ -45,7 +45,7 @@ exports.grid = {
 	},
 	html: '<div class="ui [responsive] [width|neq:min|alt:equal width] [columns|as:colnums|post: columns] grid [width|switch:contained:container]"></div>',
 	stylesheets: [
-		'../lib/components/grid.css'
+		'../ui/components/grid.css'
 	]
 };
 
@@ -88,7 +88,7 @@ exports.grid_row = {
 		},
 		columns: {
 			title: 'Columns Count',
-			description: 'Between 1 and 16, set to 0 to unknown - works well with doubling',
+			description: 'Between 1 and 16, 0 for auto\nworks well with doubling',
 			type: "integer",
 			default: 0,
 			minimum: 0,

package/elements/image.js

@@ -6,7 +6,7 @@ exports.image = {
 	properties: {
 		alt: {
 			title: 'Alternative text',
-			description: 'Short contextual description. Leave empty when used in links.',
+			description: 'Short contextual description.\nLeave empty when used in links.',
 			type: "string"
 		},
 		url: {
@@ -145,8 +145,8 @@ exports.image = {
 };
 
 exports.inlineImage = {
-	priority: 12,
 	title: "Icon",
+	priority: 12,
 	icon: '<i class="icon image"></i>',
 	properties: {
 		url: {
@@ -285,7 +285,7 @@ exports.inlineImage = {
 		[display.floated|pre:floated ]
 		[display.align|post: aligned]" />`,
 	stylesheets: [
-		'../lib/components/image.css'
+		'../ui/components/image.css'
 	],
 	polyfills: [
 		'IntersectionObserver'

package/elements/inlines.js

@@ -1,6 +1,6 @@
 exports.strong = {
-	priority: 100,
 	title: "Strong",
+	priority: 100,
 	contents: "text*",
 	inplace: true,
 	inline: true,
@@ -11,8 +11,8 @@ exports.strong = {
 };
 
 exports.em = {
-	priority: 101,
 	title: "Emphasize",
+	priority: 101,
 	contents: "text*",
 	inline: true,
 	inplace: true,
@@ -23,8 +23,8 @@ exports.em = {
 };
 
 exports.i = {
-	priority: 102,
 	title: "Italic",
+	priority: 102,
 	contents: "text*",
 	inline: true,
 	inplace: true,
@@ -35,8 +35,8 @@ exports.i = {
 };
 
 exports.light = {
-	priority: 103,
 	title: "Light",
+	priority: 103,
 	icon: '<i class="icon" style="font-weight:lighter">L</i>',
 	contents: "text*",
 	inline: true,
@@ -46,8 +46,8 @@ exports.light = {
 };
 
 exports.sup = {
-	priority: 104,
 	title: "Sup",
+	priority: 104,
 	icon: '<i class="superscript icon"></i>',
 	contents: "text*",
 	inline: true,
@@ -58,8 +58,8 @@ exports.sup = {
 };
 
 exports.sub = {
-	priority: 105,
 	title: "Inf",
+	priority: 105,
 	icon: '<i class="subscript icon"></i>',
 	contents: "text*",
 	inline: true,
@@ -70,8 +70,8 @@ exports.sub = {
 };
 
 exports.strike = {
-	priority: 106,
 	title: "Strike",
+	priority: 106,
 	icon: '<i class="strikethrough icon"></i>',
 	contents: "text*",
 	inline: true,
@@ -82,8 +82,8 @@ exports.strike = {
 };
 
 exports.style = {
-	priority: 99,
 	title: "Style",
+	priority: 99,
 	icon: '<i class="paint brush icon"></i>',
 	contents: "text*",
 	inline: true,

package/elements/input-file.js

@@ -56,8 +56,8 @@ exports.input_file = {
 			disabled="[disabled]" accept="[limits.types|join:,]" name="[name]" />
 	</div>`,
 	stylesheets: [
-		'../lib/components/input.css',
-		'../lib/components/label.css',
+		'../ui/components/input.css',
+		'../ui/components/label.css',
 		'../ui/input-file.css'
 	],
 	scripts: [

package/elements/input-property.js

@@ -336,7 +336,7 @@ exports.input_property = {
 		return node;
 	},
 	stylesheets: [
-		'../lib/components/accordion.css',
+		'../ui/components/accordion.css',
 		'../ui/accordion.css'
 	],
 	scripts: [

package/elements/inputs.js

@@ -75,7 +75,7 @@ exports.input_button = {
 	},
 	html: '<button type="[type]" disabled="[disabled]" class="ui [full|alt:fluid:] [icon] [compact] [float|post:%20floated] button" name="[name]" value="[value]">[type|schema:title]</button>',
 	stylesheets: [
-		'../lib/components/button.css',
+		'../ui/components/button.css',
 		'../ui/button.css'
 	]
 };
@@ -367,7 +367,7 @@ exports.input_checkbox = {
 		</div>
 	</div>`,
 	stylesheets: [
-		'../lib/components/checkbox.css'
+		'../ui/components/checkbox.css'
 	]
 };
 
@@ -425,7 +425,7 @@ exports.input_radio = {
 		</div>
 	</div>`,
 	stylesheets: [
-		'../lib/components/checkbox.css',
+		'../ui/components/checkbox.css',
 		'../ui/input_radio.css'
 	]
 };
@@ -488,8 +488,8 @@ exports.input_select = {
 		</element-select>
 	</div>`,
 	stylesheets: [
-		'../lib/components/dropdown.css',
-		'../lib/components/label.css',
+		'../ui/components/dropdown.css',
+		'../ui/components/label.css',
 		'../ui/select.css'
 	],
 	scripts: [

package/elements/layout.js

@@ -1,3 +1,33 @@
+exports.units = {
+	properties: {
+		inline: {
+			title: 'Inline units',
+			anyOf: [
+				{ const: 'em' },
+				{ const: 'ch' },
+				{ const: 'vw' },
+				{ const: 'rem' },
+				{ const: 'px' }
+			],
+			default: 'em',
+			$helper: 'units'
+		},
+		block: {
+			title: 'Block units',
+			anyOf: [
+				{ const: 'rem' },
+				{ const: 'ex' },
+				{ const: 'vh' },
+				{ const: '%' },
+				{ const: 'em' },
+				{ const: 'px' }
+			],
+			default: 'rem',
+			$helper: 'units'
+		}
+	}
+};
+
 exports.layout = {
 	title: "Layout",
 	icon: '<i class="icon move"></i>',
@@ -91,24 +121,7 @@ exports.layout = {
 			default: 0
 		},
 		heightUnits: {
-			title: 'Height units',
-			default: 'em',
-			anyOf: [{
-				title: 'em',
-				const: 'em'
-			}, {
-				title: 'rem',
-				const: 'rem'
-			}, {
-				title: 'px',
-				const: 'px'
-			}, {
-				title: 'vh',
-				const: 'vh'
-			}, {
-				title: '%',
-				const: '%'
-			}]
+			$ref: "#/definitions/units/properties/data/properties/block"
 		},
 		margins: {
 			title: 'Margins',
@@ -117,25 +130,23 @@ exports.layout = {
 			properties: {
 				inline: {
 					title: 'Inline',
-					description: 'Units: em',
 					type: 'number',
 					default: 0,
 					multipleOf: 0.01,
 					nullable: true
 				},
 				inlineUnits: {
-					const: 'em'
+					$ref: "#/definitions/units/properties/data/properties/inline"
 				},
 				block: {
 					title: 'Block',
-					description: 'Units: rem',
 					type: 'number',
 					default: 0,
 					multipleOf: 0.01,
 					nullable: true
 				},
 				blockUnits: {
-					const: 'rem'
+					$ref: "#/definitions/units/properties/data/properties/block"
 				}
 			}
 		},
@@ -146,7 +157,6 @@ exports.layout = {
 			properties: {
 				inline: {
 					title: 'Inline',
-					description: 'Units: em',
 					type: 'number',
 					default: 0,
 					minimum: 0,
@@ -154,11 +164,10 @@ exports.layout = {
 					nullable: true
 				},
 				inlineUnits: {
-					const: 'em'
+					$ref: "#/definitions/units/properties/data/properties/inline"
 				},
 				block: {
 					title: 'Block',
-					description: 'Units: rem',
 					type: 'number',
 					default: 0,
 					minimum: 0,
@@ -166,7 +175,21 @@ exports.layout = {
 					nullable: true
 				},
 				blockUnits: {
-					const: 'rem'
+					$ref: "#/definitions/units/properties/data/properties/block"
+				}
+			}
+		},
+		overlay: {
+			title: 'Overlay',
+			nullable: true,
+			properties: {
+				inline: {
+					title: 'Inline',
+					anyOf: [{ const: 'start', title: 'Start' }, { const: 'end', title: 'End' }]
+				},
+				block: {
+					title: 'Block',
+					anyOf: [{ const: 'start', title: 'Start' }, { const: 'end', title: 'End' }]
 				}
 			}
 		},
@@ -337,6 +360,7 @@ exports.layout = {
 	contents: "block+",
 	group: 'block',
 	html: `<div class="layout
+		[overlay.block|pre:overlay block-] [overlay.inline|pre:overlay inline-]
 		[width|switch:full:fullwidth:contained:ui container]
 		[horizontal]
 		[vertical]
@@ -358,7 +382,7 @@ exports.layout = {
 		style-background-position="[background.position]"
 	></div>`,
 	stylesheets: [
-		'../lib/components/container.css',
+		'../ui/components/container.css',
 		'../ui/layout.css'
 	],
 	scripts: [

package/elements/link.js

@@ -39,13 +39,13 @@ exports.link = {
 	tag: 'a:not([block-type]),a[block-type="link"]',
 	html: '<a href="[url]" hreflang="[lang]" class="[button|alt:ui button]"></a>',
 	stylesheets: [
-		'../lib/components/button.css'
+		'../ui/components/button.css'
 	]
 };
 
 exports.link_button = {
-	priority: 11,
 	title: "Link Btn",
+	priority: 11,
 	icon: '<i class="icons"><i class="linkify icon"></i><i class="corner hand pointer icon"></i></i>',
 	properties: {
 		url: {
@@ -106,6 +106,6 @@ exports.link_button = {
 	tag: 'a.ui.button',
 	html: '<a href="[url]" hreflang="[lang]" class="ui [full|alt:fluid:] [icon] [compact] [float|post:%20floated] button"></a>',
 	stylesheets: [
-		'../lib/components/button.css'
+		'../ui/components/button.css'
 	]
 };

package/elements/medialist.js

@@ -1,6 +1,6 @@
 exports.medialist = {
-	priority: 20,
 	title: "List",
+	priority: 20,
 	group: "block",
 	icon: '<i class="list icon"></i>',
 	menu: "widget",

package/elements/menu.js

@@ -24,7 +24,7 @@ exports.menu = {
 	group: "block",
 	html: `<nav class="ui [direction] menu"></nav>`,
 	stylesheets: [
-		'../lib/components/menu.css'
+		'../ui/components/menu.css'
 	]
 };
 
@@ -79,8 +79,8 @@ exports.menu_group = {
 };
 
 exports.menu_item_link = {
-	priority: 10,
 	title: "Inline",
+	priority: 10,
 	icon: '<b class="icon">Link</b>',
 	menu: "link",
 	context: "menu//",
@@ -133,8 +133,8 @@ exports.menu_item_block = { ...exports.menu_item_link,
 };
 
 exports.menu_item_text = {
-	priority: 11,
 	title: 'Text',
+	priority: 11,
 	icon: '<b class="icon">Item</b>',
 	menu: "link",
 	context: "menu//",
@@ -154,8 +154,8 @@ exports.menu_item_text = {
 };
 
 exports.menu_item_dropdown = {
-	priority: 11,
 	title: "Dropdown",
+	priority: 11,
 	icon: '<b class="icon">Drop</b>',
 	menu: "link",
 	context: "menu//",
@@ -192,13 +192,13 @@ exports.menu_item_dropdown = {
 		<div class="menu" block-content="items"></div>
 	</div>`,
 	stylesheets: [
-		'../lib/components/dropdown.css'
+		'../ui/components/dropdown.css'
 	]
 };
 
 exports.menu_item_popup = {
-	priority: 11,
 	title: "Popup",
+	priority: 11,
 	icon: '<b class="icon">Pop</b>',
 	menu: "link",
 	context: "menu//",

package/elements/navigation.js

@@ -61,7 +61,7 @@ exports.breadcrumb = {
 		<div class="active section">[$page.content.title|fail:div::1]</div>
 	</nav>`,
 	stylesheets: [
-		'../lib/components/breadcrumb.css'
+		'../ui/components/breadcrumb.css'
 	]
 };
 

package/elements/page.js

@@ -1,6 +1,6 @@
 exports.page.stylesheets = [
 	...exports.page.stylesheets,
-	'../lib/components/reset.css',
+	'../ui/components/reset.css',
 	'../ui/site.css',
 	'../ui/page.css',
 	'../ui/transition.css'

package/elements/pagination.js

@@ -1,6 +1,6 @@
 exports.pagination = {
-	priority: 13, // after fetch and after menu items
 	title: "Pagination",
+	priority: 13, // after fetch and after menu items
 	icon: '<b class="icon">±N</b>',
 	menu: "link",
 	group: "block",

package/elements/paragraph.js

@@ -95,7 +95,7 @@ exports.segment = {
 	icon: '<b class="icon">Seg</b>',
 	html: '<div class="ui [size] [raised] [disabled] [inverted] [padded] [compact] [circular] [basic] [attached|switch:both: |post: attached] [align|post: aligned] segment"></div>',
 	stylesheets: [
-		'../lib/components/segment.css'
+		'../ui/components/segment.css'
 	]
 };
 
@@ -128,7 +128,7 @@ exports.divider = {
 	},
 	html: '<div class="ui divider [ruler|or:hidden] [large|alt:section] [clearing] [fitted]"></div>',
 	stylesheets: [
-		'../lib/components/divider.css'
+		'../ui/components/divider.css'
 	]
 };
 

package/elements/query-tags.js

@@ -21,7 +21,7 @@ exports.query_tags = {
 		<div class="ui labels"></div>
 	</element-query-tags>`,
 	stylesheets: [
-		'../lib/components/label.css',
+		'../ui/components/label.css',
 		'../ui/query-tags.css'
 	],
 	scripts: [

package/elements/tab.js

@@ -25,7 +25,7 @@ exports.tabs = {
 		<div block-content="tabs"></div>
 	</element-tabs>`,
 	stylesheets: [
-		'../lib/components/tab.css',
+		'../ui/components/tab.css',
 		'../ui/tab.css'
 	],
 	scripts: [

package/elements/table.js

@@ -63,7 +63,7 @@ exports.table = {
 		[compact]"
 	></table>`,
 	stylesheets: [
-		'../lib/components/table.css'
+		'../ui/components/table.css'
 	]
 };
 

package/elements/template.js

@@ -17,5 +17,5 @@ exports.message.properties.inverted = {
 };
 
 exports.message.stylesheets.unshift(
-	'../lib/components/message.css'
+	'../ui/components/message.css'
 );

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pageboard/html",
-  "version": "0.14.18",
+  "version": "0.14.20",
   "description": "",
   "main": "index.js",
   "repository": {
@@ -13,17 +13,12 @@
     "url": "https://github.com/pageboard/client/issues"
   },
   "homepage": "https://github.com/pageboard/client#readme",
-  "dependencies": {
-    "semantic-ui-css": "^2.4.1"
-  },
+  "dependencies": {},
   "devDependencies": {
     "nouislider": "^15.7.1",
     "postinstall": "^0.8.0"
   },
-  "postinstall": {
-    "semantic-ui-css/components": "link lib/components",
-    "semantic-ui-css/themes": "link lib/themes"
-  },
+  "postinstall": {},
   "prepare": {
     "nouislider/dist/nouislider.js": "copy lib/",
     "nouislider/dist/nouislider.css": "copy lib/"

package/ui/card.css

@@ -509,7 +509,7 @@
 --------------------*/
 
 
-@media only screen and (max-width: 767px) {
+@media (width <= 767px) {
 	/* Mobile Only */
 	.ui.two.doubling.cards {
 		margin-left: 0em;
@@ -594,7 +594,7 @@
 	}
 }
 
-@media only screen and (min-width: 768px) and (max-width: 991px) {
+@media (width >= 768px) and (width <= 991px) {
 	/* Tablet Only */
 	.ui.two.doubling.cards {
 		margin-left: 0em;
@@ -674,7 +674,7 @@
 			Stackable
 --------------------*/
 
-@media only screen and (max-width: 767px) {
+@media (width <= 767px) {
 	.ui.stackable.cards {
 		display: block !important;
 	}