MediaWiki

Common.css

From Joomla! Documentation

Revision as of 15:40, 28 April 2013 by Tom Hutchison (talk | contribs) (branding for J1.5 namespace, color and icon in heading)
The printable version is no longer supported and may have rendering errors. Please update your browser bookmarks and please use the default browser print function instead.

Note: After saving, you may have to bypass your browser's cache to see the changes.

  • Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
  • Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
  • Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
  • Opera: Go to Menu → Settings (Opera → Preferences on a Mac) and then to Privacy & security → Clear browsing data → Cached images and files.
/** CSS placed here will be applied to all skins */

/* hides headings on some pages [[MediaWiki:jdoc-hidden-titles]] [[MediaWiki:common.js]] */
body.no-header div#content #siteSub, 
body.no-header div#content #contentSub, 
body.no-header div#content h1.firstHeading { display: none; }

body.page-Main_Page h1.firstHeading,
body.page-Main_Page #contentSub { display:none; }
body.page-Beginners h1.firstHeading,
body.page-Beginners #contentSub { display:none; }
body.page-Intermediate_Beginners h1.firstHeading,
body.page-Intermediate_Beginners #contentSub { display:none; }
body.page-Developers h1.firstHeading,
body.page-Developers #contentSub { display:none; }
body.page-Administrators h1.firstHeading,
body.page-Administrators #contentSub { display:none; }
body.page-Web_designers  h1.firstHeading,
body.page-Web_designers  #contentSub { display:none; }
body.page-Evaluators  h1.firstHeading,
body.page-Evaluators  #contentSub { display:none; }
body.page-JEDL/FAQ h1.firstHeading,
body.page-JEDL/FAQ #contentSub { display:none; }
body.page-Framework_Home h1.firstHeading,
body.page-Framework_Home #contentSub { display:none; }

/* Hiding heading while working on new main page */
body.page-User_Hutchy68_New_main_page h1.firstHeading,
body.page-User_Hutchy68_New_main_page #contentSub { display:none; }

/*Style subpages breadcrumbs */
#content #contentSub .subpages {
width: auto;
font-weight: bold;
-moz-box-shadow: 1px 1px 3px #000;
-webkit-box-shadow: 1px 1px 3px #000;
box-shadow: 1px 1px 3px #000;
padding: 3px 5px;
border-radius: 8px;
}

/* namespace "branding" */
body.ns-4 #content h1.firstHeading { background: url(/images/thumb/7/7f/Documentation_all_together.jpg/80px-Documentation_all_together.jpg) no-repeat right bottom; }

/* Branding-Styling the Main-User-JDOC namespaces - ns-0 2 4 */
body.ns-0 #bodyContent,
body.ns-2 #bodyContent,
body.ns-4 #bodyContent {
      padding: 8px;
      width: auto;
       -moz-box-shadow: 1px 1px 8px #000;
       -webkit-box-shadow: 1px 1px 8px #000;
      box-shadow: 1px 1px 8px #000;
}
body.ns-0 #content h1.firstHeading,
body.ns-2 #content h1.firstHeading,
body.ns-4 #content h1.firstHeading {
       padding: 10px;
       width: auto;
       -moz-box-shadow: 1px 1px 8px #000;
       -webkit-box-shadow: 1px 1px 8px #000;
       box-shadow: 1px 1px 8px #000;
       margin-bottom: 10px;
}
/* Branding the J3.x namespace - ns-146 */
body.ns-146 #bodyContent {
      padding: 8px;
      width: auto;
       -moz-box-shadow: 1px 1px 8px #D4A013;
       -webkit-box-shadow: 1px 1px 8px #D4A013;
      box-shadow: 1px 1px 8px #D4A013;
}
body.ns-146 #content h1.firstHeading {
       padding: 10px;
       width: auto;
       -moz-border-radius: 6px 6px 0 0;
       -webkit-border-radius: 6px 6px 0 0;
       border-radius: 6px 6px 0 0;
       background: url(/images/6/66/J3Icon.png) no-repeat right center;
       -moz-box-shadow: 1px 1px 8px #D4A013;
       -webkit-box-shadow: 1px 1px 8px #D4A013;
       box-shadow: 1px 1px 8px #D4A013;
       margin-bottom: 10px;
}
/* Branding the J2.5 namespace - ns-144 */
body.ns-144 #bodyContent {
      padding: 8px;
      width: auto;
       -moz-box-shadow: 1px 1px 8px #6A379B;
       -webkit-box-shadow: 1px 1px 8px #6A379B;
      box-shadow: 1px 1px 8px #6A379B;
}
body.ns-144 #content h1.firstHeading {
       padding: 10px;
       width: auto;
       -moz-border-radius: 6px 6px 0 0;
       -webkit-border-radius: 6px 6px 0 0;
       border-radius: 6px 6px 0 0;
       background: url(/images/3/34/J25Icon.png) no-repeat right center;
       -moz-box-shadow: 1px 1px 8px #6A379B;
       -webkit-box-shadow: 1px 1px 8px #6A379B;
       box-shadow: 1px 1px 8px #6A379B;
       margin-bottom: 10px;
}

/* Branding the J1.5 namespace - ns-142 */
body.ns-142 #bodyContent {
      padding: 8px;
      width: auto;
       -moz-box-shadow: 1px 1px 8px #9bda6e;
       -webkit-box-shadow: 1px 1px 8px #9bda6e;
      box-shadow: 1px 1px 8px #9bda6e;
}
body.ns-142 #content h1.firstHeading {
       padding: 10px;
       width: auto;
       -moz-border-radius: 6px 6px 0 0;
       -webkit-border-radius: 6px 6px 0 0;
       border-radius: 6px 6px 0 0;
       background: url(/images/0/0a/J15_icon.png) no-repeat right center;
       -moz-box-shadow: 1px 1px 8px #9bda6e;
       -webkit-box-shadow: 1px 1px 8px #9bda6e;
       box-shadow: 1px 1px 8px #9bda6e;
       margin-bottom: 10px;
}

/* disamb and dablink CSS */
#disambig, .dablink {
  border:2px solid silver;
  border-width: 1px 0px;
  background:white;
  margin:0.5ex 1em 0.5ex 1.5em;
}

.dablink {
   border-width:1px 0;
   padding:0.5ex 1em 0.5ex 1ex;
   font-style:italic;
}

/* template-documentation */
.template-documentation {
  border:1px solid #001450; background:#f1f2f7; padding:1ex; margin-top:1em;
}

#template_doc_page_viewed_directly,
#template_doc_page_transcluded {
  text-align:center;
  width: 95%;
  margin:0 auto;
  border:1px solid #d0d0d0;
  background:white;
  color:#666;
}

/* Article message box template styles */
table.ambox {
    margin: .25em 7%;                       /* Will not overlap with other elements */
    border-collapse: collapse;
    background: #fbfbfb; 
    border: 1px solid #aaa; 
    border-left: 10px solid #1e90ff;     /* Default "notice" blue */
}
table.ambox th.ambox-text, table.ambox td.ambox-text {      /* The message body cell(s) */
    padding: 0.25em 0.5em;            /* 0.5em left/right */
    width: 100%;                      /* Make all templates the same width regardless of text size */
}
table.ambox td.ambox-image {          /* The left image cell */
    padding: 2px 0px 2px 0.5em;       /* 0.5em left, 0px right */
    text-align: center; 
}
table.ambox td.ambox-imageright {     /* The right image cell */
    padding: 2px 4px 2px 0px;         /* 0px left, 4px right */
    text-align: center; 
}
/* J! Logo Colors - red: #ED2E38 blue: #578AD6 orange: #EBAD14 green: #61BF1A */
table.ambox-notice {
  border-left: 10px solid #578AD6 ;  /* Blue */
}

table.ambox-serious {
  border-left: 10px solid #ED2E38 ;  /* Red S+I WG */
}
table.ambox-delete  {
  border-left: 10px solid orange;  /* Orange S+I WG */
  background-color: #ffc;
}
table.ambox-content {
  border-left: 10px solid #EBAD14 ;   /* Orange (Dev WG) */
  background-color: #F2FEC5;          /* Complimentary to border */
}
table.ambox-style {
  border-left: 10px solid #C16B42;    /* Umbra (Trans WG) */
}
table.ambox-merge {
  border-left: 10px solid #C348C3;    /* Purple (Doc WG) */
}
table.ambox-split {
  border-left: 10px solid #C348C3;    /* Purple (Doc WG) */
}
table.ambox-growth {
  border-left: 10px solid #61BF1A ;  /* Green (Found WG) */
}
table.ambox-protection {
  border-left: 10px solid #bba;      /* Gray */
}
table.ambox-archive {
  border: 1px solid #F28500;      /* Mixed (Orange/Yellowish) */
  background-color: #FF9;
}
table.ambox-none {
  border-left: 1px solid #aaa;
}
table.ambox.ambox-mini {             /* small floating box variant */
    float: right;
    clear: right;
    margin: 0 0 0 1em;
    width: 25%;
}

/** Table formatting **/
table.wikitable,
table.prettytable {
  margin:1em 1em 1em 0;
  background:#F9F9F9;
  border:1px #AAA solid;
  border-collapse:collapse;
  }

table.wikitable th, table.wikitable td,
table.prettytable th, table.prettytable td {
  border:1px #AAA solid;
  padding:0.2em;
  }

table.wikitable th,
table.prettytable th {
  background:#F2F2F2;
  text-align:center;
  }

table.wikitable caption,
table.prettytable caption {
  margin-left:inherit;
  margin-right:inherit;
  }

/*
 * (floating) box formatting
 */
.infobox {
  float:right;
  clear:right;
  margin-bottom:0.5em;
  margin-left:1em;
  padding:0.2em;
  border:1px solid #AAA;
  background:#F9F9F9;
  color:black;
  }

.infobox td,
.infobox th {
  vertical-align:top;
  }

.infobox caption {
  font-size:larger;
  margin-left:inherit;
  }

.infobox.bordered {
  border-collapse:collapse;
  }

.infobox.bordered td,
.infobox.bordered th {
  border:1px solid #AAA;
  }

.infobox.bordered .borderless td,
.infobox.bordered .borderless th {
  border:0;
  }

/*
 * Messagebox templates - see talkpage for examples
 * Imported from [[en:MediaWiki:Common.css]] on 2007-07-13
 */
.messagebox{
   border: 1px solid #aaa;
   background-color: #f9f9f9;
   width: 80%;
   margin: 0 auto 1em auto;
   padding: .2em;
}
.messagebox.merge {
   border: 1px solid #c0b8cc;
   background-color: #f0e5ff;
   text-align: center;
}
.messagebox.split {
   border: 1px solid #c0b8cc;
   background-color: #f0e5ff;
   text-align: center;
}
.messagebox.cleanup {
   border: 1px solid #9f9fff;
   background-color: #efefff;
   text-align: center;
}
.messagebox.standard-talk {
   border: 1px solid #c0c090;
   background-color: #f8eaba;
}
.messagebox.nested-talk {
   border: 1px solid #c0c090;
   background-color: #f8eaba;
   width: 100%;
   margin: 2px 4px 2px 4px;
}
.messagebox.small {
   width: 238px;
   font-size: 85%;
   float: right;
   clear: both;
   margin: 0 0 1em 1em;
   line-height: 1.25em; 
}

/* Default style for pre source and geshi */

pre { 
        overflow-x: auto;
        overflow-y: visible;
        font-size:0.95em;
        background-color:#EEEEEE;
}
source { 
        overflow-x: auto;
        overflow-y: visible;
        font-size:0.95em;
        background-color:#f0f0f0;
        margin: 1em 0;
}

code { 
        font-size:1.05em;
        background-color: #f0f0f0;
        padding: 2px;
}

/* Make sub and superscripts look nice in articles */

sub, sup { 
    font-size: 75%;
    line-height: 0; 
    position: relative; 
    vertical-align: baseline; 
}
 
sup { 
    top: -0.5em; 
}
 
sub { 
    bottom: -0.25em; 
}

/* Default style for navigation boxes */

table.navbox {
	/* Navbox container style */
	border: 1px solid #aaa;
	width: 100%;
	margin: auto;
	clear: both;
	font-size: 88%;
	text-align: center;
	padding: 1px;
}
table.navbox + table.navbox {
	/* Single pixel border between adjacent navboxes */
	margin-top: -1px;
	/* (doesn't work for IE6, but that's okay) */
}
.navbox th,
.navbox-title,
.navbox-abovebelow {
	text-align: center;
	/* Title and above/below styles */
	padding-left: 1em;
	padding-right: 1em;
}
th.navbox-group {
	/* Group style */
	white-space: nowrap;
	/* @noflip */
	text-align: right;
}
.navbox,
.navbox-subgroup {
	background: #fdfdfd;
}
.navbox-list {
	/* Must match background color */
	border-color: #fdfdfd;
}
.navbox th,
.navbox-title {
	/* Level 1 color */
	background: #ccccff;
}
.navbox-abovebelow,
th.navbox-group,
.navbox-subgroup .navbox-title {
	/* Level 2 color */
	background: #ddddff;
}
.navbox-subgroup .navbox-group,
.navbox-subgroup .navbox-abovebelow {
	/* Level 3 color */
	background: #e6e6ff;
}
.navbox-even {
	/* Even row striping */
	background: #f7f7f7;
}
.navbox-odd {
	/* Odd row striping */
	background: transparent;
}
.navbox .hlist td dl,
.navbox .hlist td ol,
.navbox .hlist td ul,
.navbox td.hlist dl,
.navbox td.hlist ol,
.navbox td.hlist ul {
	/* Adjust hlist padding in navboxes */
	padding: 0.125em 0;
}
.navbox .hlist dd,
.navbox .hlist dt,
.navbox .hlist li {
	/* Nowrap list items in navboxes */
	white-space: nowrap;
	/* IE < 8 no-wraps entire list, so disable it */
	white-space: normal !ie;
}
.navbox .hlist dd dl,
.navbox .hlist dt dl,
.navbox .hlist li ol,
.navbox .hlist li ul {
	/* But allow parent list items to be wrapped */
	white-space: normal;
}
ol + table.navbox,
ul + table.navbox {
	/* Prevent lists from clinging to navboxes */
	margin-top: 0.5em;
}
 
/* Default styling for Navbar template */
.navbar {
	display: inline;
	font-size: 88%;
	font-weight: normal;
}
.navbar ul {
	display: inline;
	white-space: nowrap;
}
.navbar li {
	word-spacing: -0.125em;
}
 
/* Navbar styling when nested in navbox */
.navbox .navbar {
	display: block;
	font-size: 100%;
}
.navbox-title .navbar {
	/* @noflip */
	float: left;
	/* @noflip */
	text-align: left;
	/* @noflip */
	margin-right: 0.5em;
	width: 6em;
}
/** Collapsible tables *********************************************************
 *
 *  Description: Allows tables to be collapsed, showing only the header. See
 *  http://www.mediawiki.org/wiki/Manual:Collapsible_tables.
 *  Maintainers: [[en:User:R. Koot]]
 */
 
table.collapsed tr.collapsible {
        display: none;
}
 
.collapseButton {               /* 'show'/'hide' buttons created dynamically by the             */
        float: right;           /* CollapsibleTables JavaScript in [[MediaWiki:Common.js]] */
        font-weight: normal;    /* are styled here so they can be customised.             */
        text-align: right;
        width: auto;
}

/* Category Namespace improvements in style */

.ns-14 h1.firstHeading {
	border: 2px solid #F6F6F6 !important;
        border-bottom:none !important;
        background-color:#d0e5f5 !important;
        padding-bottom:3px !important;
        padding-left:5px !important;
        padding-top:3px !important;
        margin-bottom:-5px !important;
        -moz-border-radius:10px 10px 0 0 !important;
        border-radius:10px 10px 0 0 !important;
} 
.ns-14 #bodyContent #siteSub {
       display: none !important;
}

.ns-14 #bodyContent #contentSub {
       display: none !important;
}

.ns-14 #bodyContent #mw-content-text #mw-subcategories {
       border: 1px solid #abd5f5 !important;
       padding: 5px !important;
       margin-top: 10px;
}

/* Portal CSS, modified by Hutchy68
   On wide screens, show these as two columns
   On narrow and mobile screens, let them collapse into a single column */
.portal-column-left {
    float: left;
    width: 55%;
}
.portal-column-right {
    float: right;
    width: 44%;
}
.portal-column-left-wide {
    float: left;
    width: 60%;
}
.portal-column-right-narrow {
    float: right;
    width: 39%;
}
.portal-column-left-extra-wide {
    float: left;
    width: 70%;
}
.portal-column-right-extra-narrow {
    float: right;
    width: 29%;
}
.portal-column-left-narrow {
    float: left;
    width: 44%;
}
.portal-column-right-wide {
    float: right;
    width: 55%;
}
@media only screen and (max-width: 800px) {
    /* Decouple the columns on narrow screens */
    .portal-column-left,
    .portal-column-right,
    .portal-column-left-wide,
    .portal-column-right-narrow,
    .portal-column-left-extra-wide,
    .portal-column-right-extra-narrow,
    .portal-column-left-narrow,
    .portal-column-right-wide {
        float: inherit;
        width: inherit;
    }
}


/* Tweak for Google Adsense */
#google_ads_div_Joomla_Documentation {
   margin-left: auto;
   margin-right: auto;
   width: 118px;
}

/* hlist CSS for horizontal list improvements */
/* Default skin for navigation boxes */
.hlist dl,
.hlist ol,
.hlist ul {
    margin: 0;
    padding: 0;
}
/* Display list items inline and make them nowrap */
.hlist dd,
.hlist dt,
.hlist li {
    margin: 0;
    display: inline-block;
    white-space: nowrap;
}
/* Allow wrapping for list items (in tight spaces) */
.hlist.hwrap dd,
.hlist.hwrap dt,
.hlist.hwrap li {
    white-space: normal;
}
/* Display nested lists inline and allow them to wrap */
.hlist dl dl, .hlist dl ol, .hlist dl ul,
.hlist ol dl, .hlist ol ol, .hlist ol ul,
.hlist ul dl, .hlist ul ol, .hlist ul ul {
    display: inline;
    white-space: normal;
}
/* Generate interpuncts */
.hlist dt:after {
    content: ":";
}
.hlist dd:after,
.hlist li:after {
    content: " ·";
    font-weight: bold;
}
.hlist dd:last-child:after,
.hlist dt:last-child:after,
.hlist li:last-child:after {
    content: none;
}
/* For IE8 */
.hlist dd.hlist-last-child:after,
.hlist dt.hlist-last-child:after,
.hlist li.hlist-last-child:after {
    content: none;
}
/* Add parentheses around nested lists */
.hlist dd dd:first-child:before, .hlist dd dt:first-child:before, .hlist dd li:first-child:before,
.hlist dt dd:first-child:before, .hlist dt dt:first-child:before, .hlist dt li:first-child:before,
.hlist li dd:first-child:before, .hlist li dt:first-child:before, .hlist li li:first-child:before {
    content: "(";
    font-weight: normal;
}
.hlist dd dd:last-child:after, .hlist dd dt:last-child:after, .hlist dd li:last-child:after,
.hlist dt dd:last-child:after, .hlist dt dt:last-child:after, .hlist dt li:last-child:after,
.hlist li dd:last-child:after, .hlist li dt:last-child:after, .hlist li li:last-child:after {
    content: ")";
    font-weight: normal;
}
/* For IE8 */
.hlist dd dd.hlist-last-child:after, .hlist dd dt.hlist-last-child:after, .hlist dd li.hlist-last-child:after,
.hlist dt dd.hlist-last-child:after, .hlist dt dt.hlist-last-child:after, .hlist dt li.hlist-last-child:after,
.hlist li dd.hlist-last-child:after, .hlist li dt.hlist-last-child:after, .hlist li li.hlist-last-child:after {
    content: ")";
    font-weight: normal;
}
/* Put numbers in front of ordered list items */
.hlist.hnum ol {
    counter-reset: list-item;
}
.hlist.hnum ol > li {
    counter-increment: list-item;
}
.hlist.hnum ol > li:before {
    content: counter(list-item) " ";
}
.hlist.hnum dd ol > li:first-child:before,
.hlist.hnum dt ol > li:first-child:before,
.hlist.hnum li ol > li:first-child:before {
    content: "(" counter(list-item) " ";
}
 
/* Unbulleted lists */
.plainlist ul {
    line-height: inherit;
    list-style: none none;
    margin: 0;
}
.plainlist ul li {
    margin-bottom: 0;
}

/* HeaderTab Improvements */
#headertabs { font-size:1em; }
#headertabs .ui-widget { font-family: sans-serif; font-size:1em;} 
#headertabs .ui-widget .ui-widget { font-size: 1em; }
#headertabs .ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button { font-family: sans-serif; font-size: 1em; }
#headertabs .ui-widget-content { border: none; /* @embed */ 
background: #f2f5f7 url(images/ui-bg_highlight-hard_100_f2f5f7_1x100.png) 50% top repeat-x; color: #362b36; }
#headertabs .ui-widget-content a { color:#0645AD; }
#headertabs .ui-widget-content a:visited { color:#0b0080; }
#headertabs .ui-widget-content a.new { color:#CC2200; }
#headertabs .ui-widget-content a.new:visited { color:#A55858; }
#headertabs .ui-widget-content a.extiw { color:#3366BB; }
#headertabs .ui-widget-content a.redirect { color:#308050; } /*Color redirect links*/
#headertabs .ui-widget-content a.redirect:visited { color:#3070A0; } /*Color redirect links*/
#headertabs .ui-widget-shadow { margin: -7px 0 0 -7px; padding: 7px; /* @embed */ 
background: #000000 url(images/ui-bg_flat_70_000000_40x100.png) 50% 50% repeat-x; opacity: .20;filter:Alpha(Opacity=20); 
-moz-border-radius: 8px; -webkit-border-radius: 8px; border-radius: 8px; }
.ui-tabs { position: relative; zoom: 1; }
.ui-tabs .ui-tabs-panel { display: block; border-width: 0; padding: 1em 1.4em; background: none; }

/* wikiEditor fixed with !important */
.wikiEditor-ui-toolbar .group {
    border-right: solid 1px #DDDDDD !important;
}