MediaWiki:Vector-darkmode.less/templates.less

// <pre>
/* ========================
           templates
   ======================== */
/* ------------------------
         text colors
   ------------------------ */
.text-color-mixin(@text-color-mixin) {
    color: darken( @text-color-mixin, 10% );
}
.text-red {
    .text-color-mixin(@apricot-peach);
}
.text-orange {
    .text-color-mixin(@corvette);
}
.text-yellow {
    .text-color-mixin(@golden);
}
.text-green {
    .text-color-mixin(@caper);
}
.text-blue {
    .text-color-mixin(@jordy-blue);
}
.text-purple {
    .text-color-mixin(@perfume);
}
.text-pink {
    .text-color-mixin(@cherub);
}
.text-gray,
.text-grey {
	.text-color-mixin(@mystic);
}

/* ------------------------
       [[Template:ToC]]
   ------------------------ */
#toc,
.toc {
	background: @dark-wikitable-background;

    // title bar
    .toctitle {
        background: @dark-wikitable-header;
        border: none;

        h2,
        a {
            color: @white;
        }

    }

    // link colors
    .toclevel-1 a ,
    .toclevel-2 a {
        color: @dark-text;
    }

    // entire group of headings
    > ul {
        border: none;
    }

    // subheadings only
    ul ul {
        border-color: @waikawa-grey;
    }
li {
    	list-style-type: none;
		list-style-image: none;
    }
}

/* ------------------------
             math
   kind of sus but it works
   ------------------------ */

.mwe-math-element {
	-webkit-filter: invert(100%);
	filter: invert(100%);
}

/* ------------------------
            coins
   ------------------------ */

.coins {
    color: @lima;
}

.coins-pos {
    color: @curious-blue;
}

.coins-neg {
    color: @flamingo;
}

// reset text color - unreadable against colored table rows
// from [[MediaWiki:Vector-darkmode.less/wikitables.less]]

[class^="table-bg-"] {

    .coins,
    .coins-pos,
    .coins-neg {
        color: inherit;
    }

}

/* ------------------------
            tiles
   ------------------------ */

.tile,
.tile-bottom,
.tile-halves {
	background: @dark-wikitable-background;
	border: none;
}

.tile.dark {
	color: @dark-text;
	background: @cloud-burst;

	h2,
	h3 {
		color: @dark-text;
	}
	
	a {
		color: @dark-links;
	}

	.byline {
		color: fade( @dark-text, 75% );
	}

}

.tile-top.tile-image {
    background-color: @dark-wikitable-background;
}

.tile-bottom.read-more {
    background: @cloud-burst;

    &:hover {
    	background: desaturate( lighten( @cloud-burst, 2.5% ), 2% );
    }

}

.byline {
	color: fade( @dark-text, 75% );
}

/* ------------------------
            quotes
   ------------------------ */

blockquote {
    color: inherit;

    p:not(.quote-source) {
        border-color: @pickled-bluewood;
    }

}

/* ------------------------
        quest details
   ------------------------ */

.questdetails,
.trainingdetails {
    background-color: @dark-wikitable-background;
    border: none;

    .questdetails-header {
        background-color: @dark-wikitable-header;
    }

}

.questreq ul {
	border-color: @waikawa-grey;
	list-style: none;
}

/* ------------------------
           portals
   ------------------------ */

.portal-link a {
    color: @dark-text;
    background-color: @dark-wikitable-background;

    &:hover {
    	background-color: desaturate( lighten( @dark-wikitable-background, 3%), 3% );
    }

}

/* ------------------------
    shortcut/archive list
   ------------------------ */

.archive,
.shortcut {
    background: @dark-wikitable-background;
    border: none;
}

/* ------------------------
        documentation
   ------------------------ */

.documentation {
    background-color: @dark-wikitable-background;
    border: none;

	pre,
	code {
    	background-color: @cloud-burst;
	}

}

.documentation-header {
	background: @dark-wikitable-header;
}

.documentation-subheader {
    background: darken( @dark-wikitable-header, 2% );
}

/* ------------------------
      Uses material list
   ------------------------ */

.production-selected {
    background-color: @san-felix;
    color: @frost;

	.mw-selflink {
		color: @frost;
	}

}

/* ------------------------
          Yew Grove
   ------------------------ */

.forumheader {
	border-color: @dark-wikitable-header;
    background-color: @dark-wikitable-background;
}

.forumsearchbox {
	color: @dark-text;
    background-color: @dark-wikitable-background;

    .mw-ui-button.mw-ui-progressive:disabled {
        color: @river-bed;
    }

}

.forumlist.archive {
	background: transparent;
	text-align: initial;
}

/* ------------------------
         Update pages
   ------------------------ */

.official {
	background: @pickled-bluewood;
	border: none;
}

/* ------------------------
          succession
   ------------------------ */

.succession {

	th {
		background: @dark-wikitable-header;
	}

	td {
		background: @dark-wikitable-background;
	}

}

/* ------------------------
         family tree
   ------------------------ */

td.famtreeleaf {
    background: @dark-wikitable-background;
}

/* ------------------------
         Chat options
   ------------------------ */

.chat-options .chat-options-underline {
	border-color: @dark-links;
}

/* --------------------------
     Module:ExchangeDefault
   -------------------------- */

.gemw-header {

    .gemw-name a {
        color: @dark-links;
    }

    .gemw-examine,
    .gemw-price::after,
    .gemw-updated,
    .gemw-time {
        color: @dark-text;
    }

}

.gemw-body {

    .gemw-section-left a,
    .gemw-property dt {
        color: @dark-links;
    }

    .gemw-property {
        border-color: @waikawa-grey;
    }

    .gemw-links {
        color: @dark-text;
    }

}

/* ------------------------
          sic/fact
   ------------------------ */

.fact-text {
	color: @curious-blue;
	border-color: @portage;
}

/* ------------------------
      Template:Wikipedia
   ------------------------ */
.wikipedia {
	background: @pickled-bluewood;
	border-color: @cloud-burst;
}

/* --------------------
           poll
   -------------------- */

.ajaxpoll {
    background: @pickled-bluewood;

    .ajaxpoll-answer-vote {
    	background: @cloud-burst;

    	div {
    		background: @waikawa-grey;
    	}

    }

    .ajaxpoll-id-info {
    	color: @pickled-bluewood;
    }

}

.poll-result-outer {
    background: @cloud-burst;
}

.poll-result-inner {
	background: @waikawa-grey;
}

/* ------------------------
     Template:Update list
   ------------------------ */
.update-type {
	a,
	a:visited {
		color: @white;
	}
}

.update-history {
	background: @cloud-burst;
	border-color: @pickled-bluewood;
}

/* ------------------------
     Template:Transcript
   ------------------------ */
/* .ns-116 #mw-content-text,
.transcript {
    > ul,
    > ul ul {
        li:hover {
            background: @waikawa-grey;

            // alternating colours
            li:hover,
            li:hover li:hover li:hover,
            li:hover li:hover li:hover li:hover li:hover,
            li:hover li:hover li:hover li:hover li:hover li:hover li:hover {
                background: @cloud-burst;
            }

            li:hover li:hover,
            li:hover li:hover li:hover li:hover,
            li:hover li:hover li:hover li:hover li:hover li:hover {
                background: @waikawa-grey;
            }

        }
    }
} */

/* ==============================
       [[Template:Actionbar]]
   ============================== */

.ability-rotation {
  background-color: @cloud-burst;
  border-color: @waikawa-grey;
}

/* ==============================
       Revolution Calculator
   ============================== */
   
// revolution calculator
#revocalc-settings {
	
	select {
		background-color: @ooui-input;
		border: 1px solid @ooui-input-border;
		color: @ooui-text;
		border-radius: 2px;
	}
}