From 2eb23e99b542641d833ec246df157f5cefc8e730 Mon Sep 17 00:00:00 2001
From: Frank Stellmacher <171614930+Psychotoxical@users.noreply.github.com>
Date: Wed, 13 May 2026 20:05:54 +0200
Subject: [PATCH] fix(styles): force-add result-items.css missed by .gitignore
 (#660)

The components.css split (PR #657) wrote `result-items.css` to disk, but
.gitignore line 57 (`result-*`) silently filtered it out of `git add -A`.
Local builds worked because the file existed on the splitter's machine;
fresh clones fail with `ENOENT: no such file or directory` when vite
resolves the `@import './result-items.css';` in components/index.css.

Force-adding with `git add -f` keeps the broad `result-*` ignore for
test artifacts intact.
---
 src/styles/components/result-items.css | 77 ++++++++++++++++++++++++++
 1 file changed, 77 insertions(+)
 create mode 100644 src/styles/components/result-items.css

diff --git a/src/styles/components/result-items.css b/src/styles/components/result-items.css
new file mode 100644
index 00000000..0cc70289
--- /dev/null
+++ b/src/styles/components/result-items.css
@@ -0,0 +1,77 @@
+/* ─── Result items ─── */
+.mobile-search-item {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+  width: 100%;
+  padding: 10px 16px;
+  background: none;
+  border: none;
+  cursor: pointer;
+  text-align: left;
+  transition: background var(--transition-fast);
+}
+
+.mobile-search-item:active {
+  background: var(--bg-hover);
+}
+
+.mobile-search-thumb {
+  width: 46px;
+  height: 46px;
+  border-radius: 6px;
+  object-fit: cover;
+  flex-shrink: 0;
+}
+
+.mobile-search-thumb--artist-round {
+  border-radius: 50%;
+}
+
+.mobile-search-avatar {
+  width: 46px;
+  height: 46px;
+  border-radius: 8px;
+  background: var(--bg-card);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  color: var(--text-muted);
+  flex-shrink: 0;
+}
+
+.mobile-search-avatar--circle {
+  border-radius: 50%;
+}
+
+.mobile-search-item-info {
+  display: flex;
+  flex-direction: column;
+  gap: 3px;
+  min-width: 0;
+  flex: 1;
+}
+
+.mobile-search-item-title {
+  font-size: 15px;
+  font-weight: 500;
+  color: var(--text-primary);
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.mobile-search-item-sub {
+  font-size: 13px;
+  color: var(--text-muted);
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.mobile-search-item-chevron {
+  color: var(--text-muted);
+  opacity: 0.4;
+  flex-shrink: 0;
+}
+