Jump to content

MediaWiki:Common.css

From Oreynia
Revision as of 20:13, 12 April 2026 by Maintenance script (talk | contribs) (Live IDE sync)
(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)

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)
  • Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5.
/* ==========================================================================
   OREYNIA WIKI MASTER STYLESHEET
   
   TABLE OF CONTENTS:
   1. Custom Fonts (Font-Faces)
   2. CSS Variables (The Control Panel)
   3. Global Typography (Fonts, Links, Paragraphs)
   4. Main Layout (Backgrounds, Headers, Sidebars)
   5. Wiki Components (Infoboxes, Tables, Quote Blocks)
   6. Utility Classes (Hidden elements, alignments)
   7. Special (External link icons, etc.)
   8. Media Queries (Responsive adjustments)
   ========================================================================== */

/* #region 1. CUSTOM FONTS */

@font-face {
    font-family: OreyniaTitleScript;
    src: url('/assets/fonts/oreynia-titlefont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

/* #endregion */

/* #region 2. CSS VARIABLES */

:root {
    --oreynia-color-primary: white;
    --oreynia-color-secondary: black;

    --oreynia-color-missing: red;
    --oreynia-color-highlight: cyan;

    --oreynia-background-color-primary: #59505f;
    --oreynia-background-color-secondary: #537895;
    --oreynia-background-color-tertiary: #BCC5CE;
    --oreynia-background-color-quaternary: #929EAD;

    --oreynia-color-link: #74c7ff;
    --oreynia-color-link-visited: #74c7ff;

    --oreynia-color-option: lightcyan;
    --oreynia-color-option-selected: var(--oreynia-color-highlight);

    
}

/* #endregion */

/* #region 3. GLOBAL TYPOGRAPHY */

p {
    color: var(--oreynia-color-primary);
    font-family: OreyniaTitleScript, sans-serif !important;
}

a {
    color: var(--oreynia-color-link) !important;
    text-decoration: none;
}

a:focus{
    text-decoration: none;
    font-weight: none;
}

a:hover {
    text-decoration: underline;
    color: var(--oreynia-color-link) !important;
}

a:visited {
    color: var(--oreynia-color-link-visited) !important;
}

a.new {
    color: var(--oreynia-color-missing) !important;
}

h1, h2, h3, h4, h5, h6 {
    color: var(--oreynia-color-secondary);
    font-family: OreyniaTitleScript, sans-serif !important;
}

dl {
  color: var(--oreynia-color-primary) !important;
}

li {
  color: var(--oreynia-color-primary) !important;
}

/* #endregion */

/* #region 4. MAIN LAYOUT */

html, body {
    min-height: 100vh !important;
    height: auto;
    margin: 0;
    background: linear-gradient(-180deg, var(--oreynia-background-color-tertiary) 0%, var(--oreynia-background-color-quaternary) 98%), radial-gradient(at top left, rgba(255,255,255,0.30) 0%, rgba(0,0,0,0.30) 100%) !important;
    background-blend-mode: screen !important;
    background-attachment: fixed !important; 
    background-size: cover !important;
}

.mw-page-container
{
  min-height: 100vh;
  height: auto !important;
  background-image: linear-gradient(0deg, var(--oreynia-background-color-primary) 0%, var(--oreynia-background-color-secondary) 100%);
  padding-top: 4rem;
}

.mw-header {
  background-image: linear-gradient(30deg, var(--oreynia-background-color-primary) 0%, var(--oreynia-background-color-secondary) 100%);
  position: absolute;
}

.vector-sticky-header {
  background-image: linear-gradient(30deg, var(--oreynia-background-color-primary) 0%, var(--oreynia-background-color-secondary) 100%);
  border: none;
  color: var(--oreynia-color-primary) !important;
}

/* #endregion */

/* #region 5. WIKI COMPONENTS */

/* ======================================= HEADER ============================================ */
.mw-logo-wordmark{
  color: white !important;
  font-size:x-large !important;
}

.mw-logo-wordmark::after {
    content: "™";
    font-size: 0.6em;
    vertical-align: top;
    position: relative;
    top: -0.2em;
    font-weight: normal;
    margin-left: 1px;
}

#p-vector-user-menu-userpage a.new
{
  color: var(--oreynia-color-option) !important; 
}

.vector-dropdown .vector-dropdown-content
{
    top: 150% !important;
}


.vector-main-menu-container {
  margin: 0 !important;
}

.vector-dropdown-content {
    border-radius: 5px;
    background-color: var(--oreynia-background-color-primary) !important;
    padding: 16px;
    border: 2px solid var(--oreynia-color-primary);
    min-width: 200px;
}

.vector-sticky-pinned-container::after {
    display: none !important;
}

.cdx-search-input--has-end-button
{
  border: none !important;
  background: transparent !important;
}

.cdx-text-input__input {
  border-radius: 10px !important;
}

.cdx-button {
  border-radius: 10px !important;
}

.cdx-search-input__end-button{
  margin-left: 5px !important;
} 


/*Dropdown menus*/

.vector-pinnable-header
{
    display: flex !important;
    justify-content: center !important;
}

.vector-pinnable-header-label{
    color: var(--oreynia-color-primary) !important;
    font-size: medium !important;
}

.vector-menu-heading {
    color: var(--oreynia-color-primary) !important;
}

.vector-toc .vector-toc-list-item-active.vector-toc-level-1 > .vector-toc-link {
  color: var(--oreynia-color-option-selected) !important;
}

.vector-menu-tabs .mw-list-item.selected a {
    color: var(--oreynia-color-option-selected) !important;
}

.vector-page-toolbar li a {
    color: var(--oreynia-color-option) !important;
}

.vector-page-toolbar li a:visited {
    color: var(--oreynia-color-option) !important;
}

.vector-page-toolbar li a:hover {
    color: var(--oreynia-color-option) !important;
}

.vector-page-toolbar li a:focus{
    text-decoration: none;
    font-weight: bold;
}

.vector-page-toolbar li a.new{
    color: var(--oreynia-color-option) !important;
}

.cdx-label {
    color: var(--oreynia-color-primary) !important;
}


.ve-ce-branchNode p { /* Visual Editor */
  color: black;
}

.mw-page-container-inner {
    display: block !important;
}

.vector-column-start,
.vector-column-end {
    display: none !important;
}

.mw-content-container,
.mw-body,
.vector-body,
.mw-body-content {
    display: block !important;
    max-width: none !important;
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.vector-pinnable-header-pin-button {
    display: none !important;
}

/* Tables and snippets */

code {
  color: var(--oreynia-color-secondary);
  border-radius: 5px !important;
  border: 1px solid var(--oreynia-background-color-quaternary) !important;
  background-color: var(--oreynia-background-color-tertiary) !important;
}

.wikitable{
  border-radius: 5px !important;
  border: 3px solid var(--oreynia-background-color-quaternary) !important;
  background-color: var(--oreynia-background-color-secondary) !important;
  box-shadow: 2px 2px var(--oreynia-background-color-quaternary) !important;
  border-collapse: initial;
  border-spacing: 0 !important;
}

.wikitable th{
  color: var(--oreynia-background-color-tertiary) !important;
  background-color: var(--oreynia-background-color-primary) !important;
  border: 1px solid var(--oreynia-background-color-quaternary) !important;
  
}

.wikitable td{
  border: 1px solid var(--oreynia-background-color-quaternary) !important;
}


/* #endregion */

/* #region 6. UTILITY CLASSES */



/* #endregion */

/* #REGION 7. SPECIAL */

.mw-parser-output a.external {
    background-image: none !important;
    padding-right: 0 !important;
}

.mw-parser-output a.external::after {
    content: "";
    display: inline-block;
    
    width: 0.857em;
    height: 0.857em;
    margin-left: 0.25em;
    vertical-align: baseline;

    background-color: var(--oreynia-color-link) !important; 
    
    -webkit-mask-image: url(/skins/Vector/resources/skins.vector.styles/images/link-external-small-ltr-progressive.svg);
    mask-image: url(/skins/Vector/resources/skins.vector.styles/images/link-external-small-ltr-progressive.svg);
    
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
}

.oo-ui-labelWidget .oo-ui-inline-help
{
  color: var(--oreynia-color-primary) !important;
}

.oo-ui-popupWidget-popup p{
  color: var(--oreynia-color-secondary) !important;
}

.mw-htmlform-ooui-wrapper 
{
  border-radius: 5px !important;
  border: 3px solid var(--oreynia-background-color-quaternary) !important;
  background-color: var(--oreynia-background-color-tertiary) !important;
  box-shadow: 2px 4px var(--oreynia-background-color-quaternary) !important;
}

.oo-ui-inputWidget-input {
  border-radius: 5px !important;
}

.oo-ui-fieldsetLayout-header .oo-ui-labelElement-label {
  font-size: 1.5rem !important;
  margin-bottom: 30px !important;
}

.catlinks{
  margin-top: 4rem!important;
  padding: 5px!important;
  border-radius: 5px !important;
  border: 3px solid var(--oreynia-background-color-quaternary) !important;
  background-color: var(--oreynia-background-color-secondary) !important;
  box-shadow: 2px 2px var(--oreynia-background-color-quaternary) !important;
}

.mw-normal-catlinks li{
  padding: 0 !important;
  border: none !important;
}

.mw-normal-catlinks li a{
  padding: 2px 10px !important;
  border-radius: 12px !important;
  margin: 0px 2px !important;
  background-color: var(--oreynia-background-color-primary) !important;
}

.mw-normal-catlinks > a { 
    font-weight: bold !important;
    color: var(--oreynia-color-secondary) !important;
}

.mw-footer-container {
  margin-top: 20px!important;
  padding: 0!important;
  height: 8rem !important;
}


/* #endregion */

/* #REGION 8. Media */

@media screen and (min-width: 1080px) {
    .mw-header .search-toggle {
        display: none !important;
    }

    .mw-header .vector-typeahead-search-container {
        display: block;
    }
}

/* #endregion */
Retrieved from "https://oreynia.com/index.php?title=MediaWiki:Common.css&oldid=360"