MediaWiki:Mobile.css
From Clicklaw Wikibooks
Revision as of 04:22, 30 May 2022 by Carolina Reid (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 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-container {
/*CLWB-374*/
border-bottom: 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 td {
width: 80% !important;
}
}
