Template:Cauldron grid/styles.css

/* Cauldron recipe grid ({{#invoke:ItemData|cauldronGrid}}): scrolls inside its box, headers stay in view. */
.hic-grid-wrap {
	overflow: auto;
	max-width: 100%;
	max-height: 80vh;
	margin: 0.5em 0 1em;
}
table.hic-grid {
	border-collapse: separate;
	border-spacing: 0;
	margin: 0;
}
table.hic-grid th,
table.hic-grid td {
	padding: 2px 3px;
	text-align: center;
	vertical-align: middle;
	min-width: 34px;
	height: 38px;
}
table.hic-grid th {
	background-color: #241319;
}
table.hic-grid th.hic-grid-col {
	position: sticky;
	top: 0;
	z-index: 3;
}
table.hic-grid th.hic-grid-row {
	position: sticky;
	left: 0;
	z-index: 2;
	text-align: left;
	white-space: nowrap;
}
table.hic-grid th.hic-grid-corner {
	position: sticky;
	top: 0;
	left: 0;
	z-index: 4;
}
table.hic-grid tr:hover td,
table.hic-grid tr:hover th.hic-grid-row {
	background-color: rgba(255, 255, 255, 0.07);
}
table.hic-grid td.hic-grid-hit:hover {
	background-color: rgba(209, 133, 30, 0.35);
}
table.hic-grid .hic-kw {
	border-bottom: none;
}
table.hic-grid .hic-kw-tip {
	left: 50%;
	transform: translateX(-50%);
	width: 260px;
}
.hic-grid-name {
	font-size: 12px;
}