MediaWiki:Common.css: Difference between revisions

Revision as of 14:13, 20 May 2026

/* CSS placed here will be applied to all skins */
.inputbox-gallery {
    display: flex; 
    flex-wrap: wrap; 
    justify-content: space-between; 
    gap: 20px; 
    margin: 0 auto;
}
.inputbox-gallery > div {
    width: calc(33.33% - 14px); 
    box-sizing: border-box;
    flex-shrink: 0; 
}
.page__main {
	background-color: rgba(var(--theme-page-background-color--rgb), 0.9);
}

/* Vanguard Galaxy — Citizen theme overrides (palette from VG_Banner.png logo region) */
.skin-citizen-dark, .skin-citizen-auto {
  /* Accent: bright cyan from the VANGUARD wordmark glow */
  --color-progressive:          #34b2ec;
  --color-progressive--hover:   #5ec5f0;
  --color-progressive--active:  #1a93cb;
  --color-progressive--focus:   #34b2ec;

  --color-destructive: #ff6e5b;

  /* Surfaces: deep space navy, graduated */
  --color-surface-0: #05080f;
  --color-surface-1: #0a1020;
  --color-surface-2: #11192e;
  --color-surface-3: #182240;
  --color-surface-4: #1f2c52;

  --background-color-base:     #0a1020;
  --background-color-primary:  #11192e;
  --background-color-neutral-subtle: #182240;

  --color-base:       #e6edf6;          /* cool off-white body text */
  --color-subtle:     #8aa0c2;
  --color-emphasized: #ffffff;
  --color-link:           #8cd4f5;       /* the bright VANGUARD glow */
  --color-link--visited:  #5ea0c2;

  --border-color-base:    #1a2a4a;
  --border-color-subtle:  #15203a;

  --color-syntax-blue:  #8cd4f5;
  --color-syntax-pink:  #ff6e5b;
}

/* Tighten wordmark in header */
.citizen-header__siteTitle img.citizen-header__sitelogo,
.mw-logo-wordmark { max-height: 36px; width: auto; }

/* Vanguard Galaxy starfield + nebula background — Steam hero artwork */
html.skin-citizen-dark body,
html.skin-citizen-auto body {
  background-color: #05080f;
  background-image:
    linear-gradient( rgba(5, 8, 15, 0.78), rgba(5, 8, 15, 0.62) ),
    url("/images/9/9c/VG-Hero-Background.jpg");
  background-size: cover;
  background-position: center top;
  background-attachment: fixed;
  background-repeat: no-repeat;
}

/* Let the page panel feel slightly translucent so the starfield reads behind it */
html.skin-citizen-dark .citizen-page-container,
html.skin-citizen-auto .citizen-page-container,
html.skin-citizen-dark .mw-page-container,
html.skin-citizen-auto .mw-page-container {
  background-color: rgba(10, 16, 32, 0.88);
  backdrop-filter: blur(4px);
}

/* Header bar — keep it readable over the artwork */
html.skin-citizen-dark .citizen-header,
html.skin-citizen-auto .citizen-header {
  background-color: rgba(5, 8, 15, 0.92);
  backdrop-filter: blur(6px);
}