Toggle menu
Toggle preferences menu
Toggle personal menu
Not logged in
Your IP address will be publicly visible if you make any edits.

MediaWiki:Citizen.css: Difference between revisions

MediaWiki interface page
No edit summary
mNo edit summary
 
(92 intermediate revisions by the same user not shown)
Line 1: Line 1:
/* All CSS here will be loaded for users of the Citizen skin */
.res-img img {
    max-width: 100%;
    height: auto;
}


:root.skin-citizen-light {
:root {
     --bgb-blue:         rgb(27 62 116 / 100%);
     --width-layout: 980px;
     --interface-blue:   rgb(74 112 170 / 100%);
     --text-header:     rgb(255 255 255 / 100%);
     --bg-color:         rgb(170 180 200 / 100%);
     --text-content:     rgb(255 255 255 / 80%);
}


     --text-header:     rgb(0 0 0 / 100%);
:root.skin-theme-clientpref-night {
     --text-content:     rgb(0 0 0 / 80%);
     /* Set hue to BGB Blue*/
    --color-progressive-oklch__l: 0.3693;
    --color-progressive-oklch__c: 0.1013;
     --color-progressive-oklch__h: 258.93;


     //background: var(--bgb-blue);
     --color-surface-0-oklch__l: 0.2589;
     background-image: linear-gradient(red, yellow);
    --color-surface-0-oklch__c: 0.0568;
     --color-primary: var(--interface-blue);
    --color-surface-0-oklch__h: 261.9;
 
    --color-base-oklch__l: 0.9;
    --color-base-oklch__c: 0.0;
     --color-base-oklch__h: 0.0;
 
    --color-emphasized-oklch__l: 1.0;
     --color-emphasized-oklch__c: 0.0;
    --color-emphasized-oklch__h: 0.0;
}
}


:root.skin-citizen-dark {
    --bgb-blue:        rgb(27 62 116 / 100%);
    --interface-blue:  rgb(74 112 170 / 100%);
    --bg-color:        rgb(24 40 64 / 100%);


    --text-header:     rgb(255 255 255 / 100%);
a:link {
    --text-content:     rgb(255 255 255 / 80%);
  color: #4a70aa;
}


    background: var(--bgb-blue);
a:visited {
    --color-primary: var(--interface-blue);
  color: #4a70aa;
}
}


.mw-header-siteinfo .mw-wiki-title .mw-logo-wordmark {
a.new{
    color: var(--text-header);
  color: #DF0552;
}
}


body {
.skin-citizen .mw-editform #wpTextbox1 {
     background: var(--bg-color);
     background-color: #22252D;
    color: var(--text-content);
    padding-top: 50px;
}
}


.mw-body {
.mw-datatable th {
     background: var(--bg-color);
     background-color: #4a70aa;
}
}


.mw-footer {
.mw-code {
     background: var(--bgb-blue);
     background-color: #22252D;
}
}


/*
#skin-client-prefs-skin-theme .citizen-client-prefs-radio:has(input[value="os"]) {
.last-modified-bar {
     display: none;
     background: var(--bg-color);
}
}


.last-modified-bar-content {
#skin-client-prefs-skin-theme form {  
    background: var(--bg-color);
  grid-template-columns: repeat(2,1fr);
}
}
*/

Latest revision as of 15:48, 15 March 2026

.res-img img {
    max-width: 100%;
    height: auto;
}

:root {
    --width-layout: 980px;
    --text-header:      rgb(255 255 255 / 100%);
    --text-content:     rgb(255 255 255 / 80%);
}

:root.skin-theme-clientpref-night {
    /* Set hue to BGB Blue*/
    --color-progressive-oklch__l: 0.3693;
    --color-progressive-oklch__c: 0.1013;
    --color-progressive-oklch__h: 258.93;

    --color-surface-0-oklch__l: 0.2589;
    --color-surface-0-oklch__c: 0.0568;
    --color-surface-0-oklch__h: 261.9;

    --color-base-oklch__l: 0.9;
    --color-base-oklch__c: 0.0;
    --color-base-oklch__h: 0.0;

    --color-emphasized-oklch__l: 1.0;
    --color-emphasized-oklch__c: 0.0;
    --color-emphasized-oklch__h: 0.0;
}


a:link {
  color: #4a70aa;
}

a:visited {
  color: #4a70aa;
}

a.new{
  color: #DF0552;
}

.skin-citizen .mw-editform #wpTextbox1 {
    background-color: #22252D;
}

.mw-datatable th {
    background-color: #4a70aa;
}

.mw-code {
    background-color: #22252D;
}

#skin-client-prefs-skin-theme .citizen-client-prefs-radio:has(input[value="os"]) {
    display: none;
}

#skin-client-prefs-skin-theme form { 
   grid-template-columns: repeat(2,1fr);
}