Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
CSS user style to add a red border around media (images, audio, video and animated 'gifv') that lacks a description. Based on code by Paul: https://linernotes.club/@balrogboogie
/* indicate media without a description
initial code by Paul (https://linernotes.club/@balrogboogie), expanded upon by FiXato (https://contact.fixato.org)
related discussions: https://dragonscave.space/@Mayana/106443499687608116.
Feel free to reuse it; it's public domain (https://linernotes.club/@balrogboogie/106681622019395866) */
.media-gallery__item-thumbnail img:not([alt]),
.audio-player__canvas:not([title]),
.video-player video:not([title]),
.media-gallery__gifv video:not([title])
{
border: 1px dashed rgba(255, 0, 0, 0.5);
box-sizing: border-box;
}
/* indicate media without a description
initial code by Paul (https://linernotes.club/@balrogboogie), expanded upon by FiXato (https://contact.fixato.org)
related discussion: https://dragonscave.space/@Mayana/106443499687608116.
Feel free to reuse it; it's public domain (https://linernotes.club/@balrogboogie/106681622019395866) */
.media-gallery__item-thumbnail img:not([alt]),
.audio-player__canvas:not([title]),
.video-player video:not([title]),
.media-gallery__gifv video:not([title])
{
border: 2px solid red;
box-sizing: border-box;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment