The iPhone Wiki is no longer updated. Visit this article on The Apple Wiki for current information. |
Difference between revisions of "MediaWiki:Common.css"
(float:right the .keypage-filename) |
(add SF Mono font, add text-size-adjust workaround) |
||
(31 intermediate revisions by 3 users not shown) | |||
Line 1: | Line 1: | ||
+ | /* Fix mobile browsers randomly scaling text */ |
||
− | /* [[Main Page]] specifics */ |
||
+ | * { |
||
+ | -webkit-text-size-adjust: 100%; |
||
+ | } |
||
+ | |||
+ | /* Apply a fixed-width font for textareas */ |
||
+ | pre, code, tt, kbd, samp, .mw-code, |
||
+ | textarea, .mw-editfont-monospace { |
||
+ | font-family: "SF Mono", ui-monospace, "Menlo", "Andale Mono", "Courier Prime", "Courier", monospace; |
||
+ | } |
||
+ | |||
+ | |||
+ | /* Flex boxes |
||
+ | * -- Each <div> will have equal width |
||
+ | */ |
||
+ | .flex { |
||
+ | display: flex; |
||
+ | flex-direction: row; |
||
+ | } |
||
+ | .flex > div { |
||
+ | flex: 1 1 0; |
||
+ | padding-right: 4px; |
||
+ | } |
||
+ | .flex > div:last-child { |
||
+ | padding-right: 0px !important; |
||
+ | } |
||
+ | |||
+ | |||
+ | /* [[Main Page]] */ |
||
body.page-Main_Page h1.firstHeading { |
body.page-Main_Page h1.firstHeading { |
||
display: none; |
display: none; |
||
} |
} |
||
body.page-Main_Page div.mw-headline { |
body.page-Main_Page div.mw-headline { |
||
− | padding: 0.2em 0.4em; |
||
− | margin: 10px 0 10px 0; |
||
border-bottom: 4px solid #A3BFB1; |
border-bottom: 4px solid #A3BFB1; |
||
border-bottom: 4px solid rgba(163, 191, 177, 0.5); |
border-bottom: 4px solid rgba(163, 191, 177, 0.5); |
||
Line 13: | Line 39: | ||
font-size: 120%; |
font-size: 120%; |
||
font-weight: bold; |
font-weight: bold; |
||
+ | margin: 10px 0 10px 0; |
||
+ | padding: 0.2em 0.4em; |
||
} |
} |
||
+ | /* [[Template:keys]] */ |
||
− | |||
− | /* [[Template:keys]] page file names */ |
||
span.keypage-filename { |
span.keypage-filename { |
||
− | color: # |
+ | color: #333; |
float: right; |
float: right; |
||
+ | font-size: 1rem; /* [http://snook.ca/archives/html_and_css/font-size-with-rem] */ |
||
− | text-transform: none; |
||
− | + | position: relative; |
|
+ | top: -2em; |
||
} |
} |
||
+ | /* [[Template:Archive Page]] */ |
||
+ | .archive-page-notice, |
||
+ | .archive-page-notice td { |
||
+ | background-color: #CC9 !important; |
||
+ | } |
||
+ | |||
+ | |||
+ | /* [[Template:internal software]] */ |
||
+ | .internal-software-notice { |
||
+ | background-color: #FBB; |
||
+ | border: 3px solid #F55; |
||
+ | margin-bottom: 0.5em; |
||
+ | text-align: center; |
||
+ | width: 100%; |
||
+ | padding: 8px; |
||
+ | } |
||
+ | |||
+ | |||
+ | /* [[Template:date]] */ |
||
+ | .date { |
||
+ | white-space: nowrap; |
||
+ | } |
||
+ | |||
+ | |||
+ | /* [[Firmware Keys]] */ |
||
+ | .page-Firmware_Keys_1_x #mw-content-text .wikitable td, |
||
+ | .page-Firmware_Keys_2_x #mw-content-text .wikitable td, |
||
+ | .page-Firmware_Keys_3_x #mw-content-text .wikitable td, |
||
+ | .page-Firmware_Keys_4_x #mw-content-text .wikitable td, |
||
+ | .page-Firmware_Keys_5_x #mw-content-text .wikitable td, |
||
+ | .page-Firmware_Keys_6_x #mw-content-text .wikitable td, |
||
+ | .page-Firmware_Keys_7_x #mw-content-text .wikitable td, |
||
+ | .page-Firmware_Keys_8_x #mw-content-text .wikitable td, |
||
+ | .page-Firmware_Keys_9_x #mw-content-text .wikitable td, |
||
+ | .page-Firmware_Keys_10_x #mw-content-text .wikitable td, |
||
+ | .page-Firmware_Keys_11_x #mw-content-text .wikitable td, |
||
+ | .page-Firmware_Keys_12_x #mw-content-text .wikitable td, |
||
+ | .page-Firmware_Keys_13_x #mw-content-text .wikitable td, |
||
+ | .page-Firmware_Keys_14_x #mw-content-text .wikitable td, |
||
+ | .page-Firmware_Keys_15_x #mw-content-text .wikitable td, |
||
+ | .page-Firmware_Keys_16_x #mw-content-text .wikitable td |
||
+ | { |
||
+ | white-space: nowrap; |
||
+ | } |
||
+ | |||
+ | |||
+ | |||
+ | |||
+ | /* ============================================================================ |
||
+ | * Borrowed from [[wikipedia:MediaWiki:Common.css]] |
||
+ | * ============================================================================ |
||
+ | */ |
||
+ | |||
+ | |||
+ | /* Infobox */ |
||
.infobox { |
.infobox { |
||
border: 1px solid #aaa; |
border: 1px solid #aaa; |
||
background-color: #f9f9f9; |
background-color: #f9f9f9; |
||
+ | clear: right; |
||
color: black; |
color: black; |
||
− | margin: 0.5em 0 0.5em 1em; |
||
− | padding: 0.2em; |
||
float: right; |
float: right; |
||
− | clear: right; |
||
− | text-align: left; |
||
font-size: 88%; |
font-size: 88%; |
||
line-height: 1.5em; |
line-height: 1.5em; |
||
+ | margin: 0.5em 0 0.5em 1em; |
||
+ | padding: 0.2em; |
||
+ | text-align: left; |
||
} |
} |
||
.infobox caption { |
.infobox caption { |
||
Line 46: | Line 129: | ||
vertical-align: top; |
vertical-align: top; |
||
} |
} |
||
+ | |||
table.wikitable { |
table.wikitable { |
||
− | + | font-size: smaller; |
|
} |
} |
||
table#archive-page-notice { |
table#archive-page-notice { |
||
− | + | font-size: small; |
|
} |
} |
||
table.wikitable * { |
table.wikitable * { |
||
− | + | text-align: center; |
|
} |
} |
||
+ | |||
+ | |||
+ | /* [[Template:n/a]], [[Template:no]], [[Template:partial]], [[Template:yes]] */ |
||
.table-no, |
.table-no, |
||
.table-partial, |
.table-partial, |
||
.table-yes { |
.table-yes { |
||
− | + | color: #000; |
|
− | + | text-align: center; |
|
− | + | vertical-align: middle; |
|
} |
} |
||
.table-no { |
.table-no { |
||
− | + | background-color: #D88 !important; |
|
} |
} |
||
.table-partial { |
.table-partial { |
||
− | + | background-color: #EEA !important; |
|
} |
} |
||
.table-yes { |
.table-yes { |
||
− | + | background-color: #AE9 !important; |
|
} |
} |
||
.table-na { |
.table-na { |
||
− | + | background-color: #F0F0F0 !important; |
|
− | + | color: gray; |
|
− | + | text-align: center; |
|
− | + | vertical-align: middle; |
|
+ | } |
||
+ | |||
+ | |||
+ | /* [[Template:hatnote]] */ |
||
+ | .rellink, |
||
+ | .hatnote { |
||
+ | font-style: italic; |
||
+ | } |
||
+ | .rellink i, |
||
+ | .hatnote i { |
||
+ | font-style: normal; |
||
+ | } |
||
+ | div.rellink, |
||
+ | div.hatnote { |
||
+ | padding-left: 1.6em; |
||
+ | margin-bottom: 0.5em; |
||
} |
} |
||
− | /* Borrowed from Wikipedia's Common.css */ |
||
/* Allow limiting of which header levels are shown in a TOC; |
/* Allow limiting of which header levels are shown in a TOC; |
||
Line 92: | Line 194: | ||
.toclimit-6 .toclevel-5 ul, |
.toclimit-6 .toclevel-5 ul, |
||
.toclimit-7 .toclevel-6 ul { |
.toclimit-7 .toclevel-6 ul { |
||
− | + | display: none; |
|
+ | } |
||
+ | |||
+ | |||
+ | /* [[Template:Horizontal TOC]] */ |
||
+ | .hlist dl, |
||
+ | .hlist ol, |
||
+ | .hlist ul { |
||
+ | margin: 0; |
||
+ | padding: 0; |
||
+ | } |
||
+ | /* Display list items inline */ |
||
+ | .hlist dd, |
||
+ | .hlist dt, |
||
+ | .hlist li { |
||
+ | margin: 0; |
||
+ | display: inline; |
||
+ | } |
||
+ | /* Display nested lists inline */ |
||
+ | .hlist.inline, |
||
+ | .hlist.inline dl, |
||
+ | .hlist.inline ol, |
||
+ | .hlist.inline ul, |
||
+ | .hlist dl dl, .hlist dl ol, .hlist dl ul, |
||
+ | .hlist ol dl, .hlist ol ol, .hlist ol ul, |
||
+ | .hlist ul dl, .hlist ul ol, .hlist ul ul { |
||
+ | display: inline; |
||
+ | } |
||
+ | /* Generate interpuncts */ |
||
+ | .hlist dt:after { |
||
+ | content: ": "; |
||
+ | } |
||
+ | .hlist dd:after, |
||
+ | .hlist li:after { |
||
+ | content: " · "; |
||
+ | font-weight: bold; |
||
+ | } |
||
+ | .hlist dd:last-child:after, |
||
+ | .hlist dt:last-child:after, |
||
+ | .hlist li:last-child:after { |
||
+ | content: none; |
||
+ | } |
||
+ | /* For IE8 */ |
||
+ | .hlist dd.hlist-last-child:after, |
||
+ | .hlist dt.hlist-last-child:after, |
||
+ | .hlist li.hlist-last-child:after { |
||
+ | content: none; |
||
+ | } |
||
+ | /* Add parentheses around nested lists */ |
||
+ | .hlist dd dd:first-child:before, .hlist dd dt:first-child:before, .hlist dd li:first-child:before, |
||
+ | .hlist dt dd:first-child:before, .hlist dt dt:first-child:before, .hlist dt li:first-child:before, |
||
+ | .hlist li dd:first-child:before, .hlist li dt:first-child:before, .hlist li li:first-child:before { |
||
+ | content: " ("; |
||
+ | font-weight: normal; |
||
+ | } |
||
+ | .hlist dd dd:last-child:after, .hlist dd dt:last-child:after, .hlist dd li:last-child:after, |
||
+ | .hlist dt dd:last-child:after, .hlist dt dt:last-child:after, .hlist dt li:last-child:after, |
||
+ | .hlist li dd:last-child:after, .hlist li dt:last-child:after, .hlist li li:last-child:after { |
||
+ | content: ") "; |
||
+ | font-weight: normal; |
||
+ | } |
||
+ | /* For IE8 */ |
||
+ | .hlist dd dd.hlist-last-child:after, .hlist dd dt.hlist-last-child:after, .hlist dd li.hlist-last-child:after, |
||
+ | .hlist dt dd.hlist-last-child:after, .hlist dt dt.hlist-last-child:after, .hlist dt li.hlist-last-child:after, |
||
+ | .hlist li dd.hlist-last-child:after, .hlist li dt.hlist-last-child:after, .hlist li li.hlist-last-child:after { |
||
+ | content: ") "; |
||
+ | font-weight: normal; |
||
+ | } |
||
+ | /* Put ordinals in front of ordered list items */ |
||
+ | .hlist ol { |
||
+ | counter-reset: listitem; |
||
+ | } |
||
+ | .hlist ol > li { |
||
+ | counter-increment: listitem; |
||
+ | } |
||
+ | .hlist ol > li:before { |
||
+ | content: " " counter(listitem) " "; |
||
+ | white-space: nowrap; |
||
+ | } |
||
+ | .hlist dd ol > li:first-child:before, |
||
+ | .hlist dt ol > li:first-child:before, |
||
+ | .hlist li ol > li:first-child:before { |
||
+ | content: " (" counter(listitem) " "; |
||
+ | } |
||
+ | |||
+ | |||
+ | |||
+ | |||
+ | /* ============================================================================ |
||
+ | * Mobile CSS by iAdam1n |
||
+ | * ============================================================================ |
||
+ | * Makes some text bigger to increase readability |
||
+ | */ |
||
+ | @media only screen and (max-device-width: 600px) { |
||
+ | div#p-sidebar { |
||
+ | font-size: 1.3em; |
||
+ | } |
||
+ | div#p-sidebar h3 { |
||
+ | font-size: 0.72em; |
||
+ | } |
||
+ | div#p-personal { |
||
+ | font-size: 1.375em; |
||
+ | } |
||
+ | div#p-views ul { |
||
+ | font-size: 1.2em; |
||
+ | } |
||
+ | div#p-views #ca-move { |
||
+ | font-size: 1.125em; |
||
+ | } |
||
+ | input#searchButton.searchButton { |
||
+ | font-size: 1.125em; |
||
+ | } |
||
+ | div.vectorTabs ul { |
||
+ | font-size: 1.2em; |
||
+ | } |
||
+ | div#mw-normal-catlinks.mw-normal-catlinks { |
||
+ | font-size: 1.375em; |
||
+ | } |
||
+ | #footer-info { |
||
+ | font-size: 1.125em; |
||
+ | } |
||
+ | #footer-places { |
||
+ | font-size: 1.375em; |
||
+ | } |
||
+ | .search-types { |
||
+ | font-size: 1em; |
||
+ | } |
||
+ | .rcoptions legend { |
||
+ | position: relative; |
||
+ | font-size: 1.6em; |
||
+ | } |
||
+ | .mw-recentchanges-table label { |
||
+ | font-size: 1.6em; |
||
+ | } |
||
+ | #mw-content-text > fieldset > form > table > tbody > tr > td.mw-input > input[type="submit"]:nth-child(6) { |
||
+ | font-size: 1.5em; |
||
+ | } |
||
} |
} |
Latest revision as of 04:49, 23 September 2022
/* Fix mobile browsers randomly scaling text */
* {
-webkit-text-size-adjust: 100%;
}
/* Apply a fixed-width font for textareas */
pre, code, tt, kbd, samp, .mw-code,
textarea, .mw-editfont-monospace {
font-family: "SF Mono", ui-monospace, "Menlo", "Andale Mono", "Courier Prime", "Courier", monospace;
}
/* Flex boxes
* -- Each <div> will have equal width
*/
.flex {
display: flex;
flex-direction: row;
}
.flex > div {
flex: 1 1 0;
padding-right: 4px;
}
.flex > div:last-child {
padding-right: 0px !important;
}
/* [[Main Page]] */
body.page-Main_Page h1.firstHeading {
display: none;
}
body.page-Main_Page div.mw-headline {
border-bottom: 4px solid #A3BFB1;
border-bottom: 4px solid rgba(163, 191, 177, 0.5);
background-color: white;
background-color: rgba(255, 255, 255, 0.4);
color: black;
font-size: 120%;
font-weight: bold;
margin: 10px 0 10px 0;
padding: 0.2em 0.4em;
}
/* [[Template:keys]] */
span.keypage-filename {
color: #333;
float: right;
font-size: 1rem; /* [http://snook.ca/archives/html_and_css/font-size-with-rem] */
position: relative;
top: -2em;
}
/* [[Template:Archive Page]] */
.archive-page-notice,
.archive-page-notice td {
background-color: #CC9 !important;
}
/* [[Template:internal software]] */
.internal-software-notice {
background-color: #FBB;
border: 3px solid #F55;
margin-bottom: 0.5em;
text-align: center;
width: 100%;
padding: 8px;
}
/* [[Template:date]] */
.date {
white-space: nowrap;
}
/* [[Firmware Keys]] */
.page-Firmware_Keys_1_x #mw-content-text .wikitable td,
.page-Firmware_Keys_2_x #mw-content-text .wikitable td,
.page-Firmware_Keys_3_x #mw-content-text .wikitable td,
.page-Firmware_Keys_4_x #mw-content-text .wikitable td,
.page-Firmware_Keys_5_x #mw-content-text .wikitable td,
.page-Firmware_Keys_6_x #mw-content-text .wikitable td,
.page-Firmware_Keys_7_x #mw-content-text .wikitable td,
.page-Firmware_Keys_8_x #mw-content-text .wikitable td,
.page-Firmware_Keys_9_x #mw-content-text .wikitable td,
.page-Firmware_Keys_10_x #mw-content-text .wikitable td,
.page-Firmware_Keys_11_x #mw-content-text .wikitable td,
.page-Firmware_Keys_12_x #mw-content-text .wikitable td,
.page-Firmware_Keys_13_x #mw-content-text .wikitable td,
.page-Firmware_Keys_14_x #mw-content-text .wikitable td,
.page-Firmware_Keys_15_x #mw-content-text .wikitable td,
.page-Firmware_Keys_16_x #mw-content-text .wikitable td
{
white-space: nowrap;
}
/* ============================================================================
* Borrowed from [[wikipedia:MediaWiki:Common.css]]
* ============================================================================
*/
/* Infobox */
.infobox {
border: 1px solid #aaa;
background-color: #f9f9f9;
clear: right;
color: black;
float: right;
font-size: 88%;
line-height: 1.5em;
margin: 0.5em 0 0.5em 1em;
padding: 0.2em;
text-align: left;
}
.infobox caption {
font-size: 125%;
font-weight: bold;
}
.infobox td,
.infobox th {
vertical-align: top;
}
table.wikitable {
font-size: smaller;
}
table#archive-page-notice {
font-size: small;
}
table.wikitable * {
text-align: center;
}
/* [[Template:n/a]], [[Template:no]], [[Template:partial]], [[Template:yes]] */
.table-no,
.table-partial,
.table-yes {
color: #000;
text-align: center;
vertical-align: middle;
}
.table-no {
background-color: #D88 !important;
}
.table-partial {
background-color: #EEA !important;
}
.table-yes {
background-color: #AE9 !important;
}
.table-na {
background-color: #F0F0F0 !important;
color: gray;
text-align: center;
vertical-align: middle;
}
/* [[Template:hatnote]] */
.rellink,
.hatnote {
font-style: italic;
}
.rellink i,
.hatnote i {
font-style: normal;
}
div.rellink,
div.hatnote {
padding-left: 1.6em;
margin-bottom: 0.5em;
}
/* Allow limiting of which header levels are shown in a TOC;
<div class="toclimit-3">, for instance, will limit to
showing ==headings== and ===headings=== but no further
(as long as there are no =headings= on the page, which
there shouldn't be according to the MoS). */
.toclimit-2 .toclevel-1 ul,
.toclimit-3 .toclevel-2 ul,
.toclimit-4 .toclevel-3 ul,
.toclimit-5 .toclevel-4 ul,
.toclimit-6 .toclevel-5 ul,
.toclimit-7 .toclevel-6 ul {
display: none;
}
/* [[Template:Horizontal TOC]] */
.hlist dl,
.hlist ol,
.hlist ul {
margin: 0;
padding: 0;
}
/* Display list items inline */
.hlist dd,
.hlist dt,
.hlist li {
margin: 0;
display: inline;
}
/* Display nested lists inline */
.hlist.inline,
.hlist.inline dl,
.hlist.inline ol,
.hlist.inline ul,
.hlist dl dl, .hlist dl ol, .hlist dl ul,
.hlist ol dl, .hlist ol ol, .hlist ol ul,
.hlist ul dl, .hlist ul ol, .hlist ul ul {
display: inline;
}
/* Generate interpuncts */
.hlist dt:after {
content: ": ";
}
.hlist dd:after,
.hlist li:after {
content: " · ";
font-weight: bold;
}
.hlist dd:last-child:after,
.hlist dt:last-child:after,
.hlist li:last-child:after {
content: none;
}
/* For IE8 */
.hlist dd.hlist-last-child:after,
.hlist dt.hlist-last-child:after,
.hlist li.hlist-last-child:after {
content: none;
}
/* Add parentheses around nested lists */
.hlist dd dd:first-child:before, .hlist dd dt:first-child:before, .hlist dd li:first-child:before,
.hlist dt dd:first-child:before, .hlist dt dt:first-child:before, .hlist dt li:first-child:before,
.hlist li dd:first-child:before, .hlist li dt:first-child:before, .hlist li li:first-child:before {
content: " (";
font-weight: normal;
}
.hlist dd dd:last-child:after, .hlist dd dt:last-child:after, .hlist dd li:last-child:after,
.hlist dt dd:last-child:after, .hlist dt dt:last-child:after, .hlist dt li:last-child:after,
.hlist li dd:last-child:after, .hlist li dt:last-child:after, .hlist li li:last-child:after {
content: ") ";
font-weight: normal;
}
/* For IE8 */
.hlist dd dd.hlist-last-child:after, .hlist dd dt.hlist-last-child:after, .hlist dd li.hlist-last-child:after,
.hlist dt dd.hlist-last-child:after, .hlist dt dt.hlist-last-child:after, .hlist dt li.hlist-last-child:after,
.hlist li dd.hlist-last-child:after, .hlist li dt.hlist-last-child:after, .hlist li li.hlist-last-child:after {
content: ") ";
font-weight: normal;
}
/* Put ordinals in front of ordered list items */
.hlist ol {
counter-reset: listitem;
}
.hlist ol > li {
counter-increment: listitem;
}
.hlist ol > li:before {
content: " " counter(listitem) " ";
white-space: nowrap;
}
.hlist dd ol > li:first-child:before,
.hlist dt ol > li:first-child:before,
.hlist li ol > li:first-child:before {
content: " (" counter(listitem) " ";
}
/* ============================================================================
* Mobile CSS by iAdam1n
* ============================================================================
* Makes some text bigger to increase readability
*/
@media only screen and (max-device-width: 600px) {
div#p-sidebar {
font-size: 1.3em;
}
div#p-sidebar h3 {
font-size: 0.72em;
}
div#p-personal {
font-size: 1.375em;
}
div#p-views ul {
font-size: 1.2em;
}
div#p-views #ca-move {
font-size: 1.125em;
}
input#searchButton.searchButton {
font-size: 1.125em;
}
div.vectorTabs ul {
font-size: 1.2em;
}
div#mw-normal-catlinks.mw-normal-catlinks {
font-size: 1.375em;
}
#footer-info {
font-size: 1.125em;
}
#footer-places {
font-size: 1.375em;
}
.search-types {
font-size: 1em;
}
.rcoptions legend {
position: relative;
font-size: 1.6em;
}
.mw-recentchanges-table label {
font-size: 1.6em;
}
#mw-content-text > fieldset > form > table > tbody > tr > td.mw-input > input[type="submit"]:nth-child(6) {
font-size: 1.5em;
}
}