MediaWiki:Medik.css: Difference between revisions
From OpenJuris
Created page with "→Gradient for the navbar: .navbar { background: #8E2DE2; →fallback: background: -webkit-linear-gradient(to right, #4A00E0, #8E2DE2); background: linear-gradient(to right, #4A00E0, #8E2DE2); } →If you want to use your primary color as a variable: :root { --medik-base: #8E2DE2; }" |
switching up colors Tag: Reverted |
||
| Line 1: | Line 1: | ||
/* | /* Medik sidebar width override — 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 { | ||
--medik- | flex: 0 0 12%; | ||
max-width: 12%; | |||
} | |||
} | |||
.skin-medik #mw-navigation a, | |||
.skin-medik #mw-navigation a:visited { | |||
color: #202122; | |||
} | |||
.skin-medik #mw-navigation h3 { | |||
color: #202122; | |||
font-weight: 600; | |||
} | |||
/* Hide Bootstrap "Navigation" label in Medik */ | |||
.skin-medik #p-navigation-label { | |||
display: none !important; | |||
} | |||
/* Restore spacing after hiding Navigation label (Medik) */ | |||
.skin-medik #mw-navigation nav.nav { | |||
margin-top: 1.25rem; /* tweak as needed */ | |||
} | |||
/* Sidebar links: gradient hover (Medik) */ | |||
.skin-medik #mw-navigation .nav-link { | |||
color: #202122; /* normal text */ | |||
transition: background 0.2s ease, color 0.2s ease; | |||
} | |||
/* Sidebar links: gradient text on hover (Medik) */ | |||
.skin-medik #mw-navigation .nav-link { | |||
color: #202122; /* normal body text */ | |||
transition: color 0.2s ease; | |||
} | |||
/* Hover: gradient text */ | |||
.skin-medik #mw-navigation .nav-link:hover { | |||
color: #8E2DE2; /* fallback for browsers without text-clip */ | |||
background: -webkit-linear-gradient(to right, #8E2DE2, #8E2DE2); | |||
background: linear-gradient(to right, #8E2DE2, #8E2DE2); | |||
-webkit-background-clip: text; | |||
-webkit-text-fill-color: transparent; | |||
} | |||
/* Existing links (unvisited) */ | |||
.skin-medik .mw-parser-output a:not(.new):link { | |||
color: #8E2DE2; | |||
} | |||
/* Existing links (visited) */ | |||
.skin-medik .mw-parser-output a:not(.new):visited { | |||
color: #4A00E0 !important; | |||
} | |||
/* Non-existent pages (red links) */ | |||
.skin-medik .mw-parser-output a.new { | |||
color: #b33a3a; | |||
} | |||
/* Main content container */ | |||
.skin-medik .mw-content-container { | |||
max-width: 1400px; /* wider than default, not full-width */ | |||
margin-left: auto; | |||
margin-right: auto; | |||
padding-left: 2rem; | |||
padding-right: 2rem; | |||
} | |||
/* Medik: widen and center the main Bootstrap container */ | |||
.skin-medik #mw-main-container > .row { | |||
margin-left: 0; | |||
margin-right: 0; | |||
} | } | ||
Revision as of 23:25, 17 December 2025
/* Medik sidebar width override — 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%;
}
}
.skin-medik #mw-navigation a,
.skin-medik #mw-navigation a:visited {
color: #202122;
}
.skin-medik #mw-navigation h3 {
color: #202122;
font-weight: 600;
}
/* Hide Bootstrap "Navigation" label in Medik */
.skin-medik #p-navigation-label {
display: none !important;
}
/* Restore spacing after hiding Navigation label (Medik) */
.skin-medik #mw-navigation nav.nav {
margin-top: 1.25rem; /* tweak as needed */
}
/* Sidebar links: gradient hover (Medik) */
.skin-medik #mw-navigation .nav-link {
color: #202122; /* normal text */
transition: background 0.2s ease, color 0.2s ease;
}
/* Sidebar links: gradient text on hover (Medik) */
.skin-medik #mw-navigation .nav-link {
color: #202122; /* normal body text */
transition: color 0.2s ease;
}
/* Hover: gradient text */
.skin-medik #mw-navigation .nav-link:hover {
color: #8E2DE2; /* fallback for browsers without text-clip */
background: -webkit-linear-gradient(to right, #8E2DE2, #8E2DE2);
background: linear-gradient(to right, #8E2DE2, #8E2DE2);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
/* Existing links (unvisited) */
.skin-medik .mw-parser-output a:not(.new):link {
color: #8E2DE2;
}
/* Existing links (visited) */
.skin-medik .mw-parser-output a:not(.new):visited {
color: #4A00E0 !important;
}
/* Non-existent pages (red links) */
.skin-medik .mw-parser-output a.new {
color: #b33a3a;
}
/* Main content container */
.skin-medik .mw-content-container {
max-width: 1400px; /* wider than default, not full-width */
margin-left: auto;
margin-right: auto;
padding-left: 2rem;
padding-right: 2rem;
}
/* Medik: widen and center the main Bootstrap container */
.skin-medik #mw-main-container > .row {
margin-left: 0;
margin-right: 0;
}