「MediaWiki:Mobile.css」修訂間的差異
跳至導覽
跳至搜尋
小 |
小 |
||
| 行 1: | 行 1: | ||
/* main page */ | /* main page */ | ||
body.page-Main_Page #mw-mf-viewport div.as-h4 { | body.page-Main_Page #mw-mf-viewport div.as-h4 { | ||
| − | + | font-size: 24px; | |
| − | + | margin-bottom: 15px; | |
| − | + | line-height: 1.4; } | |
| − | body.page-Main_Page #mw-mf-viewport .main-page-banner { | + | body.page-Main_Page #mw-mf-viewport .main-page-banner { |
| − | + | background-color: #CEDFF2; | |
| − | + | padding: 2px; | |
| − | + | border-radius: 10px; } | |
| − | + | body.page-Main_Page #mw-mf-viewport .main-page-banner .banner-left, body.page-Main_Page #mw-mf-viewport .main-page-banner .banner-right { | |
| − | + | box-sizing: border-box; } | |
| − | + | @media (min-width: 768px) { | |
| − | + | body.page-Main_Page #mw-mf-viewport .main-page-banner .banner-left, body.page-Main_Page #mw-mf-viewport .main-page-banner .banner-right { | |
| − | + | float: left; } } | |
| − | + | body.page-Main_Page #mw-mf-viewport .main-page-banner .banner-left { | |
| − | + | background-color: #fff; | |
| − | + | border-radius: 10px; | |
| − | + | padding: 5px 0; | |
| − | + | text-align: center; | |
| − | + | vertical-align: middle; } | |
| − | + | body.page-Main_Page #mw-mf-viewport .main-page-banner .banner-left h1 { | |
| − | + | margin: 0 !important; | |
| − | + | padding: 0 !important; | |
| − | + | line-height: 1 !important; | |
| − | + | font-size: 46px !important; | |
| − | + | border: 0 !important; | |
| − | + | font-weight: bold; } | |
| − | + | body.page-Main_Page #mw-mf-viewport .main-page-banner .banner-left em { | |
| − | + | font-weight: bold; | |
| − | + | color: green; | |
| − | + | font-style: normal; } | |
| − | + | body.page-Main_Page #mw-mf-viewport .main-page-banner .banner-left .top-8-words { | |
| − | + | padding: 4px 0 0 0; | |
| − | + | font-size: 15px; } | |
| − | + | body.page-Main_Page #mw-mf-viewport .main-page-banner .banner-left .bottom-counter { | |
| − | + | padding: 6px 0 3px 0; | |
| − | + | font-size: 16px; } | |
| − | + | @media (min-width: 768px) { | |
| − | + | body.page-Main_Page #mw-mf-viewport .main-page-banner .banner-left { | |
| − | + | width: 75%; } } | |
| − | + | body.page-Main_Page #mw-mf-viewport .main-page-banner .banner-right { | |
| − | + | padding: 10px; } | |
| − | + | body.page-Main_Page #mw-mf-viewport .main-page-banner .banner-right ul { | |
| − | + | font-size: 19px; | |
| − | + | line-height: 1.4; } | |
| − | + | @media (min-width: 768px) { | |
| − | + | body.page-Main_Page #mw-mf-viewport .main-page-banner .banner-right { | |
| − | + | width: 25%; } } | |
| − | + | body.page-Main_Page #mw-mf-viewport .main-page-banner:after { | |
| − | + | content: ""; | |
| − | + | clear: both; | |
| − | + | display: block; } | |
| − | body.page-Main_Page #mw-mf-viewport .wikipedia { | + | body.page-Main_Page #mw-mf-viewport .wikipedia { |
| − | + | padding: 10px 0; | |
| − | + | margin: auto -15px; | |
| − | + | display: none; } | |
| − | + | body.page-Main_Page #mw-mf-viewport .wikipedia .my-wiki-item { | |
| − | + | float: left; | |
| − | + | width: 50%; | |
| − | + | font-size: 14px; | |
| − | + | line-height: 1.4; | |
| − | + | box-sizing: border-box; | |
| − | + | padding: 15px; } | |
| − | + | body.page-Main_Page #mw-mf-viewport .wikipedia .my-wiki-item div.as-h4 { | |
| − | + | border-bottom: 1px solid #aaa; } | |
| − | + | body.page-Main_Page #mw-mf-viewport .wikipedia .my-wiki-item > div { | |
| − | + | border: 1px solid #ccc; | |
| − | + | padding: 10px 15px 15px 15px; } | |
| − | + | body.page-Main_Page #mw-mf-viewport .wikipedia:after { | |
| − | + | content: ""; | |
| − | + | clear: both; | |
| − | + | display: block; } | |
| − | + | @media (min-width: 768px) { | |
| − | + | body.page-Main_Page #mw-mf-viewport .wikipedia { | |
| − | + | display: block; } } | |
| − | body.page-Main_Page #mw-mf-viewport .main-page-main { | + | body.page-Main_Page #mw-mf-viewport .main-page-main { |
| − | + | margin: auto -15px; | |
| − | + | line-height: 1.4; } | |
| − | + | body.page-Main_Page #mw-mf-viewport .main-page-main div.as-h4 { | |
| − | + | font-weight: bold; } | |
| − | + | body.page-Main_Page #mw-mf-viewport .main-page-main .main-left, body.page-Main_Page #mw-mf-viewport .main-page-main .main-right { | |
| − | + | padding: 15px; | |
| − | + | box-sizing: border-box; } | |
| − | + | @media (min-width: 768px) { | |
| − | + | body.page-Main_Page #mw-mf-viewport .main-page-main .main-left, body.page-Main_Page #mw-mf-viewport .main-page-main .main-right { | |
| − | + | float: left; } } | |
| − | + | body.page-Main_Page #mw-mf-viewport .main-page-main .main-left .main-content-1, body.page-Main_Page #mw-mf-viewport .main-page-main .main-left .main-content-2, body.page-Main_Page #mw-mf-viewport .main-page-main .main-left .main-content-3 { | |
| − | + | list-style: square inside; | |
| − | + | margin-bottom: 15px; | |
| − | + | padding-top: 15px; } | |
| − | + | body.page-Main_Page #mw-mf-viewport .main-page-main .main-left .main-content-1 ul li, body.page-Main_Page #mw-mf-viewport .main-page-main .main-left .main-content-2 ul li, body.page-Main_Page #mw-mf-viewport .main-page-main .main-left .main-content-3 .randomPages > span { | |
| − | + | float: left; | |
| − | + | display: list-item; | |
| − | + | width: 50%; } | |
| − | + | @media (min-width: 768px) { | |
| − | + | body.page-Main_Page #mw-mf-viewport .main-page-main .main-left .main-content-1 ul li, body.page-Main_Page #mw-mf-viewport .main-page-main .main-left .main-content-2 ul li, body.page-Main_Page #mw-mf-viewport .main-page-main .main-left .main-content-3 .randomPages > span { | |
| − | + | width: 33.3333%; } } | |
| − | + | body.page-Main_Page #mw-mf-viewport .main-page-main .main-left .main-content-1 ul:after, body.page-Main_Page #mw-mf-viewport .main-page-main .main-left .main-content-2 ul:after, body.page-Main_Page #mw-mf-viewport .main-page-main .main-left .main-content-3 .randomPages:after { | |
| − | + | content: ""; | |
| − | + | clear: both; | |
| − | + | display: block; } | |
| − | + | body.page-Main_Page #mw-mf-viewport .main-page-main .main-left .main-content-2, body.page-Main_Page #mw-mf-viewport .main-page-main .main-left .main-content-3 { | |
| − | + | border-top: 1px solid #EEE; } | |
| − | + | @media (min-width: 768px) { | |
| − | + | body.page-Main_Page #mw-mf-viewport .main-page-main .main-left { | |
| − | + | width: 65%; } } | |
| − | + | body.page-Main_Page #mw-mf-viewport .main-page-main .main-right .main-recent-modify { | |
| − | + | margin-bottom: 15px; | |
| − | + | border: 1px solid #EEE; | |
| − | + | padding: 15px; } | |
| − | + | body.page-Main_Page #mw-mf-viewport .main-page-main .main-right .main-recent-modify ol { | |
| − | + | list-style-type: decimal !important; | |
| − | + | list-style-image: none; } | |
| − | + | body.page-Main_Page #mw-mf-viewport .main-page-main .main-right .main-recent-modify ol li { | |
| − | + | float: left; | |
| − | + | width: 50%; } | |
| − | + | body.page-Main_Page #mw-mf-viewport .main-page-main .main-right .main-recent-modify ol:after { | |
| − | + | content: ""; | |
| − | + | clear: both; | |
| − | + | display: block; } | |
| − | + | body.page-Main_Page #mw-mf-viewport .main-page-main .main-right .facebook-timeline { | |
| − | + | padding-top: 15px; | |
| − | + | text-align: center; } | |
| − | + | @media (min-width: 768px) { | |
| − | + | body.page-Main_Page #mw-mf-viewport .main-page-main .main-right { | |
| − | + | width: 35%; } } | |
| − | + | body.page-Main_Page #mw-mf-viewport .main-page-main:after { | |
| − | + | content: ""; | |
| − | + | clear: both; | |
| − | /* NavBox */ | + | display: block; } |
| − | .my-nav-box { | + | |
| − | + | /* NavBox */ | |
| − | + | .my-nav-box { | |
| − | + | font-size: 15px; | |
| − | + | border: 1px solid #ccc; | |
| − | + | padding: 2px 2px 0px 2px; | |
| − | + | background-color: #fdfdfd; | |
| − | + | clear: both; | |
| − | + | line-height: 1.4em; } | |
| − | + | .my-nav-box .title { | |
| − | + | font-weight: bold; | |
| − | + | margin-bottom: 2px; | |
| − | + | text-align: center; | |
| − | + | background-color: #ccccff; | |
| − | + | padding: 1px 13px; } | |
| − | + | .my-nav-box dl { | |
| − | + | margin: 0; } | |
| − | + | .my-nav-box dl dd, .my-nav-box dl dt { | |
| − | + | margin-bottom: 2px; | |
| − | + | padding-top: 1px; | |
| − | + | padding-bottom: 1px; } | |
| − | + | .my-nav-box dl dt { | |
| − | + | text-align: center; | |
| − | + | font-weight: bold; | |
| − | + | background-color: #ddddff; | |
| − | + | padding-left: 13px; | |
| − | + | padding-right: 13px; } | |
| − | + | @media (min-width: 768px) { | |
| − | + | .my-nav-box dl dt { | |
| − | + | width: 180px; | |
| − | + | float: left; | |
| − | + | text-align: right; } } | |
| − | + | .my-nav-box dl dd { | |
| − | + | padding-left: 6px; | |
| − | + | padding-right: 6px; } | |
| − | + | .my-nav-box dl dd a, .my-nav-box dl dd strong { | |
| − | + | margin-left: 6px; | |
| − | + | margin-right: 6px; } | |
| − | + | @media (min-width: 768px) { | |
| − | + | .my-nav-box dl dd { | |
| − | + | margin-left: 200px; } | |
| + | .my-nav-box dl dd:nth-child(4n) { | ||
| + | background-color: #f7f7f7; } } | ||
於 2018年8月10日 (五) 00:28 的修訂
/* main page */
body.page-Main_Page #mw-mf-viewport div.as-h4 {
font-size: 24px;
margin-bottom: 15px;
line-height: 1.4; }
body.page-Main_Page #mw-mf-viewport .main-page-banner {
background-color: #CEDFF2;
padding: 2px;
border-radius: 10px; }
body.page-Main_Page #mw-mf-viewport .main-page-banner .banner-left, body.page-Main_Page #mw-mf-viewport .main-page-banner .banner-right {
box-sizing: border-box; }
@media (min-width: 768px) {
body.page-Main_Page #mw-mf-viewport .main-page-banner .banner-left, body.page-Main_Page #mw-mf-viewport .main-page-banner .banner-right {
float: left; } }
body.page-Main_Page #mw-mf-viewport .main-page-banner .banner-left {
background-color: #fff;
border-radius: 10px;
padding: 5px 0;
text-align: center;
vertical-align: middle; }
body.page-Main_Page #mw-mf-viewport .main-page-banner .banner-left h1 {
margin: 0 !important;
padding: 0 !important;
line-height: 1 !important;
font-size: 46px !important;
border: 0 !important;
font-weight: bold; }
body.page-Main_Page #mw-mf-viewport .main-page-banner .banner-left em {
font-weight: bold;
color: green;
font-style: normal; }
body.page-Main_Page #mw-mf-viewport .main-page-banner .banner-left .top-8-words {
padding: 4px 0 0 0;
font-size: 15px; }
body.page-Main_Page #mw-mf-viewport .main-page-banner .banner-left .bottom-counter {
padding: 6px 0 3px 0;
font-size: 16px; }
@media (min-width: 768px) {
body.page-Main_Page #mw-mf-viewport .main-page-banner .banner-left {
width: 75%; } }
body.page-Main_Page #mw-mf-viewport .main-page-banner .banner-right {
padding: 10px; }
body.page-Main_Page #mw-mf-viewport .main-page-banner .banner-right ul {
font-size: 19px;
line-height: 1.4; }
@media (min-width: 768px) {
body.page-Main_Page #mw-mf-viewport .main-page-banner .banner-right {
width: 25%; } }
body.page-Main_Page #mw-mf-viewport .main-page-banner:after {
content: "";
clear: both;
display: block; }
body.page-Main_Page #mw-mf-viewport .wikipedia {
padding: 10px 0;
margin: auto -15px;
display: none; }
body.page-Main_Page #mw-mf-viewport .wikipedia .my-wiki-item {
float: left;
width: 50%;
font-size: 14px;
line-height: 1.4;
box-sizing: border-box;
padding: 15px; }
body.page-Main_Page #mw-mf-viewport .wikipedia .my-wiki-item div.as-h4 {
border-bottom: 1px solid #aaa; }
body.page-Main_Page #mw-mf-viewport .wikipedia .my-wiki-item > div {
border: 1px solid #ccc;
padding: 10px 15px 15px 15px; }
body.page-Main_Page #mw-mf-viewport .wikipedia:after {
content: "";
clear: both;
display: block; }
@media (min-width: 768px) {
body.page-Main_Page #mw-mf-viewport .wikipedia {
display: block; } }
body.page-Main_Page #mw-mf-viewport .main-page-main {
margin: auto -15px;
line-height: 1.4; }
body.page-Main_Page #mw-mf-viewport .main-page-main div.as-h4 {
font-weight: bold; }
body.page-Main_Page #mw-mf-viewport .main-page-main .main-left, body.page-Main_Page #mw-mf-viewport .main-page-main .main-right {
padding: 15px;
box-sizing: border-box; }
@media (min-width: 768px) {
body.page-Main_Page #mw-mf-viewport .main-page-main .main-left, body.page-Main_Page #mw-mf-viewport .main-page-main .main-right {
float: left; } }
body.page-Main_Page #mw-mf-viewport .main-page-main .main-left .main-content-1, body.page-Main_Page #mw-mf-viewport .main-page-main .main-left .main-content-2, body.page-Main_Page #mw-mf-viewport .main-page-main .main-left .main-content-3 {
list-style: square inside;
margin-bottom: 15px;
padding-top: 15px; }
body.page-Main_Page #mw-mf-viewport .main-page-main .main-left .main-content-1 ul li, body.page-Main_Page #mw-mf-viewport .main-page-main .main-left .main-content-2 ul li, body.page-Main_Page #mw-mf-viewport .main-page-main .main-left .main-content-3 .randomPages > span {
float: left;
display: list-item;
width: 50%; }
@media (min-width: 768px) {
body.page-Main_Page #mw-mf-viewport .main-page-main .main-left .main-content-1 ul li, body.page-Main_Page #mw-mf-viewport .main-page-main .main-left .main-content-2 ul li, body.page-Main_Page #mw-mf-viewport .main-page-main .main-left .main-content-3 .randomPages > span {
width: 33.3333%; } }
body.page-Main_Page #mw-mf-viewport .main-page-main .main-left .main-content-1 ul:after, body.page-Main_Page #mw-mf-viewport .main-page-main .main-left .main-content-2 ul:after, body.page-Main_Page #mw-mf-viewport .main-page-main .main-left .main-content-3 .randomPages:after {
content: "";
clear: both;
display: block; }
body.page-Main_Page #mw-mf-viewport .main-page-main .main-left .main-content-2, body.page-Main_Page #mw-mf-viewport .main-page-main .main-left .main-content-3 {
border-top: 1px solid #EEE; }
@media (min-width: 768px) {
body.page-Main_Page #mw-mf-viewport .main-page-main .main-left {
width: 65%; } }
body.page-Main_Page #mw-mf-viewport .main-page-main .main-right .main-recent-modify {
margin-bottom: 15px;
border: 1px solid #EEE;
padding: 15px; }
body.page-Main_Page #mw-mf-viewport .main-page-main .main-right .main-recent-modify ol {
list-style-type: decimal !important;
list-style-image: none; }
body.page-Main_Page #mw-mf-viewport .main-page-main .main-right .main-recent-modify ol li {
float: left;
width: 50%; }
body.page-Main_Page #mw-mf-viewport .main-page-main .main-right .main-recent-modify ol:after {
content: "";
clear: both;
display: block; }
body.page-Main_Page #mw-mf-viewport .main-page-main .main-right .facebook-timeline {
padding-top: 15px;
text-align: center; }
@media (min-width: 768px) {
body.page-Main_Page #mw-mf-viewport .main-page-main .main-right {
width: 35%; } }
body.page-Main_Page #mw-mf-viewport .main-page-main:after {
content: "";
clear: both;
display: block; }
/* NavBox */
.my-nav-box {
font-size: 15px;
border: 1px solid #ccc;
padding: 2px 2px 0px 2px;
background-color: #fdfdfd;
clear: both;
line-height: 1.4em; }
.my-nav-box .title {
font-weight: bold;
margin-bottom: 2px;
text-align: center;
background-color: #ccccff;
padding: 1px 13px; }
.my-nav-box dl {
margin: 0; }
.my-nav-box dl dd, .my-nav-box dl dt {
margin-bottom: 2px;
padding-top: 1px;
padding-bottom: 1px; }
.my-nav-box dl dt {
text-align: center;
font-weight: bold;
background-color: #ddddff;
padding-left: 13px;
padding-right: 13px; }
@media (min-width: 768px) {
.my-nav-box dl dt {
width: 180px;
float: left;
text-align: right; } }
.my-nav-box dl dd {
padding-left: 6px;
padding-right: 6px; }
.my-nav-box dl dd a, .my-nav-box dl dd strong {
margin-left: 6px;
margin-right: 6px; }
@media (min-width: 768px) {
.my-nav-box dl dd {
margin-left: 200px; }
.my-nav-box dl dd:nth-child(4n) {
background-color: #f7f7f7; } }