MediaWiki:Vector-darkmode.less/specials.less
Jump to navigation
Jump to search
//
/* ========================
special pages
======================== */
/* ---------------------------
Common
--------------------------- */
// Help icon colour
#mw-indicator-mw-helplink a {
// Set fill='%23cbd9f4', i.e. #cbd9f4, a.k.a. @dark-text
background-image: linear-gradient(transparent,transparent),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='%23cbd9f4' viewBox='0 0 24 24'%3E %3Cpath d='M12.001 2.085c-5.478 0-9.916 4.438-9.916 9.916 0 5.476 4.438 9.914 9.916 9.914 5.476 0 9.914-4.438 9.914-9.914 0-5.478-4.438-9.916-9.914-9.916zm.001 18c-4.465 0-8.084-3.619-8.084-8.083 0-4.465 3.619-8.084 8.084-8.084 4.464 0 8.083 3.619 8.083 8.084 0 4.464-3.619 8.083-8.083 8.083z'/%3E %3Cpath d='M11.766 6.688c-2.5 0-3.219 2.188-3.219 2.188l1.411.854s.298-.791.901-1.229c.516-.375 1.625-.625 2.219.125.701.885-.17 1.587-1.078 2.719-.953 1.186-1 3.655-1 3.655h1.969s.135-2.318 1.041-3.381c.603-.707 1.443-1.338 1.443-2.494s-1.187-2.437-3.687-2.437zM11 16h2v2h-2z'/%3E %3C/svg%3E");
}
/* ---------------------------
Special:CreateAccount
Special:UserLogin
--------------------------- */
#signupstart,
#userloginprompt {
border: none;
background: @pickled-bluewood;
}
#userloginForm {
input {
box-shadow: none;
}
}
.signup-realname-tip {
color: inherit;
opacity: .8;
}
/* ---------------------------
Special:RecentChanges
--------------------------- */
.mw-plusminus-pos {
color: @lima;
}
.mw-plusminus-neg {
color: @flamingo;
}
.mw-plusminus-null {
color: @loblolly;
}
/* ------------------
for new RC
------------------ */
.page-Special_RecentChanges .mw-rcfilters-ui-changesListWrapperWidget {
color: @dark-text;
}
// "Other review tools" box
.client-js .mw-recentchanges-toplinks:not(.mw-recentchanges-toplinks-collapsed) {
border-color: @waikawa-grey;
}
// filter dropdown
.mw-rcfilters-ui-filterMenuHeaderWidget-header {
background-color: @ooui-interface;
border-color: @ooui-interface-border;
}
.mw-rcfilters-ui-menuSelectWidget-body {
background-color: @ooui-normal;
}
// group heading
.mw-rcfilters-ui-filterMenuSectionOptionWidget {
background-color: @big-stone;
&-header-title.oo-ui-labelElement-label {
color: @ooui-text;
}
}
// individual option
.mw-rcfilters-ui-itemMenuOptionWidget {
background-color: @ooui-normal;
&:hover {
background-color: @ooui-normal--hover;
}
}
.mw-rcfilters-ui-itemMenuOptionWidget-label-desc {
color: fade( @ooui-text, 75% );
}
.mw-rcfilters-ui-itemMenuOptionWidget:not(:last-child) {
border-color: @ooui-normal-border;
}
// muted option
.mw-rcfilters-ui-filterMenuOptionWidget.oo-ui-flaggedElement-muted:not(.oo-ui-optionWidget-selected) {
background-color: darken( @ooui-normal, 4% );
}
.mw-rcfilters-ui-filterMenuOptionWidget.oo-ui-flaggedElement-muted .mw-rcfilters-ui-itemMenuOptionWidget-label-title,
.mw-rcfilters-ui-filterMenuOptionWidget.oo-ui-flaggedElement-muted .mw-rcfilters-ui-itemMenuOptionWidget-label-desc {
color: fade( @ooui-text, 40% );
}
// "Advanced filters" text
.mw-rcfilters-ui-viewSwitchWidget label.oo-ui-labelWidget {
color: @ooui-text;
}
// "Tell us what you think" footer
.mw-rcfilters-ui-menuSelectWidget-footer {
background-color: @ooui-interface;
border-color: @ooui-interface-border;
}
// namespaces/tags button
.mw-rcfilters-ui-filterTagMultiselectWidget-views-select-widget.oo-ui-widget {
background-color: @ooui-normal;
border-color: @ooui-normal-border;
}
// new changes separator
.mw-rcfilters-ui-changesListWrapperWidget-previousChangesIndicator {
border-color: @waikawa-grey;
}
// no. of results/time period popup
.mw-rcfilters-ui-datePopupWidget {
border-color: @ooui-interface-border;
.mw-rcfilters-ui-valuePickerWidget-title {
color: @ooui-text;
}
}
/* ---------------------------
Special:Editcount
--------------------------- */
#editcount {
input[type="text"] {
background-color: @ooui-input;
border: 1px solid @ooui-input-border;
color: @ooui-text;
padding: 2px 1px;
border-radius: 2px;
}
table[border="1"] {
background: @dark-wikitable-background !important;
border-color: @dark-wikitable-border !important;
th {
background: @dark-wikitable-header;
border: 1px solid @dark-wikitable-border;
}
td {
border: 1px solid @dark-wikitable-border;
}
tr:nth-child(odd) {
background-color: darken( @dark-wikitable-background, 2.5% );
}
}
}
/* ---------------------------
Special:Contributions
--------------------------- */
input {
&#LQT-BlockTime,
&#LQT-DeleteReason,
&.mw-ui-input-inline {
background-color: @ooui-input;
border: 1px solid @ooui-input-border;
color: @ooui-text;
padding: 2px 1px;
border-radius: 2px;
}
}
select {
&#namespace {
background-color: @ooui-input;
border: 1px solid @ooui-input-border;
color: @ooui-text;
border-radius: 2px;
}
}
.mw-widget-calendarWidget-day-today { // day today
background-color: @ooui-normal;
color: @dark-text;
box-shadow: none;
border-color: @ooui-normal-border;
}
/* ---------------------------
Special:Search
--------------------------- */
.mw-search-profile-tabs {
background-color: @pickled-bluewood;
border-color: @big-stone;
}
.search-types .current a {
color: @dark-text;
}
#mw-searchoptions {
background-color: @pickled-bluewood;
border-color: @big-stone;
.divider {
border-color: @big-stone;
}
}
.mw-datatable {
&,
td,
th {
border-color: @dark-wikitable-border;
}
th {
background-color: @dark-wikitable-header;
}
td,
tr:hover td {
background-color: @dark-wikitable-background;
}
}
/* ---------------------------
Special:AbuseLog
--------------------------- */
table.mw-abuselog-details {
background: @dark-wikitable-background;
border-color: @dark-wikitable-border;
th {
background: @dark-wikitable-header;
}
th,
td {
border-color: @dark-wikitable-border;
}
}
.mw-abusefilter-history-changed {
background: @old-brick; // example: [[Special:AbuseFilter/history/60]]
}
/* ---------------------------
Special:BatchUpload
--------------------------- */
ul.fileupload-results li.ful-success {
background: @san-felix;
a {
color: @caper;
}
}
/* ---------------------------
Special:Browse
--------------------------- */
.smwb-title {
background-color: @dark-wikitable-header;
border: none;
}
.smwb-propvalue {
background-color: @dark-wikitable-background;
}
.smwb-propvalue .smwb-prophead,
.smwb-ipropvalue .smwb-prophead {
background-color: @dark-wikitable-header;
border-color: @dark-wikitable-border;
}
.smwb-propvalue .smwb-propval,
.smwb-ipropvalue .smwb-propval {
background-color: @dark-wikitable-background;
border-color: @dark-wikitable-border;
}
.smwb-center {
background-color: @dark-wikitable-header;
border-color: @dark-wikitable-border;
}
/* ---------------------------
Special:Preferences
--------------------------- */
.client-js {
#preferences {
background: @dark-wikitable-background;
border-color: @dark-wikitable-background;
fieldset {
border-color: @portage;
}
legend,
.signup-realname-tip,
.htmlform-tip {
color: @dark-text;
}
}
// tabs
#preftoc {
background: none;
border: none;
a,
a:active {
color: @dark-links;
}
li {
background: none;
border: none;
padding-bottom: .25em;
&.selected a {
background: @dark-wikitable-background;
color: @dark-text;
}
}
}
}
/* ---------------------------
Special:Ask
--------------------------- */
.smw-ask-otheroptions > tbody > tr {
background: @dark-wikitable-background !important;
&:nth-child(even) {
background: @cloud-burst !important;
}
}
/* ---------------------------
Special:AllMessages
--------------------------- */
// Colored divs
#mw-allmessagestable {
.allmessages-customised {
.am_default {
background-color: @olive;
color: @alabaster;
}
.am_actual {
background-color: @la-palma;
color: @alabaster;
}
&:hover {
.am_default {
background-color: lighten( @olive, 4%)
}
+ .allmessages-customised .am_actual {
background-color: lighten( @la-palma, 4%)
}
}
}
}
/* ---------------------------
Special:Interwiki
--------------------------- */
table.mw-interwikitable.body td.mw-interwikitable-local-yes {
background-color: @la-palma;
}
/* ---------------------------
Special:NewFiles
--------------------------- */
// input
.mw-widgets-datetime-dateTimeInputWidget-handle {
background-color: @ooui-input;
border-color: @ooui-input-border;
color: @dark-text;
}
// date input hover
.mw-widgets-datetime-dateTimeInputWidget.oo-ui-widget-enabled .mw-widgets-datetime-dateTimeInputWidget-editField:hover {
background-color: lighten( @ooui-input, 4% );
}
// calendar
.mw-widgets-datetime-calendarWidget- {
&dependent { // calendar bg
background-color: @ooui-input;
border: 1px solid @ooui-input-border !important; // to avoid the white top border left-over
}
}
// day today
.mw-widgets-datetime-calendarWidget-grid .mw-widgets-datetime-calendarWidget-cell.mw-widgets-datetime-calendarWidget-selected .oo-ui-buttonElement-button {
background-color: lighten( @ooui-input, 4% );
&:hover {
background-color: @ooui-input-border--hover;
border: lighten( @ooui-input-border--hover, 4% );
}
.oo-ui-labelElement-label {
color: @dark-text;
}
}
/* ---------------------------
Special:Notifications
--------------------------- */
// popup header
.mw-echo-ui-notificationBadgeButtonPopupWidget-popup > .oo-ui-popupWidget-popup > .oo-ui-popupWidget-head {
border-color: @ooui-interface-border;
}
// bell icon
.mw-echo-ui-overlay .oo-ui-popupWidget-head .oo-ui-iconElement-icon {
filter: invert(1);
}
// individual notification entry
.mw-echo-ui-notificationItemWidget {
background-color: desaturate( lighten( @ooui-interface, 4% ), 2% );
border-color: @ooui-interface-border;
&:hover {
background: desaturate( lighten( @ooui-interface, 6% ), 4% );
}
}
// edit summary
.mw-echo-ui-notificationItemWidget-content-message-body {
color: @ooui-text;
}
// icon on left
.mw-echo-ui-notificationItemWidget-icon {
filter: brightness(150%);
}
// entry's main "headline"
.mw-echo-ui-notificationItemWidget-content-message-header {
color: @ooui-text;
}
.mw-echo-ui-menuItemWidget {
// entry username/View changes text
> .oo-ui-labelElement-label {
color: fade( @ooui-text, 85% );
}
// icon on left
> .oo-ui-iconElement-icon {
filter: invert(1);
}
}
// cross-wiki notifications
.mw-echo-ui-crossWikiNotificationItemWidget-separator,
.mw-echo-ui-bundleNotificationItemWidget-separator {
border-color: @ooui-interface-border;
}
.mw-echo-ui-crossWikiNotificationItemWidget-group,
.mw-echo-ui-bundleNotificationItemWidget-group {
background-color: desaturate( lighten( @ooui-interface, 4% ), 2% );
}
// unread entry
.mw-echo-ui-notificationItemWidget-unread {
background-color: desaturate( lighten( @ooui-interface, 12% ), 10% );
}
// fix background for unseen _and_ unread entry
@keyframes unseen-fadeout-to-unread {
// background-color on .mw-echo-ui-notificationItemWidget:hover
from {
background-color: desaturate( lighten( @ooui-interface, 6% ), 4% );
}
// background-color on .mw-echo-ui-notificationItemWidget-unread
to {
background-color: desaturate( lighten( @ooui-interface, 12% ), 10% );
}
}
@keyframes unseen-fadeout-to-read {
// background-color on .mw-echo-ui-notificationItemWidget:hover
from {
background-color: desaturate( lighten( @ooui-interface, 6% ), 4% );
}
// background-color on .mw-echo-ui-notificationItemWidget
to {
background-color: desaturate( lighten( @ooui-interface, 4% ), 2% );
}
}
// footer
.oo-ui-popupWidget-footer {
.mw-echo-ui-notificationBadgeButtonPopupWidget-popup > .oo-ui-popupWidget-popup > & {
border-color: @ooui-normal-border;
}
.oo-ui-buttonElement .oo-ui-buttonElement-button {
background-color: @ooui-normal;
}
.oo-ui-iconElement-icon {
filter: invert(1);
}
.mw-echo-ui-notificationBadgeButtonPopupWidget-popup > .oo-ui-popupWidget-popup > & .mw-echo-ui-notificationBadgeButtonPopupWidget-footer-buttons .oo-ui-buttonElement:last-child {
border-color: @ooui-normal-border;
}
}
/* --------------------------
Notifications page
-------------------------- */
// all/read/unread and settings toolbar
.mw-echo-ui-notificationsInboxWidget-toolbarWrapper {
background: transparent;
box-shadow: none;
}
// list of notifications
.mw-echo-ui-notificationItemWidget:last-child {
border-color: @ooui-interface-border;
}
// Recent activity box
.mw-echo-ui-crossWikiUnreadFilterWidget {
border-color: @ooui-interface-border;
}
// wiki name
.mw-echo-ui-pageNotificationsOptionWidget.oo-ui-optionWidget-selected {
background-color: @ooui-progressive;
}
.oo-ui-optionWidget-selected .mw-echo-ui-pageNotificationsOptionWidget-label-count {
color: @ooui-text;
}
.mw-echo-ui-pageNotificationsOptionWidget-icon .oo-ui-iconElement-icon {
filter: invert(1);
}
// number of notifs
.mw-echo-ui-pageNotificationsOptionWidget-label-count {
background-color: @ooui-interface;
}
// hovering over username
.mw-echo-ui-pageNotificationsOptionWidget.oo-ui-optionWidget-highlighted {
background-color: @ooui-interface;
}
// secondary dates next to "Today", "Yesterday", etc.
.mw-body-content .mw-echo-ui-datedSubGroupListWidget-title-secondary {
color: fade( @ooui-text, 85% );
}
// preferences menu
.mw-echo-ui-specialHelpMenuWidget {
.oo-ui-iconElement-icon,
.oo-ui-indicator-down {
filter: invert(1);
}
}
.mw-echo-ui-specialHelpMenuWidget-menu {
.oo-ui-buttonWidget:hover {
background-color: @ooui-normal--hover;
}
.oo-ui-iconElement-icon {
filter: invert(1);
}
}
//
