Template:Support Page: Difference between revisions

Content deleted Content added
remove unused vertical logo
CSS linting/cleanup
Line 2:
{{Add viewport tag.js}}<!-- Critical javascript to add the viewport tag. Other js is in MediaWiki:SupportPage.js -->
<html><style>
*,
*, *:before, *:after {
*:after {
box-sizing: border-box;
}
 
html,
body {
margin: 0;
padding: 0;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Lato", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
font-size: 16px;
-ms-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%;
Line 45 ⟶ 49:
.sp-dir-rtl {
direction: rtl;
 
/* Resets */
.sp-page li {
margin-bottom: 0;
}
 
/* OOUI focus styles are applied to buttons */
.sp-page .sp-btn:focus {
outline: 0;
}
 
/* Global font-size and line-height settings */
html, body {
font-size: 16px;
}
 
p, li, dl, .sp-page table {
.sp-page table {
font-weight: 400;
font-size: 0.875rem;
line-height: 1.5;
}
 
@media all and (min-width: 1281px) {
p, li, dl, .sp-page table {
font-size: 0.9375rem;
.sp-page table {
font-size: .9375rem;
}
}
 
.sp-footer-text {
font-size: 0.875rem;
line-height: 1.5; /* 24px @16px */
}
 
Line 92 ⟶ 81:
margin: 0;
padding: 0;
border: none0;
}
 
Line 100 ⟶ 89:
.sp-page h4,
.sp-page h5,
.sp-page h6  {
font-weight: bold;
}
Line 109 ⟶ 98:
border-bottom: 3px solid #000;
margin-bottom: 1rem;
/* letter-spacing: 0.03125rem; */
}
 
@media all and (min-width: 768px) {
.sp-page h1 {
font-size: 2.375rem;
Line 120 ⟶ 109:
margin-bottom: 1rem;
font-size: 1.125rem;
line-height: 1.5; /* 36px @24px */
/* border-bottom: 2px solid #000; */
}
 
Line 128 ⟶ 116:
}
 
@media all and (min-width: 1281px) {
.sp-page h2 {
font-size: 1.375rem;
Line 141 ⟶ 129:
.sp-page {
font-size: 18px;
line-height: 1.5555555556; /* 28px @18px */
}
 
@media all and (min-width: 768px) {
.sp-page {
font-size: 20px;
line-height: 1.5; /* 30px @20px */
}
}
Line 155 ⟶ 144:
.sp-content ol,
.sp-content dl {
margin-bottom: 1rem; /* 16px */
}
 
Line 190 ⟶ 179:
position: relative;
}
 
.sp-languages.-expanded {
height: auto;
Line 197 ⟶ 187:
position: absolute;
top: 10px;
left: 16px;
}
 
.sp-dir-rtl .sp-languages-icon {
left: auto;
Line 211 ⟶ 202:
transition: all 100ms;
}
 
.sp-dir-rtl .sp-languages-expand {
right: auto;
Line 220 ⟶ 212:
fill: #222;
}
 
.sp-languages.-expanded .sp-languages-expand {
transform: rotate(90deg);
Line 247 ⟶ 240:
} */
.sp-dir-rtl .sp-languages ul li:after {
padding: 0 0.4em 0 0.2em;
}
 
Line 256 ⟶ 249:
.sp-languages a,
.sp-languages a:visited {
color: #54595D54595d;
font-size: 14px;
font-weight: 600;
Line 278 ⟶ 271:
margin: 0 auto;
}
 
@media (min-width: 768px) {
.mw-1360 {
Line 298 ⟶ 292:
}
}
 
 
/* Header */
Line 304 ⟶ 297:
padding-bottom: 2rem;
}
 
@media all and (min-width: 1024px) {
.sp-header {
padding-top: 61px;
}
}
 
 
.sp-header-inner {
Line 331 ⟶ 324:
align-items: center;
width: 100%;
background-color: #fffffffff;
z-index: 9999;
left: 0;
Line 348 ⟶ 341:
vertical-align: middle;
}
 
@media all and (min-width: 640px) {
.sp-logo-horizontal {
height: 60px;
Line 357 ⟶ 351:
text-align: inherit;
}
 
@media all and (min-width: 768px) {
.sp-nav-container {
text-align: right;
Line 370 ⟶ 365:
border-radius: 2px;
font-weight: bold;
line-height: 1.25; /* 20px @16px */
background: #36c;
}
 
.sp-page .sp-btn:hover {
text-decoration: none;
background: #447ff5;
}
 
.sp-page .sp-btn:active {
box-shadow: none;
background: #2a4b8d;
}
 
.sp-page .sp-btn:focus {
outline: 0;
border-color: #36c;
box-shadow: inset 0 0 0 1px #36c, inset 0 0 0 2px #fff;
Line 388 ⟶ 387:
/* Donate Now button */
.sp-page .sp-donate-now-btn {
border: none;
background: 0 0;
border-radius: 2px;
background: #fde8f0;
Line 395 ⟶ 392:
color: #d40356;
font-weight: 700;
padding: 0.4rem 0.8rem;
font-size: 15px;
height: 34px;
Line 411 ⟶ 408:
border-color: #f61971;
background: #fde8f0;
outline: none0;
}
 
Line 422 ⟶ 419:
.toc {
background: none;
border: none0;
padding: 0;
font-weight: bold;
margin-bottom: 3rem;
}
 
.toc .toctogglecheckbox,
.toc .toctitle,
.toc .tocnumber {
display: none;
}
 
.toc ul {
margin-left: 0;
margin-bottom: 0;
}
 
.toc li {
margin-bottom: 12px;
}
 
/* Second level navigation */
.toc li ul {
Line 451 ⟶ 452:
.toc a {
display: block;
font-size: 0.875rem;
font-weight: 600;
color: #3a25ff;
}
 
.toc a:hover {
text-decoration: none;
Line 469 ⟶ 471:
height: calc(100vh - 4.5rem);
margin-bottom: 0;
padding-bottom: 2rem; /* 32px */
}
 
.sp-dir-rtl .sp-toc {
float: left;
Line 476 ⟶ 479:
padding-right: 2rem;
}
 
.toc a {
border-left: 4px solid transparent;
}
 
.sp-dir-rtl .toc a {
padding-left: 0;
Line 487 ⟶ 492:
}
 
@media all and (min-width: 1280px) {
.sp-largetoc .toc li {
margin-bottom: 16px;
Line 498 ⟶ 503:
margin-bottom: 2.5rem;
}
 
@media (min-width: 768px) {
.sp-content {
Line 503 ⟶ 509:
}
}
 
@media (min-width: 1024px) {
.sp-content {
Line 513 ⟶ 520:
 
/* Links */
 
.sp-content a,
.sp-content a:visited,
Line 524 ⟶ 532:
background-image: none;
}
 
.sp-content a:hover,
.sp-content a.external:hover,
Line 531 ⟶ 540:
 
.sp-content a.no-underline {
background: none;
}
 
Line 547 ⟶ 556:
flex-direction: column;
}
 
@media (min-width: 768px) {
.sp-footer-row {
flex-direction: row;
}
 
.sp-footer-text {
width: 57%;
Line 576 ⟶ 587:
}
 
/* TablesNL info table */
.wikitable th {
text-align: left !important;
}
.wikitable ul {
margin-bottom: 0;
}
.NL-info-summary {
font-size: 16px;
}
 
.NL-info-summary th {
text-align: left !important;
 
.NL-info-summary ul {
list-style-type: none;
margin-left: 0;
margin-bottom: 0;
}
</style>