From 451f1ff97e03502d6ff634082b51b7c5ebd6ab6a Mon Sep 17 00:00:00 2001
From: Konrad Kollnig <5175206+kasnder@users.noreply.github.com>
Date: Wed, 23 Sep 2026 09:18:36 +0200
Subject: [PATCH] Align directory filters and remove duplicate placeholder

---
 public/css/styles.css     |  1 +
 test/websiteViews.test.js | 14 ++++++++++++++
 views/directory.pug       |  2 +-
 3 files changed, 16 insertions(+), 1 deletion(-)

diff --git a/public/css/styles.css b/public/css/styles.css
index 1738c7c..ae4616a 100644
--- a/public/css/styles.css
+++ b/public/css/styles.css
@@ -285,6 +285,7 @@ progress.bar-track::-moz-progress-bar { background: var(--brand); }
 .error-list { margin: 0; padding-left: 1.2rem; }
 
 .directory-controls, .tracker-controls { display: grid; gap: .5rem .75rem; grid-template-columns: auto minmax(160px, 1fr) auto; margin: 1.5rem 0 1rem; }
+.directory-controls { align-items: center; }
 .directory-controls input { min-width: 0; }
 .directory-controls .result-count { align-self: center; }
 .result-count { color: var(--muted); flex: 0 1 auto; font-size: .8rem; }
diff --git a/test/websiteViews.test.js b/test/websiteViews.test.js
index 2dbb0cb..baf5cd8 100644
--- a/test/websiteViews.test.js
+++ b/test/websiteViews.test.js
@@ -224,6 +224,20 @@ test('search, directory, lookup, statistics, about, request and error states ren
   assertSingleH1(directory, 'directory');
   assert.match(directory, /Acme Analytics/);
   assert.match(directory, /data-filter=/);
+  assert.match(directory, /<label for="directory-filter">Filter trackers or companies<\/label>/);
+  const trackerFilter = directory.match(/<input[^>]*id="directory-filter"[^>]*>/)?.[0];
+  assert.ok(trackerFilter);
+  assert.doesNotMatch(trackerFilter, /placeholder=/);
+
+  const companyDirectory = render('directory.pug', {
+    kind: 'company',
+    entries: [{ name: 'Acme Corp', slug: 'acme-corp', countryName: 'United States', region: 'US', appCount: 2, pct: '50.0' }],
+    totalApps: 4, trackedApps: 2
+  });
+  assert.match(companyDirectory, /<label for="directory-filter">Filter companies<\/label>/);
+  const companyFilter = companyDirectory.match(/<input[^>]*id="directory-filter"[^>]*>/)?.[0];
+  assert.ok(companyFilter);
+  assert.doesNotMatch(companyFilter, /placeholder=/);
 
   const lookup = render('lookup.pug', {
     kind: 'tracker',
diff --git a/views/directory.pug b/views/directory.pug
index 5b6be3c..e8ab973 100644
--- a/views/directory.pug
+++ b/views/directory.pug
@@ -23,7 +23,7 @@ block content
 
     .directory-controls
       label(for='directory-filter')= translate(isTracker ? 'Filter trackers or companies' : 'Filter companies')
-      input#directory-filter(type='search' placeholder=translate(isTracker ? 'Filter trackers or companies' : 'Filter companies') aria-controls='directory-table' data-filter-target='#directory-table' autocomplete='off')
+      input#directory-filter(type='search' aria-controls='directory-table' data-filter-target='#directory-table' autocomplete='off')
       p#directory-count.result-count(role='status' aria-live='polite')= translate(directoryEntries.length === 1 ? '{{count}} entry' : '{{count}} entries', { count: directoryEntries.length })
 
     p.table-scroll-hint= translate('Scroll sideways to see all columns.')