paritybit.ca

Unnamed repository; edit this file 'description' to name the repository.
Log | Files | Refs | README | LICENSE

commit bcd903c6ff45b399ca2d56b3fd018aa06cebff8b
parent b5a3883a8aae3dfa3f4e711f7793d3cc49a452c6
Author: Jake Bauer <jbauer@paritybit.ca>
Date:   Thu, 28 Mar 2019 02:16:32 -0400

Improve styling for video and audio elements

Styling for video and audio elements should appropriately resize for
smaller screens. Make them do that. (Includes minor change for
making <li> elements with a certain class bold so that they fit with
the rest of a list better.

Diffstat:
Mbuild/base.css | 13+++++++++++++
Mpages/projects.md | 2+-
Mpages/projects/dnd/dnd-podcast.md | 2+-
3 files changed, 15 insertions(+), 2 deletions(-)

diff --git a/build/base.css b/build/base.css @@ -48,9 +48,18 @@ button { video, audio { width: 27em; + max-width: 90%; border: 5px #585858 groove; } +video { + height: 16em; +} + +audio { + height: 2.3em; +} + ul.inline { padding: .1em 0 .5em 0; margin: 0; @@ -60,6 +69,10 @@ ul.inline { text-align: center; } +.sublist-header { + font-weight: bold; +} + #header { font-family: "Liberation Mono", monospace; text-align: center; diff --git a/pages/projects.md b/pages/projects.md @@ -2,7 +2,7 @@ <ul> <li><a href="https://git.sr.ht/~jbauer/">My Sourcehut (preferred git service)</a></li> <li><a href="https://github.com/JakeMBauer/">My GitHub</a></li> - <li>Dungeons & Dragons + <li class="sublist-header">Dungeons & Dragons <ul> <li><a href="projects/dnd/dnd-podcast.html">D&D Podcast (We record our sessions!)</a></li> <li><a href="projects/dnd/roll.html">D&D Simple Dice Roller</a></li> diff --git a/pages/projects/dnd/dnd-podcast.md b/pages/projects/dnd/dnd-podcast.md @@ -33,7 +33,7 @@ This is a test recording to ensure that the website functions as expected. Watch the video (MP4) in your browser: -<video width="320" height="240" controls> +<video controls> <source src="/share/podcasts/e0/test-recording.mp4" type="video/mp4"> Your browser does not support the HTML5 video tag. </video>