MediaWiki:Resources/2015/landingpages-wlm.css

From Donate
Jump to navigation Jump to search
The printable version is no longer supported and may have rendering errors. Please update your browser bookmarks and please use the default browser print function instead.

Note: After publishing, you may have to bypass your browser's cache to see the changes.

  • Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
  • Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
  • Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5.
/* === MediaWiki:Resources/2015/landingpage.css === */

/* --- Hide default MediaWiki stuff we don't want --- */

a {
    color: #ABCDEF !important;
}
body {
  background-color: #fff;
  background-size: auto 100%;
  background-repeat: no-repeat;
  background-attachment: fixed;
}
#mw-head {
  display: none !important;
}
#mw-page-base {
  background-color: transparent !important;
  background-image: none !important;
}
#mw-head-base {
  height: 1em;
}
#mw-panel .portal {
  display: none;
}
.mw-wiki-logo {
  background-image: url(//upload.wikimedia.org/wikipedia/commons/thumb/f/f3/LUSITANA_WLM_2011_d.svg/100px-LUSITANA_WLM_2011_d.svg.png) !important;
}
#p-namespaces, #p-views, #p-cactions, #p-search, #p-personal, #catlinks, #firstHeading, #contentSub, #siteSub, #jump-to-nav {
  display: none;
}
#content {
  background-color: transparent;
  background-image: none;
  border: none;
}

/* --- Overall layout of the landing page --- */
#LP-table {
  width: 100%;
  border: none;
}
body.rtl #LP-table {
  direction: rtl;
}

#form-wrapper {
  vertical-align: top;
}
#appeal-wrapper {
  vertical-align: top;
  padding-left: 0;
  padding-right: 2em;
}
body.rtl #appeal-wrapper {
  padding-left: 2em;
  padding-right: 0;
}

/* --- Appeal ---*/

#appeal-head {
  font-size: 1.5em;
  font-weight: bold;
  color: #000;
  padding-bottom: 0.5em;
  border-bottom: 3px solid #8F0000;
}
#appeal-body {
  padding: 1em 0 0.2em 0;
  color: #000;
  font-size: 1.2em;
  margin-bottom: 1em;
}

/* --- Hide non-monthly capable payment methods on monthly forms --- */

.form-monthly .not-monthly-capable {
  display: none;
}

/* --- Form --- */

#form-wrapper * {
  -moz-box-sizing:    border-box;
  -webkit-box-sizing: border-box;
  box-sizing:         border-box;
  transition: all 0.2s;
}

#donate-form-wrapper {
  position: relative;
  background-color: #e2e2e2;
  border: none;
  padding: 1.6em;
}

.button {
    background-color: #4CAF50; /* Green */
    border: none;
    border-radius: 4px;
    color: white;
    padding: 10px 16px;
    text-align: center;
    font-weight: bold;
    text-decoration: none;
    font-size: 12px;
    margin: 4px 2px;
    -webkit-transition-duration: 0.4s; /* Safari */
    transition-duration: 0.4s;
    cursor: pointer;
    z-index: 999;
}

@media (min-width: 1200px) { .button {display: inline-block; } }
@media (max-width: 1200px) { .button {width: 30%; } }
@media (max-width: 1200px) { .button {margin: auto; margin-top: 10px; } }

/* --- Buttons --- */
a.buttonlink {
  cursor: pointer;
  text-decoration: none;
  color: black;
}

a.buttonlink:hover {
  color: white;
}

.button1 {
    background-color: #0082C0;
    color: white;
    position: static;
    top: 45%;
    right: 30px;
    transform: translateY(-45%);
    min-width: 110px;
}

.button1:hover {
 background-color: #447FF5;
}

/* --- Subheaders ---*/

#radiobuttons-table-header,
#paymenttype-table-header {
  display: block;
  margin-top: 1.5em;
  margin-bottom: .5em;
  text-align: center;
  font-size: .75em;
  text-transform: uppercase;
  font-weight: normal;
}

/* --- Frequency options --- */

.frequency-options {
  margin: 0 3px;
  font-size: 1em;
}
.frequency-options label {
  display: block;
  float: left;
  width: 49%;
  margin-bottom: 1em;
  -moz-border-radius:    .3em;
  -webkit-border-radius: .3em;
  border-radius:         .3em;
  background: #cacaca;
  padding: 0.4em 0.2em;
  font-size: 1em;
  line-height: 1;
  text-transform: uppercase;
  text-align: center;
  cursor: pointer;
}
.frequency-options label:first-child {
  margin-right: 4px;
}

body.rtl .frequency-options label {
  float: right;
}
body.rtl .frequency-options label:first-child {
  margin-left: 4px;
  margin-right: 0;
}

@media only screen and (max-width: 740px) {
  .frequency-options label {
    font-size: .8em;
  }
}

.frequency-options label:hover {
  background: #afafaf;
}
.frequency-options label:active {
  background: #d2d2d2;
  -moz-box-shadow:    inset 0 1px 3px rgba(0,0,0,.25);
  -webkit-box-shadow: inset 0 1px 3px rgba(0,0,0,.25);
  box-shadow:         inset 0 1px 3px rgba(0,0,0,.25);
}
.frequency-options label.checked {
  background: #afafaf;
  -moz-box-shadow:    inset 0 1px 3px rgba(0,0,0,.25);
  -webkit-box-shadow: inset 0 1px 3px rgba(0,0,0,.25);
  box-shadow:         inset 0 1px 3px rgba(0,0,0,.25);
}

/* --- Donation Amounts --- */

#radiobuttons-table-body {
  clear: both;
}

#radiobuttons-table {
  width: 100%;
  margin-bottom: 1em;
}

.radiobuttons-cell {
  width: 20%;
  padding: 1px;
  text-align: center;
}

.radiobuttons-cell input[type="radio"] {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  border: 0;
  clip: rect(0 0 0 0);
}

.radiobuttons-cell label {
  background: #367fb4;
  display: block;
  font-size: 1em;
  height: 5em;
  line-height: 5;
  -moz-border-radius:    .3em;
  -webkit-border-radius: .3em;
  border-radius:         .3em;
  color: #fff;
  cursor: pointer;
}

.input_amount_other label {
  line-height: 2.5;
}

.input_amount_other span {
  font-size: 0.8em;
}

.input_amount_other input {
  display: block;
  width: 80%;
  margin: 0 auto;
  background: #235375;
  line-height: 1;
  padding: .5em;
  border: 0;
  outline: 0;
  -moz-border-radius:    .3em;
  -webkit-border-radius: .3em;
  border-radius:         .3em;
}

@media only screen and (max-width: 740px) {
  .input_amount_other input {
    padding: .3em;
  }
}

.input_amount_other input:hover {
  background: #19415e;
}
.input_amount_other input:focus {
  background: #fff;
  color: #19415e;
}

.input_amount_other.checked input {
  background: #fff;
}
.input_amount_other.checked input:hover {
  background: #cbcbcb;
}
.input_amount_other.checked input:focus {
  -moz-box-shadow:    inset 0 1px 3px rgba(0,0,0,.25);
  -webkit-box-shadow: inset 0 1px 3px rgba(0,0,0,.25);
  box-shadow:         inset 0 1px 3px rgba(0,0,0,.25);
}

.radiobuttons-cell label:active,
.radiobuttons-cell input[type="radio"]:checked + label,
.radiobuttons-cell label.checked,
.input_amount_other.checked {
  background: #0f4b76 !important;
  -moz-box-shadow:    inset 0 1px 3px rgba(0,0,0,.25);
  -webkit-box-shadow: inset 0 1px 3px rgba(0,0,0,.25);
  box-shadow:         inset 0 1px 3px rgba(0,0,0,.25);
}


/* --- Payment method buttons --- */

.payment-method-button {
  display: block;
  margin: 0 3px .5em 3px;
  width: 100%;
  min-height: 3.5em;
  -moz-border-radius:    .3em;
  -webkit-border-radius: .3em;
  border-radius:         .3em;
  border: 0;
  outline: 0;
  background-color: #eaeaea;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: auto 65%;
  -moz-box-shadow:    inset 0 14px 16px rgba(255,255,255,.5), inset 0 0 7px #fff;
  -webkit-box-shadow: inset 0 14px 16px rgba(255,255,255,.5), inset 0 0 7px #fff;
  box-shadow:         inset 0 14px 16px rgba(255,255,255,.5), inset 0 0 7px #fff;
  color: #367fb4;
  padding: 0 1em;
  font-size: 1.1em;
  text-transform: uppercase;
  white-space: normal;
  vertical-align: middle;
  cursor: pointer;
  -webkit-appearance: none;
  -moz-appearance:    none;
  appearance:         none;
}

.payment-method-button:hover {
  background-color: #f2f2f2;
}

.payment-method-button:active {
  background-color: #f2f2f2;
  -moz-box-shadow:    inset 0 14px 16px rgba(255,255,255,.5), inset 0 1px 3px rgba(0,0,0,.25);
  -webkit-box-shadow: inset 0 14px 16px rgba(255,255,255,.5), inset 0 1px 3px rgba(0,0,0,.25);
  box-shadow:         inset 0 14px 16px rgba(255,255,255,.5), inset 0 1px 3px rgba(0,0,0,.25);
}

/* This will be overridden for IE 8 and below */
.paymentmethod-pp input,
.paymentmethod-amazon input,
.paymentmethod-bpay input,
.paymentmethod-ideal input,
.paymentmethod-enets input,
.paymentmethod-yandex input {
  text-indent: -10000px;
  overflow: hidden;
}

.paymentmethod-cc input {
  background-image: none;
}
.paymentmethod-pp input {
  background-image: url(//upload.wikimedia.org/wikipedia/donate/8/8d/Paypal-color.svg);
}
.paymentmethod-amazon input {
  background-image: url(//upload.wikimedia.org/wikipedia/donate/e/e4/Amazon-color.svg);
}
.paymentmethod-bpay input {
  background-image: url(//upload.wikimedia.org/wikipedia/donate/e/e3/BPAY_Landscape_MONO.gif);
}
.paymentmethod-ideal input {
  background-image: url(//upload.wikimedia.org/wikipedia/donate/8/83/Ideal_logo.gif);
}
.paymentmethod-enets input {
  background-image: url(//upload.wikimedia.org/wikipedia/donate/d/d4/Enets-logo.png);
}
.paymentmethod-yandex input {
  background-image: url(//upload.wikimedia.org/wikipedia/donate/8/85/Yamoney_en.png);
}
html[lang="ru"] .paymentmethod-yandex input {
  background-image: url(//upload.wikimedia.org/wikipedia/donate/c/cb/Yandex_money_RU_logo.png);
}
.paymentmethod-pp-usd input {
  background-image: url(//upload.wikimedia.org/wikipedia/donate/2/22/Paypal-USD-color.svg);
}


/* --- Infobox ("Where your donation goes") --- */

.dividing-line {
  display: none;
}

#infobox-wrapper {
  padding-top: 1em;
  width: 25em;
  line-height: 1.1;
  color: #707070;
  font-size: .9em;
}

#infobox-header {
  font-size: 1.3em;
  font-weight: bold;
  margin-bottom: .7em;
  color: #367fb4;
}

/* --- Privacy and links --- */

#donor-policy-block {
  -moz-box-sizing:    border-box;
  -webkit-box-sizing: border-box;
  box-sizing:         border-box;
  width: 100%;
  color: white;
  text-align: center;
  font-size: 0.8em;
  line-height: 1.2;
  padding: 1.8em 15% .7em;
}

#donor-policy-block #cancel-monthly {
  margin-top: 1em;
  color: white;
}

#donate-links-block {
  -moz-box-sizing:    border-box;
  -webkit-box-sizing: border-box;
  box-sizing:         border-box;
  width: 100%;
  padding: 1em 15% 0;
  color: white;
}

.form-info-links {
  list-style: none;
  margin-left: 0;
  width: 100%;
  display: block;
  font-size: 0.8em;
  text-align: center;
}
.form-info-links li {
  width: auto;
  display: inline-block;
  padding: 0 1em;
  margin: 0 auto;
}

/* --- Footer --- */

#footer-info,
#footer-places {
  display: none;
}
div#footer #footer-icons {
  float: none;
  text-align: center;
}
div#footer #footer-icons li {
  float: none;
  display: inline-block;
}

/* === end of MediaWiki:Resources/2015/landingpage.css === */
Retrieved from "https://donate.wikimedia.org/w/index.php?title=MediaWiki:Resources/2015/landingpages-wlm.css&oldid=27922"