[backport core/1.41] fix: center ComfyUI logo in sidebar menu button with chevron (#9722) (#10093)

Backport of #9722 to core/1.41

Co-authored-by: Deep Mehta <42841935+deepme987@users.noreply.github.com>
Co-authored-by: github-actions <github-actions@github.com>
Co-authored-by: Alexander Brown <drjkl@comfy.org>
Co-authored-by: GitHub Action <action@github.com>

src/components/sidebar/ComfyMenuButton.vue

@@ -11,10 +11,13 @@
     }"
     @click="onLogoMenuClick($event)"
   >
-    <div class="flex size-8 items-center justify-center rounded-lg bg-black">
+    <div class="grid place-items-center-safe gap-0.5">
+      <i
+        class="col-span-full row-span-full icon-[lucide--chevron-down] size-3 translate-x-4 text-muted-foreground"
+      />
       <ComfyLogo
         alt="ComfyUI Logo"
-        class="comfyui-logo h-[18px] w-[18px] text-white"
+        class="comfyui-logo col-span-full row-span-full size-4.5"
         mode="fill"
       />
     </div>

src/renderer/extensions/vueNodes/widgets/components/layout/WidgetLayoutField.vue

@@ -33,7 +33,7 @@ const hideLayoutField = useHideLayoutField()
       <div
         :class="
           cn(
-            'cursor-default min-w-0 rounded-lg has-[:focus-visible]:ring has-[:focus-visible]:ring-component-node-widget-background-highlighted transition-all',
+            'min-w-0 cursor-default rounded-lg transition-all has-focus-visible:ring has-focus-visible:ring-component-node-widget-background-highlighted',
             widget.borderStyle
           )
         "