Difference between revisions of "MediaWiki:Common.css"

From GURaaS Developer Community
 
 
(112 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 */


/*Main page*/
/*GENERAL VISUAL STYLE FOR WIKI*/
/**MAIN PAGE STYLESHEET**/


table#mainpagenavigation {
/**Settings for full background**/
/*border: 1px solid #000000;*/
#content-wrapper{
box-shadow:rgba(0,0,0,0.25) 0 0 0.75em;
background-image: linear-gradient(rgba(35,203,240,1) 0%, rgba(35,203,240,1) 5%, rgba(35,203,240,0.8) 10%, rgba(64,146,255,0.8) 90%, rgba(114,103,198,1) 100%), url(/resources/assets/images_dev/Site_Background_Clear.jpg);
background-attachment: fixed;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
}


.page-Main_Page h1.firstHeading#firstHeading {
/**Settings for full background of actual content**/
display:none;
#content{
background-color: rgba(255,255,255, 0.75);
}
}


#mainpagenavigation {
/**Settings for header**/
display:block;
#header-wrapper{
border-collapse:collapse;
background: rgba(35, 203, 240, 1.0);
text-align:left
border-bottom: rgba(35, 203, 240, 1.0);
background
}
}


#mainpagenavigation th {
/**.search {
/*font-size:1.7692307692em;*/
background-color: #ffffff00;
font-size:20px;
borgder: 1px solid #ffffff;
color:#fff;
}**/
/*text-shadow:rgba(0,0,0,0.75) 0 0 .25em;*/
background-color:#4fb9cf;
font-weight:400;
height:48px;
text-align:center;
font-size-adjust:0.43
}


#mainpagenavigation th.header_sub {
/**Settings for logo**/
height:24px;
#logo{
color:rgba(255,255,255, 1);
}
}


#mainpagenavigation th h3{
/* ------------------------------------------------------------------------- */
font-size:25px;
padding-top:0px;
color:#fff;
 
background-color:#444;
font-weight:400;
height:48px;
text-align:center;
font-size-adjust:0.43
}
 
#mainpagenavigation td {
background-color:#fff;
filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#ffffffff,EndColorStr=#ffffffff);
background-image: linear-gradient(top, #bbb 0%, #fff 2%, #fff 100%);
background-image: -o-linear-gradient(top, #bbb 0%, #fff 2%, #fff 100%);
background-image: -moz-linear-gradient(top, #bbb 0%, #fff 2%, #fff 100%);
background-image: -webkit-linear-gradient(top, #bbb 0%, #fff 2%, #fff 100%);
background-image: -ms-linear-gradient(top, #bbb 0%, #fff 2%, #fff 100%);
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #bbb), color-stop(.02, #fff), color-stop(1, #fff));
/*height:250px;*/
}
 
#mainpagenavigation td.content {vertical-align:top;padding:.5em 1.5em;}
#mainpagenavigation td.separator {border-right:#aaa solid 1px}
 
/*Editing tags on the main page*/
#mainpagenavigation h5{
position:absolute;
margin-left:180px;
}
/*Main page (padding, not used)*/
/* body.page-Main_Page.ns-subject #content,body.page-Main_Page_editcopy.ns-subject #content {padding-left:1em;padding-right:1em}*/
 
/*Float the table of contents right*/
#toc { float: right };
.toctoggle { float: right };


/*GENERAL VISUAL STYLE FOR TEXT*/


/* Style for horizontal lists (separator following item).
/* Adding varying font faces*/
  IE8-specific classes are assigned in [[MediaWiki:Common.js/IEFixes.js]].
@font-face {
  @source mediawiki.org/wiki/Snippets/Horizontal_lists
     font-family: 'Bebas Neue';
  @revision 6 (2014-05-09)
     src: url('/resources/assets/fonts/BebasNeue-Book.woff') format('woff');
  @author [[User:Edokter]]
     font-weight: 300;
*/
     font-style: normal;
.hlist dl,
.hlist ol,
.hlist ul {
     margin: 0;
     padding: 0;
}
/* Display list items inline */
.hlist dd,
.hlist dt,
.hlist li {
    margin: 0;
    display: inline;
}
/* Display nested lists inline */
.hlist.inline,
.hlist.inline dl,
.hlist.inline ol,
.hlist.inline ul,
.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;
}
/* Generate interpuncts */
.hlist dt:after {
     content: ": ";
}
}
.hlist dd:after,
@font-face {
.hlist li:after {
    font-family: 'Bebas Neue Bold';
     content: " · ";
     src: url('/resources/assets/fonts/BebasNeue-Bold.woff') format('woff');
     font-weight: bold;
     font-weight: bold;
    font-style: normal;
}
}
.hlist dd:last-child:after,
@font-face {
.hlist dt:last-child:after,
    font-family: 'Muli';
.hlist li:last-child:after {
     src: url('/resources/assets/fonts/Muli-Regular.woff') format('woff');
     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;
     font-weight: normal;
    font-style: normal;
}
}
.hlist dd dd:last-child:after, .hlist dd dt:last-child:after, .hlist dd li:last-child:after,
@font-face {
.hlist dt dd:last-child:after, .hlist dt dt:last-child:after, .hlist dt li:last-child:after,
    font-family: 'Muli Bold';
.hlist li dd:last-child:after, .hlist li dt:last-child:after, .hlist li li:last-child:after {
    src: url('/resources/assets/fonts/Muli-Black.woff') format('woff');
     content: ") ";
     font-weight: 900;
     font-weight: normal;
     font-style: bold;
}
}
/* For IE8 */
@font-face {
.hlist dd dd.hlist-last-child:after, .hlist dd dt.hlist-last-child:after, .hlist dd li.hlist-last-child:after,
    font-family: 'Muli Italic';
.hlist dt dd.hlist-last-child:after, .hlist dt dt.hlist-last-child:after, .hlist dt li.hlist-last-child:after,
    src: url('/resources/assets/fonts/Muli-Italic.woff') format('woff');
.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;
     font-weight: normal;
    font-style: italic;
}
}
/* Put ordinals in front of ordered list items */
@font-face {
.hlist ol {
    font-family: 'Muli Light';
     counter-reset: listitem;
    src: url('/resources/assets/fonts/Muli-Light.woff') format('woff');
    font-weight: 300;
     font-style: normal;
}
}
.hlist ol > li {
@font-face {
     counter-increment: listitem;
    font-family: 'Muli Light';
    src: url('/resources/assets/fonts/Muli-Light.woff') format('woff');
    font-weight: 300;
     font-style: normal;
}
}
.hlist ol > li:before {
@font-face {
     content: " " counter(listitem) " ";
     font-family: 'Roboto';
     white-space: nowrap;
     src: url('/resources/assets/fonts/Roboto-Regular-webfont.woff') format('woff');
}
    font-weight: normal;
.hlist dd ol > li:first-child:before,
     font-style: normal;
.hlist dt ol > li:first-child:before,
.hlist li ol > li:first-child:before {
     content: " (" counter(listitem) " ";
}
}


/*Don't float the horizontal list by default*/
body {
#toc.toc.hlist {
  font-family: "Roboto", normal;
float:none;
  color:#292929;
}
}


/*learned things header*/
#content h1{
.learned_heading {
  color: #292929;
#background-color:#d0eed0;
  font-family: "Bebas Neue Bold", normal;
background-color:#c9f9ff;
  font-size: 350%;
padding: 1px 1px 10px 12px;
  line-height: 0%;
}
}
 
#content h2 {
/*boxes with steps in the editor*/
  color:#292929;
.editor_location_box {
  font-family: "Bebas Neue Bold", normal;
margin-top:25px;
  font-size: 250%;
margin-bottom:25px;
  line-height: 0%;
}
}
 
#content h3 {
.editor_steps_box {
  color:#292929;
display:inline-block;
  font-family: "Bebas Neue", normal;
border-style:dashed;
  font-size: 200%;
border-color:#808080;
  line-height: 0%;
background-color:#e4e4ee;
padding-right:40px;
margin-left:40px;
vertical-align:top;
margin-bottom:10px;
}
}
 
#content h4 {
.editor_steps_box .editor_steps_title{
  color:#292929;
margin-left:20px;
  font-family: "Bebas Neue", normal;
  font-size: 150%;
  line-height: 0%;
}
}


.editor_steps_box_wrapper{
/* ------------------------------------------------------------------------- */
margin-left:40px;
}


.editor_steps_box_wrapper .editor_steps_box{
/**MAIN PAGE MENU**/
margin:0;
/**Settings for main page menu general**/
max-width:50%;
#mainpagenavigation {
display:block;
border-collapse:collapse;
}
}


.editor_steps_box_wrapper .editor_steps_image {
/**Settings for main page menu headers**/
display:inline;
#mainpagenavigation th {
color:#292929;
font-family: "Bebas Neue Bold", normal;
font-size: 250%;
background-color: rgba(255, 255, 255);
height:48px;
}
}


.editor_steps_box_wrapper .editor_steps_image > div {
/**Settings for main page menu content**/
max-width:40%;
#mainpagenavigation td {
display:inline-block;
background-color: rgba(255, 255, 255,0.4);
margin:0;
color: #292929;
float:right;
clear:both;
}
}


/*Workaround because of applied width to style*/
.editor_steps_box_wrapper .editor_steps_image > div > div {
width:auto !important;
}


.editor_steps_box_wrapper .editor_steps_image img{
max-width:100%;
height:auto;
}


/*Support namespace styling*/
/* ------------------------------------------------------------------------- */
.ns-4500 #content, .ns-501 #content { background-color: #f3f3f3; }
.ns-4500 div.thumb, .ns-501 div.thumb { border-color: #f3f3f3; }


/*Infobox styling*/
/*INFOBOX VISUAL SETTINGS*/
/* Infobox template style */
.infobox {
.infobox {
    background-image: linear-gradient(#c6c6c6, #f2f2f2);
     border: 1px solid #aaa;
     border: 1px solid #aaa;
     background-color: #f9f9f9;
     border-radius: 10px 10px 10px 10px;
    color: black;
    margin: 0.5em 0 0.5em 1em;
    padding: 0.2em;
     float: right;
     float: right;
     clear: right;
     margin: 0 0 1em 1em;
    padding: 1em;
    width: 400px;
}
.infobox-title {
    font-size: 2em;
    text-align: center;
}
.infobox-image {
    text-align: center;
}
}
.infobox td,
.infobox th {
.infobox th {
    text-align: center;
     vertical-align: top;
     vertical-align: top;
    width: 120px;
}
}
.infobox caption {
.infobox td {
    font-size: larger;
     vertical-align: top;
}
.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;
}
}


.infobox.sisterproject {
/*
    width: 20em;
* custom styles applied by hekman.m@buas.nl below
    font-size: 90%;
*/
}


.infobox.standard-talk {
#poncho-content-wrapper {
    border: 1px solid #c0c090;
    background-color: #f8eaba;
}
.infobox.standard-talk.bordered td,
.infobox.standard-talk.bordered th {
    border: 1px solid #c0c090;
}


/* styles for bordered infobox with merged rows */
.infobox.bordered .mergedtoprow td,
.infobox.bordered .mergedtoprow th {
    border: 0;
    border-top: 1px solid #aaa;
    border-right: 1px solid #aaa;
}
}


.infobox.bordered .mergedrow td,
body {
.infobox.bordered .mergedrow th {
    background-image: linear-gradient(rgba(35,203,240,1) 0%,rgba(35,203,240,1) 5%,rgba(35,203,240,0.8) 10%,rgba(64,146,255,0.8) 90%,rgba(114,103,198,1) 100%),url(/resources/assets/images_dev/Site_Background_Clear.jpg);
     border: 0;
    background-attachment: fixed;
     border-right: 1px solid #aaa;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    font-family: Arial;
    font-size: 14px;
    height: 100%;
    margin: 0;
     padding: 0;
     font-family: "Roboto",normal;
}
}


/* Styles for geography infoboxes, eg countries,
#content {
  country subdivisions, cities, etc.            */
     line-height: 1.5;
.infobox.geography {
     margin: 0 auto;
    text-align: left;
     max-width: 1000px;
    border-collapse: collapse;
     overflow: hidden;
     line-height: 1.2em;  
     padding: 1em;
     font-size: 90%;
     padding-bottom: 5em;
}
 
.infobox.geography  td,
.infobox.geography  th {
     border-top: solid 1px #aaa;
     padding: 0.4em 0.6em 0.4em 0.6em;
}
.infobox.geography .mergedtoprow td,
.infobox.geography .mergedtoprow th {
     border-top: solid 1px #aaa;
     padding: 0.4em 0.6em 0.2em 0.6em;
}
}


.infobox.geography .mergedrow td,
#poncho-logo {
.infobox.geography .mergedrow th {
    color: rgba(255,255,255,1);
     border: 0;
    background-size: contain;
     padding: 0 0.6em 0.2em 0.6em;
    background-repeat: no-repeat;
    display: inline-block;
    font-size: 1.5em;
    height: 1.4em;
     line-height: 1.5;
     padding: .33em .33em .33em 2.5em;
    text-decoration: none;
}
}


.infobox.geography .mergedbottomrow td,
#poncho-header-wrapper {
.infobox.geography .mergedbottomrow th {
     background: rgba(35,203,240,1.0);
     border-top: 0;
     border-bottom: rgba(35,203,240,1.0);
     border-bottom: solid 1px #aaa;
     padding: .5em 0;
     padding: 0 0.6em 0.4em 0.6em;
}
}


.infobox.geography .maptable td,
.firstHeading {
.infobox.geography .maptable th {
  font-family: "Bebas Neue Bold",normal;
    border: 0;
  font-size: 350%;
    padding: 0;
  padding: 0 0 0 14px;
  margin: 0;
}
}


/* Code styling */
#content h1{
code{
  line-height: unset;
    color:black;
    background-color:#f9f9f9;
    border:1px solid #ddd;
    border-radius:2px;
    padding:1px 4px
}
 
/*Infobox basic styling*/
.tygron-abox {
    width: 60%;
    margin: auto;
 
    background-color: #dddddd;
    border: 2px solid #bbbbbb;
    padding: 10px;
}
}
 
#content h2 {
/*Page breaks*/
  line-height: unset;
.pageBreakBlock {
    display:none;
}
}
@media print {
#content h3 {
    .pageBreak {
  line-height: unset;
        page-break-after: always;
    }
    .pageBreakBlock {
        display:block;
    }
}
}
 
#content h4 {
 
  line-height: unset;   
 
 
.menu-container{
display: flex;
  background-color: #044f82;
 
}
}


.menu-container > div{
.wikitable > tr > th, .wikitable > tr > td, .wikitable > * > tr > th, .wikitable > * > tr > td {
  background-color: #f1f1f1;
    border: 1px solid #a2a9b1;
 
    padding: 0.2em 0.4em;
  margin: 15px;
  padding: 30px;
  font-size: 30px;
}
}


 
.wikitable > tr > th, .wikitable > * > tr > th {
 
     background-color: #eaecf0;
 
/* ------------------------------------------------------------------------- */
 
.infobox {
     background-image: linear-gradient(#c6c6c6, #f2f2f2);
    border: 1px solid #aaa;
    border-radius: 10px 10px 10px 10px;
    float: right;
    margin: 0 0 1em 1em;
    padding: 1em;
    width: 400px;
}
.infobox-title {
    font-size: 2em;
     text-align: center;
     text-align: center;
}
.infobox-image {
    text-align: center;
}
.infobox th {
    text-align: center;
    vertical-align: top;
    width: 120px;
}
.infobox td {
    vertical-align: top;
}
}

Latest revision as of 12:58, 26 October 2021

/* CSS placed here will be applied to all skins */

/*GENERAL VISUAL STYLE FOR WIKI*/

/**Settings for full background**/
#content-wrapper{
background-image: linear-gradient(rgba(35,203,240,1) 0%, rgba(35,203,240,1) 5%, rgba(35,203,240,0.8) 10%, rgba(64,146,255,0.8) 90%, rgba(114,103,198,1) 100%), url(/resources/assets/images_dev/Site_Background_Clear.jpg);
background-attachment: fixed;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}

/**Settings for full background of actual content**/
#content{
background-color: rgba(255,255,255, 0.75);
}

/**Settings for header**/
#header-wrapper{
background: rgba(35, 203, 240, 1.0);
border-bottom: rgba(35, 203, 240, 1.0);
 background
}

/**.search {
background-color: #ffffff00;
borgder: 1px solid #ffffff;
}**/

/**Settings for logo**/
#logo{
color:rgba(255,255,255, 1);
}

/* ------------------------------------------------------------------------- */

/*GENERAL VISUAL STYLE FOR TEXT*/

/* Adding varying font faces*/
@font-face {
    font-family: 'Bebas Neue';
    src: url('/resources/assets/fonts/BebasNeue-Book.woff') format('woff');
    font-weight: 300;
    font-style: normal;
}
@font-face {
    font-family: 'Bebas Neue Bold';
    src: url('/resources/assets/fonts/BebasNeue-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
}
@font-face {
    font-family: 'Muli';
    src: url('/resources/assets/fonts/Muli-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Muli Bold';
    src: url('/resources/assets/fonts/Muli-Black.woff') format('woff');
    font-weight: 900;
    font-style: bold;
}
@font-face {
    font-family: 'Muli Italic';
    src: url('/resources/assets/fonts/Muli-Italic.woff') format('woff');
    font-weight: normal;
    font-style: italic;
}
@font-face {
    font-family: 'Muli Light';
    src: url('/resources/assets/fonts/Muli-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
}
@font-face {
    font-family: 'Muli Light';
    src: url('/resources/assets/fonts/Muli-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
}
@font-face {
    font-family: 'Roboto';
    src: url('/resources/assets/fonts/Roboto-Regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

body {
  font-family: "Roboto", normal;
  color:#292929;
}

#content h1{
  color: #292929;
  font-family: "Bebas Neue Bold", normal;
  font-size: 350%;
  line-height: 0%;
}
#content h2 {
  color:#292929;
  font-family: "Bebas Neue Bold", normal;
  font-size: 250%;
  line-height: 0%;
}
#content h3 {
  color:#292929;
  font-family: "Bebas Neue", normal;
  font-size: 200%;
  line-height: 0%;
}
#content h4 {
  color:#292929;
  font-family: "Bebas Neue", normal;
  font-size: 150%;
  line-height: 0%;
}

/* ------------------------------------------------------------------------- */

/**MAIN PAGE MENU**/
/**Settings for main page menu general**/
#mainpagenavigation {
display:block;
border-collapse:collapse;
}

/**Settings for main page menu headers**/
#mainpagenavigation th {
color:#292929;
font-family: "Bebas Neue Bold", normal;
font-size: 250%;
background-color: rgba(255, 255, 255);
height:48px;
}

/**Settings for main page menu content**/
#mainpagenavigation td {
background-color: rgba(255, 255, 255,0.4);
color: #292929;
}



/* ------------------------------------------------------------------------- */

/*INFOBOX VISUAL SETTINGS*/
.infobox {
    background-image: linear-gradient(#c6c6c6, #f2f2f2);
    border: 1px solid #aaa;
    border-radius: 10px 10px 10px 10px;
    float: right;
    margin: 0 0 1em 1em;
    padding: 1em;
    width: 400px;
}
.infobox-title {
    font-size: 2em;
    text-align: center;
}
.infobox-image {
    text-align: center;
}
.infobox th {
    text-align: center;
    vertical-align: top;
    width: 120px;
}
.infobox td {
    vertical-align: top;
}

/*
 * custom styles applied by hekman.m@buas.nl below
 */

#poncho-content-wrapper {

}

body {
    background-image: linear-gradient(rgba(35,203,240,1) 0%,rgba(35,203,240,1) 5%,rgba(35,203,240,0.8) 10%,rgba(64,146,255,0.8) 90%,rgba(114,103,198,1) 100%),url(/resources/assets/images_dev/Site_Background_Clear.jpg);
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    font-family: Arial;
    font-size: 14px;
    height: 100%;
    margin: 0;
    padding: 0;
    font-family: "Roboto",normal;
}

#content {
    line-height: 1.5;
    margin: 0 auto;
    max-width: 1000px;
    overflow: hidden;
    padding: 1em;
    padding-bottom: 5em;
}

#poncho-logo {
    color: rgba(255,255,255,1);
    background-size: contain;
    background-repeat: no-repeat;
    display: inline-block;
    font-size: 1.5em;
    height: 1.4em;
    line-height: 1.5;
    padding: .33em .33em .33em 2.5em;
    text-decoration: none;
}

#poncho-header-wrapper {
    background: rgba(35,203,240,1.0);
    border-bottom: rgba(35,203,240,1.0);
    padding: .5em 0;
}

.firstHeading {
   font-family: "Bebas Neue Bold",normal;
   font-size: 350%;
   padding: 0 0 0 14px;
   margin: 0;
}

#content h1{
  line-height: unset;
}
#content h2 {
  line-height: unset;  
}
#content h3 {
  line-height: unset;  
}
#content h4 {
  line-height: unset;  
}

.wikitable > tr > th, .wikitable > tr > td, .wikitable > * > tr > th, .wikitable > * > tr > td {
    border: 1px solid #a2a9b1;
    padding: 0.2em 0.4em;
}

.wikitable > tr > th, .wikitable > * > tr > th {
    background-color: #eaecf0;
    text-align: center;
}
Retrieved from "https://dev.guraas.com/index.php?title=MediaWiki:Common.css&oldid=478"