diff --git a/src/pages/SnsPage.scss b/src/pages/SnsPage.scss index 5f18693..c642a50 100644 --- a/src/pages/SnsPage.scss +++ b/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 { diff --git a/src/pages/SnsPage.tsx b/src/pages/SnsPage.tsx index 25f146e..2c536f7 100644 --- a/src/pages/SnsPage.tsx +++ b/src/pages/SnsPage.tsx @@ -1093,7 +1093,7 @@ export default function SnsPage() {