feat: highlight 'your own highlights' in login copy

- Style 'your own highlights' text with user's mine highlight color
- Uses --highlight-color-mine CSS variable from settings
- Adds subtle padding and border-radius for clean highlight effect
This commit is contained in:
Gigi
2025-10-18 09:11:04 +02:00
parent 1870c307da
commit e4b4b97874
2 changed files with 9 additions and 1 deletions

View File

@@ -78,7 +78,7 @@ const LoginOptions: React.FC = () => {
<div className="login-content">
<h2 className="login-title">Welcome to Boris</h2>
<p className="login-description">
Login to see your bookmarks, explore long-form articles, and create your own highlights.
Login to see your bookmarks, explore long-form articles, and create <mark className="login-highlight">your own highlights</mark>.
</p>
<div className="login-buttons">

View File

@@ -27,6 +27,14 @@
text-align: center;
}
.login-highlight {
background-color: var(--highlight-color-mine, #fde047);
color: var(--color-text);
padding: 0.125rem 0.25rem;
border-radius: 3px;
font-weight: 500;
}
.login-buttons {
display: flex;
flex-direction: column;