aboutsummaryrefslogtreecommitdiffstats
path: root/frontend/src
diff options
context:
space:
mode:
authorAdam Mathes <adam@adammathes.com>2026-02-13 17:07:04 -0800
committerAdam Mathes <adam@adammathes.com>2026-02-13 17:07:04 -0800
commit777c55c742066c674d544604a388d15b782769ff (patch)
tree7833d5accfdb43b7cbb9a9d20cf628fbedbd004f /frontend/src
parent993fa16af4fb5891fa9eb06be728933030cf3953 (diff)
downloadneko-777c55c742066c674d544604a388d15b782769ff.tar.gz
neko-777c55c742066c674d544604a388d15b782769ff.tar.bz2
neko-777c55c742066c674d544604a388d15b782769ff.zip
style(v2): move star to right of title and match legacy look (NK-35kxxw)
Diffstat (limited to 'frontend/src')
-rw-r--r--frontend/src/components/FeedItem.css11
-rw-r--r--frontend/src/components/FeedItem.test.tsx2
-rw-r--r--frontend/src/components/FeedItem.tsx8
3 files changed, 10 insertions, 11 deletions
diff --git a/frontend/src/components/FeedItem.css b/frontend/src/components/FeedItem.css
index 1e7b9bd..bdca707 100644
--- a/frontend/src/components/FeedItem.css
+++ b/frontend/src/components/FeedItem.css
@@ -48,24 +48,23 @@
background: none;
border: none;
cursor: pointer;
- font-size: 1.2rem;
- padding: 0 0.5rem 0 0;
+ font-size: 1.25rem;
+ padding: 0 0 0 0.5rem;
vertical-align: middle;
transition: color 0.2s;
line-height: 1;
}
.star-btn.is-starred {
- color: #ffd700;
- /* Gold */
+ color: blue;
}
.star-btn.is-unstarred {
- color: #ccc;
+ color: black;
}
.star-btn:hover {
- color: #ffeb3b;
+ color: blue;
}
.action-btn {
diff --git a/frontend/src/components/FeedItem.test.tsx b/frontend/src/components/FeedItem.test.tsx
index 913e6ff..5ca5582 100644
--- a/frontend/src/components/FeedItem.test.tsx
+++ b/frontend/src/components/FeedItem.test.tsx
@@ -36,7 +36,7 @@ describe('FeedItem Component', () => {
render(<FeedItem item={mockItem} />);
const starBtn = screen.getByTitle('Star');
- expect(starBtn).toHaveTextContent('☆');
+ expect(starBtn).toHaveTextContent('★');
fireEvent.click(starBtn);
// Optimistic update
diff --git a/frontend/src/components/FeedItem.tsx b/frontend/src/components/FeedItem.tsx
index 23f2bae..2dcbcb9 100644
--- a/frontend/src/components/FeedItem.tsx
+++ b/frontend/src/components/FeedItem.tsx
@@ -54,6 +54,9 @@ export default function FeedItem({ item: initialItem }: FeedItemProps) {
return (
<li className={`feed-item ${item.read ? 'read' : 'unread'} ${loading ? 'loading' : ''}`}>
<div className="item-header">
+ <a href={item.url} target="_blank" rel="noopener noreferrer" className="item-title">
+ {item.title || '(No Title)'}
+ </a>
<button
onClick={(e) => {
e.stopPropagation();
@@ -62,11 +65,8 @@ export default function FeedItem({ item: initialItem }: FeedItemProps) {
className={`star-btn ${item.starred ? 'is-starred' : 'is-unstarred'}`}
title={item.starred ? "Unstar" : "Star"}
>
- {item.starred ? '★' : '☆'}
+ ★
</button>
- <a href={item.url} target="_blank" rel="noopener noreferrer" className="item-title">
- {item.title || '(No Title)'}
- </a>
</div>
<div className="dateline">
<a href={item.url} target="_blank" rel="noopener noreferrer">