diff --git a/src/lib/components/Settings.svelte b/src/lib/components/Settings.svelte index 311ba9b..4e2d566 100644 --- a/src/lib/components/Settings.svelte +++ b/src/lib/components/Settings.svelte @@ -27,6 +27,10 @@ let showTimestamps = $state(true); let fadeSeconds = $state(10); let maxLines = $state(100); + let fontSource = $state("System Font"); + let fontFamily = $state("Courier"); + let websafeFont = $state("Arial"); + let googleFont = $state("Roboto"); let fontSize = $state(12); let userColor = $state("#4CAF50"); let textColor = $state("#FFFFFF"); @@ -99,6 +103,10 @@ showTimestamps = cfg.display.show_timestamps; fadeSeconds = cfg.display.fade_after_seconds; maxLines = cfg.display.max_lines; + fontSource = cfg.display.font_source ?? "System Font"; + fontFamily = cfg.display.font_family ?? "Courier"; + websafeFont = cfg.display.websafe_font ?? "Arial"; + googleFont = cfg.display.google_font ?? "Roboto"; fontSize = cfg.display.font_size; userColor = cfg.display.user_color; textColor = cfg.display.text_color; @@ -174,6 +182,10 @@ show_timestamps: showTimestamps, fade_after_seconds: fadeSeconds, max_lines: maxLines, + font_source: fontSource, + font_family: fontFamily, + websafe_font: websafeFont, + google_font: googleFont, font_size: fontSize, user_color: userColor, text_color: textColor, @@ -485,6 +497,95 @@ bind:value={maxLines} /> +
+ + +
+ {#if fontSource === "System Font"} +
+ + +
+ {/if} + {#if fontSource === "Web-Safe"} +
+ + +
+ {/if} + {#if fontSource === "Google Font"} +
+ + +

+ Browse more at fonts.google.com +

+
+ {/if}