Template:BTD6 stats/style.css: Difference between revisions

From Blooncyclopedia, the independent Bloons knowledge base
Jump to navigation Jump to search
mNo edit summary
mNo edit summary
 
(11 intermediate revisions by the same user not shown)
Line 1: Line 1:
/* [[Category:Template styles]] */
/* [[Category:Template styles]] */
.stats-wrapper {
display: flex;
flex-wrap: wrap;
gap: 10px;
margin: 1em 0;
}
.stats-wrapper dt {
font-weight: normal;
}
.stats-outer-block {
.stats-outer-block {
background: var(--background-color-object-base);
background: var(--background-color-object-base);
border: 1px solid var(--border-color-object-base);
border: 1px solid var(--border-color-object-base);
margin: 1em 0;
padding: 3px 4px 4px;
padding: 3px 4px 4px;
}
 
.stats-outer-block .flex-wrapper {
width: 100%;
margin-top: 2px;
display: flex;
display: flex;
flex-wrap: wrap;
flex-wrap: wrap;
gap: 2px;
gap: 2px;
align-self: flex-start;
}
.stats-outer-block.horizontal {
flex: 1 1 800px;
}
.stats-outer-block.vertical {
flex: 1 1 300px;
flex-direction: column;
}
}


.stats-outer-block .head {
.stats-outer-block > .head {
text-align: center;
text-align: center;
font-weight: bold;
font-weight: bold;
font-size: 1.1em;
font-size: 1.1em;
}
.stats-outer-block.horizontal > .head {
flex: 1 1 100%;
}
}


.stats-outer-block .stats-inner-block {
.stats-outer-block .stats-inner-block {
flex: 1 1 300px;
font-size: 90%;
font-size: 90%;
}
}


.stats-outer-block .stats-inner-block.wide {
.stats-outer-block.horizontal .stats-inner-block {
flex: 2 1 401px;
flex: 1 1 400px;
}
 
.stats-outer-block.vertical .stats-inner-block {
flex: 1;
}
 
.stats-outer-block .stats-inner-block .subtable {
height: 100%;
}
 
.stats-outer-block .stats-inner-block .subtable td {
width: 100%;
}
 
.stats-outer-block .stats-inner-block .subtable .head {
height: 0;
}
}

Latest revision as of 19:35, 14 August 2026

/* [[Category:Template styles]] */
.stats-wrapper {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin: 1em 0;
}

.stats-wrapper dt {
	font-weight: normal;
}

.stats-outer-block {
	background: var(--background-color-object-base);
	border: 1px solid var(--border-color-object-base);
	padding: 3px 4px 4px;
	
	display: flex;
	flex-wrap: wrap;
	gap: 2px;
	align-self: flex-start;
}

.stats-outer-block.horizontal {
	flex: 1 1 800px;
}

.stats-outer-block.vertical {
	flex: 1 1 300px;
	flex-direction: column;
}

.stats-outer-block > .head {
	text-align: center;
	font-weight: bold;
	font-size: 1.1em;
}

.stats-outer-block.horizontal > .head {
	flex: 1 1 100%;
}

.stats-outer-block .stats-inner-block {
	font-size: 90%;
}

.stats-outer-block.horizontal .stats-inner-block {
	flex: 1 1 400px;
}

.stats-outer-block.vertical .stats-inner-block {
	flex: 1;
}

.stats-outer-block .stats-inner-block .subtable {
	height: 100%;
}

.stats-outer-block .stats-inner-block .subtable td {
	width: 100%;
}

.stats-outer-block .stats-inner-block .subtable .head {
	height: 0;
}