diff --git a/config.js b/config.js new file mode 100644 index 0000000..4c18fb5 --- /dev/null +++ b/config.js @@ -0,0 +1,9 @@ +const CONFIG = { + style: { + fontBackground: "rgba(19, 20, 33, 0.5)", + fontColor: "#ffffff", + fontSize: "70pt", + fontStrokeSize: "3px", + fontStrokeColor: "#000000", + }, +}; diff --git a/css/style.css b/css/style.css index 52da40f..82d200d 100644 --- a/css/style.css +++ b/css/style.css @@ -1,12 +1,8 @@ * { font-family: Arial, Helvetica, sans-serif; font-weight: bold; - color: white; - font-size: 70pt; padding: 0; margin: 0; - -webkit-text-stroke: 3px black; - background-color: transparent; } #content div { margin-top: 5px; @@ -23,3 +19,9 @@ .content-text { margin-left: 130px; } + +.content-text p { + display: inline; + padding-left: 20px; + padding-right: 20px; +} diff --git a/js/display_content.js b/js/display_content.js index f5007db..4fdbf6d 100644 --- a/js/display_content.js +++ b/js/display_content.js @@ -3,7 +3,8 @@ function drawClients() { result = ""; getClientsInChannel(thisClient.channel).forEach((c) => { - result += '
'; + result += `
`; + result += '
'; if (c.outputMuted) { result += ' '; } else if (c.inputMuted) { @@ -14,7 +15,9 @@ function drawClients() { result += ' '; } result += "
"; - result += '
' + c.name + "
"; + result += `

${c.name}

`; }); elem.innerHTML = result; } diff --git a/overlay.html b/overlay.html index ba28044..38cd3f0 100644 --- a/overlay.html +++ b/overlay.html @@ -8,6 +8,7 @@ TS5 - OBS Overlay +