Update font settings in EpubReader and Reader components to include a "Font Boldness" slider which applies a stroke to the text #3020 on main repo

components/readers/EpubReader.vue

@@ -38,7 +38,8 @@ export default {
       ereaderSettings: {
         theme: 'dark',
         fontScale: 100,
-        lineSpacing: 115
+        lineSpacing: 115,
+        textStroke: 0
       }
     }
   },
@@ -113,7 +114,8 @@ export default {
         '*': {
           color: `${fontColor}!important`,
           'background-color': `${backgroundColor}!important`,
-          'line-height': this.ereaderSettings.lineSpacing + '%!important'
+          'line-height': this.ereaderSettings.lineSpacing + '%!important',
+          '-webkit-text-stroke': this.ereaderSettings.textStroke/100 + 'px ' + fontColor + '!important'
         },
         a: {
           color: `${fontColor}!important`

components/readers/Reader.vue

@@ -82,6 +82,12 @@
               </div>
               <ui-range-input v-model="ereaderSettings.lineSpacing" :min="100" :max="300" :step="5" input-width="180px" @input="settingsUpdated" />
             </div>
+            <div class="flex items-center mb-6">
+              <div class="w-32">
+                <p class="text-base">{{ $strings.LabelFontBoldness }}:</p>
+              </div>
+              <ui-range-input v-model="ereaderSettings.textStroke" :min="0" :max="300" :step="5" input-width="180px" @input="settingsUpdated" />
+            </div>
             <div class="flex items-center">
               <div class="w-32">
                 <p class="text-base">{{ $strings.LabelLayout }}:</p>
@@ -116,7 +122,8 @@ export default {
         theme: 'dark',
         fontScale: 100,
         lineSpacing: 115,
-        spread: 'auto'
+        spread: 'auto',
+        textStroke: 0
       }
     }
   },

strings/en-us.json

@@ -137,6 +137,7 @@
   "LabelFilename": "Filename",
   "LabelFinished": "Finished",
   "LabelFolder": "Folder",
+  "LabelFontBoldness": "Font Boldness",
   "LabelFontScale": "Font scale",
   "LabelGenre": "Genre",
   "LabelGenres": "Genres",