Jump to content

MediaWiki:Gadget-calculators.css: Difference between revisions

From 1TC Rules
Calculator styles
 
Omit blank names, Points wording, copy button
Line 47: Line 47:
}
}
.tc-calc-note { font-size: 0.9em; color: var( --color-subtle, #54595d ); margin-top: 0.6em; }
.tc-calc-note { font-size: 0.9em; color: var( --color-subtle, #54595d ); margin-top: 0.6em; }
.tc-calc-postwrap { display: flex; align-items: flex-start; gap: 0.6em; margin-top: 0.8em; }
.tc-calc-postwrap .tc-calc-post { flex: 1; margin-top: 0; }
.tc-calc-copy {
flex: none;
padding: 0.4em 0.9em;
border: 1px solid var( --border-color-base, #a2a9b1 );
background: var( --background-color-interactive-subtle, #f8f9fa );
color: var( --color-base, inherit );
border-radius: 2px;
cursor: pointer;
font-size: 0.9em;
white-space: nowrap;
}
.tc-calc-copy:hover { background: var( --background-color-interactive, #eaecf0 ); }

Revision as of 21:46, 23 September 2026

/* 1TC calculators — theme-aware via Codex tokens, with light-mode fallbacks. */
.tc-calc {
	border: 1px solid var( --border-color-base, #a2a9b1 );
	background: var( --background-color-neutral-subtle, #f8f9fa );
	color: var( --color-base, inherit );
	border-radius: 2px;
	padding: 1em 1.2em;
	margin: 1em 0;
	max-width: 44em;
}
.tc-calc-row { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.5em 1em; margin-bottom: 0.7em; }
.tc-calc label { min-width: 12em; font-weight: bold; }
.tc-calc input[type="number"], .tc-calc select {
	padding: 0.3em 0.5em;
	border: 1px solid var( --border-color-base, #a2a9b1 );
	background: var( --background-color-base, #fff );
	color: var( --color-base, inherit );
	border-radius: 2px;
	width: 9em;
}
.tc-calc .tc-scores input { width: 5em; }
.tc-calc-out {
	border-top: 1px solid var( --border-color-base, #a2a9b1 );
	margin-top: 1em;
	padding-top: 0.9em;
}
.tc-calc-big { font-size: 1.6em; font-weight: bold; line-height: 1.3; }
.tc-calc-steps { font-size: 0.9em; color: var( --color-subtle, #54595d ); margin: 0.5em 0 0; }
.tc-calc-steps li { margin: 0.15em 0; }
.tc-calc-post {
	font-family: monospace, monospace;
	white-space: pre;
	overflow-x: auto;
	border: 1px solid var( --border-color-base, #a2a9b1 );
	background: var( --background-color-base, #fff );
	color: var( --color-base, inherit );
	padding: 0.7em 0.9em;
	margin-top: 0.8em;
	border-radius: 2px;
}
.tc-calc-warn {
	border-left: 3px solid var( --border-color-error, #bf3c2c );
	background: var( --background-color-error-subtle, #fee7e6 );
	color: var( --color-base, inherit );
	padding: 0.5em 0.8em;
	margin-top: 0.8em;
}
.tc-calc-note { font-size: 0.9em; color: var( --color-subtle, #54595d ); margin-top: 0.6em; }
.tc-calc-postwrap { display: flex; align-items: flex-start; gap: 0.6em; margin-top: 0.8em; }
.tc-calc-postwrap .tc-calc-post { flex: 1; margin-top: 0; }
.tc-calc-copy {
	flex: none;
	padding: 0.4em 0.9em;
	border: 1px solid var( --border-color-base, #a2a9b1 );
	background: var( --background-color-interactive-subtle, #f8f9fa );
	color: var( --color-base, inherit );
	border-radius: 2px;
	cursor: pointer;
	font-size: 0.9em;
	white-space: nowrap;
}
.tc-calc-copy:hover { background: var( --background-color-interactive, #eaecf0 ); }