feat(brand): icone de dente (premium) na home, favicon e menu de dentistas

- novo componente ToothIcon (SVG, lucide-like)
- LandingPage: logo nav/mobile usa ToothIcon (sobre o gradiente premium)
- favicon.svg (dente branco em gradiente azul) + index.html
- Sidebar: menu DENTISTAS e 'ver como dentista' usam ToothIcon

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
VPS 4 Builder
2026-06-10 06:18:51 +02:00
parent e5e02b7438
commit ed26605dd1
5 changed files with 27 additions and 7 deletions
+4 -3
View File
@@ -1,8 +1,9 @@
import React from 'react';
import {
Users, Calendar as CalendarIcon, LayoutDashboard, Stethoscope,
Users, Calendar as CalendarIcon, LayoutDashboard,
DollarSign, RefreshCw, Activity, BookOpen, Award, Megaphone, LogOut, ClipboardList, Bell, Building2, User, BarChart3, Settings, FileText, Puzzle, ScanLine, Monitor, UsersRound, GraduationCap, UserSearch, Briefcase, TrendingUp, Eye, FlaskConical
} from 'lucide-react';
import { ToothIcon } from './ToothIcon.tsx';
import { HybridBackend } from '../services/backend.ts';
import { getActivePlugins } from '../views/plugins/pluginRegistry.ts';
@@ -49,7 +50,7 @@ export const Sidebar: React.FC<SidebarProps> = ({ activeTab, setActiveTab }) =>
{ id: 'leads', label: 'GESTÃO DE LEADS', icon: Megaphone },
{ id: 'tratamentos', label: 'MEUS TRATAMENTOS', icon: ClipboardList },
{ id: 'clinicas', label: 'MINHAS CLÍNICAS', icon: Building2 },
{ id: 'dentistas', label: 'DENTISTAS', icon: Stethoscope },
{ id: 'dentistas', label: 'DENTISTAS', icon: ToothIcon },
{ id: 'especialidades', label: 'ESPECIALIDADES', icon: Award },
{ id: 'procedimentos', label: 'PROCEDIMENTOS', icon: ClipboardList },
{ id: 'planos', label: 'PLANOS / CONVÊNIOS', icon: BookOpen },
@@ -146,7 +147,7 @@ export const Sidebar: React.FC<SidebarProps> = ({ activeTab, setActiveTab }) =>
</p>
{[
{ role: 'donoclinica', label: 'DONO DE CLÍNICA', icon: Building2 },
{ role: 'dentista', label: 'DENTISTA', icon: Stethoscope },
{ role: 'dentista', label: 'DENTISTA', icon: ToothIcon },
{ role: 'protetico', label: 'PROTÉTICO', icon: FlaskConical },
{ role: 'paciente', label: 'PACIENTE', icon: User },
].map(({ role, label, icon: Icon }) => (
+9
View File
@@ -0,0 +1,9 @@
import React from 'react';
// Ícone de DENTE (lucide-like: aceita size/className/style). Usa fill=currentColor,
// então herda a cor do texto/contexto. Representa dentistas / a marca ScoreOdonto.
export const ToothIcon: React.FC<{ size?: number; className?: string; style?: React.CSSProperties }> = ({ size = 24, className, style }) => (
<svg width={size} height={size} viewBox="0 0 24 24" fill="currentColor" className={className} style={style} aria-hidden="true">
<path d="M7 2C4.79 2 3 3.79 3 6c0 1.5.4 3 .9 4.5.3.9.5 2 .6 3 .2 1.6.4 3.2 1 4.7.3.8.7 1.8 1.7 1.8.9 0 1.2-1 1.4-1.8.3-1.1.5-2.4 1.4-2.4s1.1 1.3 1.4 2.4c.2.8.5 1.8 1.4 1.8 1 0 1.4-1 1.7-1.8.6-1.5.8-3.1 1-4.7.1-1 .3-2.1.6-3C20.6 9 21 7.5 21 6c0-2.21-1.79-4-4-4-1.66 0-2.5 1-5 1S8.66 2 7 2Z" />
</svg>
);
+1 -1
View File
@@ -19,7 +19,7 @@
<base href="/">
<link rel="icon" href="data:;base64,iVBORw0KGgo=">
<link rel="icon" type="image/svg+xml" href="/favicon.svg">
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="./index.css">
+10
View File
@@ -0,0 +1,10 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32">
<defs>
<linearGradient id="g" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stop-color="#2563eb"/>
<stop offset="1" stop-color="#4f46e5"/>
</linearGradient>
</defs>
<rect width="32" height="32" rx="8" fill="url(#g)"/>
<path transform="translate(4 4)" fill="#fff" d="M7 2C4.79 2 3 3.79 3 6c0 1.5.4 3 .9 4.5.3.9.5 2 .6 3 .2 1.6.4 3.2 1 4.7.3.8.7 1.8 1.7 1.8.9 0 1.2-1 1.4-1.8.3-1.1.5-2.4 1.4-2.4s1.1 1.3 1.4 2.4c.2.8.5 1.8 1.4 1.8 1 0 1.4-1 1.7-1.8.6-1.5.8-3.1 1-4.7.1-1 .3-2.1.6-3C20.6 9 21 7.5 21 6c0-2.21-1.79-4-4-4-1.66 0-2.5 1-5 1S8.66 2 7 2Z"/>
</svg>

After

Width:  |  Height:  |  Size: 645 B

+3 -3
View File
@@ -10,11 +10,11 @@ import {
ArrowRight,
Menu,
X,
Stethoscope,
Zap,
MessageCircle,
User
} from 'lucide-react';
import { ToothIcon } from '../components/ToothIcon.tsx';
const FeatureCard: React.FC<{ icon: React.ReactNode; title: string; description: string }> = ({ icon, title, description }) => (
<div className="bg-white/70 backdrop-blur-md p-8 rounded-3xl border border-white/50 shadow-[0_8px_30px_rgb(0,0,0,0.04)] hover:shadow-[0_20px_50px_rgba(8,112,184,0.1)] transition-all duration-500 group">
@@ -54,7 +54,7 @@ export const LandingPage: React.FC<{
<div className="max-w-7xl mx-auto px-6 flex justify-between items-center">
<div className="flex items-center gap-2">
<div className="w-10 h-10 bg-gradient-to-tr from-blue-600 to-indigo-600 rounded-xl flex items-center justify-center shadow-lg shadow-blue-200">
<Stethoscope className="text-white" size={24} />
<ToothIcon className="text-white" size={22} />
</div>
<span className="text-2xl font-black text-gray-900 tracking-tighter uppercase italic">Score<span className="text-blue-600">Odonto</span></span>
</div>
@@ -287,7 +287,7 @@ export const LandingPage: React.FC<{
<div className="space-y-6">
<div className="flex items-center gap-2">
<div className="w-8 h-8 bg-blue-600 rounded-lg flex items-center justify-center">
<Stethoscope className="text-white" size={18} />
<ToothIcon className="text-white" size={18} />
</div>
<span className="text-xl font-black text-gray-900 tracking-tighter uppercase italic">Score<span className="text-blue-600">Odonto</span></span>
</div>