Skip to content

Commit 78ab35b

Browse files
steveseguinsteveseguin
committed
all fonts
1 parent 0511aed commit 78ab35b

File tree

3 files changed

+30
-9
lines changed

3 files changed

+30
-9
lines changed

‎fonts.html‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -235,6 +235,16 @@ <h1>Installed Font Detector</h1>
235235
<p>Lists fonts your browser can use, shows a live sample, and provides a URL parameter to apply the font site‑wide.</p>
236236
</header>
237237

238+
<div class="footer" style="margin-top:0;margin-bottom:16px;">
239+
<h2>How to Install Custom Fonts</h2>
240+
<ul>
241+
<li><b>Windows:</b> Right-click the .ttf or .otf file &rarr; select "Install" or "Install for all users" &rarr; restart your browser.</li>
242+
<li><b>macOS:</b> Double-click the .ttf or .otf file &rarr; click "Install Font" in Font Book &rarr; restart your browser.</li>
243+
<li><b>Linux:</b> Copy font files to <code>~/.local/share/fonts/</code> &rarr; run <code>fc-cache -fv</code> &rarr; restart your browser.</li>
244+
</ul>
245+
<p class="note">After installing, refresh this page to see your new fonts. If a font doesn't appear, try the "Try Local Fonts API" button (Chromium browsers only).</p>
246+
</div>
247+
238248
<div class="controls">
239249
<input id="filter" type="text" placeholder="Filter fonts (e.g. Segoe, Mono, Arabic)" />
240250
<button id="tryLocalFonts" title="Requests permission (if supported) to list local fonts via the Local Fonts API">Try Local Fonts API</button>

‎popup.html‎

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -3365,7 +3365,7 @@ <h3 data-translate="donation-colors">Customize Donation Colors by Threshold 🌈
33653365
<label for="googlefont"><span data-translate="googlefont">&gt; Specify a Google Font name</span></label>
33663366
</div>
33673367
<div>
3368-
<i>note: You can find more fonts <a href="https://socialstream.ninja/fonts.html" target="_blank" class="lightblue">here</a></i>
3368+
<i>note: Install custom fonts on your system (Windows: right-click .ttf/.otf &rarr; Install, then restart browser). <a href="https://socialstream.ninja/fonts.html" target="_blank" class="lightblue">Font detector &amp; help</a></i>
33693369
</div>
33703370
</div>
33713371
</div>
@@ -7728,7 +7728,7 @@ <h3><span data-translate="display-options">Display Options</span></h3>
77287728
<label for="googlefont17"><span data-translate="googlefont">&gt; Specify a Google Font name</span></label>
77297729
</div>
77307730
<div>
7731-
<i>note: You can find more fonts <a href="https://socialstream.ninja/fonts.html" target="_blank" class="lightblue">here</a></i>
7731+
<i>note: Install custom fonts on your system (Windows: right-click .ttf/.otf &rarr; Install, then restart browser). <a href="https://socialstream.ninja/fonts.html" target="_blank" class="lightblue">Font detector &amp; help</a></i>
77327732
</div>
77337733
<div>
77347734
<h3>Event cheat sheet:</h3>
@@ -7974,7 +7974,7 @@ <h3><span data-translate="other-customization-options">Other customization optio
79747974
<label for="googlefont4"><span data-translate="googlefont">&gt; Specify a Google Font name</span></label>
79757975
</div>
79767976
<div>
7977-
<i>note: You can find more fonts <a href="https://socialstream.ninja/fonts.html" target="_blank" class="lightblue">here</a></i>
7977+
<i>note: Install custom fonts on your system (Windows: right-click .ttf/.otf &rarr; Install, then restart browser). <a href="https://socialstream.ninja/fonts.html" target="_blank" class="lightblue">Font detector &amp; help</a></i>
79787978
</div>
79797979
<h3><span data-translate="source-combination-options">Source Combination Options</span></h3>
79807980
<div>
@@ -8305,7 +8305,7 @@ <h3><span data-translate="other-customization-options">Other customization optio
83058305
<label for="googlefont5"><span data-translate="googlefont">&gt; Specify a Google Font name</span></label>
83068306
</div>
83078307
<div>
8308-
<i>note: You can find more fonts <a href="https://socialstream.ninja/fonts.html" target="_blank" class="lightblue">here</a></i>
8308+
<i>note: Install custom fonts on your system (Windows: right-click .ttf/.otf &rarr; Install, then restart browser). <a href="https://socialstream.ninja/fonts.html" target="_blank" class="lightblue">Font detector &amp; help</a></i>
83098309
</div>
83108310

83118311
</div>
@@ -8669,7 +8669,7 @@ <h3><span data-translate="other-customization-options">Other customization optio
86698669
<label for="googlefont13"><span data-translate="googlefont">&gt; Specify a Google Font name</span></label>
86708670
</div>
86718671
<div>
8672-
<i>note: You can find more fonts <a href="https://socialstream.ninja/fonts.html" target="_blank" class="lightblue">here</a></i>
8672+
<i>note: Install custom fonts on your system (Windows: right-click .ttf/.otf &rarr; Install, then restart browser). <a href="https://socialstream.ninja/fonts.html" target="_blank" class="lightblue">Font detector &amp; help</a></i>
86738673
</div>
86748674
<br>
86758675
<div>
@@ -9079,7 +9079,7 @@ <h3><span data-translate="theme-and-styling">Theme and Styling</span></h3>
90799079
<label for="googlefont20"><span data-translate="googlefont">&gt; Specify a Google Font name</span></label>
90809080
</div>
90819081
<div>
9082-
<i>note: You can find more fonts <a href="https://socialstream.ninja/fonts.html" target="_blank" class="lightblue">here</a></i>
9082+
<i>note: Install custom fonts on your system (Windows: right-click .ttf/.otf &rarr; Install, then restart browser). <a href="https://socialstream.ninja/fonts.html" target="_blank" class="lightblue">Font detector &amp; help</a></i>
90839083
</div>
90849084
<br>
90859085

@@ -9794,7 +9794,7 @@ <h3><span data-translate="other-customization-options">Other customization optio
97949794
<label for="googlefont6"><span data-translate="googlefont">&gt; Specify a Google Font name</span></label>
97959795
</div>
97969796
<div>
9797-
<i>note: You can find more fonts <a href="https://socialstream.ninja/fonts.html" target="_blank" class="lightblue">here</a></i>
9797+
<i>note: Install custom fonts on your system (Windows: right-click .ttf/.otf &rarr; Install, then restart browser). <a href="https://socialstream.ninja/fonts.html" target="_blank" class="lightblue">Font detector &amp; help</a></i>
97989798
</div>
97999799

98009800
<div style="padding: 12px; border-radius: 8px; background: rgba(0,0,0,0.04); margin-bottom: 15px;">
@@ -9917,7 +9917,7 @@ <h3><span data-translate="other-customization-options">Other customization optio
99179917
<label for="googlefont7"><span data-translate="googlefont">&gt; Specify a Google Font name</span></label>
99189918
</div>
99199919
<div>
9920-
<i>note: You can find more fonts <a href="https://socialstream.ninja/fonts.html" target="_blank" class="lightblue">here</a></i>
9920+
<i>note: Install custom fonts on your system (Windows: right-click .ttf/.otf &rarr; Install, then restart browser). <a href="https://socialstream.ninja/fonts.html" target="_blank" class="lightblue">Font detector &amp; help</a></i>
99219921
</div>
99229922
<br>
99239923
<div>

‎popup.js‎

Lines changed: 12 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -780,7 +780,18 @@ function isFontAvailable(fontName) {
780780
}
781781

782782
async function populateFontDropdown() {
783-
const fonts = ["Roboto", "Tahoma", "Arial", "Verdana", "Helvetica", "Serif", "Trebuchet MS", "Times New Roman", "Georgia", "Garamond", "Courier New", "Brush Script MT"];
783+
const fonts = [
784+
// Windows core UI/text
785+
'Segoe UI', 'Segoe UI Variable', 'Segoe UI Emoji', 'Segoe UI Historic', 'Segoe UI Symbol', 'Bahnschrift', 'Ebrima', 'Gadugi', 'Javanese Text', 'Leelawadee UI', 'Lucida Sans Unicode', 'Malgun Gothic', 'Meiryo', 'Microsoft Himalaya', 'Microsoft JhengHei', 'Microsoft New Tai Lue', 'Microsoft PhagsPa', 'Microsoft Sans Serif', 'Microsoft Tai Le', 'Microsoft Uighur', 'Microsoft YaHei', 'Microsoft Yi Baiti', 'MingLiU-ExtB', 'Mongolian Baiti', 'MS Gothic', 'MS PGothic', 'MS UI Gothic', 'NSimSun', 'PMingLiU-ExtB', 'SimSun', 'SimSun-ExtB', 'Yu Gothic', 'Yu Gothic UI',
786+
// Windows Latin staples
787+
'Arial', 'Arial Black', 'Calibri', 'Cambria', 'Candara', 'Comic Sans MS', 'Consolas', 'Constantia', 'Corbel', 'Courier New', 'Franklin Gothic Medium', 'Gabriola', 'Georgia', 'Impact', 'Palatino Linotype', 'Tahoma', 'Times New Roman', 'Trebuchet MS', 'Verdana', 'Symbol', 'Webdings', 'Wingdings', 'Wingdings 2', 'Wingdings 3', 'Sitka Banner', 'Sitka Display', 'Sitka Heading', 'Sitka Small', 'Sitka Subheading', 'Sitka Text', 'Lucida Console',
788+
// Developer favorites / code
789+
'Cascadia Code', 'Cascadia Mono', 'Fira Code', 'Fira Mono', 'JetBrains Mono', 'Source Code Pro', 'IBM Plex Mono', 'Ubuntu Mono', 'Inconsolata', 'Monaspace Neon', 'Monaspace Argon',
790+
// Popular sans/serif families
791+
'Inter', 'Roboto', 'Open Sans', 'Noto Sans', 'Noto Serif', 'Noto Sans JP', 'Noto Sans KR', 'Noto Sans SC', 'Noto Serif JP', 'Noto Naskh Arabic', 'Lato', 'Montserrat', 'Poppins', 'Oswald', 'Raleway', 'Nunito', 'Merriweather', 'Playfair Display', 'PT Sans', 'PT Serif', 'Source Sans 3', 'Source Serif 4', 'Source Sans Pro', 'Source Serif Pro', 'IBM Plex Sans', 'IBM Plex Serif', 'Ubuntu', 'Work Sans', 'Sora', 'Avenir', 'Avenir Next', 'SF Pro Text', 'SF Pro Display', 'Helvetica Neue', 'Helvetica', 'Gill Sans',
792+
// Other common
793+
'Book Antiqua', 'Century Gothic', 'Garamond', 'Didot', 'Bodoni MT', 'Perpetua', 'Rockwell', 'Goudy Old Style', 'Copperplate', 'Brush Script MT'
794+
];
784795

785796
var select = document.querySelector("[data-optionparam1='font']");
786797
fonts.forEach(font => {

0 commit comments

Comments
 (0)