MediaWiki:Common.css: Difference between revisions
Myriad-admin (talk | contribs) No edit summary |
Myriad-admin (talk | contribs) No edit summary |
||
Line 30: | Line 30: | ||
} | } | ||
/* === DRG Footer container === */ | |||
#drg-footer { | |||
border-top: 1px solid #ccc; | |||
background: #fff; | |||
padding-top: 2em; | |||
font-family: sans-serif; | |||
color: #000; | |||
font-size: 1.1rem; | |||
margin: 1em 0 2em; | |||
} | |||
/* === Three‐column layout === */ | |||
.drg-columns { | |||
display: flex; | |||
justify-content: center; | |||
align-items: stretch; | |||
gap: 2em; | |||
max-width: 1200px; | |||
margin: 0 auto; | |||
flex-wrap: nowrap; | |||
} | } | ||
.drg-column { | |||
width: | flex: 1 1 33%; | ||
padding: 1em; | display: flex; | ||
font- | flex-direction: column; | ||
gap: 1em; | |||
min-width: 0; | |||
} | |||
/* Left-aligned with inward padding */ | |||
.drg-column-left { | |||
align-items: flex-end; | |||
text-align: right; | |||
padding-right: 1.5em; | |||
} | |||
.drg-column-right { | |||
align-items: flex-start; | |||
text-align: left; | |||
padding-left: 1.5em; | |||
} | |||
.drg-column-left a, | |||
.drg-column-right a { | |||
color: #000; | |||
text-decoration: none; | |||
} | |||
.drg-column-left a:hover, | |||
.drg-column-right a:hover { | |||
text-decoration: underline; | |||
} | |||
/* Divider lines */ | |||
.drg-divider { | |||
width: 1px; | |||
background: #666; | |||
opacity: 0.4; | |||
align-self: stretch; | |||
} | |||
/* Center column specifics */ | |||
.drg-column-center { | |||
text-align: center; | |||
align-items: center; | |||
justify-content: center; | |||
} | |||
.drg-eu-flag { | |||
margin-bottom: 1em; | |||
} | |||
.drg-eu-flag img { | |||
height: 4em; | |||
width: auto; | |||
max-width: 100%; | |||
} | |||
.drg-eu-text { | |||
font-weight: bold; | |||
line-height: 1.5; | |||
font-size: 1em; | |||
max-width: 400px; | |||
text-align: center; | |||
color: #000; | |||
} | |||
/* Disclaimer block */ | |||
.drg-disclaimer { | |||
max-width: 900px; | |||
margin: 2em auto 0; | |||
padding: 1em 0 0; | |||
border-top: 1px solid #eee; | |||
font-size: 0.9em; | |||
color: #666; | |||
text-align: center; | |||
} | |||
.drg-disclaimer a { | |||
color: #374CFF; | |||
text-decoration: underline; | |||
} | } | ||
/* === Responsive tweaks === */ | |||
@media (max-width: 768px) { | |||
text- | .drg-columns { | ||
flex-direction: column; | |||
align-items: center; | |||
} | |||
.drg-divider { | |||
display: none; | |||
} | |||
.drg-column { | |||
width: 100%; | |||
text-align: center !important; | |||
align-items: center !important; | |||
padding: 0 !important; | |||
} | |||
.drg-eu-text { | |||
max-width: 90%; | |||
} | |||
} | } |
Revision as of 09:46, 26 May 2025
/* CSS placed here will be applied to all skins */
body.page-Help_Main_Page.action-view h1.firstHeading, body.page-Main_Page.action-view h1.firstHeading { display: none; }
div#content a.external[href ^="https://"] {
background-image: none;
padding-right: 0;
}
/* MYRIAD colours */
:root {
--myriad-blue: #374CFF;
--myriad-purple: #8836EA;
--myriad-pink: #DB20D2;
--myriad-dkblue: #000091;
--myriad-yellow: #FFCE00;
--myriad-green: #5AE09A;
}
/* Clickable button */
.drg-button {
display: inline-block;
padding: .5em 1em;
text-align: center;
font-variant: small-caps;
border-radius: 7px;
background-color: var(--myriad-blue);
color: rgba(255, 255, 255, .8) !important;
transition: all 400ms;
text-decoration: none !important;
box-shadow: rgba(25, 128, 195, .3) 3px 3px 4px 0px;
}
/* === DRG Footer container === */
#drg-footer {
border-top: 1px solid #ccc;
background: #fff;
padding-top: 2em;
font-family: sans-serif;
color: #000;
font-size: 1.1rem;
margin: 1em 0 2em;
}
/* === Three‐column layout === */
.drg-columns {
display: flex;
justify-content: center;
align-items: stretch;
gap: 2em;
max-width: 1200px;
margin: 0 auto;
flex-wrap: nowrap;
}
.drg-column {
flex: 1 1 33%;
display: flex;
flex-direction: column;
gap: 1em;
min-width: 0;
}
/* Left-aligned with inward padding */
.drg-column-left {
align-items: flex-end;
text-align: right;
padding-right: 1.5em;
}
.drg-column-right {
align-items: flex-start;
text-align: left;
padding-left: 1.5em;
}
.drg-column-left a,
.drg-column-right a {
color: #000;
text-decoration: none;
}
.drg-column-left a:hover,
.drg-column-right a:hover {
text-decoration: underline;
}
/* Divider lines */
.drg-divider {
width: 1px;
background: #666;
opacity: 0.4;
align-self: stretch;
}
/* Center column specifics */
.drg-column-center {
text-align: center;
align-items: center;
justify-content: center;
}
.drg-eu-flag {
margin-bottom: 1em;
}
.drg-eu-flag img {
height: 4em;
width: auto;
max-width: 100%;
}
.drg-eu-text {
font-weight: bold;
line-height: 1.5;
font-size: 1em;
max-width: 400px;
text-align: center;
color: #000;
}
/* Disclaimer block */
.drg-disclaimer {
max-width: 900px;
margin: 2em auto 0;
padding: 1em 0 0;
border-top: 1px solid #eee;
font-size: 0.9em;
color: #666;
text-align: center;
}
.drg-disclaimer a {
color: #374CFF;
text-decoration: underline;
}
/* === Responsive tweaks === */
@media (max-width: 768px) {
.drg-columns {
flex-direction: column;
align-items: center;
}
.drg-divider {
display: none;
}
.drg-column {
width: 100%;
text-align: center !important;
align-items: center !important;
padding: 0 !important;
}
.drg-eu-text {
max-width: 90%;
}
}