MediaWiki:Common.css/src/template/sound.scss
This page is one of the SCSS pages which are the basis for MediaWiki:Common.css. After you edit this page, you will need to recompile them for your changes to take effect. See Terraria Wiki:CSS to learn more.
Ancestors: / src / template / sound.scss
Siblings: achievement.scss animation.scss archive_header.scss archive-box.scss chance.scss coin.scss color_box.scss crafts.scss diagram.scss doc.scss dotlist.scss dpl3.scss editcopy_notice.scss error.scss etext.scss exclusive_icon_link.scss exclusive_icons.scss expert,master,journey.scss flavor_text.scss float_file_box.scss gameText.scss getDropInfo.scss hardmode.scss hatnote.scss history.scss hp.scss info_request.scss infobox.scss infocard.scss item.scss itemlist.scss key.scss l10n_subtemplate.scss licensebox.scss living_preferences.scss loot.scss mctoc.scss msgbox.scss multi-column_list.scss na.scss navbox.scss project.scss protected.scss quotation.scss recipes.scss reflist.scss shortcut.scss sound.scss spoiler.scss summoned.scss templatedata.scss toc_limit.scss toggleBox.scss transclude.scss translation_projects.scss use_time,knockback.scss yes,no.scss
Children: (none)
/********* [[Template:Sound]] *********/
/* All of these styles should only be applied if JavaScript is enabled (because
* the functionality doesn't work otherwise); see also
* https://www.mediawiki.org/wiki/Manual:Coding_conventions/CSS#.client-js_and_.client-nojs */
.client-js .sound {
cursor: pointer;
audio {
/* hide the default HTML audio player */
display: none;
}
&.iconlast .sound-title::after,
&.iconfirst .sound-title::before {
/* speaker icon */
content: '';
display: inline-block;
width: 1.143em;
height: 1.143em;
vertical-align: text-top;
background: url(https://commons.wiki.gg/images/3/36/Audio.svg);
background-size: contain;
filter: var(--ooui--icon-normal-filter);
}
.sound-title {
&::after {
/* for sound.iconlast */
margin-left: 2px;
}
&::before {
/* for sound.iconfirst */
margin-right: 2px;
}
}
&.sound-playing .sound-title {
&::after,
&::before {
/* color the speaker icon in the "progressive" color */
filter: var(--ooui--icon-progressive-filter);
}
}
}