diff --git a/src/assets/fonts/subtitles.css b/src/assets/fonts/subtitles.css index b2a9e6fae4d1b8e644559a448ce6ebab46bf72ae..4bf29c2b3768794c5ea18d95c975576205ced64f 100644 --- a/src/assets/fonts/subtitles.css +++ b/src/assets/fonts/subtitles.css @@ -1,5 +1,5 @@ .ttml-sansSerif { - font-family: sans-serif; + font-family: "Tiresias", Verdana, Arial, sans-serif; } .ttml-serif { @@ -11,7 +11,7 @@ } .ttml-proportionalSansSerif { - font-family: sans-serif; + font-family: "Tiresias", Verdana, Arial, sans-serif; } .ttml-monospaceSansSerif { diff --git a/src/assets/fonts/tiresias.css b/src/assets/fonts/tiresias.css new file mode 100644 index 0000000000000000000000000000000000000000..65c233c204450d3e9ca29749ef50d43287247ec2 --- /dev/null +++ b/src/assets/fonts/tiresias.css @@ -0,0 +1,14 @@ +@font-face { + font-family: 'Tiresias'; + font-style: normal; + font-weight: 400; + font-display: swap; + src: url("tiresias/Tiresias.ttf") format("truetype"); +} +@font-face { + font-family: 'Tiresias'; + font-style: italic; + font-weight: 400; + font-display: swap; + src: url("tiresias/Tiresias-Italic.ttf") format("truetype"); +} diff --git a/src/assets/fonts/tiresias/Tiresias-Italic.ttf b/src/assets/fonts/tiresias/Tiresias-Italic.ttf new file mode 100644 index 0000000000000000000000000000000000000000..001a58fa8e675bb310533570d55145d058dc2680 Binary files /dev/null and b/src/assets/fonts/tiresias/Tiresias-Italic.ttf differ diff --git a/src/assets/fonts/tiresias/Tiresias.ttf b/src/assets/fonts/tiresias/Tiresias.ttf new file mode 100644 index 0000000000000000000000000000000000000000..2a8a6aaa858bcd10ff63a76314483260775377ec Binary files /dev/null and b/src/assets/fonts/tiresias/Tiresias.ttf differ diff --git a/src/index.tsx b/src/index.tsx index 2b54e57e1a594c66298785c1b85a402839b9ca40..a313dd52ecd21be515da4d506068d0490cbd0ed8 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -7,6 +7,7 @@ import {App} from "./App"; import './assets/fonts/fira-sans.css'; import './assets/fonts/inter.css'; +import './assets/fonts/tiresias.css'; import './assets/fonts/subtitles.css'; import './base/base.css'; import * as serviceWorker from './serviceWorker'; diff --git a/src/routes/player/Player.tsx b/src/routes/player/Player.tsx index aac33f4e10c32c71abd2cbe5f532d4b512a64aa7..40f04b583cf2d862ff4a2c725c939b2bf16eabd9 100644 --- a/src/routes/player/Player.tsx +++ b/src/routes/player/Player.tsx @@ -190,6 +190,6 @@ const useStyles = createUseStyles({ bottom: 0, width: "100%", height: "100%", - textShadow: "rgba(40,40,40,0.8) 0px 0px 3px", + textShadow: "#000 0px 0px 3px, rgba(0,0,0,0.5) 0px 0px 7px", }, }); diff --git a/src/util/subtitles/ttml/html.js b/src/util/subtitles/ttml/html.js index a76ee4a1aac3d6d67f6bfa1c6a6a0858c6287218..bb374df27f38feb56351048264d9d6dc709c684e 100644 --- a/src/util/subtitles/ttml/html.js +++ b/src/util/subtitles/ttml/html.js @@ -706,13 +706,13 @@ let STYLING_MAP_DEFS = [ function (context, dom_element, isd_element, attr) { /* per IMSC1 */ const styleClasses = ["monospaceSerif", "proportionalSerif", "monospace", "sansSerif", "serif", "monospaceSansSerif", "proportionalSansSerif"]; - for (let attribute of attr) { - if (styleClasses.includes(attribute)) { - dom_element.classList.add("ttml-" + attribute); - } else { - dom_element.style.fontFamily = attribute; - } - } + const attributes = Array.from(attr) + .map(it => it.trim()); + const fonts = attributes.filter(it => !styleClasses.includes(it)); + dom_element.style.fontFamily = fonts.map(it => '"'+it+'"').join(","); + const classes = attributes.filter(it => styleClasses.includes(it)) + .map(it => "ttml-"+it); + classes.forEach(it => dom_element.classList.add(it)); } ), new HTMLStylingMapDefintion( diff --git a/src/util/subtitles/ttml/styles.js b/src/util/subtitles/ttml/styles.js index 4510f645b55d36088c30f202c3fca328e7359999..806921cdba6d987a7e133fcdc60b07d71eb5028f 100644 --- a/src/util/subtitles/ttml/styles.js +++ b/src/util/subtitles/ttml/styles.js @@ -26,7 +26,7 @@ import * as imscNames from './names'; import * as imscUtils from './utils'; -const DEFAULT_FONT_FAMILY = "monospaceSansSerif"; +const DEFAULT_FONT_FAMILY = "proportionalSansSerif"; function StylingAttributeDefinition(ns, name, initialValue, appliesTo, isInherit, isAnimatable, parseFunc, computeFunc) { this.name = name;