MediaWiki:Common.less/wikitables.less

From the RuneScape Wiki, the wiki for all things RuneScape
Jump to: navigation, search
// <pre>
/* ========================
          wikitables
   ======================== */

@wikitable-background: @white;
@wikitable-header-background: @gallery;

table.wikitable {
	color: inherit;
    background: @wikitable-background;
    font-size: .9em;
    box-shadow: @box-shadow;
    border: none;

    // headers
    > * > tr > th {
        background-color: @wikitable-header-background;
        border-color: darken( @wikitable-header-background, 7% );
        line-height: 1.65em;
        padding: .4em;
    }

    // cells
    > * > tr > td {
        border-color: darken( @wikitable-background, 10% );
        padding: .25em .45em;
    }

	// i forget what this is for
    .header-top {
        background: #448fba;
    }

}

/* --------------------------
      column and row stuff
   -------------------------- */

@table-align-list: left right center;

.table-align(@list, @i: 1) when (@i <= length(@list)) {
    @align-dir: extract(@list, @i);

	// nth td from the left is right-aligned - ths are ignored
    [email protected]{align-dir}-1 td:nth-of-type(1),
    table.align-@{align-dir}-2 td:nth-of-type(2),
    table.align-@{align-dir}-3 td:nth-of-type(3),
    table.align-@{align-dir}-4 td:nth-of-type(4),
    table.align-@{align-dir}-5 td:nth-of-type(5),
    table.align-@{align-dir}-6 td:nth-of-type(6),
    table.align-@{align-dir}-7 td:nth-of-type(7),
    table.align-@{align-dir}-8 td:nth-of-type(8),
    table.align-@{align-dir}-9 td:nth-of-type(9),
    table.align-@{align-dir}-10 td:nth-of-type(10),
    table.align-@{align-dir}-11 td:nth-of-type(11),
    table.align-@{align-dir}-12 td:nth-of-type(12),
    table.align-@{align-dir}-13 td:nth-of-type(13) {
        text-align: @align-dir;
    }

    .table-align(@list, @i + 1);
}

.table-align(@table-align-list);

/* alternating colours (similar to spreadsheets) */
table.alternating-rows tr:nth-child(odd),
table.alternating-cols td:nth-child(odd) {
    background: darken( @wikitable-background, 2.5% );
}

/* -----------------------
      table backgrounds
   ----------------------- */

.table-bg-color(@cell-background, @cell-text, @cell-link) {
    background: @cell-background;
    color: @cell-text;

    a:not(.mw-selflink) {
        color: @cell-link;
        text-decoration: underline;
    }

}

.table-bg-red, .table-bg-veryrare {
    .table-bg-color(@apricot-peach, @mocaccino, @old-brick);
}

.table-bg-orange, .table-bg-rare {
    .table-bg-color(@corvette, @antique-bronze, @korma);
}

.table-bg-yellow, .table-bg-uncommon {
    .table-bg-color(@golden, @cinnamon, @olive);
}

.table-bg-green, .table-bg-common {
    .table-bg-color(@caper, @san-felix, @la-palma);
}

.table-bg-blue, .table-bg-always {
    .table-bg-color(@jordy-blue, @regal-blue, @venice-blue);
}

.table-bg-purple {
    .table-bg-color(@perfume, @honey-flower, @seance);
}

.table-bg-pink, .table-bg-random {
    .table-bg-color(@cherub, @cosmic, @cannon-pink);
}

.table-bg-gray, .table-bg-grey, .table-bg-default {
    .table-bg-color(@mystic, @river-bed, @shuttle-gray);
}

/* [[Template:Store locations list]] */
tr.store-hist {
	opacity: 0.6;
	.table-bg-color(@mystic, @river-bed, @shuttle-gray);
}

/* [[Template:NA]] */
.table-na {
    background: @alabaster;
    color: #aaa;
    text-align: center !important; // override align-x class on wikitables
    cursor: default;
    .user-select( none );

    // for [[MediaWiki:Gadget-highlightTable.js]]
    table.lighttable .highlight-over & {
        color: fade( @la-palma, 40% );
        background: darken( @frost, 4% );
    }

    table.lighttable .highlight-on & {
        color: fade( @la-palma, 55% );
        background: darken( @caper, 5% );
    }

}

/* collapsible wikitables */
.mw-collapsible {

    &.mw-collapsed {
        /*min-width: 250px;+*/
    }

    .mw-collapsible-toggle {
        font-weight: normal;
        margin-left: .5em;
    }

}

/* Livestream page */
.livestream-table td > .media-logo {
	filter: grayscale(0.8);
	opacity: 0.5;
}