diff --git a/src/components/HighlightsPanel.tsx b/src/components/HighlightsPanel.tsx index 5c496bd7..f615f64a 100644 --- a/src/components/HighlightsPanel.tsx +++ b/src/components/HighlightsPanel.tsx @@ -143,26 +143,26 @@ export const HighlightsPanel: React.FC = ({ friends: !highlightVisibility.friends })} className={`level-toggle-btn ${highlightVisibility.friends ? 'active' : ''}`} - title="Toggle friends highlights" + title={currentUserPubkey ? "Toggle friends highlights" : "Login to see friends highlights"} aria-label="Toggle friends highlights" style={{ color: highlightVisibility.friends ? 'var(--highlight-color-friends, #f97316)' : undefined }} + disabled={!currentUserPubkey} > - {currentUserPubkey && ( - - )} + )} {onRefresh && ( diff --git a/src/index.css b/src/index.css index cea0dd7a..9d8e29e6 100644 --- a/src/index.css +++ b/src/index.css @@ -1326,6 +1326,15 @@ body { opacity: 0.4; } +.highlight-level-toggles .level-toggle-btn:disabled { + opacity: 0.3; + cursor: not-allowed; +} + +.highlight-level-toggles .level-toggle-btn:disabled:hover { + background: none; +} + .refresh-highlights-btn, .toggle-underlines-btn, .toggle-highlights-btn {