smiteitems.less

* {border:0; margin:0; padding:0; text-decoration:none;}

html {padding:8px 8px 16px; font-size:100%; line-height:1.3em;}
h1 {font-size:1.6em; line-height:1.6em; margin:0.2em 0 0.1em;}
h2 {font-size:1.4em; line-height:1.4em; margin:0.3em 0 0.1em;}

input[type=text] { border:1px solid #dddddd; }
table, tr, th, td {border:1px solid #cccccc; vertical-align:top;}
table {border-collapse:collapse;}
th, td {padding:2px;}
thead th {vertical-align:bottom;}
tbody th {text-align:right;}
ul, li {list-style-type:none; display:inline-block;}
aside { font-style:italic; }

@import "less/relatedpages.less";
@import "less/footer.less";

.items-container {
	border: 1px dotted #ccc;

	summary {
		display: block;
	}
}
.items {
	display: flex;
}
.item-tree {
	border: 1px solid red;
	margin: 8px;
}
.item-tree-node {
	border: 1px solid cyan;
	margin: 8px;
}
.item {
	padding: 4px;

	.icon {
		display: block;
		// width: 64px;
		// height: 64px;
		width: 48px;
		height: 48px;
		margin: 0 auto;
	}

	background-color:#dddddd;
	&.item-root {
		margin: 12px;
		padding: 12px;
	}

	.item-desc {
		// &:hover::after {
		// 	content:attr(title); color:#000000; background-color:#ffffff; display:block; width:100%; height:12px; position:absolute;
		// }
		a {
			display:block;
		}
		/* Icon size: 128x128 */
		/* .item .icon, .godnoicon { display:block; width:100%; } */
		.noicon { background-color:lightblue; font-style:italic; text-align:center; }
		.name {
			height:16px;
			font-size:14px;
			font-weight: bold;
			line-height:16px;
			text-align:center;
			white-space:nowrap;
			overflow:hidden;
		}
		/* .item .shortdesc {} */
		.description { 
			font-size:0.8em;
			line-height:1em; 
		}
		.properties {
			display: grid;
			grid-template: auto / auto 1fr;
		}
		.propkey {
			margin-right: 6px;
		}
	}

	.tag {
		padding: 2px 4px;
		border-radius: 4px;
		background-color:#cccccc; 
		color:#333333;
	}
}

.data-block {
	background:#fafafa;
	padding:8px 4px;
	margin:4px;
	border:2px solid transparent;
}
.data-block h2 {
	margin:0 0 0.1em;
}
.filter {
	margin-bottom:8px;
}
#legend {float:right;}
#options {float:left;}
#filters {float:left;}