MediaWiki:Gadget-Awards.css
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)
- Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
- Opera: Press Ctrl-F5.
/* Main Page poll spinner */
#polltable .awardspolls {
display: block !important;
}
#polltable th.marioawards {
border-top-left-radius: 10px;
border-top-right-radius: 10px;
}
#polltable .pollspinner,
#polltable .pollspinnerbox {
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
}
.pollspinner {
width: 100%;
overflow: hidden;
position: relative;
}
.pollspinner.animated {
transition: height 0.5s;
}
.pollspinnerbox {
box-sizing: border-box;
position: absolute;
left: 100%;
width: 100%;
overflow: hidden;
}
.pollspinner.animated .pollspinnerbox {
transition: left 0.5s;
transition-delay: 0.5s;
}
.pollspinnerbox.end {
max-width: 320px;
background-image: url(https://mario.wiki.gallery/images/poll-thanks.png);
background-size: 100% auto;
padding: 209px 9px 9px;
text-align: center;
box-sizing: border-box;
background-repeat: no-repeat;
background-color: black;
font-size: 11px;
color: white;
margin: 0 auto;
background-position: top center;
}
.pollspinnerbox.visible {
left: 0;
}
.pollspinner:not(.animated) .pollspinnerbox.visible {
position: static;
}
.pollspinner:not(.animated) .pollspinnerbox.unanswered {
display: none;
}
.pollspinnerbox.hidden {
left: -100%;
}
@keyframes pollthrobber {
from {
background-position: right 0, right 20px;
}
to {
background-position: right -320px, right 20px;
}
}
.pollspinner .throbber {
color: transparent;
width: 100%;
height: 20px;
}
.pollspinner.throbbing:not(#N) .throbber {
color: inherit;
animation: pollthrobber 2s steps(16);
animation-iteration-count: 1;
animation-fill-mode: both;
background-image: url(https://mario.wiki.gallery/images/poll-throbber.png), url(https://mario.wiki.gallery/images/poll-throbber.gif);
background-size: 20px 320px, 20px 20px;
background-repeat: no-repeat;
background-position: right 20px, right 0;
text-align: right;
padding: 0px 25px 0px;
box-sizing: border-box;
}
.pollspinner_skip:not(#N):not(#N) {
margin-left: 1em;
}
.pollspinner .pds-box {
width: 100% !important;
}
.pollspinner .pds-input-label {
width: 100% !important;
float: none !important;
padding: 0 0 0 25px !important;
box-sizing: border-box !important;
min-height: 0px !important;
}
.pollspinner .pds-answer-group {
padding: 1px !important;
position: relative !important;
margin: 5px 0 !important;
}
.pollspinner .pds-answer-input {
position: absolute !important;
top: 50% !important;
transform: translate(0, -50%) !important;
}
.pollspinner .pds-other-label {
margin: 0 0 0 25px !important;
}
.pollspinner .pollspinner_begin {
font: normal normal bold 14px/24px Arial;
color: #333;
text-align: left;
background: #f2f2f2 linear-gradient(to bottom, #ffffff, #ededed) repeat-x left top;
border: 1px solid #999;
border-radius: 11px;
display: block;
text-decoration: none;
margin: 0;
padding: 0 24px;
width: -moz-fit-content;
width: fit-content;
}
.pollspinner .pollspinner_begin.clicked {
pointer-events: none;
}
.pollspinner .pollspinner_begin, .pollspinner .pds-vote-button {
cursor: pointer;
box-shadow: 0 -0.25em 0.5em 0 rgba(0,0,0,0.1) inset, 0 0.25em 0.5em 0 rgba(255,255,255,0.1) inset;
}
.pollspinner .pollspinner_begin:active, .pollspinner .pds-vote-button:active {
cursor: pointer;
box-shadow: 0 0.25em 0.5em 0 rgba(0,0,0,0.1) inset, 0 -0.25em 0.5em 0 rgba(255,255,255,0.1) inset;
}
/* MarioWiki:Anniversary poll container */
.cpf-flex {
display: flex;
flex-wrap: wrap;
align-items: justify;
justify-content: center;
}
.cpf-flex .cpf-poll {
flex-basis: 300px;
flex-grow: 0.2;
margin: 2px;
}
.cpf-theme-1 {
--border-color: #c55;
--background-color: #f88;
--highlight-color-1: #844;
--highlight-color-2: #fdd;
--text-color: #422;
--header-background-color: #c55;
--header-text-color: #fee;
}
.cpf-theme-2 {
--border-color: #90f;
--background-color: #cbc;
--highlight-color-1: #656;
--highlight-color-2: #ede;
--text-color: #323;
--header-background-color: #90f;
--header-text-color: #efe;
}
.cpf-theme-3 {
--border-color: #7FADFD;
--background-color: #CDD9FD;
--highlight-color-1: #666C7E;
--highlight-color-2: #E6ECFE;
--text-color: #33363F;
--header-background-color: #7FADFD;
--header-text-color: #F2F5FE;
}
.cpf-container .cpf-poll {
border-width: 1px 1px 1px 5px;
border-color: var(--border-color);
border-style: solid;
background-color: var(--background-color);
color: var(--text-color);
}
.cpf-container .cpf-header {
padding: 5px;
background-color: var(--header-background-color);
color: var(--header-text-color);
}
.cpf-container .cpf-title {
font-size: 150%;
text-align: center;
border-bottom: 1px solid var(--header-text-color);
margin-bottom: 2px;
padding-bottom: 2px;
}
.cpf-container .pds-question.css-question {
display: none;
}
.cpf-container .pds-box {
padding: 5px !important;
border: none !important;
background: none !important;
width: 100%!important;
}
.cpf-container .pds-answer-group{
margin: 4px !important;
color: var(--text-color);
}
.cpf-container .pds-answer-group:hover .pds-radiobutton,
.cpf-container .pds-answer-group:hover .pds-answer-span {
color: var(--highlight-color-1);
filter: drop-shadow(1px 1px 3px var(--highlight-color-2));
}
.cpf-container .pds-answer {
padding: 0 !important;
border-top: none !important;
border-color: var(--border-color) !important;
}
.cpf-container .pds-vote {
padding: 5px 0 0 0 !important;
}
.cpf-container .pds-radiobutton {
margin: 0 !important;
}
.cpf-container .pds-links {
margin-top: 5px !important;
color: var(--text-color) !important;
}
.cpf-container .pds-links a, .cpf-container .pds-links-back a {
color: var(--text-color) !important;
opacity: 50%;
}
.cpf-container .pds-input-label {
align-self: end;
}
.cpf-container .pds-answer-input{
align-self: center !important;
}
.cpf-container .pds-vote-button {
background-color: var(--border-color) !important;
}
.cpf-container .pds-vote-button:hover {
background-color: var(--highlight-color-1) !important;
}