Replace emoji icons with Lucide icons and soften link colors
Replaced emoji icons throughout the Angular app with modern Lucide icon library for a more professional and consistent look matching the original static site design. **Icon Updates:** - Navigation tabs: Database, Upload, Search icons - Toolbar buttons: RefreshCw, Sparkles, Search, X icons - Action buttons: Download, Trash2 icons - Form buttons: Upload, Search, X icons **Style Improvements:** - Added softer blue color for artifact links (#93c5fd) - Added hover effect with lighter blue (#bfdbfe) - Added proper cursor pointer for clickable rows - Improved icon color consistency throughout **Dependencies:** - Added lucide-angular (v0.545.0) for icon support - Bundle size: 356.54 kB (raw) → 93.91 kB (gzipped) - Minimal impact: only +7.79 kB for full icon library All components updated with Lucide imports and icon references. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
@@ -524,6 +524,28 @@ code {
|
||||
stroke: currentColor;
|
||||
}
|
||||
|
||||
/* Artifact link styles - softer blue */
|
||||
.artifact-link {
|
||||
color: #93c5fd;
|
||||
text-decoration: none;
|
||||
transition: color 0.3s;
|
||||
}
|
||||
|
||||
.artifact-link:hover {
|
||||
color: #bfdbfe;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* Clickable row cursor */
|
||||
tr.clickable {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
/* Search icon color */
|
||||
.search-icon {
|
||||
color: #64748b;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.form-row {
|
||||
grid-template-columns: 1fr;
|
||||
|
||||
Reference in New Issue
Block a user