MediaWiki:Common.css: Difference between revisions
From OpenJuris
reattempting semantic code Tag: Reverted |
Undo revision 99 by Nilotpal Datta (talk) Tag: Undo |
||
| Line 1: | Line 1: | ||
/* | /* Medik sidebar width override — Bootstrap-correct */ | ||
@media (min-width: 768px) { | @media (min-width: 768px) { | ||
.skin-medik #mw-navigation { | .skin-medik #mw-navigation { | ||
| Line 18: | Line 14: | ||
} | } | ||
/* Hide | |||
.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 { | .skin-medik #p-navigation-label { | ||
display: none !important; | display: none !important; | ||
} | } | ||
/* Restore spacing after label | /* Restore spacing after hiding Navigation label (Medik) */ | ||
.skin-medik #mw-navigation nav.nav { | .skin-medik #mw-navigation nav.nav { | ||
margin-top: 1.25rem; | 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; | |||
.skin-medik #mw-navigation | |||
. | |||
color: #202122; | |||
} | } | ||
/* Sidebar links: gradient text on hover (Medik) */ | |||
/* Sidebar links | |||
.skin-medik #mw-navigation .nav-link { | .skin-medik #mw-navigation .nav-link { | ||
color: #202122; | color: #202122; /* normal body text */ | ||
transition: color 0.2s ease; | transition: color 0.2s ease; | ||
} | } | ||
/* Hover: gradient text */ | |||
.skin-medik #mw-navigation .nav-link:hover { | .skin-medik #mw-navigation .nav-link:hover { | ||
color: #8E2DE2; /* fallback */ | color: #8E2DE2; /* fallback for browsers without text-clip */ | ||
background: -webkit-linear-gradient(to right, #4A00E0, #8E2DE2); | |||
background: linear-gradient(to right, #4A00E0, #8E2DE2); | background: linear-gradient(to right, #4A00E0, #8E2DE2); | ||
-webkit-background-clip: text; | -webkit-background-clip: text; | ||
| Line 56: | Line 56: | ||
} | } | ||
/* Existing links */ | |||
.skin-medik .mw-parser-output a:not(.new) { | .skin-medik .mw-parser-output a:not(.new) { | ||
color: #8E2DE2; | color: #8E2DE2; | ||
} | } | ||
/* Visited links (darker) */ | |||
.skin-medik .mw-parser-output a:not(.new):visited { | .skin-medik .mw-parser-output a:not(.new):visited { | ||
color: #5a1fa6; | color: #5a1fa6; | ||
} | } | ||
/* Non-existent pages (red links) */ | |||
.skin-medik .mw-parser-output a.new { | .skin-medik .mw-parser-output a.new { | ||
color: #b33a3a; | color: #b33a3a; | ||
} | } | ||
/* ===================================================== | /* ===================================================== | ||
Medik content layout – wider, centered, readable | |||
WordPress-style editorial feel | |||
===================================================== */ | ===================================================== */ | ||
.skin-medik | /* 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: article text readability */ | ||
.skin-medik .mw-body-content { | |||
font-size: 1.75rem; | |||
line-height: 1.7; | |||
} | |||
/* Paragraph spacing */ | |||
.skin-medik .mw-parser-output p { | |||
margin-bottom: 1.1em; | |||
} | |||
/* Headings: give them breathing room */ | |||
.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; | |||
} | |||
/* Medik: widen and center the main Bootstrap container */ | |||
.skin-medik #mw-main-container > .row { | |||
margin-left: 0; | |||
margin-right: 0; | |||
} | } | ||
Revision as of 22:53, 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, #4A00E0, #8E2DE2);
background: linear-gradient(to right, #4A00E0, #8E2DE2);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
/* Existing links */
.skin-medik .mw-parser-output a:not(.new) {
color: #8E2DE2;
}
/* Visited links (darker) */
.skin-medik .mw-parser-output a:not(.new):visited {
color: #5a1fa6;
}
/* Non-existent pages (red links) */
.skin-medik .mw-parser-output a.new {
color: #b33a3a;
}
/* =====================================================
Medik content layout – wider, centered, readable
WordPress-style editorial feel
===================================================== */
/* 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: article text readability */
.skin-medik .mw-body-content {
font-size: 1.75rem;
line-height: 1.7;
}
/* Paragraph spacing */
.skin-medik .mw-parser-output p {
margin-bottom: 1.1em;
}
/* Headings: give them breathing room */
.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;
}
/* Medik: widen and center the main Bootstrap container */
.skin-medik #mw-main-container > .row {
margin-left: 0;
margin-right: 0;
}