MediaWiki:Common.css: Difference between revisions

Revision as of 11:10, 16 July 2022

/* Delete talk tab */
#ca-talk { display:none!important; }
/* Delete pages tab */
#ca-nstab-main { display:none!important; }
/* Delete read tab */
#ca-view { display: none !important; }
/* Delete view history tab */
#ca-history { display: none !important;}
/* Delete view source tab */
#ca-viewsource { display: none !important; }

/* Remove Tools menu */
#p-tb { display: none; }

/* Display MediaWiki:Tagline text below main article header */
#siteSub {
	display: inline;
	font-size: 1.1em;
	font-weight: normal;
	font-style: italic; }

/* Hide Tagline on Main Page */
body.page-Main_Page.action-view #siteSub,
body.page-Main_Page.action-submit #siteSub {display: none;}

/* Table of Contents */
#toc { width: 390px; font-size: 1em; }

/* Sidebar */
#mw-panel .portal a, #mw-panel .portal a:visited {font-size: 1.2em !important; }

p { font-size: 1.11em; line-height: 142%; }

/* Page Title */
.mw-body h1, .mw-body-content h1 { font-size: 2.25em; }

/* Images should be responsive */
.image img { width:100%; height:auto; }

.infobox {
    font-size: 1em;
    border: solid 1px #aaa;
    float: right;
    margin: 0 0 1em 1em;
    padding: 1em;
    width: 235px; }

.infobox p {
    font-size: 1.2em; 
    font-family: serif; 
    padding: 0; margin: 0; 
    border-bottom: 1px solid #aaa; 
    width: 100%; 
    display: block; }

.red { color: red; font-size: 18pt; }

.home {
    font-size: 0.9em;
    border: 1px solid #aaa !important;
    float: left;  
    display: block;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    width: 100%; }

#welcome {
    background-image: url("https://"); 
    background-repeat: repeat-x repeat-y;
    background-position: center;
    padding: 0 !important; 
    margin: 0 0 5px 0; 
    text-align: center;
    font-size: 1.2em; }

.box { display: flex; width: 100%; padding: 0 !important; margin-bottom: 5px; }

.col { text-align: left; padding: 10px; }

.left1 { width: 76%; background-color: #f5fafe !important; margin-right: 5px; border: 1px solid #cedff1 !important; line-height: 100%; } /* Wikiblue1 */
.right2 { width: 24%; background-color: #f4fff9 !important; border: 1px solid #cdf2e0 !important; line-height: 100%; } /* Wikigreen1 */

.left3 { font-size: 0.9em; line-height: 120%; width: 33%; background-color: #FFFFF0 !important; margin-right: 2.5px; border: 1px solid #FFE4C4 !important; line-height: 100%; } /* Ivory  */
.center4 { font-size: 0.9em; line-height: 120%; width: 33%; background-color: #FFFFE0 !important; margin-left: 2.5px; margin-right: 2.5px; border: 1px solid #EEE8AA !important; line-height: 100%; } /* LightYellow */
.right5 { font-size: 0.9em; line-height: 120%; width: 33%; background-color: #FFFAF0 !important; margin-left: 2.5px; border: 1px solid #FFDAB9 !important; line-height: 100%; } /* FloralWhite */

.left6 { font-size: 0.9em; line-height: 120%; width: 100%; background-color: #FFF5EE !important; line-height: 100%; } /* SeaShell */

.title { 
   display: block; 
   font-size: 14pt;
   box-sizing: border-box;
   -webkit-box-sizing: border-box;
   -moz-box-sizing: border-box; }

.title1 { background-color: #cedff1 !important; border: none; padding: 2px 0 3px 0 !important; } /* Wikiblue2 */
.title2 { background-color: #cdf2e0 !important; border: none; padding: 2px 0 3px 0 !important; } /* Wikigreen2 */
.title3 { background-color: #ffe4c4 !important; border: none; padding: 2px 0 3px 0 !important; } /* Bisque */
.title4 { background-color: #eee8aa !important; border: none; padding: 2px 0 3px 0 !important; } /* PaleGoldenRod */
.title5 { background-color: #ffdab9 !important; border: none; padding: 2px 0 3px 0 !important; } /* PeachPuff */
.title6 { background-color: #eee8aa !important; border: none; padding: 2px 0 3px 0 !important; } /* LavendarBlush */

/* COLORS
   LightSteelBlue #B0C4DE PowderBlue #B0E0E6 AliceBlue #F0F8FF
   MintCream #F5FFFA Azure #F0FFFF HoneyDew #F0FFF0
   Bisque #FFE4C4 OldLace #FDF5E6 AntiqueWhite #FAEBD7 CornSilk #FFF8DC FloralWhite #FFFAF0
   Ivory #FFFFF0 LemonChiffon #FFFACD LightGoldenRod #FAFAD2 LightYellow #FFFFE0 PaleGoldenRod #EEE8AA
   PeachPuff #FFDAB9 MistyRose #FFE4E1 LavendarBlush #FFF0F5 Linen #FAF0E6 OldLace #FDF5E6 PapayaWhip #FFEFD5 SeaShell #FFF5EE
   WhiteSmoke #F5F5F5 Snow #FFFAFA White #FFFFFF 
   NavajoWhite #FFDEAD
*/


/* NAV_pageTree */

/* Remove default bullets */
div#pageTree ul { list-style-type: none; padding-left: 5px; }

/* Remove bullets */ 
div#pageTree li { list-style-position: outside; overflow: hidden; margin-left: -16px; }} 

/* Remove margins and padding from parent ul */
#pageTree { margin: 0; padding: 0; }

/* Style caret/arrow */
.caret { cursor: pointer; user-select: none; /* Prevent text selection */ }

/* Create caret/arrow with unicode, and style it */
.caret::before { content: "\25B6"; color: black; display: inline-block; margin-right: 7px; }

/* Rotate caret/arrow when clicked (using JavaScript) */
.caret-down::before { transform: rotate(90deg); }

/* Hide nested list */
.nested { display: none; }

/* Show nested list when user clicks caret/arrow (with JavaScript) */
.active { display: block; }

container {
    position: relative;
    width: 25%;
    /* whatever width you want. I was implementing this in a 4 tile grid pattern. I used javascript to set height equal to width */
    border: 2px solid #fff;
    /* just to separate the images */
    overflow: hidden;
    /* "crop" the image */
    background: #000;
    /* incase the image is wider than tall/taller than wide */ }

.container img {
    position: absolute;
    display: block;
    height: 100%;
    /* all images at least fill the height */
    top: 50%;
    /* top, left, transform trick to vertically and horizontally center image */
    left: 50%;
    transform: translate3d(-50%, -50%, 0); }