feat(sns): show selected jump date in header

src/pages/SnsPage.scss

@@ -210,6 +210,50 @@
             animation: spin 0.8s linear infinite;
         }
     }
+
+    .jump-date-chip {
+        display: inline-flex;
+        align-items: center;
+        gap: 8px;
+        border: 1px solid var(--border-color);
+        border-radius: var(--sns-border-radius-sm);
+        background: var(--bg-tertiary);
+        color: var(--text-secondary);
+        padding: 8px 10px;
+        cursor: pointer;
+        transition: all 0.2s;
+
+        &:hover {
+            background: var(--hover-bg);
+            color: var(--primary);
+        }
+
+        &.active {
+            border-color: var(--primary);
+            background: rgba(var(--primary-rgb), 0.08);
+            color: var(--primary);
+        }
+    }
+
+    .jump-date-chip-label {
+        font-size: 13px;
+        font-weight: 500;
+        line-height: 1;
+        white-space: nowrap;
+    }
+
+    .jump-date-chip-clear {
+        display: inline-flex;
+        align-items: center;
+        justify-content: center;
+        color: inherit;
+        border-radius: 999px;
+        padding: 1px;
+
+        &:hover {
+            background: color-mix(in srgb, var(--primary) 12%, transparent);
+        }
+    }
 }
 
 .sns-posts-scroll {

src/pages/SnsPage.tsx

@@ -1093,7 +1093,7 @@ export default function SnsPage() {
                             <div className="jump-calendar-anchor" ref={jumpCalendarWrapRef}>
                                 <button
                                     type="button"
-                                    className={`icon-btn ${showJumpPopover ? 'active' : ''}`}
+                                    className={`${jumpTargetDate ? 'jump-date-chip' : 'icon-btn'} ${showJumpPopover ? 'active' : ''}`}
                                     title={jumpTargetDate
                                         ? jumpTargetDate.toLocaleDateString('zh-CN', { year: 'numeric', month: 'long', day: 'numeric' })
                                         : '时间跳转'}
@@ -1106,7 +1106,35 @@ export default function SnsPage() {
                                         setShowJumpPopover(prev => !prev)
                                     }}
                                 >
+                                    {jumpTargetDate ? (
+                                        <>
+                                            <span className="jump-date-chip-label">
+                                                {`${jumpTargetDate.getFullYear()}-${String(jumpTargetDate.getMonth() + 1).padStart(2, '0')}-${String(jumpTargetDate.getDate()).padStart(2, '0')}`}
+                                            </span>
+                                            <span
+                                                className="jump-date-chip-clear"
+                                                role="button"
+                                                tabIndex={0}
+                                                onClick={(event) => {
+                                                    event.stopPropagation()
+                                                    setJumpTargetDate(undefined)
+                                                    setShowJumpPopover(false)
+                                                }}
+                                                onKeyDown={(event) => {
+                                                    if (event.key !== 'Enter' && event.key !== ' ') return
+                                                    event.preventDefault()
+                                                    event.stopPropagation()
+                                                    setJumpTargetDate(undefined)
+                                                    setShowJumpPopover(false)
+                                                }}
+                                                aria-label="清除日期跳转"
+                                            >
+                                                <X size={14} />
+                                            </span>
+                                        </>
+                                    ) : (
                                         <Calendar size={20} />
+                                    )}
                                 </button>
                                 <JumpToDatePopover
                                     isOpen={showJumpPopover}