Difference between revisions of "MediaWiki:Mobile.css"
From Zak
m |
|||
(38 intermediate revisions by the same user not shown) | |||
Line 6: | Line 6: | ||
border: 1px solid #aaaaaa; | border: 1px solid #aaaaaa; | ||
margin-bottom:20px; | margin-bottom:20px; | ||
+ | } | ||
+ | |||
+ | .homeWelcomeText { | ||
+ | font-size:170%; | ||
+ | margin: 2px !important; | ||
+ | text-align:center; | ||
+ | } | ||
+ | |||
+ | .homeWelcomeTitle { | ||
+ | width:100%; | ||
+ | box-sizing: border-box; | ||
+ | padding:8px; | ||
+ | background-color:#ddddff; | ||
} | } | ||
Line 13: | Line 26: | ||
padding:8px; | padding:8px; | ||
background-color:#eeeeee; | background-color:#eeeeee; | ||
+ | text-align:center; | ||
} | } | ||
Line 21: | Line 35: | ||
} | } | ||
− | . | + | .homeContentLeft { |
− | + | width:100%; | |
− | font-size: | + | float:none; |
+ | box-sizing: border-box; | ||
+ | } | ||
+ | |||
+ | .homeContentRight { | ||
+ | width:100%; | ||
+ | float:none; | ||
+ | box-sizing: border-box; | ||
+ | } | ||
+ | |||
+ | .homeNavigationGames { | ||
+ | width:33%; | ||
+ | float:left; | ||
+ | -moz-box-sizing: border-box; | ||
+ | box-sizing: border-box; | ||
+ | text-align:center; | ||
+ | padding:4px; | ||
+ | } | ||
+ | |||
+ | .homeNavigationGames25 { | ||
+ | width:25%; | ||
+ | float:left; | ||
+ | -moz-box-sizing: border-box; | ||
+ | box-sizing: border-box; | ||
+ | text-align:center; | ||
+ | padding:4px; | ||
+ | } | ||
+ | |||
+ | .homeNavigationGames20 { | ||
+ | width:20%; | ||
+ | float:left; | ||
+ | -moz-box-sizing: border-box; | ||
+ | box-sizing: border-box; | ||
+ | text-align:center; | ||
+ | padding:4px; | ||
+ | } | ||
+ | |||
+ | .bgLightBlue { | ||
+ | background-color:#eeeeff; | ||
+ | } | ||
+ | |||
+ | .bgLightGray { | ||
+ | background-color:#f9f9f9; | ||
+ | } | ||
+ | |||
+ | .txtCenter { | ||
+ | text-align:center; | ||
+ | } | ||
+ | |||
+ | .fontSmall { | ||
+ | font-size:95%; | ||
+ | } | ||
+ | |||
+ | .styleLang { | ||
+ | width:100%; | ||
+ | font-size:95%; | ||
+ | } | ||
+ | |||
+ | .styleLangText { | ||
+ | vertical-align:top; | ||
+ | background-color:#eee; | ||
+ | border:1px solid #aaa; | ||
+ | } | ||
+ | |||
+ | .styleLangSelect { | ||
+ | width:100%; | ||
+ | background-color:#f9f9f9; | ||
+ | border:1px solid #aaa; | ||
+ | border-left:0; | ||
} | } | ||
Line 29: | Line 111: | ||
display: none; | display: none; | ||
speak: none; | speak: none; | ||
+ | } | ||
+ | |||
+ | .hideMobile { | ||
+ | display:none; | ||
+ | } | ||
+ | |||
+ | .floatingDiv { | ||
+ | float:none; | ||
+ | } | ||
+ | |||
+ | .mTop10 { | ||
+ | margin-top:10px; | ||
+ | } | ||
+ | |||
+ | .WhButton { | ||
+ | background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ffffff), color-stop(1, #f6f6f6)); | ||
+ | background:-moz-linear-gradient(top, #ffffff 5%, #f6f6f6 100%); | ||
+ | background:-webkit-linear-gradient(top, #ffffff 5%, #f6f6f6 100%); | ||
+ | background:-o-linear-gradient(top, #ffffff 5%, #f6f6f6 100%); | ||
+ | background:-ms-linear-gradient(top, #ffffff 5%, #f6f6f6 100%); | ||
+ | background:linear-gradient(to bottom, #ffffff 5%, #f6f6f6 100%); | ||
+ | filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f6f6f6',GradientType=0); | ||
+ | background-color:#ffffff; | ||
+ | -moz-border-radius:6px; | ||
+ | -webkit-border-radius:6px; | ||
+ | border-radius:6px; | ||
+ | border:1px solid #dcdcdc; | ||
+ | display:inline-block; | ||
+ | cursor:pointer; | ||
+ | color:#333; | ||
+ | font-size:10px; | ||
+ | padding:1px 4px; | ||
+ | text-decoration:none; | ||
+ | margin-top:3px; | ||
+ | } | ||
+ | |||
+ | .WhButton:hover { | ||
+ | background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #f6f6f6), color-stop(1, #ffffff)); | ||
+ | background:-moz-linear-gradient(top, #f6f6f6 5%, #ffffff 100%); | ||
+ | background:-webkit-linear-gradient(top, #f6f6f6 5%, #ffffff 100%); | ||
+ | background:-o-linear-gradient(top, #f6f6f6 5%, #ffffff 100%); | ||
+ | background:-ms-linear-gradient(top, #f6f6f6 5%, #ffffff 100%); | ||
+ | background:linear-gradient(to bottom, #f6f6f6 5%, #ffffff 100%); | ||
+ | filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f6f6f6', endColorstr='#ffffff',GradientType=0); | ||
+ | background-color:#f6f6f6; | ||
+ | } | ||
+ | |||
+ | .WhButton:active { | ||
+ | position:relative; | ||
+ | top:1px; | ||
+ | } | ||
+ | |||
+ | .WhButton2 { | ||
+ | -moz-box-shadow:inset 0px 1px 0px 0px #eff5ff; | ||
+ | -webkit-box-shadow:inset 0px 1px 0px 0px #eff5ff; | ||
+ | box-shadow:inset 0px 1px 0px 0px #eff5ff; | ||
+ | background-color:transparent; | ||
+ | -moz-border-radius:6px; | ||
+ | -webkit-border-radius:6px; | ||
+ | border-radius:6px; | ||
+ | border:1px solid #cfe2ff; | ||
+ | display:inline-block; | ||
+ | cursor:pointer; | ||
+ | color:#333; | ||
+ | font-size:10px; | ||
+ | padding:1px 4px; | ||
+ | text-decoration:none; | ||
+ | margin-top:3px; | ||
+ | } | ||
+ | |||
+ | .WhButton2:hover { | ||
+ | background-color:transparent; | ||
+ | } | ||
+ | |||
+ | .WhButton2:active { | ||
+ | position:relative; | ||
+ | top:1px; | ||
+ | } | ||
+ | |||
+ | .mobileLeft { | ||
+ | float: left; | ||
+ | padding-right: 4px; | ||
+ | padding-bottom: 2px; | ||
+ | } | ||
+ | |||
+ | @media (max-width: 450px) { | ||
+ | .breakMobile { width:100%; float:none; } | ||
} | } |
Latest revision as of 09:31, 21 October 2016
/* CSS placed here will affect users of the mobile site */ .homeBoxBorder { width:100%; box-sizing: border-box; border: 1px solid #aaaaaa; margin-bottom:20px; } .homeWelcomeText { font-size:170%; margin: 2px !important; text-align:center; } .homeWelcomeTitle { width:100%; box-sizing: border-box; padding:8px; background-color:#ddddff; } .homeBoxTitle { width:100%; box-sizing: border-box; padding:8px; background-color:#eeeeee; text-align:center; } .homeBoxContent { width:100%; box-sizing: border-box; padding:8px; } .homeContentLeft { width:100%; float:none; box-sizing: border-box; } .homeContentRight { width:100%; float:none; box-sizing: border-box; } .homeNavigationGames { width:33%; float:left; -moz-box-sizing: border-box; box-sizing: border-box; text-align:center; padding:4px; } .homeNavigationGames25 { width:25%; float:left; -moz-box-sizing: border-box; box-sizing: border-box; text-align:center; padding:4px; } .homeNavigationGames20 { width:20%; float:left; -moz-box-sizing: border-box; box-sizing: border-box; text-align:center; padding:4px; } .bgLightBlue { background-color:#eeeeff; } .bgLightGray { background-color:#f9f9f9; } .txtCenter { text-align:center; } .fontSmall { font-size:95%; } .styleLang { width:100%; font-size:95%; } .styleLangText { vertical-align:top; background-color:#eee; border:1px solid #aaa; } .styleLangSelect { width:100%; background-color:#f9f9f9; border:1px solid #aaa; border-left:0; } .hiddenStructure { display: none; speak: none; } .hideMobile { display:none; } .floatingDiv { float:none; } .mTop10 { margin-top:10px; } .WhButton { background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ffffff), color-stop(1, #f6f6f6)); background:-moz-linear-gradient(top, #ffffff 5%, #f6f6f6 100%); background:-webkit-linear-gradient(top, #ffffff 5%, #f6f6f6 100%); background:-o-linear-gradient(top, #ffffff 5%, #f6f6f6 100%); background:-ms-linear-gradient(top, #ffffff 5%, #f6f6f6 100%); background:linear-gradient(to bottom, #ffffff 5%, #f6f6f6 100%); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f6f6f6',GradientType=0); background-color:#ffffff; -moz-border-radius:6px; -webkit-border-radius:6px; border-radius:6px; border:1px solid #dcdcdc; display:inline-block; cursor:pointer; color:#333; font-size:10px; padding:1px 4px; text-decoration:none; margin-top:3px; } .WhButton:hover { background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #f6f6f6), color-stop(1, #ffffff)); background:-moz-linear-gradient(top, #f6f6f6 5%, #ffffff 100%); background:-webkit-linear-gradient(top, #f6f6f6 5%, #ffffff 100%); background:-o-linear-gradient(top, #f6f6f6 5%, #ffffff 100%); background:-ms-linear-gradient(top, #f6f6f6 5%, #ffffff 100%); background:linear-gradient(to bottom, #f6f6f6 5%, #ffffff 100%); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f6f6f6', endColorstr='#ffffff',GradientType=0); background-color:#f6f6f6; } .WhButton:active { position:relative; top:1px; } .WhButton2 { -moz-box-shadow:inset 0px 1px 0px 0px #eff5ff; -webkit-box-shadow:inset 0px 1px 0px 0px #eff5ff; box-shadow:inset 0px 1px 0px 0px #eff5ff; background-color:transparent; -moz-border-radius:6px; -webkit-border-radius:6px; border-radius:6px; border:1px solid #cfe2ff; display:inline-block; cursor:pointer; color:#333; font-size:10px; padding:1px 4px; text-decoration:none; margin-top:3px; } .WhButton2:hover { background-color:transparent; } .WhButton2:active { position:relative; top:1px; } .mobileLeft { float: left; padding-right: 4px; padding-bottom: 2px; } @media (max-width: 450px) { .breakMobile { width:100%; float:none; } }