Template:VerticalGrid/styles.css: Difference between revisions

From Rhythm Heaven Wiki
Jump to navigation Jump to search
(Created page with ".vertical-grid { max-width: 100%; overflow: auto; display: grid; grid-auto-flow: column dense; grid-auto-columns: minmax(16em, 1fr); column-gap: 2em; } .vertical-grid.nowrap { grid-auto-columns: minmax(max-content, 1fr); } body.mobile .vertical-grid { font-size: 90%; }")
 
(More optional classes)
 
(3 intermediate revisions by the same user not shown)
Line 10: Line 10:
grid-auto-columns: minmax(max-content, 1fr);
grid-auto-columns: minmax(max-content, 1fr);
}
}
body.mobile .vertical-grid {
.vertical-grid-cell.nowrap {
white-space: nowrap;
}
.vg-compact {
grid-auto-columns: max-content;
}
.vg-compact-centered {
grid-auto-columns: max-content;
width: max-content;
margin: 0 auto;
}
.vg-row-centered {
align-items: center;
}
.vg-row-numbered {
row-gap: 1em;
grid-template-columns: max-content;
}
.vg-row-numbered > .vgc-row-number {
grid-column: 1;
align-self: stretch;
border-right: 1px solid #A2A9B1;
padding-right: 0.5em;
text-align: right;
}
body.mw-mf .vertical-grid {
font-size: 90%;
font-size: 90%;
}
}

Latest revision as of 12:06, 24 September 2025

.vertical-grid {
	max-width: 100%;
	overflow: auto;
	display: grid;
	grid-auto-flow: column dense;
	grid-auto-columns: minmax(16em, 1fr);
	column-gap: 2em;
}
.vertical-grid.nowrap {
	grid-auto-columns: minmax(max-content, 1fr);
}
.vertical-grid-cell.nowrap {
	white-space: nowrap;
}
.vg-compact {
	grid-auto-columns: max-content;
}
.vg-compact-centered {
	grid-auto-columns: max-content;
	width: max-content;
	margin: 0 auto;
}
.vg-row-centered {
	align-items: center;
}
.vg-row-numbered {
	row-gap: 1em;
	grid-template-columns: max-content;
}
.vg-row-numbered > .vgc-row-number {
	grid-column: 1;
	align-self: stretch;
	border-right: 1px solid #A2A9B1;
	padding-right: 0.5em;
	text-align: right;
}
body.mw-mf .vertical-grid {
	font-size: 90%;
}