MediaWiki:Medik.css
From the Audiovisual Identity Database, the motion graphics museum
Note: After publishing, you may have to bypass your browser's cache to see the changes.
- Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
- Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
- Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
- Opera: Press Ctrl-F5.
:root {
--titleglow: var(--primary);
--thbg: var(--medik);
}
/* Top bar font modernization */
#user-tools{
font-family: AVID Sans;
}
.form-control {
font-family:AVID Sans;
}
/*Exempt banner from dark mode*/
.client-dark-mode #mw-navbar {
filter:invert( 1 ) hue-rotate( 180deg );
}
.client-dark-mode #mw-navbar {
filter:invert( 1 ) hue-rotate( 180deg );
}
/*Category links, table and system message box styling (temporary patch pending proper bug fix)*/
#catlinks {
text-align:left
}
.catlinks {
border:1px solid #a2a9b1;
background-color:#f8f9fa;
padding:5px;
margin-top:1em;
clear:both
}
.catlinks ul {
display:inline;
margin:0;
padding:0;
list-style:none
}
.catlinks li {
display:inline-block;
line-height:1.25em;
border-left:1px solid #a2a9b1;
margin:0.125em 0;
padding:0 0.5em
}
.catlinks li:first-child {
padding-left:0.25em;
border-left:0
}
.catlinks li a.mw-redirect {
font-style:italic
}
.mw-hidden-cats-hidden,
.catlinks-allhidden {
display:none
}
.wikitable {
background-color: #f8f9fa;
color: #202122;
margin: 1em 0;
border: 1px solid #a2a9b1;
border-collapse: collapse;
}
.wikitable > tr > th, .wikitable > tr > td, .wikitable > * > tr > th, .wikitable > * > tr > td {
border: 1px solid #a2a9b1;
padding: 0.2em 0.4em;
}
.wikitable > tr > th, .wikitable > * > tr > th {
background-color: #eaecf0;
text-align: center;
}
a.new {
color: #dd3333
}
.mw-message-box-warning {
background-color: #fef6e7;
border-color: #fc3;
}
.mw-message-box {
color: #000;
box-sizing: border-box;
margin-bottom: 16px;
border: 1px solid;
border-top-color: currentcolor;
border-right-color: currentcolor;
border-bottom-color: currentcolor;
border-left-color: currentcolor;
padding: 12px 24px;
word-wrap: break-word;
overflow-wrap: break-word;
overflow: hidden;
}
div.mw-warning-with-logexcerpt, div.mw-lag-warn-high, div.mw-cascadeprotectedwarning, div#mw-protect-cascadeon, div.titleblacklist-warning {
clear: both;
margin: 0.2em 0;
border: 1px solid #bb7070;
background-color: #ffdbdb;
padding: 0.25em 0.9em;
box-sizing: border-box;
}
/*Sidebar styling*/
.nav-link {
color:#fff !important
}
.nav-link:hover {
color:#cccdcf !important
}
#mw-navigation {
background-color: #161f2b;
border:none;
}
.mw-footer {
background-color: #161f2b;
border:none;
color:white
}
#p-navigation-label {
background: #da0c3f;
}
#p-Explore-label {
background: #ffa800;
margin-top: 2em;
}
#p-Explore {
margin-top: 2em;
}
#p-Browse_by\.\.\.-label {
background: #1dc82b;
margin-top: 2em;
}
#p-Browse_by\.\.\. {
margin-top: 2em;
}
#p-Policy_and_Administration-label {
background: #0c62da;
margin-top: 2em;
}
#p-Policy_and_Administration {
margin-top: 2em;
}
#p-More_AVID-label {
background: #801ae5
}
#p-More_AVID {
margin-top: 2em;
}
#p-managewiki-sidebar-header-label {
background: #da0c3f;
margin-top: 2em;
}
#p-managewiki-sidebar-header {
margin-top: 2em;
}
/*Dark Mode optimization*/
.client-darkmode #mw-navigation {filter: invert( 1 ) hue-rotate( 180deg )}
.client-darkmode .mw-footer {filter: invert( 1 ) hue-rotate( 180deg )}
/*fix invisible actions label*/
#p-actions-label {
color: #6c757d !important
}
/*UI refresh by Compooper*/
.sitenotice-new {
background-color: #f8f9fa;
border: 0px solid #ffa800;
border-left: 25px solid #ffa800;
font-weight: normal;
}
.sitenotice-open {
background-color: #f8f9fa;
border: 0px solid #ffa800;
border-left: 25px solid #0c62da;
font-weight: normal;
}
.mw-inputbox-createbox:required:invalid ~ .mw-ui-button {
background-color: #c8ccd1;
color: #ffffff;
border-color: #c8ccd1;
cursor: default;
font-weight: normal;
border-radius: 5px;
}
.mw-ui-button.mw-ui-progressive:not(:disabled) {
background-color: #0c62da;
color: #fff;
border-color: #0c62da;
font-weight: normal;
border-radius: 5px;
}
.user-section-title {
float: left;
font-size: 20px;
letter-spacing: 0px;
padding: 0 10px 0 0;
font-weight: normal;
}
.profile-actions a {
text-decoration: none;
font-weight: normal;
margin: 0 6px;
}
#profile-toggle-button {
background-color: #ffa800;
border-radius: 5px;
top: 5px;
right: 0;
padding: 2px 10px;
position: absolute;
}
#profile-toggle-button a {
color: #fff;
font-weight: normal;
}
.suggestions-result {
color: #000;
margin: 0;
line-height: 1.5em;
padding: 0.01em 0.25em;
text-align: left;
overflow: hidden;
text-overflow: ellipsis;
font-size: 15px;
white-space: nowrap;
}
li.gallerybox div.thumb {
border: 1px solid #e8e8e8;
background-color: #e8e8e8;
border-radius: 10px;
}
.suggestions-results {
background-color: #f8f9fa;
cursor: pointer;
border: 0px solid #a2a9b1;
border-radius: 5px;
padding: 1px;
margin: 0;
font-family: 'AVID Sans';
}
.suggestions-special {
position: relative;
background-color: #f8f9fa;
cursor: pointer;
border: 0px solid #a2a9b1;
border-radius: 5px;
margin: 0;
margin-top: -2px;
display: none;
padding: 0.25em 0.25em;
line-height: 1.25em;
}
.suggestions-special .special-label {
color: #72777d;
font-family: 'AVID SANS';
text-align: left;
font-size: 10px;
}
.suggestions a.mw-searchSuggest-link .special-query {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
font-family: 'AVID SANS';
}
.suggestions-special .special-query {
color: #000;
text-align: left;
font-style: normal;
}
.sitenotice-new {
background-color: #f8f9fa;
border: 0px solid #ffa800;
border-left: 25px solid #ffa800;
font-weight: normal;
}
.sitenotice-open {
background-color: #f8f9fa;
border: 0px solid #ffa800;
border-left: 25px solid #0c62da;
font-weight: normal;
}
body.oo-ui-window-content.oo-ui-dialog-content.oo-ui-processDialog-content.oo-ui-window-content-setup.oo-ui-window-content-ready
a.new {
color: #da0c3f;
}
.discord-banner {
background-image: url(https://i.imgur.com/86lmQaU.png);
background-size: cover;
background-repeat: no-repeat;
float: none;
filter: none;
}
.mw-echo-ui-notificationBadgeButtonPopupWidget-popup > .oo-ui-popupWidget-popup > .oo-ui-popupWidget-head {
box-sizing: border-box;
height: 3.1428571em;
border-bottom: 0px solid #c8ccd1;
margin: 0;
}
.tabber__tab {
display: inline-flex;
align-items: center;
padding: 0.5em 0.75em;
color: #0c62da;
font-weight: normal;
text-decoration: none;
white-space: nowrap;
}
.tabber__tab[aria-selected='true'], .tabber__tab[aria-selected='true']:visited {
color: #0c62da;
}
.oo-ui-dropdownWidget-handle {
min-height: 32px;
border: 0px solid #a2a9b1;
border-radius: 2px;
padding: 5px 2.14285714em 5px 12px;
line-height: 1;
}
.oo-ui-pendingElement-pending {
background-color: #161f2b;
background-image: linear-gradient(135deg,#374562 25%,transparent 25%,transparent 50%,#374562 50%,#374562 75%,transparent 75%,transparent);
background-size: 1.42857143em 1.42857143em;
animation: oo-ui-pendingElement-stripes 650ms linear infinite;
}
.mw-upload-bookletLayout-filePreview p {
line-height: 1em;
margin: -9px;
margin-left: 3px;
}
.oo-ui-progressBarWidget.oo-ui-widget-enabled .oo-ui-progressBarWidget-bar {
background-color: #0c62da;
}
.mw-upload-bookletLayout-filePreview {
width: 503px;
height: 1em;
background-color: #eaecf0;
background-size: cover;
background-position: center center;
padding: 1.42857143em;
margin: -1.42857143em;
margin-bottom: 1.42857143em;
position: relative;
}
.mw-echo-ui-notificationBadgeButtonPopupWidget-popup > .oo-ui-popupWidget-popup > .oo-ui-popupWidget-head > .oo-ui-labelElement-label {
margin: 0 0 0 13.47619050000003em;
font-size: 1.2em;
font-weight: normal;
line-height: 2.5595238em;
text-align: center;
}
.oo-ui-popupWidget {
font-family: AVID Sans;
}
.oo-ui-popupWidget-popup {
background-color: #161f2b;
border: 0px solid #a2a9b1;
border-radius: 10px;
box-shadow: 0 2px 2px 0 rgb(0 0 0 / 25%);
color: white;
}
.oo-ui-floatableElement-floatable, .oo-ui-clippableElement-clippable {
background-color: #fff;
z-index: 2000;
border-radius: 10px;
}
.mw-echo-ui-notificationBadgeButtonPopupWidget-popup > .oo-ui-popupWidget-popup > .oo-ui-popupWidget-head > .oo-ui-iconWidget {
float: right;
height: 100%;
margin: 0 0 0 1.1428571em;
opacity: 0;
}
.oo-ui-pendingElement-pending {
background-color: #161f2b;
background-image: linear-gradient(135deg,#374562 25%,transparent 25%,transparent 50%,#374562 50%,#374562 75%,transparent 75%,transparent);
background-size: 1.42857143em 1.42857143em;
animation: oo-ui-pendingElement-stripes 650ms linear infinite;
}
.oo-ui-processDialog .oo-ui-actionWidget.oo-ui-labelElement > .oo-ui-buttonElement-button {
padding: 8px;
border-radius: 5px;
}
.oo-ui-labelElement .oo-ui-labelElement-label, .oo-ui-labelElement.oo-ui-labelElement-label {
box-sizing: border-box;
font-weight: normal;
}
.oo-ui-processDialog .oo-ui-actionWidget.oo-ui-labelElement:first-child {
margin-left: 8px;
margin-right: 8px;
margin-top: 8px;
margin-right: 8px;
}
.oo-ui-windowManager-modal > .oo-ui-dialog {
background-color: rgb(162 162 162 / 50%);
opacity: 0;
transition: opacity ease-out 250ms;
backdrop-filter: blur(4px);
}
.oo-ui-processDialog .oo-ui-actionWidget.oo-ui-labelElement > .oo-ui-buttonElement-button {
padding: 8px 13px;
}
.oo-ui-processDialog-content .oo-ui-window-head, .oo-ui-processDialog-content .oo-ui-window-foot {
outline: 0px solid #c8ccd1;
}
.oo-ui-windowManager-modal.oo-ui-windowManager-floating > .oo-ui-dialog > .oo-ui-window-frame {
border: solid 0px #ddd;
border-radius: 15px;
box-shadow: 0 0px 0px 0;
}
.oo-ui-window-content.oo-ui-dialog-content.oo-ui-processDialog-content.oo-ui-window-content-setup.oo-ui-window-content-ready {
font-family: AVID Sans;
border: solid 0px #ddd;
border-radius: 15px;
}
.oo-ui-window-head {
border: solid 0px #ddd;
border-radius: 5px;
background-color: #161f2b;
color: white;
}
#p-More_AVID-label {
background: #801ae5;
}
.diff-addedline {
border-color: #0c62da;
}
.oo-ui-messageWidget.oo-ui-flaggedElement-success:not(.oo-ui-messageWidget-block) {
color: #000000;
font-family: AVID Sans;
font-weight: normal;
}
.diff-deletedline {
border-color: #ffa800;
}
.mw-notification {
border: solid 0px #ddd;
border-radius: 5px;
border-left: 17px solid #a9b4bf;
}
.mw-parser-output .documentation-heading {
font-weight: normal;
font-size: 125%;
}
.toc, .toccolours {
border: 0px solid #a2a9b1;
border-radius: 5px;
background-color: #f8f9fa;
padding: 5px;
font-size: 95%;
}
.toc .h2 {
display: inline;
border: 0;
padding: 0;
font-size: 100%;
font-weight: normal;
}
.oo-ui-buttonElement-frameless.oo-ui-labelElement:first-child {
margin-left: -6px;
margin-top: 6px;
}
.mw-rcfilters-ui-filterTagMultiselectWidget.oo-ui-widget-enabled .oo-ui-tagMultiselectWidget-handle {
background-color: #e8e8e8;
border: 0px solid #a2a9b1;
border-bottom: 0;
border-radius: 5px;
padding: 0 0.6em 0.6em 0.6em;
line-height: normal;
}
.mw-rcfilters-ui-filterTagMultiselectWidget-wrapper-content-title {
font-weight: normal;
color: #54595d;
white-space: nowrap;
}
#filetoc {
border: 0px solid #a2a9b1;
border-radius: 5px;
background-color: #f8f9fa;
padding: 5px;
font-size: 95%;
margin-bottom: 0.5em;
margin-left: 0;
margin-right: 0;
text-align: left;
}
.mw-message-box-error {
clear: both;
margin: 0.2em 0;
background-color: #ffffff;
border: 0px solid #da0c3f;
border-left: 10px solid #161f2b;
padding: 0.25em 0.9em;
box-sizing: border-box;
}
#p-navigation-label {
background: #da0c3f;
border-radius: 5px;
font-weight: normal;
}
#mw-navigation a.nav-link.disabled {
color: #444;
margin-top: 1em;
font-weight: normal;
border-radius: 5px;
text-align: center;
}
a:visited {
color: #4840df;
}
.ext-darkmode-link::before {
content: '';
display: hidden;
}
.wikitable > tr > th, .wikitable > tr > td, .wikitable > * > tr > th, .wikitable > * > tr > td {
border: -7.75px solid #a2a9b1;
border-radius: 5px;
padding: 0.2em 0.4em;
}
.wikitable {
font-weight: normal;
background-color: #f8f9fa;
color: #202122;
margin: 1em 0;
border: 0px solid #a2a9b1;
border-radius: 5px;
border-collapse: collapse;
}
.usermessage {
background-color: #ffffff;
border: 0px solid #ffa800;
border-left: 10px solid #ffa800;
border-radius: 5px;
color: #000;
font-weight: normal;
margin: 2em 0 1em;
padding: 0.5em 1em;
vertical-align: middle;
}
.dropdown-menu {
position: absolute;
top: 100%;
z-index: 1000;
display: none;
float: left;
min-width: 10rem;
padding: 0.5rem 0;
margin: 0.125rem 0 0;
font-size: .8rem;
color: #212529;
text-align: left;
list-style: none;
background-color: #f3f3f3;
background-clip: padding-box;
border: 0px solid rgba(0,0,0,.15);
border-radius: .75rem;
}
#content a:not(.new):visited, #siteNotice a:not(.new):visited {
color: #0c62da;
}
a {
color: #0c62da;
text-decoration: none;
background-color: transparent;
}
#pt-uls .uls-trigger:before {
content: '';
background-image: url(/w/extensions/UniversalLanguageSelector/lib/jquery.uls/);
background-position: left 0.08333333em;
background-repeat: no-repeat;
background-size: 1.33333333em 1.33333333em;
padding-top: 0.33333333em;
padding-left: 1.66666667em;
opacity: 0.67;
}
.oo-ui-dropdownWidget.oo-ui-widget-enabled .oo-ui-dropdownWidget-handle:hover {
background-color: #fff;
color: #404244;
border: 0px #a2a9b1;
}
.mw-search-profile-tabs {
background-color: #e8e8e8;
margin-top: 1em;
border: 0px solid #c8ccd1;
border-radius: 8px;
}
.oo-ui-dropdownInputWidget select {
-webkit-appearance: none;
-moz-appearance: none;
background-color: transparent;
background-position: right 12px center;
box-sizing: border-box;
height: 2.28571429em;
border: 0px solid #a2a9b1;
border-radius: 2px;
padding-left: 12px;
padding-right: 2.14285714em;
font-size: inherit;
font-family: inherit;
vertical-align: middle;
}
.oo-ui-panelLayout-framed {
background: #e8e8e8;
border: 0px solid #a2a9b1;
border-radius: 15px;
}
.oo-ui-fieldsetLayout.oo-ui-labelElement > .oo-ui-fieldsetLayout-header > .oo-ui-labelElement-label {
display: inline-block;
margin-bottom: 8px;
font-size: 1.5em;
font-weight: normal;
}
.oo-ui-textInputWidget {
position: relative;
vertical-align: middle;
box-sizing: border-box;
width: 100%;
max-width: 197em;
}
.catlinks {
border: 0px solid #a2a9b1;
border-left: 10px solid #a9b4bf;
border-radius: 5px;
background-color: #f8f9fa;
padding: 5px;
padding-left: 15px;
margin-top: 1em;
clear: both;
}
.oo-ui-buttonElement > .oo-ui-buttonElement-button {
background-color: #f8f9fa;
color: #000000;
display: inline-block;
-moz-box-sizing: border-box;
box-sizing: border-box;
margin: 0;
border: 0px solid #a2a9b1;
border-radius: 5px;
cursor: pointer;
vertical-align: middle;
font-family: inherit;
font-size: .85em;
font-weight: normal;
text-align: center;
}
div.mw-warning-with-logexcerpt, div.mw-lag-warn-high, div.mw-cascadeprotectedwarning, div#mw-protect-cascadeon, div.titleblacklist-warning {
clear: both;
margin: 0.2em 0;
background-color: #f8f9fa;
border: 0px solid #da0c3f;
border-left: 10px solid #da0c3f;
padding: 0.25em 0.9em;
box-sizing: border-box;
}
.oo-ui-messageWidget.oo-ui-messageWidget-block.oo-ui-flaggedElement-warning {
background-color: #f8f9fa;
border: 0px solid #da0c3f;
border-radius: 5px;
border-left: 10px solid #ffa800;
}
.mw-continue-editing {
visibility: hidden
}
.mw-message-box-warning{
background-color: #f8f9fa;
border: 0px solid #ffa800;
border-left: 10px solid #ffa800;
font-weight: normal;
}
.mw-message-box {
color: #000000;
box-sizing: border-box;
margin-bottom: 16px;
padding: 12px 24px;
border-radius: 5px;
word-wrap: break-word;
overflow-wrap: break-word;
overflow: hidden;
}
.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type='checkbox']:checked + span, .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type='checkbox']:indeterminate + span {
background-color: #0c62da;
border-color: #0c62da;
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button {
background-color: #0c62da;
color: #ffffff;
display: inline-block;
-moz-box-sizing: border-box;
box-sizing: border-box;
margin: 0;
border: 0px solid #a2a9b1;
border-radius: 5px;
cursor: pointer;
vertical-align: middle;
font-family: inherit;
font-size: .85em;
font-weight: normal;
text-align: center;
}
.oo-ui-textInputWidget .oo-ui-inputWidget-input {
background-color: #ffffff;
color: #000;
margin: 0;
border: 1px solid #e1e1e1;
border-radius: 2px;
padding: 5px 8px;
font-size: inherit;
font-family: inherit;
line-height: 1.42857143em;
}
.editOptions {
background-color: #e8e8e8;
color: #202122;
border: 0px solid #c8ccd1;
border-radius: 5px;
padding: 1em 1em 1.5em 1em;
margin-bottom: 2em;
}
.mw-ui-button:not(.mw-ui-icon-element) {
padding: 9px 12px;
-webkit-appearance: none;
}
.flex-row .dropdown {
left:0;
}
#mw-editing-your-version {
border: 0px solid #77cc88;
border-radius: 5px;
border-left: 10px solid #1dc82b;
padding: 12px 24px;
background-color: #f8f9fa;
margin-bottom: 5px;
}
.ext-discussiontools-visualenhancements-enabled h2.ext-discussiontools-ui-newTopic-sectionTitle .oo-ui-inputWidget-input {
font-weight: bold;
font-family: avid sans;
}
.infobox .dropdown-item {
padding:0;
}
.mw-parser-output > div > .mainpageframe {
border-radius: 5px;
}
.multicol-float .mainpageframe {
border-radius: 5px;
}
.mw-parser-output div div .mainpageframe {
border-radius: 5px;
}
#pt-notifications-alert .mw-echo-notifications-badge:after, #pt-notifications-notice .mw-echo-notifications-badge:after {
position: absolute;
display: inline-block;
cursor: pointer;
top: 9px;
text-indent: 0;
left: 55%;
font-size: 0.9em;
font-weight: normal;
padding: 0 0.3em;
border: 1px solid #fff;
border-radius: 24px;
background-color: #000000;
content: attr(data-counter-text);
color: #fff;
}
#pending-review {
display: inline-block;
padding: 5px;
margin: 10px;
margin-left: 0;
font-weight: normal;
font-size: 120%;
text-transform: none;
font-family: AVID Sans;
text-align: center;
border: 0px;
}
#profile-top {
background:#F1F3F5;
padding:10px;
border-radius:5px
}
#profile-title {
font-weight:normal
}
#user-page-right {
background:#F1F3F5;
padding:10px;
border-radius:5px
}
#user-page-left {
background:#F1F3F5;
padding:10px;
border-radius:5px
}
.user-board-message-from {
border-radius:5px;
background:#161f2b;
}
.user-board-message-from a {
color:#fff;
}
.user-board-message {
padding:5px;
border:none
}
.mw-htmlform legend {
font-size: 100%;
font-weight: normal;
font-size: large;
font-family: 'AVID SANS';
}
.mw-destfile-warning {
background-color: #f8f9fa;
border: 0px solid #ffa800;
border-left: 10px solid #ffa800;
font-weight: normal;
border-radius: 5px;
}
