Page MenuHomePhabricator

Tables: 'mw-datatable' class
Closed, DuplicatePublic

Description

We have 'mw-datatable' class in MediaWiki core which was added on 2011. I think this code needs to be updated: colors, padding, etc.
https://phabricator.wikimedia.org/rMWf98a0ec075294df1bc7c9f70ca6a979137a26687

Something like that:

.mw-datatable {
	margin: 1em 0;
	border: 1px solid #a2a9b1;
	border-collapse: collapse;
	color: #000;
}
	
.mw-datatable > tr > th,
.mw-datatable > tr > td,
.mw-datatable > * > tr > th,
.mw-datatable > * > tr > td {
	border: 1px solid #a2a9b1;
	padding: 0.2em 0.4em;
}
	
.mw-datatable tr:hover td {
	background-color: #eaf3ff;
}

.mw-datatable > tr > th,
.mw-datatable > * > tr > th {
	background-color: #cfe3ff;
	text-align: center;
}
	
.mw-datatable > caption {
	font-weight: bold;
}

Tests


https://ru.wikipedia.org/wiki/User:Iniquity/test2

Event Timeline

Iniquity created this task.Jun 6 2017, 6:48 PM
Restricted Application added a subscriber: Aklapper. · View Herald TranscriptJun 6 2017, 6:48 PM
Iniquity updated the task description. (Show Details)Jun 6 2017, 7:01 PM

As of right now, this seems to be already updated at https://github.com/wikimedia/mediawiki/blob/master/resources/src/mediawiki.legacy/shared.css#L354 (and that diff linked is old), am I missing something here? There's a few color differences from the one you suggested and the current one, so I suggest a screenshot of a datatable before and after + discussion.

resources/src/mediawiki.legacy/shared.css
/**
 * wikitable class for skinning normal tables
 * keep in sync with commonPrint.css
 */
table.wikitable {
	margin: 1em 0;
	background-color: #f8f9fa;
	border: 1px solid #a2a9b1;
	border-collapse: collapse;
	color: #000;
}

table.wikitable > tr > th,
table.wikitable > tr > td,
table.wikitable > * > tr > th,
table.wikitable > * > tr > td {
	border: 1px solid #a2a9b1;
	padding: 0.2em 0.4em;
}

table.wikitable > tr > th,
table.wikitable > * > tr > th {
	background-color: #eaecf0;
	text-align: center;
}

table.wikitable > caption {
	font-weight: bold;
}
Iniquity added a comment.EditedJun 6 2017, 7:40 PM

Oh... Yeap, you are talking about wikitable, I am talking about mw-datatable.

SamanthaNguyen added a comment.EditedJun 6 2017, 7:42 PM

Sorry that's my bad! wrong one. Here's the current version at https://github.com/wikimedia/mediawiki/blob/master/resources/src/mediawiki.legacy/shared.css#L476 below. Again, please make sure you provide screenshots since it's easier to visually understand what the differences are between yours and the current one.

Edit: Looks like you found it before me, heh :P

Iniquity added a comment.EditedJun 6 2017, 7:55 PM

@SamanthaNguyen https://ru.wikipedia.org/wiki/User:Iniquity/test2, I think this page better than screenshots:)

Iniquity updated the task description. (Show Details)Jun 6 2017, 8:00 PM
Iniquity updated the task description. (Show Details)
Iniquity added a comment.EditedJun 7 2017, 12:17 AM

Even so, maybe, this class is used only for support, isnt it? For: wikitable+mw-datatable.

putnik added a subscriber: putnik.Jun 12 2017, 11:39 PM
TheDJ added a subscriber: TheDJ.Jun 16 2017, 12:01 PM