Template:Category/Workshop organizer roster/styles.css

From Miniscope
Jump to: navigation, search
/* TemplateStyles for [[Template:Category/Workshop organizer roster]].
 *
 * Targets `.wiki-roster` wrapper around SMW's `format=table` output,
 * which renders as `<table class="smwtable smwtable-default">`. The
 * sibling [[Template:Category/Workshop participant roster/styles.css]]
 * carries an identical ruleset; the two files are intentionally
 * duplicated rather than abstracted into a shared UI module because
 * each dispatcher template owns its own styles file by convention
 * (mirrors workshops_library/styles.css, faqs_library/styles.css, etc).
 *
 * Theme via `var(--labki-*, literal)` so a host wiki can retheme by
 * overriding the tokens in MediaWiki:Common.css. Literal fallbacks
 * keep the roster readable on wikis that don't ship the token set.
 *
 * Sanitizer notes: MW's css-sanitizer rejects `var()` in some
 * properties (notably `border-color` on certain elements — see the
 * workshop_itinerary/styles.css note about category color stripes).
 * This file avoids those traps by using compound `border` shorthand
 * with a literal color fallback baked in.
 */

.wiki-roster {
	margin: 16px 0;
	max-width: 100%;
	overflow-x: auto;
}

.wiki-roster .smwtable,
.wiki-roster .smwtable-default {
	border-collapse: collapse;
	border-spacing: 0;
	width: 100%;
	border: 1px solid var(--labki-border, #d8dde3);
	background: var(--labki-bg, #ffffff);
	font-size: 0.95em;
	line-height: 1.5;
}

.wiki-roster .smwtable th {
	text-align: left;
	font-size: 0.78em;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--labki-text-muted, #5a6a7a);
	background: var(--labki-bg-subtle, #f4f6f8);
	border: none;
	border-bottom: 1px solid var(--labki-border, #d8dde3);
	padding: 10px 14px;
	white-space: nowrap;
}

.wiki-roster .smwtable td {
	padding: 11px 14px;
	border: none;
	border-bottom: 1px solid #eef0f3;
	color: var(--labki-text, #1c1c1c);
	vertical-align: top;
}

.wiki-roster .smwtable tbody tr:last-child td {
	border-bottom: none;
}

/* Zebra striping for scan-ability on long rosters. Subtle enough
 * to read as "row separator" rather than "active state". */
.wiki-roster .smwtable tbody tr:nth-child(even) td {
	background: var(--labki-bg-subtle, #fafbfc);
}

/* Row hover — primary affordance that the row's first column is a
 * link to the person's page. Stronger than zebra so it reads as
 * "this is interactive, click me". */
.wiki-roster .smwtable tbody tr:hover td {
	background: var(--labki-bg-hover, #eef3f8);
}

/* First column (the Profile mainlabel — a wikilink to the participant
 * page) gets the bold-name treatment so it pops as the primary scan
 * target. The link color comes from the wiki's default link styling.
 */
.wiki-roster .smwtable td:first-child {
	font-weight: 600;
}

/* Empty-state placeholder rendered by `default=` when the #ask
 * returns zero rows. Distinct dashed-border treatment so it reads
 * as "nothing here yet" rather than as a normal row. */
.wiki-roster-empty {
	padding: 14px 16px;
	color: var(--labki-text-muted, #5a6a7a);
	font-style: italic;
	background: var(--labki-bg-subtle, #f4f6f8);
	border: 1px dashed var(--labki-border, #d8dde3);
}