MediaWiki:Common.css: Difference between revisions
Jump to navigation
Jump to search
No edit summary |
No edit summary |
||
| (33 intermediate revisions by the same user not shown) | |||
| Line 1: | Line 1: | ||
/* CSS placed here will be applied to all skins */ | /* CSS placed here will be applied to all skins */ | ||
/********/ | |||
/* LOFE */ | |||
/********/ | |||
. | /* This styling will be applied to all pages in the LOFE and Library of Formatting Examples namespaces */ | ||
} | .ns-3001 #content, .ns-3002 #content, .ns-3003 #content, .ns-3004 #content {background-color:#f6f6f6; } | ||
. | .ns-3001 #content .navbar, .ns-3002 #content .navbar, .ns-3003 #content .navbar, .ns-3004 #content .navbar { | ||
background-color:white; | |||
} | } | ||
/* Remove the sidebar from Library pages (3002 namespace) only */ | |||
.ns-3002 #mw-panel {visibility: hidden;} | |||
.ns-3002 #content {margin-left:0;} | |||
} | |||
/* | /* Div and image styles used on Example pages, Most of these are set by the LOFE Example templates. */ | ||
div.lofe- | div.lofe-examples { | ||
display:flex; | |||
justify-content:center; | |||
align-items:flex-start; | |||
flex-direction:row; | |||
flex-wrap:wrap; | |||
} | |||
/* | /* Individual example wrappers */ | ||
div.lofe- | div.lofe-example { | ||
padding:1em; | |||
} | |||
/* | /* Image examples */ | ||
.lofe-image, .lofe-image img { | |||
width:100%; | |||
} | } | ||
.lofe-image img { | |||
height:auto; | |||
} | } | ||
div.lofe- | div.lofe-text { | ||
width:100%; | |||
margin-top:0; | |||
background-color: white; | |||
} | } | ||
/* Text examples */ | |||
div.lofe-text pre { | |||
background-color: white; | |||
margin-top:0; | |||
} | } | ||
/* Discussion block */ | |||
div.lofe-discussion { | div.lofe-discussion { | ||
| Line 79: | Line 66: | ||
clear:both; | clear:both; | ||
margin-top:1em; | margin-top:1em; | ||
padding:0.5em; | padding:0.5em; | ||
} | } | ||
| Line 85: | Line 71: | ||
/* Allow shrinking side by side text slightly to fit better in medium screens */ | /* Allow shrinking side by side text slightly to fit better in medium screens */ | ||
div.lofe-size-small { | div.lofe-size-small { | ||
font-size: | font-size:90%; | ||
} | } | ||
| Line 98: | Line 80: | ||
} | } | ||
/* Width classes */ | |||
. | /* Set the width in ems for each example image */ | ||
} | div.lofe-image-width-15 {width:15em;} | ||
div.lofe-image-width-20 {width:20em;} | |||
div.lofe-image-width-25 {width:25em;} | |||
div.lofe-image-width-30 {width:30em;} | |||
div.lofe-image-width-35 {width:35em;} | |||
div.lofe-image-width-40 {width:40em;} | |||
div.lofe-image-width-45 {width:45em;} | |||
div.lofe-image-width-50 {width:50em;} | |||
div.lofe-image-width-55 {width:55em;} | |||
div.lofe-image-width-60 {width:60em;} | |||
div.lofe-image-width-65 {width:65em;} | |||
div.lofe-image-width-70 {width:70em;} | |||
/* | /* Set the minimum width in ems for each example text block */ | ||
. | div.lofe-text-width-20 {min-width:20em;} | ||
. | div.lofe-text-width-25 {min-width:25em;} | ||
div.lofe-text-width-30 {min-width:30em;} | |||
div.lofe-text-width-35 {min-width:35em;} | |||
div.lofe-text-width-40 {min-width:40em;} | |||
div.lofe-text-width-45 {min-width:45em;} | |||
div.lofe-text-width-50 {min-width:50em;} | |||
div.lofe-text-width-55 {min-width:55em;} | |||
div.lofe-text-width-60 {min-width:60em;} | |||
div.lofe-text-width-65 {min-width:65em;} | |||
div.lofe-text-width-70 {min-width:70em;} | |||
div.lofe-text-width-75 {min-width:75em;} | |||
div.lofe-text-width-100 {min-width:100em;} | |||
Latest revision as of 11:44, 27 December 2025
/* CSS placed here will be applied to all skins */
/********/
/* LOFE */
/********/
/* This styling will be applied to all pages in the LOFE and Library of Formatting Examples namespaces */
.ns-3001 #content, .ns-3002 #content, .ns-3003 #content, .ns-3004 #content {background-color:#f6f6f6; }
.ns-3001 #content .navbar, .ns-3002 #content .navbar, .ns-3003 #content .navbar, .ns-3004 #content .navbar {
background-color:white;
}
/* Remove the sidebar from Library pages (3002 namespace) only */
.ns-3002 #mw-panel {visibility: hidden;}
.ns-3002 #content {margin-left:0;}
/* Div and image styles used on Example pages, Most of these are set by the LOFE Example templates. */
div.lofe-examples {
display:flex;
justify-content:center;
align-items:flex-start;
flex-direction:row;
flex-wrap:wrap;
}
/* Individual example wrappers */
div.lofe-example {
padding:1em;
}
/* Image examples */
.lofe-image, .lofe-image img {
width:100%;
}
.lofe-image img {
height:auto;
}
div.lofe-text {
width:100%;
margin-top:0;
background-color: white;
}
/* Text examples */
div.lofe-text pre {
background-color: white;
margin-top:0;
}
/* Discussion block */
div.lofe-discussion {
display:block;
clear:both;
margin-top:1em;
padding:0.5em;
}
/* Allow shrinking side by side text slightly to fit better in medium screens */
div.lofe-size-small {
font-size:90%;
}
div.lofe-size-normal {
font-size:100%;
}
/* Width classes */
/* Set the width in ems for each example image */
div.lofe-image-width-15 {width:15em;}
div.lofe-image-width-20 {width:20em;}
div.lofe-image-width-25 {width:25em;}
div.lofe-image-width-30 {width:30em;}
div.lofe-image-width-35 {width:35em;}
div.lofe-image-width-40 {width:40em;}
div.lofe-image-width-45 {width:45em;}
div.lofe-image-width-50 {width:50em;}
div.lofe-image-width-55 {width:55em;}
div.lofe-image-width-60 {width:60em;}
div.lofe-image-width-65 {width:65em;}
div.lofe-image-width-70 {width:70em;}
/* Set the minimum width in ems for each example text block */
div.lofe-text-width-20 {min-width:20em;}
div.lofe-text-width-25 {min-width:25em;}
div.lofe-text-width-30 {min-width:30em;}
div.lofe-text-width-35 {min-width:35em;}
div.lofe-text-width-40 {min-width:40em;}
div.lofe-text-width-45 {min-width:45em;}
div.lofe-text-width-50 {min-width:50em;}
div.lofe-text-width-55 {min-width:55em;}
div.lofe-text-width-60 {min-width:60em;}
div.lofe-text-width-65 {min-width:65em;}
div.lofe-text-width-70 {min-width:70em;}
div.lofe-text-width-75 {min-width:75em;}
div.lofe-text-width-100 {min-width:100em;}