MediaWiki:Mobile.css

From Clicklaw Wikibooks
Jump to navigation Jump to search
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 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 mobile site */
table{ 
	border-style: solid;
	border-width: 0px; 
}

.content table td, .content table th {
border: 0px;
}

.mw-lingo-tooltip-definition {
    display:none;
}

/***************************** Mobile View *********************************************/

body, .mw-body h1, .mw-body h2, .mw-body h3, .mw-body h4, .mw-body h5, .mw-body h6, .mw-body dt,
#p-logo-text a {
	font-family: Trebuchet MS, sans-serif !important;
}

body {
    color: black;
    font-size: 15px;
}

h3 {		
		/*CLWB-374*/
		font-size: 12px !important;
		font-weight: bold !important;
		/*CLWB-374*/
		border-bottom: none !important;
    
}

/*CLWB-359*/
/*hide category section from mobile*/
#catlinks{
		display: none;
}

/*CLWB-352*/
.plainlinks.fmbox.fmbox-system {
    width:260px;
    clear: right;
    float: right;
	/*CLWB-374*/
	background: #F9F9F9;
	border: 1px solid #333333;
}

table.fmbox {
    margin: 0.2em 0;
    border: 1px solid #aaa;
	border-collapse: separate;
    box-sizing: border-box;
    border-spacing: 2px;
	padding: 10px;
}

.mbox-image{
	padding-right: 10px;
}

@media screen and (max-width: 850px) {
	.plainlinks.fmbox.fmbox-system {
		width: 100% !important;
	}
    .vertical-navbox.noprint.nowraplinks {
		width: 100%;
	}

    #mw-header-container {
        padding: 3.75em 2em 0.35em;
    }
}

/*CLWB-362*/
.table-content td {	
    display: block!important;
    width: 100%!important;
    box-sizing: border-box;
}

/*CLWB-358*/
.navbox-subgroup .navbox-group {
	width:45%;
}
@media screen and (max-width: 350px) {
	.navbox-subgroup .navbox-group {
		width:50%;
	}
}

.navbox-title {
	padding: 0.5em 0 0 0.5em;
}

/*CLWB-374*/

.navbox-subgroup a, .navbox-subgroup a:hover, .navbox-subgroup a:visited {
	font-size: 14px;
}
	
.navbox-subgroup a:active {
	color: #54A546;
}

th.navbox-group a, th.navbox-group a:hover, th.navbox-group a:visited {
	font-weight: bold;
}

table {
	border-spacing: 0px;
}

.TitleList-Table td {	
    text-align: center;
	margin-top: 10px;
}

.table-content td {	
    text-align: center;
	margin-top: 10px;
}

/*CLWB-354*/
.table-chapters-books {
	border-collapse: separate;
    border-spacing: 0em 1.5em;
}

.ul-chapters-books ul{
	padding-bottom: 1em;
}

/*CLWB-357 */
.navbox-book-span {
	display: none;
}

/*CLWB-357 */
/*Getting started did not get centered without this*/
.nowraplinks.collapsible.autocollapse.navbox-subgroup {
	width: 100%;
}

/*CLWB-357 */
/*text below Resource list did not get centerd without this*/
.navbox-abovebelow {
	text-align: center;
}

/*need in order to ger text below titles centered*/
/*CLWB-357 */
/*CLWB-358 */
.nowraplinks.navbox-subgroup {
	width: 100%;
	border-spacing: 0em 0.5em !important;
    border-collapse: separate !important;
}

/*CLWB-357 */
/*need in order to ger text below titles centered*/
.navbox-list.navbox-odd {
	text-align: center;
}

/*CLWB-373*/
.table-contributor-template td {	
    display: block!important;
    width: 100%!important;
    box-sizing: border-box;
}

.table-contributor-template-information {
	width: 100% !important;
	margin: 0px 0px 10px 0px;
}

.table-contributor-template-information .floatleft{    
    float: none !important;
    clear: none !important;
    text-align: center;
}

.table-contributor-template-information-details{
	width: 100% !important;
    font-size:85%;
	margin-bottom: 10px;
}

.table-contributor-template-information-details td{
    text-align: center;
}

.table-contributor-template-information-details img{
	margin-bottom: 10px;
}

.table-resourceguidebox-template td{
	display: block!important;
	width: 100%!important;
}

.table-resourceguidebox-template-box{
	width: 100% !important;
}

.table-resourceguidebox-template-description{
	padding-bottom: 15px;
}
/*CLWB-358 */
.nowraplinks.collapsible.autocollapse.navbox-inner {
	width: 100%;
	border-spacing: 0em 0.5em !important;
    border-collapse: separate !important;
}

body {
   background: none;
}

#mw-footer-container {	
	/*CLWB-374*/
	border-top: none;
	box-shadow: 3px 1px 7px 0 rgba(0, 0, 0, 0.11);
	-moz-box-shadow: 3px 1px 7px 0 rgba(0, 0, 0, 0.11);
	-webkit-box-shadow: 3px 1px 7px 0 rgba(0, 0, 0, 0.11);
	-o-box-shadow: 3px 1px 7px 0 rgba(0, 0, 0, 0.11);	
	color: #333333;
}

#mw-footer-container a {
		/*CLWB-374*/
		color: #000;
                font-weight: bold;
}
	
#mw-footer-container a:hover, #mw-footer-container a:active {
		color: #54A546;
}
	
#mw-footer-container ul {
		/*CLWB-374*/
		font-size: 12px !important;
}

#p-logo-text {
    max-width: 100%;
    padding: 10px 10px 0px 10px;
}

@media screen and (max-width: 850px){
    #p-logo-text {
               text-align: center;
               position: static;
    }
}

#p-logo-text a {
               /*CLWB-374*/
		color: #54A546;
		font-weight: bold;
		text-decoration: none;
}

#simpleSearch {
	/*CLWB-374*/
	box-shadow: 0 2px 10px 0 rgba(0,0,0,0.10);
	-webkit-box-shadow: 0px 2px 10px 0 rgba(0, 0, 0, 0.10);
	-webkit-appearance: none;	
	margin-bottom: 16px;
        margin-top: 12px;
	border: none;
}

#mw-footer .footer-icons {
        /*CLWB-367*/
	/*display icons centered*/
		float: none;
		text-align: center;
		margin: 0 0 1em 0;
	}

#mw-footer .footer-places li {
	/*CLWB-367*/
	/*display footer links as a vertical list, no an horizontal list*/
	/*display links centered*/
		display: block;
		text-align: center;
		padding-right: 0em;
	}

#mw-content {
	/*CLWB-374*/
	border-bottom: none;
    box-shadow: none;
}

#mw-page-header-links {
	/*CLWB-374*/
	background-image: url(/skins/Timeless/resources/images/border.png);
	background-position: bottom left;
        background-repeat: repeat-x;
	height: 2.1em;
}

.tools-inline li.selected {
    border-bottom-color: #54A546;
    padding-bottom: 3px;
}

.tools-inline li:hover {
    border: none;
}

a {
	/*CLWB-374*/
	text-decoration: underline;
	color: #000;
}

a:hover,
a:visited {
		/*CLWB-374*/
		color: #000;
}
	
/*CLWB-374*/
a:active {
		color: #54A546;
}

#mw-content h1, #mw-content  h2, #mw-content h1.firstHeading, #mw-content h1:after, #mw-content h2:after {
		/*CLWB-374*/
		border: none;
}

#mw-content h1 {
		/*CLWB-374*/
		font-size: 30px;
}

#mw-content h2 {
		/*CLWB-374*/
		font-size: 24px;
}

#mw-content h3 {
		/*CLWB-374*/
		font-size: 22px;
		font-weight: bold;
}

#mw-content h4 {
		/*CLWB-374*/
		font-size: 16px;
		font-weight: bold;
}

#mw-content h5 {
		/*CLWB-374*/
		font-size: 12px;
		font-weight: bold;
}

.thumbinner {
	/*CLWB-374*/
	background-color: #F9F9F9;
	border: 1px solid #333333;
}

.thumbinner .thumbimage {
	/*CLWB-374*/
	width: 191px;
	height: 295px;
}

.color-left, .color-right, .color-middle-container {
	/*CLWB-374*/
	display: none;
}

/*CLWB-374*/
body.page-Main_Page #mw-content h2 {
	font-size: 18px;
	font-weight: bold;
	color: #CC6600;
}

ul {
	font-size: 14px;
}

/*#mw-page-header-links ul {
	font-size: 12px;
	line-height: 2.4;
}*/

/*CLWB-377*/
li#ca-talk{
	display: none !important;
}

li#ca-languages{
	display: none !important;
}

li#ca-viewsource{
	display: none !important;
}

table.plainlinks.ombox.ombox-notice {
	width: 100% !important;
}	

#mw-footer {
	/*CLWB-374*/
	/*margin: 2em 2em 0px 2em;*/
    padding: 2em 2em 1em 2em;
}

#mw-header-hack {
	/*CLWB-374*/
	border: 0.1px solid rgba(0,0,0,0.08);
        box-shadow: 0 3px 7px 0.05px rgba(0,0,0,0.11);
	-moz-box-shadow: 0 3px 7px 0.05px rgba(0,0,0,0.11);
	-webkit-box-shadow: 0 3px 7px 0.05px rgba(0,0,0,0.11);
}

#site-navigation .sidebar-inner {
		/*CLWB-374*/
		top: 0;
}

@media screen and (max-width: 850px){
        #site-navigation h2{
                 left: 1.45em;
        }
        #personal-extra{
                 right: 9.9em;
        }
        #user-tools h2{
                 right: 2.5em;
        }
        #site-tools h2{
                 right: 5.95em;
        }
}

/*CLWB-374*/

li#ca-nstab-main.selected a {
    background-image: url(/skins/Timeless/resources/images/page-green.png);
    background-image: linear-gradient(transparent,transparent),url(/skins/Timeless/resources/images/page-green.svg);
}

li#ca-talk.selected a {
    background-image: url(/skins/Timeless/resources/images/talk-green.png);
    background-image: linear-gradient(transparent,transparent),url(/skins/Timeless/resources/images/talk-green.svg);
}

li#ca-unwatch.mw-watchlink.selected a {
    background-image: url(/skins/Timeless/resources/images/star-filled-green.png);
    background-image: linear-gradient(transparent,transparent),url(/skins/Timeless/resources/images/star-filled-green.svg);
}

li#ca-watch.mw-watchlink.selected a {
    background-image: url(/skins/Timeless/resources/images/star-green.png);
    background-image: linear-gradient(transparent,transparent),url(/skins/Timeless/resources/images/star-green.svg);
}

li#ca-edit.selected a {
    background-image: url(/skins/Timeless/resources/images/pencil-green.png);
    background-image: linear-gradient(transparent,transparent),url(/skins/Timeless/resources/images/pencil-green.svg);
}

li#ca-history.selected a {
    background-image: url(/skins/Timeless/resources/images/clock-green.png);
    background-image: linear-gradient(transparent,transparent),url(/skins/Timeless/resources/images/clock-green.svg);
}

li#ca-addsection.selected a {
    background-image: url(/skins/Timeless/resources/images/plus-green.png);
    background-image: linear-gradient(transparent,transparent),url(/skins/Timeless/resources/images/plus-green.svg);
}
/*remove weird background in history page when opening setting's menu*/
li#ca-nstab-special.selected a {
	background-image:none
}

@media screen and (max-width: 850px){
     #mw-content {
         padding: 1em 2em; 
     }
}

/*CommetStreams style*/
#cs-header {
    background-color: #DFF0FF;
    padding: 12px;
    border: 2px solid #30538f;
    width: fit-content;
}

#cs-comments {
    padding: 15px;
}

/*Hide single page printing message collection*/
.collection-warning-box, .collection-notice-box{
    display:none;
}

/*Hide comments*/
.cs-stream{
    display:none;
}

.table-HP td {	
    display: block;
    width: 100%;
    box-sizing: border-box;
}

@media screen and (max-width: 850px) {
.table-HP, .table-HP p img {
    width: 75vw !important;

}
}

.mw-footer #footer-places li{
    display: block !important;
    text-align: center !important;
    margin: 10px !important;
}

.cs-comments{
    padding-bottom: 30px;
}

#mw-content-container{
    border-bottom: none !important;
}