diff --git a/src/components/icon.jsx b/src/components/icon.jsx index 1f60dcba..5942cfd1 100644 --- a/src/components/icon.jsx +++ b/src/components/icon.jsx @@ -41,6 +41,7 @@ export const ICONS = { upload: () => import('@iconify-icons/mingcute/upload-3-line'), gear: () => import('@iconify-icons/mingcute/settings-3-line'), more: () => import('@iconify-icons/mingcute/more-3-line'), + more2: () => import('@iconify-icons/mingcute/more-1-fill'), external: () => import('@iconify-icons/mingcute/external-link-line'), popout: () => import('@iconify-icons/mingcute/external-link-line'), popin: [() => import('@iconify-icons/mingcute/external-link-line'), '180deg'], diff --git a/src/components/status.css b/src/components/status.css index 8921b7e5..eb451353 100644 --- a/src/components/status.css +++ b/src/components/status.css @@ -364,9 +364,8 @@ vertical-align: middle; } .status > .container > .meta :is(.time, .edited) { - color: inherit; + color: var(--text-insignificant-color); text-align: end; - opacity: 0.5; text-decoration: none; flex-shrink: 0; margin-left: 4px; @@ -375,9 +374,21 @@ .status > .container > .meta a.time { position: relative; overflow: visible; + display: flex; + align-items: center; + gap: 2px; + font-size: 90%; + + .more { + margin-left: 4px; + transition: transform 0.2s ease-out; + } } .status > .container > .meta a.time:is(:hover, :focus) { - text-decoration: underline; + .more { + transform: scale(1.2); + color: var(--link-color); + } } .status > .container > .meta a.time:active, .status > .container > .meta a.time.is-open { diff --git a/src/components/status.jsx b/src/components/status.jsx index 9c4fd9cc..29914e0c 100644 --- a/src/components/status.jsx +++ b/src/components/status.jsx @@ -1412,6 +1412,7 @@ function Status({ /> )}{' '} + {showContextMenu && } ) : ( //