Template:赛马娘角色语音/style.css

/* 表格整体样式 */
.uma-voice {
    width: 100%;
}

.uma-voice *{
	box-sizing: content-box;
}

.uma-voice.wikitable .uma-voice-caption {
    background-color: #69c10c;
    color: white;
}

.uma-voice.wikitable tr > th {
    background-color: #bff7bb;
}

.uma-voice.wikitable tr > th[colspan="3"] {
    position: sticky;
    top: 0px;
}

.uma-voice tr > th:last-child,
.uma-voice tr > td:last-child {
    white-space: nowrap;
    width:0;
}

/* 文本切换显示样式
.uma-voice tr > td .textToggleDisplay > hr {
    display: none;
}

.uma-voice tr > td .textToggleDisplay.textToggleDisplay-on ~ .textToggleDisplay > hr {
    display: block;
}
*/

/* 语音按钮样式 */

.uma-voice .uma-voice-file{
    display:flex;
}

.uma-voice .uma-voice-file .sm2-bar-ui {
    max-width: none;
}

.uma-voice .uma-voice-file .sm2-bar-ui .bd.sm2-main-controls {
    background-image: url(https://img.moegirl.org.cn/common/e/eb/%E8%B5%9B%E9%A9%AC%E5%A8%98-%E7%AB%8B%E7%BB%98%E5%88%87%E6%8D%A2%E6%8C%89%E9%92%AE.png);
    background-color: transparent;
    background-size: 100%;
    width: 45px;
    height: 47px;
    border: none;
    position: relative;
    margin: 5px;
    transition: transform .3s cubic-bezier(.175, .885, .32, 1.275), -webkit-transform .3s cubic-bezier(.175, .885, .32, 1.275);
    writing-mode: horizontal-tb;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.uma-voice .uma-voice-file .sm2-bar-ui .bd.sm2-main-controls:hover {
    transition: transform .5s cubic-bezier(.19, 1, .22, 1), -webkit-transform .5s cubic-bezier(.19, 1, .22, 1);
    transform: scale(.9);
}

.uma-voice .uma-voice-file .sm2-bar-ui .bd.sm2-main-controls.playing::before {
    content: "";
    display: block;
    position: absolute;
    top: -6px;
    left: -7.5px;
    width: 58px;
    height: 58px;
    background-image: url(https://img.moegirl.org.cn/common/2/26/%E8%B5%9B%E9%A9%AC%E5%A8%98-%E7%AB%8B%E7%BB%98%E5%88%87%E6%8D%A2%E6%8C%89%E9%92%AE-%E9%80%89%E4%B8%AD.png);
    background-size: 58px;
    background-position: 50%;
}


.uma-voice .uma-voice-file .sm2-bar-ui .bd.sm2-main-controls .sm2-inline-element.sm2-button-element .sm2-button-bd .sm2-inline-button.sm2-icon-play-pause::before {
    color: white;
    font-weight: bold;
}

/* 注解样式 */
.note img.multimediaViewerScrollSet{
    width: 3em;
    height: 3em;
}

.note{
    font-size: smaller;
    text-align: center;
    background: wheat;
    border-radius:10px;
    margin: 10px 10px 10px 0;
    height: 2em;
    display: inline-flex;
    align-items: center;
}

/* [[Category:赛马娘 Pretty Derby模板CSS]] */