MCBBS Wiki欢迎您共同参与编辑！在参与编辑之前请先阅读Wiki方针。
如果在编辑的过程中遇到了什么问题，可以去讨论板提问。
为了您能够无阻碍地参与编辑 未验证/绑定过邮箱的用户，请尽快绑定/验证。
MCBBS Wiki GitHub群组已上线！
您可以在回声洞中发表吐槽！
服务器状态监控。点击进入
本站由MCBBS用户自行搭建，与MCBBS及东银河系漫游指南（北京）科技有限公司没有从属关系。点此了解 MCBBS Wiki 不是什么>>
用户:Salt lovely/沙盒/投票箱：修订间差异
< 用户:Salt lovely | 沙盒
Salt lovely（留言 | 贡献） 小 （参数别名） |
Salt lovely（留言 | 贡献） 小 （编辑“用户:Salt_lovely/沙盒/投票箱” // 维基盐编辑器） |
||
| 第4行： | 第4行： | ||
--><div class="salt-vote-title">{{{title|{{{标题|投票统计}}}}}}</div><!-- |
--><div class="salt-vote-title">{{{title|{{{标题|投票统计}}}}}}</div><!-- |
||
-->{{#if: {{{subtitle|{{{副标题|}}}}}} | <div class="salt-vote-subtitle">{{{subtitle|{{{副标题|}}}}}}</div> | }}<!-- |
-->{{#if: {{{subtitle|{{{副标题|}}}}}} | <div class="salt-vote-subtitle">{{{subtitle|{{{副标题|}}}}}}</div> | }}<!-- |
||
-->{{#if: {{{bar| |
-->{{#if: {{{bar|}}} | <div class="salt-vote-bar"></div> | }}<!-- |
||
{{#forargs: # |
--><ul class="salt-vote-options">{{#forargs: #| _k | _v| |
||
<li><div class="salt-vote-option">{{#var: _k }}</div><div class="salt-vote-voter">{{#var: _v }}</div></li> |
|||
| _k |
|||
}}</ul><!-- |
|||
| _v |
|||
--><ul class="salt-vote-desc-list">{{#forargs: * | _i | _d | |
|||
| <nowiki></nowiki> |
|||
<li><div class="salt-vote-desc-option">{{#var: _i }}</div><div class="salt-vote-desc">{{#var: _d }}</div></li> |
|||
}}</ |
}}</ul><!-- |
||
--></div><!-- |
|||
-->{{CSS|1= |
-->{{CSS|1= |
||
{{U:Salt lovely/沙盒/投票箱/style.css}} |
|||
.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-bar { |
|||
display: flex; |
|||
align-items: center; |
|||
width: 100%; |
|||
height: 1rem; |
|||
margin: 0 0 0 1rem; |
|||
} |
|||
.salt-vote-container .salt-vote-bar .salt-vote-bar-item { |
|||
position: relative; |
|||
min-width: 2rem; |
|||
height: 100%; |
|||
line-height: 100%; |
|||
text-align: center; |
|||
transition: 240ms ease; |
|||
text-shadow: 0 0 8px #fff; |
|||
} |
|||
.salt-vote-container .salt-vote-bar .salt-vote-bar-item:hover { |
|||
text-shadow: 0 0 8px #fff,0 0 8px #fff,0 0 16px #fff,0 0 16px #fff; |
|||
} |
|||
.salt-vote-container .salt-vote-bar .salt-vote-bar-item::before { |
|||
content: ''; |
|||
position: absolute; |
|||
top: 25%; |
|||
bottom: 25%; |
|||
left: 0; |
|||
right: 0; |
|||
background-color: var(--vote-color, #ab8749); |
|||
opacity: .5; |
|||
transition: 240ms ease; |
|||
z-index: -1; |
|||
} |
|||
.salt-vote-container .salt-vote-bar .salt-vote-bar-item:hover::before { |
|||
top: 0; |
|||
bottom: 0; |
|||
opacity: 1; |
|||
} |
|||
.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; |
|||
} |
|||
}}{{#Widget:SaltVoteContainer}}</includeonly> |
}}{{#Widget:SaltVoteContainer}}</includeonly> |
||
2024年3月18日 (一) 01:01的版本
用于展示投票箱