MediaWiki:Metrolook.css
From HandWiki
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 affect users of the Metrolook skin */
/*
#ca-talk { display:none!important; }
#ca-history { display:none!important; }
#ca-viewsource { display:none!important; }
*/
#n-Biology-Home,#n-Physics-Home,#n-Chemistry-Home,#n-Astronomy-Home,#n-Engineering-Home,#n-Philosophy-Home,#n-Earth-Home,#n-Social-Home,#n-Software-Home, #n-Biography-Home,#n-Company-Home,#n-Medicine-Home,#n-Finance-Home,#n-Unsolved-Home,#n-Organization-Home,#n-Book-Home,#n-Manual-Home,#n-Monograph-Home,#n-Tutorial-Home {
font-weight: bold;
}
#n-HandWiki-Home {
font-weight: bold;
}
.mw-panel {
top: 30px;
padding-top: 1em;
width: 12.5em;
}
/* Code fonts. CSS placed here will be applied to all skins */
.mw-highlight pre {
font-size: 110%;
}
/* Changes the default font used for MediaWiki headings to Noto Serif: */
#content h1,
#content h2 {
font-family: arial, serif;
}
/* #### Padding for infobox for Mobile Phones Portrait #### */
@media (min-width: 320px) and (max-width: 480px) {
.infobox {
padding-left: 1.2em;
}
.mw-body {
padding-top: 7px;
padding-right: 7px;
padding-bottom: 10px;
padding-left: 7px;
}
#mw-panel div.portal div.body ul li {
line-height: 1.5em;
}
}
#siteSub {
display: block; font-weight: normal; font-size: normal; color: #1d5f64; margin-top: -15px;
}
/* To make images responsive */
/*
<div class="res-img">
[[File:Whatever.JPG]]
</div>
*/
.res-img img {
max-width:100%;
height:auto;
}
.mw-jump{
visibility: hidden;
display:none }
.mw-body {
background-color: #fffffa;
}
#mw-panel div.portal {
margin-right: 0.2em;
margin-left: 0.2em;
padding-top: 0.25em;
padding-bottom: 0.25em;
}
/* Increase font in left panel */
#mw-panel div.portal div.body ul li {
font-size: 0.85em;
word-wrap: break-word;
}
.goog-logo-link img {
display: none;
}
@media only screen and (max-width: 2200px) {
#p-logo a {
margin-left: 0.1em;
}
}
/* left panel for desktops */
@media (min-width:1024px) {
#mw-panel {
top: 30px;
padding-top: 1.0em;
padding-left: 0.2em;
width: 12.5em;
}
.mw-body {
margin-left: 12.5em;
}
#p-logo a {
height: 90px;
width: 170px;
margin-left: 0.6em;
}
}
#searchGoButtonM,#searchTextM {
background-color: #ffb84d;
padding: .3em;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
color: black;
font-family: sans-serif, Arial, Helvetica;
font-size: 1em;
text-decoration: none;
text-align: center;
border: none;
width: 5em;
height: 28px;
margin: 8px 2px;
}
#searchGoButtonM:hover,#searchTextM:hover {
border: none;
background: orange;
box-shadow: 0px 0px 1px #777;
}
.flexbntsearch {
border: 0;
height: 29px;
margin: 0;
float:right;
width: 24%;
}
/* Search field in Main page*/
#searchInput {
width: 75%;
margin-left: auto;
margin-right: auto;
margin: 4px 0;
margin-top: -10px;
}
/* Full length for smartphones */
@media only screen and (max-width: 600px) {
#searchInput {
width: 100%;
}
.flexbntsearch {
float:center;
width: 80%;
}
}
/* Top search*/
div#simpleSearch {
width: 30em;
height: 36px;
position: relative;
margin-top: -5px;
border-radius: 5px;
}
@media only screen and (max-width: 640px) {
div#simpleSearch {
width: 18em;
}
}
div#simpleSearch #searchInput {
padding-top: 5px;
padding-bottom: 10px;
padding-left: 5px;
padding-right: 5px;
font-size: 1.1em;
direction: ltr;
font-weight: normal;
}
/* Buttons to create article*/
.mw-ui-button.mw-ui-progressive:hover {
background-color: orange;
font-weight: normal;
}
.mw-ui-button.mw-ui-progressive {
background-color: #ffb84d;
color: black;
font-weight: normal;
}
/* Fix so <tt>, <code>, and <pre> display in a suitable size in firefox, chrome, etc */
code {
font-size: 1.0em;
background-color: #ffffff;
}
tt {
font-size: 1.0em;
}
pre.code2highlight, pre.nohighlight {
font-size: 1.0em;
}
h1, h2, h3, h4, h5, h6 {
font-family: Helvetica, Arial, Verdana, sans-serif;
}
/**
* Styling for links generated by [[MediaWiki:Edittools]]
* @source https://www.mediawiki.org/wiki/Extension:CharInsert#Styling
* @updated 2020-03-17
*/
.mw-charinsert-buttons {
border: 1px solid #aaa;
margin-top: 10px;
padding: 1px;
font-size: 1.1em;
text-align: center;
}
.mw-charinsert-buttons a {
background-color: #cde !important;
color: #000;
border: thin #069 outset;
padding: 0 1px 1px;
font-weight: bold;
font-size: .9em;
text-decoration: none;
}
.mw-charinsert-buttons a:hover,
.mw-charinsert-buttons a:active {
background-color: #bcd;
border-style: inset;
}
.client-js .mw-edittools-section {
display: inline;
}
.client-js .mw-edittools-section input[type="button"] {
font-size: .9em;
margin-left: 1px;
padding-left: 1px;
padding-right: 1px;
}
/* custom search */
/* Style the search field */
form.hwiki-search input[type=text] {
padding: 8px;
font-size: 1.0em;
border: 1px solid grey;
float: left;
width: 80%;
background: white;
}
/* Style the submit button */
form.hwiki-search button {
float: left;
width: 20%;
padding: 10px;
background: #2196F3;
color: white;
font-size: 1.0em;
border: 1px solid grey;
border-left: none; /* Prevent double borders */
cursor: pointer;
}
form.hwiki-search button:hover {
background: #0b7dda;
}
/* Clear floats */
form.hwiki-search::after {
content: "";
clear: both;
display: table;
}
/* create HandWiki simple search mobile friendly buttons*/
.hwsimple {
float: center;
margin-left: 3px;
margin-right: 3px;
position: relative;
display: inline-block;
white-space: nowrap;
width: 310px;
}
.hwsimple .search-container {
display: block;
position: relative;
white-space: nowrap;
width: 100%;
}
.hwsimple input[type=text] {
padding: 6px;
margin-top: 6px;
font-size: 1.1em;
padding: 6px;
border: 1px solid #ccc;
height: 32px;
background-color: #ffffff;
border: 1px solid #1d5f64;
text-align: left;
}
.hwsimple .search-container button {
margin-top: 6px;
padding: 6px 6px;
background-color: #1d5f64;
color: #ffff;
font-size: 1.1em;
border: 1px solid #1d5f64;
cursor: pointer;
text-align: center;
height: 44px;
}
.hwsimple .search-container button:hover {
border: 1px solid #1d5f64;
background-color: #278188;
color: #ffff;
}
@media all and (max-width: 479px) {
.hwsimple {
float: center;
margin-left: -10px;
margin-left: 2px;
margin-right: 2px;
width: 310px;
height: 33px;
}
.hwsimple input[type=text] {
float: center;
display: block;
width: 100%;
margin-left: -10px;
margin-right: 2px;
padding: 4px;
}
.hwsimple button {
float: center;
display: block;
text-align: center;
width: 200px;
padding: 6px;
margin-top: 14px;
}
}
@media (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {
.hwsimple {
float: center;
width: 99%;
}
}
/* for mobile view only */
.deskContent {
display: block;
}
.phoneContent {
display: none;
}
@media all and (max-width: 1026px) {
.deskContent {display:block;}
.phoneContent {display:none;}
}
@media screen and (max-width:1024px){
.deskContent {display:none;}
.phoneContent {display:block;}
}
@media screen and (min-width:768px) and (max-width:1024px) and (orientation:landscape){
.deskContent {display:none;}
.phoneContent {display:block;}
}
@media all and (max-width: 768px) {
.deskContent {display:none;}
.phoneContent {display:block;}
}
