specter/gmi-web
1
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

inline media refine

Browse source
This commit is contained in:
Talon Poole 2021-02-18 23:57:56 +00:00
parent 58f654fc47
commit cc9c651abf
2 changed files with 5 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
README.md
View file

@ -20,7 +20,9 @@ HTML for these tags.
## optional: inline media
If a link is consumable by `<img>`, `<audio>` or `<video>` you may insert the respective tag inline, instead of an `<a>`. Images and video should be styled to have `max-width: 100%;` so they don't overflow the body. It's a good idea to also include the `controls` attribute. These are all categorized as inline just like `<a>` and will need `display: block;` styling or to be wrapped in a "block" level element.
If a link is consumable by `<img>`, `<audio>` or `<video>` you may insert the respective tag inline, instead of an `<a>`. It's a good idea to also include the `controls`, `currentTime` and `duration` attributes.
These are categorized as inline just like `<a>` and will need `display: block;` styling. Images and video should also have `max-width: 100%;` so they don't overflow the body.
## `<html>` and `<head>`

4
html.js
View file

@ -43,10 +43,10 @@ export function block(
props += ` src=${href}` + alt ? ` title=${alt}` : "";
} else if (options.audio && matchesExt(href, options.audio)) {
type = "audio";
props += ` src=${href}` + alt ? ` title=${alt}` : "";
props += ` controls src=${href}` + alt ? ` title=${alt}` : "";
} else if (options.video && matchesExt(href, options.video)) {
type = "video";
props += ` src=${href}` + alt ? ` title=${alt}` : "";
props += ` controls src=${href}` + alt ? ` title=${alt}` : "";
} else {
type = "a";
content = title || href;