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
 
(62 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(220 235 250 / 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(--bg-color);
     --color-surface-0-oklch__l: 0.2589;
     --color-primary: var(--interface-blue);
     --color-surface-0-oklch__c: 0.0568;
}
    --color-surface-0-oklch__h: 261.9;


:root.skin-citizen-dark {
    --color-base-oklch__l: 0.9;
    --bgb-blue:         rgb(27 62 116 / 100%);
     --color-base-oklch__c: 0.0;
     --interface-blue:   rgb(74 112 170 / 100%);
     --color-base-oklch__h: 0.0;
     --bg-color:         rgb(20 35 63 / 100%);


     --text-header:     rgb(255 255 255 / 100%);
     --color-emphasized-oklch__l: 1.0;
     --text-content:     rgb(255 255 255 / 80%);
     --color-emphasized-oklch__c: 0.0;
 
     --color-emphasized-oklch__h: 0.0;
     background-color: var(--bg-color);
    --color-primary: var(--interface-blue);
}
}


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


body.mediawiki {
a:link {
    background-color: var(--bg-color);
  color: #4a70aa;
    background-image: url("https://boardgamebarrage.com/w/bg.png");
    background-position: top;
    background-size: 200px;
    background-repeat: no-repeat
    padding-left: 20%;
    padding-right: 20%;
}
}


body {
a:visited {
    background-color: var(--bg-color);
  color: #4a70aa;
    color: var(--text-content);
}
}


.mw-body {
a.new{
    background-color: var(--bg-color);
  color: #DF0552;
}
}


.mw-footer {
.skin-citizen .mw-editform #wpTextbox1 {
     background: var(--bgb-blue);
     background-color: #22252D;
}
}


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


.mw-datatable th {
.mw-code {
     background-color: var(--interface-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);
}