MediaWiki:Common.css

From Fabulous Loop de Loop
Revision as of 08:50, 1 September 2020 by Simon (talk | contribs)

Note: After publishing, 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: Press Ctrl-F5.
/* CSS placed here will be applied to all skins */

body.page-Main_Page.action-view h1.firstHeading, body.page-Main_Page.action-submit h1.firstHeading { display: none; }
                              
@font-face {
    font-family: 'happytimes';
    src: url('floop-wiki-fonts/happytimes/happy-times-NG_regular_master_web.woff2') format('woff2'),
         url('floop-wiki-fonts/happytimes/happy-times-NG_regular_master_web.woff') format('woff'),
         url('floop-wiki-fonts/happytimes/happy-times-NG_regular_master_web.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'happytimes';
    src: url('floop-wiki-fonts/happytimes/happy-times-NG_bold_master_web.woff2') format('woff2'),
         url('floop-wiki-fonts/happytimes/happy-times-NG_bold_master_web.woff') format('woff'),
         url('floop-wiki-fonts/happytimes/happy-times-NG_bold_master_web.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'happytimes';
    src: url('floop-wiki-fonts/happytimes/happy-times-NG_italic_master_web.woff2') format('woff2'),
         url('floop-wiki-fonts/happytimes/happy-times-NG_italic_master_web.woff') format('woff'),
         url('floop-wiki-fonts/happytimes/happy-times-NG_italic_master_web.ttf') format('truetype');
    font-weight: 400;
    font-style: italic;
}


/*mediawiki css*/
#footer {
margin-left: 15em;
}

.mw-references-wrap.mw-references-columns {
font-family: 'happytimes', serif;
padding-top: 12px;
}

.mw-wiki-logo {
padding-top: 12px;
}

#mw-head {
/*background-color: lavender;*/
}

#mw-panel {
width: 15em;
padding-right: 8px;
font-family: 'Arial', sans-serif;
background-colour: white;
}

#mw-panel .portal {
margin: 1.8em 1em 0 0.6em;
}

#left-navigation {
margin-left: 16em;
}

#mw-page-base {
background-image: none;
background-color: lavender;
}

#mw-head-base {
margin-left: 15em;
}

#mw-head .vectorMenu h3 {
height: 100%;
}

.mw-body {
margin-left: 15em;
background-color: white;
border-top: 3px solid lavender;
border-left: 0;
border-right: 0;
border-bottom: 0;
border-radius: 50px 0 0 0;
}

.mw-body-content {
background-color: white;
margin: none;
font-family: 'happytimes', serif;
}

/*.mw-body-content p {
margin: 1em;
}*/

#mw-panel #p-logo + .portal {
margin-top: 0;
}

#p-logo {
display: none;
}

/* padding/sizing and aesthetic styles for the background of the tabs */
div#mw-head div.vectorMenu h3,
div#mw-head div.vectorTabs ul li span {
	background: white;
	line-height: 1;
	overflow: visible;
}

div.gallerytext {
font-size: 60%;
max-width: 100%;
}

div.thumbinner {
border: none;
background: white;
padding: 4px;
text-align: center;
overflow: hidden;
}

/*tabs in top nav*/
.vectorTabs {
background-image: none;
background-color: lavender;
height: 1em;
}

.vectorTabs li a {
background-color: lavender;
height: 1em;
}

.vectorTabs #ca-unwatch.icon a {
padding-top: 36px;
}

/* dropdown menu in right nav (More) */
.vectorMenu .menu {
border: none;
background-color: lavender;
opacity: 100;
}

.vectorMenuCheckbox {
background-color: lavender;
}

div#p-cactions.vectorMenu {
background-color: lavender;
}

.vectorMenuCheckbox {
background: lavender;
}

#p-cactions-label {
background-color: lavender;
}

div#mw-head div.vectorMenu h3, div#mw-head div.vectorTabs ul li span {
background-color: lavender;
}

#searchInput {
border: 1px solid black;
}

/* sidebar */
#mw-panel .portal .body {
background-image: none;
margin: none;
}

h3#p-Contents-label {
margin: none;
color: black;
}

#mw-panel .portal h3 {
margin: 0;
color: black;
padding: 1em 0 0 0;
}

/* footer */
#footer-icons {
display: none;
}

/* meta-diagram */
.container {
display: grid;
padding: 8px;
grid-template-columns: 33% 33% 33%;
grid-template-rows: auto auto auto;
}

.container-shell {
font-family: 'Arial', sans-serif;
padding: 12px;
}

.container-title {
padding: 12px;
/*vertical-align: middle;*/
/*display: table-cell;*/
max-width: 100%;
}

.container-box {
float: left;
padding: 12px;
position: relative;
text-align: center;
max-width: 100%;
display: table-cell;
}

.arrowhead {
max-width: 100%;
float: left;
}

.rightBend {
    border-left: 3px solid black;
    border-radius: 400px 0px 0px 0px;
    max-width: 100%;
    height: 100px;
}

.leftBend {
    border-radius: 400px 400px 400px 400px;
    max-width: 100%;
    border-right: 3px solid lavender;
    height: 100px;
}

/*arrows and lines*/
.arrow {
  border: solid black;
  border-width: 0 3px 3px 0;
  display: inline-block;
  padding: 30px;
}

.right {
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
}

.left {
  transform: rotate(135deg);
  -webkit-transform: rotate(135deg);
}

.up {
  transform: rotate(-135deg);
  -webkit-transform: rotate(-135deg);
}

.down {
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
}

div.rightArrow {
border-left: 3px solid lavender;
border-radius: 0px 50px 0px 0px;
margin: auto;
max-width: 100%;
height: 36px;
text-align: center;
}


/*type classes*/

.mw-body-content h2 {
font-family: 'happytimes',serif;
font-size: 1.4em;
line-height: 1.6em;
font-weight: bold;
padding-top: 12px;
}

h2 {
border-bottom: none;
}

p.title {
font-family: 'happytimes', serif;
font-size: 3em;
font-style: normal;
text-align: center;
line-height: 1em;
max-width: 100%;
}

.subtitle {
font-family: 'happytimes', serif;
font-size: 1.4em;
/*font-style: italic;*/
line-height: 1.2em;
text-align: center;
margin-top: -24px;
max-width: 100%;
}

.body {
max-width: 100%;
}

.chapter {
text-align: center;
max-width: 100%;
/*padding-left: 3em;
padding-right: 3em;*/
line-height: 1.2em;
font-size: 1.4em;
font-family: 'happytimes', serif;
margin: auto;
}

.loglines {
text-align: left;
padding: 12px;
font-size: 1em;
line-height: 1.2em;
font-family: 'happytimes', serif;
max-width: 100%;
}

.machine {
font-family: 'happytimes', serif;
font-size: 1em;
line-height: 1.2em;
/*padding-left: 3em;
padding-right: 3em;*/
font-style: bold;
text-align: center;
max-width: 100%;
}

/*redundant after setting all images as thumbs*/
.caption {
font-family: 'happytimes', serif;
text-align: left;
font-size: 1em;
margin-top: -8px;
margin-left: 3px;
max-width: 100%;
}

.quote {
padding: 36px;
font-family: 'happytimes', serif;
font-style: normal;
text-align: center;
font-size: 1.4em;
line-height: 1.3em;
max-width: 100%;
}

.byline {
font-family: 'happytimes', serif;
text-align: center;
margin-left: auto;
margin-right: auto;
}

body {
background-color: lavender;
background-image: none;
}

h1#firstHeading.firstHeading {
font-family: 'happytimes',serif;
font-size: 1.4em;
line-height: 1.2em;
border-bottom: 3px solid lavender;
border-radius: 0px 0px 50px 0px;
padding-top: 6px;
padding-bottom: 12px;
/*margin-left: 24px;
margin-right: 24px;*/
max-width: 100%;
height: 36px;
text-align: center;
}

p.annotation {
font-family: 'happytimes',serif;
font-size: 1.4em;
line-height: 1.2em;
border-top: 3px solid lavender;
border-radius: 0px 50px 0px 0px;
padding-top: 24px;
padding-bottom: 12px;
max-width: 100%;
height: 100%;
text-align: center;
}

p {
font-family: 'happytimes', serif;
font-size: 1.4em;
line-height: 1.3em;
max-width: 60%;
}

/* links */
a.image {
display: inline-block;
margin: auto auto auto auto;
position: relative;
/*width: 50%;*/
}

a:link, a:visited {
color: black;
}

a:hover, a:active , img:hover {
text-decoration: underline;
}

/* TOC */

.toctogglespan {
display: none;
}

.toctitle {
font-family: 'happytimes', serif;
font-style: normal;
text-align: left;
padding-top: 12px;
}

.toc, .mw-warning, .toccolours {
background-color: white;
border-top: 3px solid lavender;
border-left: 0px;
border-right: 0px;
border-bottom: 0px;
border-radius: 50px 0px 50px 0px;
max-width: 50%;
text-align: left;
padding-top: 12px;
padding-left: 0px;
font-family: 'happytimes', serif;
}


/* images */
img.thumbimage {
border: 1px solid lavender;
}