Template:Support Page: Difference between revisions

From Donate
Jump to navigation Jump to search
Content deleted Content added
No edit summary
No edit summary
(47 intermediate revisions by the same user not shown)
Line 1: Line 1:
<includeonly>
<includeonly>{{DISPLAYTITLE:{{{title}}}}}
<html><style>
{{Support Page/js}}
*, *:before, *:after {
<html>
box-sizing: border-box;
<style>
}
/* Wiki Resets

---------------------------------------------- */
html, body {
html, body {
margin: 0;
margin: 0;
padding: 0;
padding: 0;
font-size: 16px;
line-height: 2;
}
}


Line 14: Line 16:
}
}


#mw-navigation,
#mw-navigation, #mw-page-base, #mw-head-base,
#firstHeading, #siteSub, #contentSub, #jump-to-nav,
#mw-page-base,
#catlinks, #footer, .mw-editsection {
#mw-head-base,
#firstHeading,
#footer,
#jump-to-nav,
.mw-editsection {
display: none;
display: none;
}
}
Line 30: Line 28:
}
}


/* Hide <p> tag containing styles and scripts */
.sp-header,
.mw-parser-output > p:first-child {
.sp-content {
padding: 0 40px;
display: none;
}

.mw-body-content {
font-size: inherit;
line-height: inherit;
}

.sp-languages {
font-size: 16px;
padding: 14px 40px;
background: #eaecf0;
overflow: hidden;
}
.sp-languages-icon {
position: absolute;
margin-right: 16px;
}
.sp-languages ul {
padding-left: 40px;
margin: 0;
list-style: none;
}
.sp-languages ul:focus {
outline: none;
}
.sp-languages ul .sp-language-divider:last-of-type {
display: none;
}
.sp-languages ul li {
display: inline-block;
}
.sp-languages a,
.sp-languages a:visited {
color: #000;
padding: 0.5rem;
}

.mw-1360 {
max-width: 90rem;
padding: 0 1.25rem;
margin: 0 auto;
}

@media (min-width: 768px) {
.mw-1360 {
padding: 0 2.5rem;
}
}
}


.sp-header {
.sp-header {
background: #f6f6f6;
background: #f6f6f6;
box-shadow: 0 1px 0 0 rgba(204,204,204,0.50);
box-shadow: 0 1px 0 0 rgba(204, 204, 204, 0.5);
padding-bottom: 2.5rem;
margin-bottom: 2.5rem;
}
}


@media (min-width: 768px) {
.sp-wmf-logo {
width: 135px;
.sp-header {
margin-bottom: 5rem;
}
}
}


.sp-donate-btn {
.sp-logo-nav-container {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
padding-top: 1.5rem;
padding-bottom: 3rem;
}

.sp-logo-container {
width: 50%;
}

.sp-logo-horizontal {
max-width: 280px;
display: block;
display: block;
}
float: right;
.sp-logo-vertical {
width: 145px;
display: none;
}

@media (min-width: 1050px) {
.sp-logo-horizontal { display: none; }
.sp-logo-vertical { display: block; }
}

.sp-nav-container {
text-align: right;
}

.sp-donate-btn {
display: none;
background: #f51a71;
background: #f51a71;
color: #fff;
color: #fff !important;
padding: 12px 24px;
padding: 4px 24px;
text-transform: uppercase;
text-transform: uppercase;
font-weight: 500;
transition: all 300ms ease;
margin-bottom: 1.5rem;
}
}
.sp-donate-btn:hover {
.sp-donate-btn:hover {
text-decoration: none;
background: #B71DA0;
background: #B71DA0;
}
@media (min-width: 768px) {
.sp-donate-btn {
display: inline-block;
}
}

.sp-main-nav {
display: block;
}

.sp-header h1 {
margin-top: 0;
}

@media (min-width: 1100px) {
.sp-toc {
float: right;
padding-left: 1rem;
width: calc(100% - 50rem);
}
.toc {
margin-left: auto;
}
}
@media (min-width: 1280px) {
.sp-toc {
padding-left: 2rem;
}
}

.toc {
padding: 1rem;
background: #f6f6f6;
border-color: #e5e5e5;
line-height: 1.6;
}
.toc .toctitle {
text-align: left;
}
.toc .toctoggle {
display: none;
}
.toc .tocnumber {
display: none;
}
.toc li {
margin-bottom: 0.5rem;
}
}


.sp-content {
.sp-content {
font-size: 20px;
max-width: 50rem;
max-width: 800px;
margin-bottom: 2.5rem;
}

@media (min-width: 768px) {
.sp-content {
font-size: 1.125rem;
margin-bottom: 5rem;
}
}
@media (min-width: 1280px) {
.sp-content {
font-size: 1.25rem;
}
}
}


Line 65: Line 213:
font-family: sans-serif;
font-family: sans-serif;
font-weight: bold;
font-weight: bold;
}
.sp-content p {
margin: 0 0 2rem 0;
}
.sp-content h2 {
margin-top: 2rem;
margin-bottom: 1rem;
}
.sp-content ul {
list-style-image: none;
}
.sp-content ol {
margin-left: 1em;
}
.sp-content li {
margin-bottom: 1rem;
}

.sp-content a,
.sp-content a:visited,
.sp-content a.external,
.sp-content a.external:visited {
color: #36c;
/* Remove external link arrows */
background: none;
padding: 0;
}

.sp-footer {
background: #000;
color: #fff;
padding-top: 4rem;
padding-bottom: 4rem;
}

.sp-footer-row {
display: flex;
flex-wrap: nowrap;
flex-direction: column;
}
.sp-footer-logo-container {
flex-basis: 32%;
margin-bottom: 24px;
margin-right: 24px;
}
@media (min-width: 768px) {
.sp-footer-row {
flex-direction: row;
}
.sp-footer-text {
width: 57%;
}
}
}
</style>
</style>
<div class="sp-page">
<div class="sp-page">
<div class="sp-header">
<header class="sp-header">
<div class="translation-bar sp-languages">
<img class="sp-wmf-logo" src="/static/images/project-logos/donatewiki-2x.png" alt="Wikimedia Foundation"/>
<svg class="sp-languages-icon" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 20 20"><g fill="#000"><title>language</title><path d="M20 18h-1.44a.61.61 0 0 1-.4-.12.81.81 0 0 1-.23-.31L17 15h-5l-1 2.54a.77.77 0 0 1-.22.3.59.59 0 0 1-.4.14H9l4.55-11.47h1.89zm-3.53-4.31L14.89 9.5a11.62 11.62 0 0 1-.39-1.24q-.09.37-.19.69l-.19.56-1.58 4.19zm-6.3-1.58a13.43 13.43 0 0 1-2.91-1.41 11.46 11.46 0 0 0 2.81-5.37H12V4H7.31a4 4 0 0 0-.2-.56C6.87 2.79 6.6 2 6.6 2l-1.47.5s.4.89.6 1.5H0v1.33h2.15A11.23 11.23 0 0 0 5 10.7a17.19 17.19 0 0 1-5 2.1q.56.82.87 1.38a23.28 23.28 0 0 0 5.22-2.51 15.64 15.64 0 0 0 3.56 1.77zM3.63 5.33h4.91a8.11 8.11 0 0 1-2.45 4.45 9.11 9.11 0 0 1-2.46-4.45z"/></g></svg>
<a class="sp-donate-btn">Donate now</a>
<h1></html>{{{title}}}<html></h1>
</html>{{Languages2}}<html>
</div>
</div>
<div class="sp-content">
<div class="sp-header-inner mw-1360">
<div class="sp-logo-nav-container">
</html>
<div class="sp-logo-container">
__NOTOC__
<img class="sp-logo-horizontal" src="//upload.wikimedia.org/wikipedia/donate/6/60/Wmf_logo_horiz_K.svg" alt="Wikimedia Foundation"/>
</includeonly>
<img class="sp-logo-vertical" src="/static/images/project-logos/donatewiki-2x.png" alt="Wikimedia Foundation"/>
</div>
<div class="sp-nav-container">
<a class="sp-donate-btn" href="https://donate.wikimedia.org/">Donate now</a>
<nav class="sp-main-nav">
Lorem Ipsum Dolor Sit Amet
</nav>
</div>
</div>
<h1></html>{{{title}}}<html></h1>
</div>
</header>
<article class="sp-main mw-1360">
<div class="sp-toc">
</html>__TOC__<html>
</div>
<div class="sp-content">
</html></includeonly>

Revision as of 20:26, 12 July 2018