MediaWiki:Common.css: Difference between revisions

Revision as of 22:50, 17 December 2025

/* =====================================================
   MEDIK SIDEBAR — WIDTH, COLOR, BEHAVIOR
   ===================================================== */

/* Sidebar width (Bootstrap-correct) */
@media (min-width: 768px) {
  .skin-medik #mw-navigation {
    flex: 0 0 16%;
    max-width: 16%;
  }
}

@media (min-width: 1200px) {
  .skin-medik #mw-navigation {
    flex: 0 0 12%;
    max-width: 12%;
  }
}

/* Sidebar text color */
.skin-medik #mw-navigation {
  color: #202122;
}

.skin-medik #mw-navigation a,
.skin-medik #mw-navigation h3 {
  color: #202122;
}

.skin-medik #mw-navigation h3 {
  font-weight: 600;
}

/* Remove redundant “Navigation” label */
.skin-medik #p-navigation-label {
  display: none !important;
}

/* Restore spacing after label removal */
.skin-medik #mw-navigation nav.nav {
  margin-top: 1.25rem;
}

/* Sidebar link hover — gradient text only */
.skin-medik #mw-navigation .nav-link {
  color: #202122;
}

.skin-medik #mw-navigation .nav-link:hover {
  color: #8E2DE2; /* fallback */
  background: linear-gradient(to right, #4A00E0, #8E2DE2);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* =====================================================
   BODY LINKS — SEMANTIC, ACCESSIBLE
   ===================================================== */

/* Existing links */
.skin-medik .mw-parser-output a:not(.new) {
  color: #8E2DE2;
}

/* Visited links */
.skin-medik .mw-parser-output a:not(.new):visited {
  color: #5a1fa6;
}

/* Non-existent (red) links */
.skin-medik .mw-parser-output a.new {
  color: #b33a3a;
}

/* =====================================================
   LAYOUT FIX — REMOVE RIGHT-SIDE WHITESPACE
   ===================================================== */

/* Kill Bootstrap gutter causing empty right strip */
.skin-medik #mw-main-container > .row {
  --bs-gutter-x: 0;
}

/* =====================================================
   TYPOGRAPHY — DESKTOP ONLY (WORDPRESS-LIKE)
   ===================================================== */

@media (min-width: 992px) {

  /* Article body text */
  .skin-medik .mw-body-content {
    font-size: 1.05rem;     /* readable, not bloated */
    line-height: 1.7;
  }

  /* Paragraph rhythm */
  .skin-medik .mw-parser-output p {
    margin-bottom: 1.1em;
  }

  /* Headings spacing */
  .skin-medik .mw-parser-output h1,
  .skin-medik .mw-parser-output h2,
  .skin-medik .mw-parser-output h3 {
    margin-top: 1.6em;
    margin-bottom: 0.6em;
  }
}