Ajusta marca na sidebar

apps/desktop/src/main.tsx

@@ -1646,7 +1646,7 @@ const resolvedAppUrl = useMemo(() => {
             alt="Logotipo Raven"
             width={160}
             height={160}
-            className="h-14 w-auto md:h-16"
+            className="h-16 w-auto md:h-20"
             onError={() => {
               if (logoFallbackRef.current) return
               logoFallbackRef.current = true
@@ -1655,9 +1655,14 @@ const resolvedAppUrl = useMemo(() => {
           />
           <div className="flex flex-col items-center gap-2">
             <span className="text-lg font-semibold text-neutral-900">Raven</span>
-            <span className="inline-flex whitespace-nowrap rounded-full bg-neutral-900 px-2.5 py-1 text-[11px] font-medium text-white">
+            <div className="flex flex-col items-center gap-1">
-              Plataforma de chamados
+              <span className="inline-flex whitespace-nowrap rounded-full bg-neutral-900 px-2.5 py-1 text-[11px] font-medium text-white">
-            </span>
+                Plataforma de
+              </span>
+              <span className="inline-flex whitespace-nowrap rounded-full bg-neutral-900 px-2.5 py-1 text-[11px] font-medium text-white">
+                Chamados
+              </span>
+            </div>
             <StatusBadge status={status} />
           </div>
         </div>

src/components/app-sidebar.tsx

@@ -263,6 +263,7 @@ export function AppSidebar(props: React.ComponentProps<typeof Sidebar>) {
           logoAlt="Logotipo Raven"
           title="Raven"
           subtitle="Plataforma de chamados"
+          showTitle={false}
         />
       </SidebarHeader>
       <SidebarContent>

src/components/sidebar-brand.tsx

@@ -20,26 +20,30 @@ interface SidebarBrandProps {
   logoAlt: string
   title: string
   subtitle: string
+  showTitle?: boolean
 }
 
-export function SidebarBrand({ logoSrc, logoAlt, title, subtitle }: SidebarBrandProps) {
+export function SidebarBrand({ logoSrc, logoAlt, title, subtitle, showTitle = true }: SidebarBrandProps) {
   const { state } = useSidebar()
   const isCollapsed = state === "collapsed"
+  const subtitleBadges = subtitle === "Plataforma de chamados"
+    ? ["Plataforma de", "Chamados"]
+    : [subtitle]
 
   const brandContent = (
     <div className="flex items-center gap-3 transition-all duration-200 ease-linear">
       <div className={cn(
         "flex shrink-0 items-center justify-center transition-all duration-200 ease-linear",
-        isCollapsed ? "size-9" : "size-8"
+        isCollapsed ? "size-16" : "size-14"
       )}>
         <Image
           src={logoSrc}
           alt={logoAlt}
-          width={36}
+          width={64}
-          height={36}
+          height={64}
           className={cn(
             "object-contain transition-all duration-200 ease-linear",
-            isCollapsed ? "size-9" : "size-8"
+            isCollapsed ? "size-16" : "size-14"
           )}
           priority
         />
@@ -48,10 +52,17 @@ export function SidebarBrand({ logoSrc, logoAlt, title, subtitle }: SidebarBrand
         "flex flex-col items-start gap-1 leading-none transition-all duration-200 ease-linear overflow-hidden",
         isCollapsed ? "w-0 opacity-0" : "w-auto opacity-100"
       )}>
-        <span className="text-lg font-semibold whitespace-nowrap">{title}</span>
+        {showTitle ? <span className="text-lg font-semibold whitespace-nowrap">{title}</span> : null}
-        <span className="inline-flex whitespace-nowrap rounded-full bg-neutral-900 px-2.5 py-1 text-[11px] font-medium text-white">
+        <div className="flex flex-col items-start gap-1.5">
-          {subtitle}
+          {subtitleBadges.map((badge) => (
-        </span>
+            <span
+              key={badge}
+              className="inline-flex whitespace-nowrap rounded-full bg-neutral-900 px-3 py-1.5 text-[12px] font-medium text-white"
+            >
+              {badge}
+            </span>
+          ))}
+        </div>
       </div>
     </div>
   )
@@ -79,7 +90,7 @@ export function SidebarBrand({ logoSrc, logoAlt, title, subtitle }: SidebarBrand
               align="center"
               className="bg-sidebar border-sidebar-border text-sidebar-foreground shadow-lg"
             >
-              <p className="font-semibold">{title}</p>
+              {showTitle ? <p className="font-semibold">{title}</p> : null}
               <p className="text-xs text-sidebar-foreground/70">{subtitle}</p>
             </TooltipContent>
           </Tooltip>