Tags: Mobile edit Mobile web edit |
|
| (5 intermediate revisions by the same user not shown) |
| Line 1: |
Line 1: |
|
| |
|
| :root {
| | .mw-logo-wordmark { |
| --search-box: #525252;
| | display: none !important; |
| --searchbutton-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Cg fill='%23FFF'%3E%3Cpath d='M12.2 13.6a7 7 0 1 1 1.4-1.4l5.4 5.4-1.4 1.4-5.4-5.4zM3 8a5 5 0 1 0 10 0A5 5 0 1 0 3 8z'/%3E%3C/g%3E%3C/svg%3E");
| |
| --external-icon: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 10 10'%3E%3Cg fill='%23906039'%3E%3Cpath d='M8.9 8.9H1.1V1.1h2.8V0H1.1C.5 0 0 .5 0 1.1v7.8C0 9.5.5 10 1.1 10h7.8c.6 0 1.1-.5 1.1-1.1V6.1H8.9v2.8z'/%3E%3Cpath d='M10 0H5.6l1.8 1.8L4.2 5l.8.8 3.2-3.2L10 4.4V0z'/%3E%3C/g%3E%3C/svg%3E");
| |
|
| |
| /* [[Special:MobileDiff]] */
| |
| --diff-deletedline-background: #6b6b6b;
| |
|
| |
| /* Navboxes */
| |
| --mobile-navbox-wide-bg-color: #242424;
| |
| --mobile-navbox-linear-gradient: linear-gradient(to right, rgba(255, 255, 255, 0), var(--body-main) 95%, var(--body-main));
| |
|
| |
| --color-visited: var(--link-color);
| |
| --background-color-interactive: var(--background-color-backdrop-dark);
| |
| --background-color-progressive: var(--ooui-progressive);
| |
| | |
| }
| |
| | |
| body {
| |
| font-family: system-ui, -apple-system, Roboto, Helvetica, sans-serif; | |
| } | | } |
|
| |
|
| @media all and (max-width: 320px) {
| | .mw-anon-user #vector-page-tools-dropdown, |
| body {
| | .mw-anon-user #p-tb, |
| font-size: 0.9em;
| | .mw-anon-user .vector-column-end { |
| } | | display: none !important; |
| } | | } |
|
| |
|
| .content { | | .mw-page-container, |
| line-height: 1.7; | | .mw-content-container, |
| | .vector-sticky-header { |
| | max-width: none !important; |
| } | | } |
|
| |
|
| .pre-content h1, | | .mw-logo-icon { |
| .content h1,
| | width: 160px !important; |
| .content h2 {
| | height: 160px !important; |
| font-weight: bold; | |
| } | | } |
|
| |
|
| | /* Full-width banner at the absolute top, behind everything */ |
| body { | | body { |
| background: url('filepath://Wiki_background_bottom.png');
| | background-image: url('https://wiki.thehumanserver.org/images/9/9e/Wiki_background_top.png'); |
| background-size: 50px;
| | background-repeat: no-repeat; |
| color: var(--text-color);
| | background-position: center top; |
| }
| | background-size: 100% auto; /* Forces image to fit screen width */ |
| | | background-attachment: scroll; /* Use 'fixed' if you want it to stay when scrolling */ |
| select {
| |
| color: var(--text-color);
| |
| background: var(--body-light); | |
| border: 1px solid var(--body-border);
| |
| }
| |
| | |
| /* Self link */
| |
| a:not( [ href ] ) {
| |
| color: inherit;
| |
| }
| |
| | |
| a:where(:not([role='button'])),
| |
| a:where(:not([role='button'])):hover {
| |
| color: var(--link-color);
| |
| }
| |
| | |
| a.external,
| |
| .mw-parser-output a.external {
| |
| background-image: var(--external-icon);
| |
| }
| |
| | |
| legend {
| |
| color: inherit;
| |
| }
| |
| | |
| .pre-content h1 {
| |
| text-align: center;
| |
| }
| |
| | |
| .content .mw-parser-output > h2,
| |
| .content .section-heading {
| |
| border-color: var(--sidebar);
| |
| }
| |
| | |
| .content .mw-parser-output > h2,
| |
| .content .section-heading {
| |
| border-color: var(--sidebar);
| |
| }
| |
| | |
| .content .plainlist ol,
| |
| .content .plainlist ul {
| |
| padding: 0;
| |
| }
| |
| | |
| .content p {
| |
| margin: 0.5em 0;
| |
| padding-bottom: 0;
| |
| }
| |
| | |
| .content hr {
| |
| background: none;
| |
| border-color: var(--sidebar);
| |
| border-style: solid;
| |
| border-width: 1px 0 0 0;
| |
| height: initial;
| |
| }
| |
| | |
| .content kbd,
| |
| .content samp {
| |
| border: none;
| |
| }
| |
| | |
| .content code,
| |
| .content pre {
| |
| background-color: var(--mw-code-background-color);
| |
| border: 1px solid var(--body-border);
| |
| }
| |
| | |
| /* ================================
| |
| changes to the mobile skin
| |
| ================================ */
| |
| /* Body element is already colored */ | |
| #mw-mf-page-center {
| |
| background-color: transparent;
| |
| }
| |
| | |
| .mw-collapsible-toggle-default .mw-collapsible-text, | |
| .mw-collapsible-toggle-default .mw-collapsible-text:hover {
| |
| color: var(--link-color);
| |
| }
| |
| | |
| /* ----------------------- | |
| header/search bar
| |
| ----------------------- */
| |
| .header {
| |
| border-top: none;
| |
| }
| |
| | |
| .header-container.header-chrome {
| |
| background: url('filepath://Wiki_background_top.png') no-repeat;
| |
| background-color: var(--body-background-color); | |
| background-size: cover; | |
| box-shadow: inset 0 -1px 3px rgba(0, 0, 0, 0.1); | |
| }
| |
| | |
| .header-container .notification-count {
| |
| border-radius: 50%;
| |
| }
| |
| | |
| .header-container .notification-count.notification-unseen {
| |
| background: none;
| |
| }
| |
| | |
| .heading-holder .minerva__tab .minerva__tab-text {
| |
| color: var(--text-color);
| |
| }
| |
| | |
| .heading-holder .minerva__tab.selected .minerva__tab-text {
| |
| color: var(--heading-color);
| |
| }
| |
| | |
| /* Make logo not semi transparent */ | |
| .header-container .branding-box {
| |
| opacity: 1;
| |
| }
| |
| | |
| .search-box {
| |
| text-align: right;
| |
| }
| |
| | |
| .search-box .search {
| |
| background-color: var(--search-box);
| |
| border-color: var(--search-box);
| |
| box-shadow: 0 0.25rem 0.35rem -0.25rem rgba(0, 0, 0, 0.1);
| |
| }
| |
| | |
| .search-box .search::placeholder {
| |
| color: var(--byline-color);
| |
| }
| |
| | |
| .client-nojs .search-box .search:focus,
| |
| .search-overlay .search-box .search:focus {
| |
| border-color: var(--link-color);
| |
| box-shadow: inset 0 0 0 1px var(--link-color), 0 1px 1px rgba(0, 0, 0, 0.05);
| |
| }
| |
| | |
| /* magnifying glass icon; cant invert as the class is used in the same element as .search-box */
| |
| .mw-ui-background-icon-search,
| |
| .minerva-icon--search-base20,
| |
| .minerva-icon--search {
| |
| background-image: var(--searchbutton-icon);
| |
| }
| |
| | |
| /* -------------
| |
| overlay
| |
| ------------- */
| |
| .overlay {
| |
| background: var(--body-main); | |
| }
| |
| | |
| .overlay textarea {
| |
| color: var(--text-color);
| |
| }
| |
| | |
| .overlay.search-overlay {
| |
| background: var(--body-main);
| |
| }
| |
| | |
| /* Result boxes */ | |
| .overlay.search-overlay .results,
| |
| .overlay.search-overlay .search-feedback {
| |
| background-color: var(--body-light);
| |
| }
| |
| | |
| /* "Search within pages" */
| |
| .overlay.search-overlay .search-content {
| |
| border-color: var(--body-mid);
| |
| }
| |
| | |
| /* Inside talk pages and editor */
| |
| .overlay .license {
| |
| color: var(--base-text-color);
| |
| }
| |
| | |
| /* Border seperating summary section and preview */
| |
| .overlay .panel {
| |
| border-color: var(--sidebar);
| |
| }
| |
| | |
| /* Category menu */
| |
| .overlay .content-header {
| |
| background-color: var(--body-light);
| |
| border-color: transparent;
| |
| }
| |
| | |
| .overlay.overlay-loading {
| |
| background: var(--ooui-window-background);
| |
| }
| |
| | |
| .overlay .overlay-content {
| |
| background: var(--body-main);
| |
| width: 100%;
| |
| }
| |
| | |
| /* Search results text */
| |
| .page-summary h2,
| |
| .page-summary h3 {
| |
| color: var(--text-color);
| |
| }
| |
| | |
| /* Search results border */
| |
| .page-list li,
| |
| .topic-title-list li,
| |
| .site-link-list li {
| |
| border-color: var(--body-mid);
| |
| }
| |
| | |
| /* Background color wouldnt be affected when scrolling down certain overlays
| |
| the :not is there so source edit doesnt get messed up */
| |
| .overlay-enabled .overlay:not(.editor-overlay),
| |
| .overlay-enabled #mw-mf-page-center {
| |
| overflow-y: scroll;
| |
| }
| |
| | |
| .overlay-header-container,
| |
| .overlay-footer-container {
| |
| background-color: var(--body-background-color);
| |
| border-color: transparent;
| |
| }
| |
| | |
| /* Editor stuff */
| |
| .editor-overlay .wikitext-editor {
| |
| color: var(--text-color);
| |
| }
| |
| | |
| .editor-overlay .overlay-header {
| |
| outline-color: transparent;
| |
| }
| |
| | |
| .editor-overlay .summary-request {
| |
| color: var(--text-color);
| |
| }
| |
| | |
| .editor-overlay .editor-switcher {
| |
| border: none;
| |
| }
| |
| | |
| .action-submit .mw-editnotice .action-edit .mw-editnotice,
| |
| .action-submit .mw-editTools,
| |
| .action-edit .mw-editTools,
| |
| .action-submit .preview-limit-report-wrapper,
| |
| .action-edit .preview-limit-report-wrapper,
| |
| .action-submit .diff-otitle,
| |
| .action-edit .diff-otitle,
| |
| .action-submit .diff-ntitle,
| |
| .action-edit .diff-ntitle,
| |
| .action-submit #section_0,
| |
| .action-edit #section_0,
| |
| .action-submit #editpage-copywarn,
| |
| .action-edit #editpage-copywarn,
| |
| .action-submit #mw-anon-edit-warning,
| |
| .action-edit #mw-anon-edit-warning {
| |
| color: var(--byline-color);
| |
| }
| |
| | |
| .wikitext-editor {
| |
| background-color: var(--body-main);
| |
| }
| |
| | |
| .ve-mobile-fakeToolbar {
| |
| border: none;
| |
| }
| |
| | |
| .ve-mobile-fakeToolbar-container {
| |
| background: var(--body-background-color);
| |
| border: none;
| |
| }
| |
| | |
| .ve-mobile-fakeToolbar .mw-ui-icon-mf-spinner {
| |
| border-color: transparent;
| |
| }
| |
| | |
| .ve-ui-targetToolbar-mobile .oo-ui-toolbar-tools > .ve-ui-toolbar-group-back {
| |
| border-color: transparent;
| |
| }
| |
| | |
| .ve-ui-mobileContext {
| |
| background-color: var(--body-light);
| |
| border-color: var(--body-light);
| |
| }
| |
| | |
| .ve-ui-mobileContext .ve-ui-linearContextItem-body-action-wrapper {
| |
| border-color: var(--body-border);
| |
| }
| |
| | |
| .ve-ui-linearContextItem-foot:not(:empty) {
| |
| border-color: var(--body-border);
| |
| }
| |
| | |
| .ve-ui-mwSaveDialog-options {
| |
| backgroubd-color: var(--body-light);
| |
| border-color: var(--body-mid);
| |
| }
| |
| | |
| /* -------------
| |
| page tabs and nav
| |
| ------------- */
| |
| .page-actions-menu {
| |
| border-color: var(--sidebar);
| |
| }
| |
| | |
| /* Hide language selector */
| |
| /*#language-selector {*/
| |
| /* display: none;*/
| |
| /*}*/
| |
| | |
| /* Page tabs */
| |
| .minerva__tab-container .minerva__tab {
| |
| color: var(--text-color);
| |
| }
| |
| | |
| .minerva__tab-container .minerva__tab.new,
| |
| .minerva__tab-container .minerva__tab.new:visited,
| |
| .minerva__tab-container .minerva__tab.new:hover,
| |
| .minerva__tab-container .minerva__tab.new:active {
| |
| color: var(--redlink-color);
| |
| }
| |
| | |
| .minerva__tab-container .minerva__tab.selected {
| |
| border-color: var(--heading-color);
| |
| color: var(--heading-color);
| |
| }
| |
| | |
| /* "Joined n time ago" on userpages */
| |
| .heading-holder .tagline {
| |
| color: var(--base-heading-color);
| |
| } | | } |
|
| |
|
| /* ------------- | | /* Vector-2022 Specific: Make the skin's main containers transparent to reveal the banner */ |
| footer
| | .mw-page-container, |
| ------------- */
| | .mw-header, |
| .minerva-footer { | | .vector-sticky-header { |
| border-color: transparent; | | background-color: transparent !important; |
| background: #000;
| |
| } | | } |
|
| |
|
| .mw-footer > .post-content { | | /* Optional: Add space at the top so the banner isn't covered by the logo/search bar */ |
| margin-top: 32px; | | .mw-header { |
| | margin-top: 20px; /* Adjust this value to the height of your banner */ |
| } | | } |
| | | #content { |
| .mw-footer > .post-content > .minerva-footer-logo {
| | background-color: #2f2f2f; /* Makes content semi-transparent */ |
| display: none; | |
| } | | } |
| | | /* Make the top-right personal tools larger and stick to the corner */ |
| .mw-footer .hlist li:after { | | .vector-user-links { |
| color: var(--background-text-color); | | position: fixed; |
| | top: 10px; |
| | right: 20px; |
| | z-index: 1000; |
| | transform: scale(1.2); |
| | transform-origin: top right; |
| | background: rgba(0, 0, 0, 0.5); |
| | padding: 5px 10px; |
| | border-radius: 8px; |
| } | | } |
|
| |
|
| /* Bar at the bottom of the page linking to page history */ | | /* Adjust icons specifically if they look blurry after scaling */ |
| .last-modified-bar { | | .vector-user-links .vector-icon { |
| border-top: 1px solid; | | width: 24px; /* Increase base icon size */ |
| border-color: transparent; | | height: 24px; |
| background: none;
| |
| color: var(--text-color);
| |
| } | | } |
| | | /* Change all links to silver */ |
| .last-modified-bar a,
| | a { |
| .last-modified-bar a:active,
| | color: #d1d1d1 !important; /* You can also use the hex code #C0C0C0 */ |
| .last-modified-bar a:visited,
| |
| .last-modified-bar .last-modified-text-accent {
| |
| color: var(--background-text-color);
| |
| }
| |
| | |
| .last-modified-bar.active,
| |
| .last-modified-bar.active:active,
| |
| .last-modified-bar.active:visited,
| |
| .last-modified-bar.active .last-modified-text-accent {
| |
| color: #fff;
| |
| }
| |
| | |
| a.last-modified-bar.active {
| |
| border: none;
| |
| }
| |
| | |
| .toggle-list__list--drop-down {
| |
| background-color: var(--wikitable-bg);
| |
| }
| |
| | |
| .toggle-list__list--drop-down .toggle-list-item:hover {
| |
| background: var(--wikitable-bg-lighter);
| |
| }
| |
| | |
| .toggle-list-item__label {
| |
| color: var(--base-text-color);
| |
| }
| |
| | |
| button .minerva-icon--search-base20,
| |
| button .minerva-icon--search {
| |
| background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Ctitle%3Esearch%3C/title%3E%3Cg fill='white'%3E%3Cpath fill-rule='evenodd' d='M12.2 13.6a7 7 0 111.4-1.4l5.4 5.4-1.4 1.4-5.4-5.4zM13 8A5 5 0 113 8a5 5 0 0110 0z'/%3E%3C/g%3E%3C/svg%3E%0A");
| |
| }
| |
| | |
| .minerva-icon--menu-base20,
| |
| .minerva-icon--menu {
| |
| background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Ctitle%3Emenu%3C/title%3E%3Cg fill='white'%3E%3Cpath d='M1 3v2h18V3zm0 8h18V9H1zm0 6h18v-2H1z'/%3E%3C/g%3E%3C/svg%3E%0A");
| |
| }
| |
| | |
| .minerva-icon--bellOutline-base20 {
| |
| background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Ctitle%3Ebell%3C/title%3E%3Cg fill='white'%3E%3Cpath d='M11.5 2.19C14.09 2.86 16 5.2 16 8v6l2 2v1H2v-1l2-2V8c0-2.8 1.91-5.14 4.5-5.81V1.5C8.5.67 9.17 0 10 0s1.5.67 1.5 1.5v.69zM10 4C7.79 4 6 5.79 6 8v7h8V8c0-2.21-1.79-4-4-4zM8 18h4c0 1.1-.9 2-2 2s-2-.9-2-2z'/%3E%3C/g%3E%3C/svg%3E%0A");
| |
| }
| |
| | |
| .minerva-icon--userAvatarOutline {
| |
| background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Ctitle%3Euser avatar%3C/title%3E%3Cg fill='white'%3E%3Cpath d='M10 8c1.7 0 3.06-1.35 3.06-3S11.7 2 10 2 6.94 3.35 6.94 5 8.3 8 10 8zm0 2c-2.8 0-5.06-2.24-5.06-5S7.2 0 10 0s5.06 2.24 5.06 5-2.26 5-5.06 5zm-7 8h14v-1.33c0-1.75-2.31-3.56-7-3.56s-7 1.81-7 3.56V18zm7-6.89c6.66 0 9 3.33 9 5.56V20H1v-3.33c0-2.23 2.34-5.56 9-5.56z'/%3E%3C/g%3E%3C/svg%3E%0A");
| |
| }
| |
| | |
| /* Text inside navbar */
| |
| .page-actions-menu__list-item .cdx-button {
| |
| color: var(--base-text-color) !important; /* Base theme has !important here so we need it as well */
| |
| }
| |
| | |
| /* Close button inside search bar */
| |
| .mw-ui-icon-mf-close-base20 {
| |
| background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Ctitle%3Eclose%3C/title%3E%3Cg fill='%23fff'%3E%3Cpath d='m4.3 2.9 12.8 12.8-1.4 1.4L2.9 4.3z'/%3E%3Cpath d='M17.1 4.3 4.3 17.1l-1.4-1.4L15.7 2.9z'/%3E%3C/g%3E%3C/svg%3E");
| |
| }
| |
| | |
| /* -------------
| |
| Sidebar menus
| |
| ------------- */
| |
| #mw-mf-page-left {
| |
| background-color: #000000;
| |
| }
| |
| | |
| #mw-mf-page-left .secondary-action {
| |
| border-left-color: var(--body-mid);
| |
| }
| |
| | |
| #mw-mf-page-left ul .toggle-list-item {
| |
| background-color: var(--body-main);
| |
| border-color: #000000;
| |
| }
| |
| | |
| #mw-mf-page-left ul .toggle-list-item .toggle-list-item__anchor:hover {
| |
| box-shadow: inset 4px 0 0 0 var(--link-color);
| |
| }
| |
| | |
| #mw-mf-page-left ul.hlist li a {
| |
| color: var(--link-color);
| |
| }
| |
| | |
| /* -------------
| |
| Notification overlay
| |
| ------------- */
| |
| .notifications-overlay.navigation-drawer {
| |
| box-shadow: -1px 0 8px 0 rgba(0, 0, 0, 0.35);
| |
| }
| |
| | |
| .notifications-overlay .mw-echo-ui-actionMenuPopupWidget-menu {
| |
| border: none;
| |
| }
| |
| | |
| .mw-mf-anchor,
| |
| .mw-mf-anchor:visited,
| |
| .mw-mf-anchor:visited:hover,
| |
| .mw-mf-anchor:hover,
| |
| .mw-mf-anchor:active {
| |
| color: var(--link-color);
| |
| }
| |
| | |
| /* Talk page stuff */
| |
| .minerva-talk-full-page-button {
| |
| background-color: var(--body-main);
| |
| border-color: var(--body-dark);
| |
| color: var(--link-color);
| |
| }
| |
| | |
| .minerva-talk-content-explained {
| |
| border-color: var(--sidebar);
| |
| color: var(--base-text-color);
| |
| }
| |
| | |
| .talk-overlay .comment .wikitext-editor {
| |
| border-color: var(--body-border);
| |
| }
| |
| | |
| .client-js .skin-minerva--talk-simplified .section-heading {
| |
| border-color: var(--sidebar);
| |
| }
| |
| | |
| /* Notification boxes */
| |
| .mw-notification a,
| |
| .toast a {
| |
| color: var(--link-color);
| |
| }
| |
| | |
| /* When clicking e.g. redlinks */
| |
| .drawer {
| |
| background-color: var(--body-light);
| |
| }
| |
| | |
| /* References */
| |
| .drawer.references-drawer {
| |
| background-color: var(--body-light);
| |
| color: var(--text-color);
| |
| }
| |
| | |
| .drawer.references-drawer a {
| |
| color: var(--link-color);
| |
| }
| |
| | |
| .drawer.references-drawer .references-drawer__title {
| |
| color: var(--text-color);
| |
| }
| |
| | |
| .drawer.references-drawer .mw-ui-icon::before {
| |
| filter: brightness(0);
| |
| }
| |
| | |
| /* Obscure class used on non-existent userpages */
| |
| .cta-holder {
| |
| background: var(--body-light);
| |
| }
| |
| | |
| .cta-holder .desc {
| |
| color: var(--byline-color);
| |
| }
| |
| | |
| /* edit tag e.g. Rollback */
| |
| .mw-tag-marker {
| |
| border-color: var(--body-border);
| |
| }
| |
| | |
| /* Visedit/Sourceeditor switch button */
| |
| .oo-ui-toolGroup {
| |
| background: var(--body-background-color);
| |
| }
| |
| | |
| /* MediaViewer/ImageCarousel */
| |
| .load-fail-msg {
| |
| color: var(--text-color);
| |
| }
| |
| | |
| .load-fail-msg-link a {
| |
| color: var(--link-color);
| |
| }
| |
| | |
| /* Checkered background */
| |
| .image-carousel .image-loaded {
| |
| background: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16'%3E%3Cpath d='M0 0h8v16h8V8H0z' opacity='.13'/%3E%3C/svg%3E%0A") repeat;
| |
| }
| |
| | |
| .image-details {
| |
| background-color: var(--body-light);
| |
| border-color: transparent;
| |
| }
| |
| | |
| /* ================================
| |
| changes to special pages
| |
| ================================ */
| |
| /* [[Special:MobileOptions]] */ | |
| @media all and (min-width: 720px) {
| |
| .ns-special .pre-content {
| |
| background-color: transparent;
| |
| }
| |
| | |
| .ns-special .mw-body {
| |
| background: var(--body-main);
| |
| }
| |
| | |
| .ns-special .mw-body form {
| |
| background: transparent;
| |
| }
| |
| }
| |
| | |
| form.mw-mf-settings .oo-ui-fieldLayout,
| |
| form.mw-mf-settings .oo-ui-fieldLayout:first-child {
| |
| border-color: var(--body-mid);
| |
| }
| |
| | |
| /* Page history when not in Advanced Mobile Contribution mode */
| |
| .ns-special .content-header {
| |
| border-bottom-color: var(--body-dark);
| |
| }
| |
| | |
| .action-history .mw-history-compareselectedversions {
| |
| background-color: var(--body-main);
| |
| }
| |
| | |
| .action-history #pagehistory li:not(.selected) {
| |
| border-bottom-color: var(--sidebar);
| |
| }
| |
| | |
| /* [[Special:Contributions]] */
| |
| ul.mw-contributions-list li,
| |
| ul.special li {
| |
| border-color: var(--sidebar);
| |
| }
| |
| | |
| /* [[Special History]] */
| |
| /* Advanced Mobile Contribution mode directs to ?action=history */
| |
| .page-list li > a:not(.mw-ui-icon-element),
| |
| .topic-title-list li > a:not(.mw-ui-icon-element),
| |
| .site-link-list li > a:not(.mw-ui-icon-element) {
| |
| color: var(--byline-color);
| |
| }
| |
| | |
| .page-list.side-list .list-thumb,
| |
| .topic-title-list.side-list .list-thumb,
| |
| .site-link-list.side-list .list-thumb {
| |
| color: var(--text-color);
| |
| }
| |
| | |
| /* Edit summary */
| |
| .page-list .info,
| |
| .topic-title-list .info,
| |
| .site-link-list .info,
| |
| .page-list .component,
| |
| .topic-title-list .component,
| |
| .site-link-list .component {
| |
| color: var(--byline-color);
| |
| }
| |
| | |
| /* User link */
| |
| .mw-mf-user {
| |
| color: var(--text-color);
| |
| }
| |
| | |
| /* When Advanced Mobile Configuration is turned on */
| |
| .content .mw-index-pager-list-header {
| |
| background-color: var(--body-mid);
| |
| color: inherit;
| |
| font-family: inherit;
| |
| }
| |
| | |
| /* [[Special:Preferences]] */
| |
| .mw-prefs-title {
| |
| color: inherit;
| |
| }
| |
| | |
| .mw-prefs-description,
| |
| .oo-ui-window-body.mw-mobile-pref-dialog-body .mw-htmlform-field-HTMLInfoField {
| |
| color: var(--byline-color);
| |
| }
| |
| | |
| .mw-mobile-prefsection.oo-ui-buttonElement {
| |
| border-color: var(--sidebar);
| |
| }
| |
| | |
| .oo-ui-window-body.mw-mobile-pref-dialog-body .mw-prefs-fieldset-wrapper .oo-ui-fieldsetLayout-header,
| |
| .oo-ui-window-body.mw-mobile-pref-dialog-body [class^="mw-htmlform-field"] {
| |
| border-color: var(--sidebar);
| |
| }
| |
| | |
| /* ====================
| |
| [[Special:MobileDiff]]
| |
| ==================== */
| |
| .diff-editfont-monospace {
| |
| font-family: monospace,monospace;
| |
| }
| |
| | |
| .minoredit {
| |
| background: var(--body-mid);
| |
| }
| |
| | |
| #mw-mf-diffview .mw-mf-diff-date {
| |
| color: var(--byline-color);
| |
| }
| |
| | |
| #mw-mf-diffview .mw-diff-inline-deleted del,
| |
| #mw-mf-diffview .mw-diff-inline-changed del,
| |
| #mw-mf-diffview .mw-diff-inline-moved del {
| |
| background: var(--diff-deletedline-background);
| |
| color: var(--diff-deletedline-color);
| |
| border-radius: 0.33em;
| |
| }
| |
| | |
| #mw-mf-diffview .mw-diff-inline-added ins,
| |
| #mw-mf-diffview .mw-diff-inline-changed ins,
| |
| #mw-mf-diffview .mw-diff-inline-moved ins {
| |
| background: var(--diff-addedline-background);
| |
| color: var(--diff-addedline-color);
| |
| border-radius: 0.33em;
| |
| }
| |
| | |
| #mw-mf-diffview .mw-diff-inline-moved {
| |
| background: var(--diff-context-background);
| |
| }
| |
| | |
| #mw-mf-diffview #mw-mf-userinfo {
| |
| background: var(--body-light);
| |
| border-top-color: var(--body-border);
| |
| }
| |
| | |
| #mw-mf-diffview #mw-mf-userinfo .mw-mf-edit-count {
| |
| color: var(--text-color);
| |
| }
| |
| | |
| #mw-mf-diffview #mw-mf-userinfo .mw-mf-edit-count div {
| |
| color: inherit;
| |
| }
| |
| | |
| /*div.hatnote {*/
| |
| /* padding: 5px 7px;*/
| |
| /* color: var(--text-color);*/
| |
| /* font-size: 0.8125rem;*/
| |
| /* background-color: var(--body-light);*/
| |
| /* margin: 0 0 0.5em 0;*/
| |
| /* overflow: hidden;*/
| |
| /*}*/
| |
| | |
| @media all and (max-width: 720px) {
| |
| .messagebox {
| |
| border-left-width: 7px;
| |
| font-size: 0.9375em;
| |
| }
| |
| }
| |
| | |
| /* ====================
| |
| navboxes
| |
| ==================== */
| |
| .navbox {
| |
| border: 1px solid var(--body-border);
| |
| box-shadow: 0 0.25rem 0.35rem -0.25rem rgba(0, 0, 0, 0.1);
| |
| font-size: 0.85em;
| |
| }
| |
| | |
| .content .navbox ul {
| |
| padding-left: 0; /* Get rid of stray default mobile css */
| |
| }
| |
| | |
| .content .navbox ul li {
| |
| margin-bottom: 0; /* Get rid of stray default mobile css */
| |
| }
| |
| | |
| @media screen and (max-width: 639px) {
| |
| .navbox td,
| |
| .navbox th,
| |
| .navbox tr,
| |
| .navbox tbody,
| |
| .navbox .navbox-subgroup {
| |
| display: block;
| |
| }
| |
| | |
| }
| |
| | |
| @media screen and (min-width: 639px) {
| |
| .content table.navbox,
| |
| .content .navbox table {
| |
| width: 100% !important;
| |
| }
| |
| | |
| }
| |
| | |
| .navbox .navbox-subgroup {
| |
| margin: 0;
| |
| }
| |
| | |
| .navbox .navbar {
| |
| display: none;
| |
| }
| |
| | |
| /* Main navbox heading */
| |
| .navbox-title {
| |
| color: var(--text-color);
| |
| background-color: var(--body-dark);
| |
| font-size: 140%;
| |
| text-align: center;
| |
| padding: 0.25em 0.85em;
| |
| }
| |
| | |
| @media screen and (min-width: 639px) {
| |
| .navbox-title {
| |
| border-bottom: 1px solid var(--body-border);
| |
| }
| |
| }
| |
| | |
| /* Group headings */
| |
| .navbox-group-title {
| |
| background-color: var(--body-mid);
| |
| text-align: left;
| |
| padding: 0.2em 0.85em;
| |
| }
| |
| | |
| @media screen and (max-width: 639px) {
| |
| .navbox-group-title {
| |
| overflow: hidden;
| |
| white-space: nowrap;
| |
| text-overflow: ellipsis;
| |
| }
| |
| }
| |
| | |
| @media screen and (min-width: 639px) {
| |
| .navbox-group-title {
| |
| border: 1px solid var(--body-border);
| |
| border-width: 0 1px 1px 0;
| |
| width: 12vw;
| |
| }
| |
| }
| |
| | |
| /* hide title for half-normal-half-subgroup groups */
| |
| .navbox-group-title-hidden {
| |
| display: none;
| |
| }
| |
| | |
| .navbox-list {
| |
| padding: 0;
| |
| position: relative;
| |
| }
| |
| | |
| @media screen and (min-width: 639px) {
| |
| .navbox-list {
| |
| border-bottom: 1px solid var(--body-border);
| |
| }
| |
| }
| |
| | |
| .navbox-list ul {
| |
| display: flex;
| |
| }
| |
| | |
| @media screen and (max-width: 639px) {
| |
| .navbox-list ul {
| |
| white-space: nowrap;
| |
| overflow-x: auto;
| |
| overflow-y: hidden;
| |
| -webkit-overflow-scrolling: touch;
| |
| }
| |
| | |
| }
| |
| | |
| @media screen and (min-width: 639px) {
| |
| .navbox-list ul {
| |
| padding: 0.2em 0.85em 0.5em !important;
| |
| flex-wrap: wrap;
| |
| }
| |
| | |
| }
| |
| | |
| @media screen and (min-width: 639px) {
| |
| .navbox-list[style*="center"] ul {
| |
| justify-content: center;
| |
| }
| |
| | |
| }
| |
| | |
| .navbox-list li {
| |
| display: inline-flex;
| |
| align-items: center;
| |
| height: 3.5em;
| |
| margin: 0 0 0 0.85em;
| |
| }
| |
| | |
| @media screen and (min-width: 639px) {
| |
| .navbox-list li {
| |
| height: 2.1em;
| |
| }
| |
| | |
| .navbox-list li:first-child {
| |
| margin-left: 0;
| |
| }
| |
| | |
| }
| |
| | |
| .navbox-list li + li::before {
| |
| content: '•';
| |
| display: inline-block;
| |
| white-space: pre-wrap;
| |
| position: relative;
| |
| left: -0.425em;
| |
| color: var(--text-color);
| |
| pointer-events: none;
| |
| }
| |
| | |
| body:not(.show-beta-content) .navbox-list li:has(.beta-content-item) + li::before {
| |
| content: '';
| |
| }
| |
| | |
| .navbox-list li + li > a + a::before {
| |
| display: none;
| |
| }
| |
| | |
| .navbox-list li:last-child {
| |
| margin-right: 2em;
| |
| }
| |
| | |
| .navbox-list::after {
| |
| content: '';
| |
| display: block;
| |
| position: absolute;
| |
| background-image: var(--mobile-navbox-linear-gradient);
| |
| height: 100%;
| |
| width: 2.5em;
| |
| top: 0;
| |
| right: 0;
| |
| pointer-events: none;
| |
| }
| |
| | |
| @media screen and (min-width: 639px) {
| |
| .navbox-list::after {
| |
| display: none;
| |
| }
| |
| | |
| }
| |
| | |
| .navbox-list.navbox-parent {
| |
| border-bottom: 0;
| |
| padding: 0;
| |
| }
| |
| | |
| .navbox-list.navbox-parent::after {
| |
| display: none;
| |
| }
| |
| | |
| .navbox-group .navbox-group .navbox-group-title {
| |
| background-color: var(--body-light);
| |
| padding: 0 0.85em 0 1.7em;
| |
| }
| |
| | |
| @media screen and (min-width: 639px) {
| |
| .navbox-group .navbox-group .navbox-group-title {
| |
| padding-left: 0.85em;
| |
| }
| |
| }
| |
| | |
| .navbox-group .navbox-group .navbox-list ul {
| |
| padding-left: 1.7em;
| |
| }
| |
| | |
| .navbox-group .navbox-group .navbox-list li {
| |
| margin-bottom: 0;
| |
| }
| |
| | |
| .navbox-group .navbox-group .navbox-list li:first-child {
| |
| margin-left: 0;
| |
| }
| |
| | |
| .navbox-group .navbox-group.navbox-group-split .navbox-list ul {
| |
| padding-left: 0.85em;
| |
| }
| |
| | |
| .navbox-group .navbox-group .navbox-group:first-child .navbox-group-title {
| |
| padding-top: 0.5em;
| |
| }
| |
| | |
| @media screen and (min-width: 639px) {
| |
| .navbox-group .navbox-group .navbox-group:first-child .navbox-group-title {
| |
| padding-top: 0;
| |
| }
| |
| }
| |
| | |
| .navbox-group .navbox-group .navbox-group .navbox-group-title {
| |
| background-color: transparent;
| |
| padding-left: 2.55em;
| |
| }
| |
| | |
| @media screen and (min-width: 639px) {
| |
| .navbox-group .navbox-group .navbox-group .navbox-group-title {
| |
| background-color: var(--mobile-navbox-wide-bg-color);
| |
| padding-left: 0.85em;
| |
| }
| |
| }
| |
| | |
| .navbox-group .navbox-group .navbox-group .navbox-list ul {
| |
| padding-left: 2.55em;
| |
| }
| |
| | |
| .navbox-group .navbox-group .navbox-group.navbox-group-split .navbox-list ul {
| |
| padding-left: 1.7em;
| |
| }
| |
| | |
| /* Template:Statbox Enemy */
| |
| .statbox-enemy {
| |
| overflow: auto;
| |
| margin-right: 0;
| |
| }
| |
| | |
| /* Template:Combos/* */
| |
| .combobox-stats,
| |
| .combobox-arcana,
| |
| .combobox-darkana {
| |
| overflow: auto;
| |
| margin-right: 0;
| |
| }
| |
| | |
| /* ====================
| |
| misc fixes
| |
| ==================== */
| |
| .wikitable {
| |
| background: none;
| |
| box-shadow: none;
| |
| }
| |
| | |
| .wikitable tbody {
| |
| background: var(--body-light);
| |
| }
| |
| | |
| .toc {
| |
| background-color: var(--body-light); | |
| border-color: var(--body-border);
| |
| }
| |
| | |
| #filetoc li { | |
| display: inline;
| |
| padding-right: 2em;
| |
| }
| |
| | |
| .mw-dismissable-notice-body {
| |
| margin: 0;
| |
| }
| |
| | |
| .mw-dismissable-notice-body .mw-dismissable-notice-close-parent {
| |
| border-radius: 0 !important;
| |
| font-size: 0.75em;
| |
| }
| |
| | |
| .content figure[typeof~='mw:File/Thumb'],
| |
| .content figure[typeof~='mw:File/Frame'],
| |
| .content div.thumbinner {
| |
| background-color: var(--thumb-bg);
| |
| }
| |
| | |
| .content figure[typeof~='mw:File/Thumb'] .mw-file-element,
| |
| .content figure[typeof~='mw:File/Frame'] .mw-file-element,
| |
| .content .thumbimage {
| |
| border: 1px solid transparent;
| |
| border-bottom: none;
| |
| }
| |
| | |
| .content figure[typeof~='mw:File/Thumb'] > figcaption,
| |
| .content figure[typeof~='mw:File/Frame'] > figcaption,
| |
| .content .thumbcaption {
| |
| margin: 0;
| |
| padding: 4px 6px !important;
| |
| color: inherit;
| |
| background: var(--thumb-caption-bg);
| |
| }
| |
| | |
| .content table.messagebox {
| |
| margin: 0.5em auto;
| |
| }
| |
| | |
| .content span > video {
| |
| max-width: 100% !important;
| |
| height: auto !important;
| |
| }
| |
| | |
| .content table a > img {
| |
| max-width: inherit !important;
| |
| height: inherit !important;
| |
| }
| |
| | |
| .content .infobox a > img {
| |
| max-width: 100% !important;
| |
| height: auto !important;
| |
| }
| |
| | |
| .content .infobox-bonuses a > img {
| |
| max-width: inherit !important;
| |
| height: inherit !important;
| |
| }
| |
| | |
| table.wikitable tbody {
| |
| background: var(--body-dark);
| |
| }
| |
| | |
| /* Higher contrast icons */
| |
| .content .minerva-icon,
| |
| .content .mf-icon,
| |
| .minerva-icon,
| |
| .mf-icon,
| |
| .oo-ui-buttonElement-framed.oo-ui-iconElement.oo-ui-labelElement > .oo-ui-buttonElement-button > .oo-ui-iconElement-icon,
| |
| body .oo-ui-iconElement-icon:not(.oo-ui-image-destructive):not(.oo-ui-image-warning):not(.oo-ui-image-progressive):not(.oo-ui-checkboxInputWidget-checkIcon):not(.oo-ui-icon-page-existing),
| |
| .oo-ui-buttonElement.oo-ui-indicatorElement.oo-ui-iconElement > .oo-ui-buttonElement-button > .oo-ui-indicatorElement-indicator {
| |
| filter: brightness(0) invert(1);
| |
| }
| |
| | |
| /* Remove languages selector, since we do not have other languages on the wiki | |
| NOTE FROM HEPICHESTCOW/JUSTLEAFY: if we ever decided to fork or launch a wiki in a foreign language, remove this rule
| |
| */
| |
| .page-actions-menu #language-selector {
| |
| display: none;
| |
| }
| |
| | |
| /* -----------------------
| |
| CharacterSearch filter
| |
| ----------------------- */
| |
| .char-filter-wrapper .char-filter-dropdown-column-select ul {
| |
| margin-top: 0.9em;
| |
| }
| |
| | |
| .char-filter-dropdown-menu li {
| |
| margin-bottom: 0;
| |
| font-size: 0.9em;
| |
| }
| |
| | |
| .char-filter-help-window-panel ul {
| |
| list-style-type: disc;
| |
| margin-block-start: 1em;
| |
| margin-block-end: 1em;
| |
| margin-inline-start: 0px;
| |
| margin-inline-end: 0px;
| |
| padding-inline-start: 40px;
| |
| }
| |
| | |
| .char-filter-help-window-panel ul ul {
| |
| list-style-type: circle;
| |
| margin-block-start: 0px;
| |
| margin-block-end: 0px;
| |
| }
| |
| | |
| /* General classes */
| |
| .nomobile {
| |
| display: none;
| |
| }
| |
| | |
| /* Character select list head */
| |
| @media screen and (max-width: 720px) {
| |
| .character-select-list-head {
| |
| display: inline-grid;
| |
| grid-template-columns: repeat(4, 75px);
| |
| gap: 8px;
| |
| }
| |
|
| |
| .character-select-list-head .character-tooltip {
| |
| width: 7em;
| |
| height: 11em;
| |
| font-size: 0.66em;
| |
| }
| |
| } | | } |
|
| |
|
| /* Minor tweak for fixing image width in infoboxes in mobile */ | | /* Optional: Change color for visited links to stay silver */ |
| .infoboxNew .infoboxNew-image.infoboxNew-full-image img.mw-file-element {
| | a:visited { |
| max-width: 100% !important;
| | color: silver !important; |
| } | | } |
|
| |
|
| /* More icons to invert */ | | /* Optional: Slightly brighter silver or a different effect on hover */ |
| .overlay.editor-overlay .oo-ui-indicator-down,
| | a:hover { |
| .mw-revslider-container .oo-ui-indicatorElement-indicator.oo-ui-indicator-down {
| | color: #e0e0e0 !important; |
| filter: brightness(0) invert(1);
| | text-decoration: underline; |
| } | | } |