|
|
| (未显示同一用户的6个中间版本) |
| 第1行: |
第1行: |
| <div class="salt-vote-container not-init"> | | <noinclude>用于展示投票箱</noinclude><includeonly><!-- |
| <div class="salt-vote-color"></div> | | --><div class="salt-vote-container not-init"><!-- |
| <!-- <div class="salt-vote-title">{{{title|投票统计}}}</div> | | -->{{#if: {{{color|{{{颜色|}}}}}} | <div class="salt-vote-color">{{{color|{{{颜色|}}}}}}</div> | }}<!-- |
| {{#if: {{{subtitle|}}} | <div class="salt-vote-subtitle">{{{subtitle|}}}</div> | }} --> | | --><div class="salt-vote-title">{{{title|{{{标题|投票统计}}}}}}</div><!-- |
| <div class="salt-vote-title">投票统计</div> | | -->{{#if: {{{subtitle|{{{副标题|}}}}}} | <div class="salt-vote-subtitle">{{{subtitle|{{{副标题|}}}}}}</div> | }}<!-- |
| <div class="salt-vote-subtitle">投票统计副标题</div>
| | -->{{#if: {{{bar|}}} | <div class="salt-vote-bar"></div> | }}<!-- |
| <div class="salt-vote-bar"></div>
| | --><ul class="salt-vote-options">{{#forargs: #| _k | _v| |
| * <div class="salt-vote-option">同意</div><div class="salt-vote-voter">[[U:Salt_lovely]]</div>
| | <li><div class="salt-vote-option-content"><!-- |
| * <div class="salt-vote-option">反对</div><div class="salt-vote-voter">[[U:Salt]][[User:Salt]][[用户:Salt]]</div>
| | --><div class="salt-vote-option">{{#var: _k }}</div><!-- |
| * <div class="salt-vote-option">弃权</div><div class="salt-vote-voter">[[U:Example]]</div>
| | --><div class="salt-vote-voter">{{#var: _v }}</div><!-- |
| * <div class="salt-vote-option">重复投票</div><div class="salt-vote-voter">[[User:Example]]</div>
| | --></div></li> |
| <!-- {{#forargs: #
| | }}</ul><!-- |
| | _k
| | --><ul class="salt-vote-describe">{{#forargs: * | _i | _d | |
| | _v
| | <li><div class="salt-vote-desc-option">{{#var: _i }}</div><div class="salt-vote-desc">{{#var: _d }}</div></li> |
| | <nowiki></nowiki>
| | }}</ul><!-- |
| * <div class="salt-vote-option">{{#var: _k }}</div><div class="salt-vote-voter">{{#var: _v }}</div>
| | --></div><!-- |
| }} --> | | -->{{CSS|1= |
| </div> | | {{U:Salt lovely/沙盒/投票箱/style.css}} |
| {{CSS|1=
| | }}{{#Widget:SaltVoteContainer}}</includeonly> |
| .salt-vote-container {
| |
| width: 100%;
| |
| max-width: 50rem;
| |
| margin: 0 auto;
| |
| }
| |
| .salt-vote-container .salt-vote-title {
| |
| width: 100%;
| |
| font-size: 1.25rem;
| |
| line-height: 2rem;
| |
| text-align: center;
| |
| color: #222d;
| |
| }
| |
| .salt-vote-container .salt-vote-subtitle {
| |
| width: 100%;
| |
| font-size: 1rem;
| |
| line-height: 1.25rem;
| |
| text-align: center;
| |
| color: #333a;
| |
| }
| |
| .salt-vote-container .salt-vote-color {
| |
| display: none;
| |
| }
| |
| .salt-vote-container ul {
| |
| display: flex;
| |
| flex-wrap: wrap;
| |
| margin: .5rem 0 .5rem 2rem;
| |
| } | |
| .salt-vote-container ul li {
| |
| display: flex;
| |
| position: relative;
| |
| width: 100%;
| |
| justify-content: flex-start;
| |
| align-items: center;
| |
| margin: 0 0 2px 0;
| |
| } | |
| .salt-vote-container ul li::before {
| |
| content: '';
| |
| position: absolute;
| |
| top: 0;
| |
| bottom: 0;
| |
| left: 0;
| |
| right: 0;
| |
| background-color: var(--vote-color, #ab8749);
| |
| opacity: 0;
| |
| z-index: -1;
| |
| } | |
| .salt-vote-container ul li:hover::before{
| |
| opacity: 0.1;
| |
| } | |
| .salt-vote-container ul li .salt-vote-option {
| |
| min-width: 4rem;
| |
| flex-shrink: 0;
| |
| padding: .5rem 1rem;
| |
| text-align: center;
| |
| border-left: 4px solid var(--vote-color, #ab8749);
| |
| font-size: 1rem;
| |
| }
| |
| .salt-vote-container ul li .salt-vote-voter {
| |
| width: 100%;
| |
| display: flex;
| |
| flex-wrap: wrap;
| |
| padding: 0 1rem 0 0;
| |
| font-size: 1rem;
| |
| }
| |
| .salt-vote-container ul li .salt-vote-voter a {
| |
| display: block;
| |
| position: relative;
| |
| height: 1.5rem;
| |
| padding: 0 .4rem;
| |
| margin: .1rem .2rem .1rem 0;
| |
| line-height: 1.5rem;
| |
| font-size: .9rem;
| |
| box-sizing: border-box;
| |
| }
| |
| .salt-vote-container ul li .salt-vote-voter a::before {
| |
| content: '';
| |
| position: absolute;
| |
| top: 0;
| |
| bottom: 0;
| |
| left: 0;
| |
| right: 0;
| |
| background-color: var(--vote-color, #ab8749);
| |
| opacity: 0.1;
| |
| z-index: -1;
| |
| }
| |
| .salt-vote-container ul li .salt-vote-voter a:hover::before{
| |
| opacity: 0.2;
| |
| }
| |
| }} | |