From: Marc Foley <m.foley.88@gmail.com>
Date: Wed, 9 Jul 2025 10:34:03 +0000 (+0100)
Subject: select abritrary fonts and cats
X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=8d34c97265e5367a38f347442cf1468164bc5fae;p=thirdparty%2Fgoogle%2Ffonts.git

select abritrary fonts and cats
---

diff --git a/tagger2/TagsByFont.js b/tagger2/TagsByFont.js
index d540f7841..67700ee43 100644
--- a/tagger2/TagsByFont.js
+++ b/tagger2/TagsByFont.js
@@ -8,7 +8,12 @@ export default {
   },
   template: `
     <div>
-      <h3>Tags for font: {{ font }}</h3>
+      <h3>Tags for fonter</h3>
+      <select v-model="font" @change="filteredTags">
+        <option v-for="tag in tags.map(tag => tag.family.name).filter((value, index, self) => self.indexOf(value) === index)" :key="tag">
+          {{ tag }}
+        </option>
+      </select>
       <ul>
         <li v-for="tag in filteredTags" :key="tag.tagName + tag.family.name">
           {{ tag.tagName }} (Score: {{ tag.score }})
diff --git a/tagger2/index.html b/tagger2/index.html
index b9c345fe7..a93bb88da 100644
--- a/tagger2/index.html
+++ b/tagger2/index.html
@@ -8,12 +8,13 @@
     <div id="fonts">
       <link v-for="family in gf && gf.families ? gf.families : []" :href="family.url" rel="stylesheet">
     </div>
-    <div v-for="(panel, idx) in panels" :key="idx">
-      <panel :panel="panel" :tags="tags && tags.items ? tags.items : []" @remove="removePanel(idx)"></panel>
+    <button @click="addFontPanel('Maven Pro')">Add Font View</button>
+    <button @click="addCategoriesPanel(['/Expressive/Loud'])">Add Tag View</button>
+    <div style="display: flex; flex-direction: row; width: 100vw; min-height: 100vh;">
+      <div v-for="(panel, idx) in panels" :key="idx" :style="{ flex: '1 1 0', minWidth: 0, borderRight: idx < panels.length - 1 ? '1px solid #eee' : 'none', height: '100vh', overflow: 'auto' }">
+        <panel :panel="panel" :tags="tags && tags.items ? tags.items : []" @remove="removePanel(idx)"></panel>
+      </div>
     </div>
-    <!-- Optionally, add buttons to add panels for testing -->
-    <button @click="addFontPanel('Maven Pro')">Add Maven Pro Panel</button>
-    <button @click="addCategoriesPanel(['/Expressive/Loud'])">Add /Expressive/Loud Panel</button>
   </div>
   <script type="module">
     import { GF, Tags } from './models.js';