Remove OpenCode logo mark from sidebar menu #4050

Closed
opened 2026-02-16 17:42:25 -05:00 by yindo · 1 comment
Owner

Originally created by @shuv1337 on GitHub (Jan 1, 2026).

Originally assigned to: @adamdotdevin on GitHub.

Problem/Context

After the last merge from upstream, the sidebar menu now displays an OpenCode logo mark ('O') at the top. This branding element was added in commit a7c4f83ca ("fix(desktop): remove status bar, new elements in header") and should be removed from the forked version.

The logo mark is rendered as an SVG "O" shape using the Mark component from @opencode-ai/ui/logo.

Acceptance Criteria

  • The OpenCode 'O' logo mark is no longer visible in the sidebar menu
  • The sidebar toggle button remains functional and properly positioned
  • No visual regressions in the sidebar layout
  • The change works correctly in both expanded and collapsed sidebar states

Implementation Details

Files to Modify

packages/app/src/pages/layout.tsx

Remove the Mark import (line 29):

import { Mark } from "@opencode-ai/ui/logo"

Remove the logo mark JSX block (lines 888-891):

<Show when={!sidebarProps.mobile}>
  <A href="/" class="shrink-0 h-8 flex items-center justify-start px-2" data-tauri-drag-region>
    <Mark class="shrink-0" />
  </A>
</Show>

Reference

The Mark component is defined in packages/ui/src/components/logo.tsx:1-14 and renders a simple SVG "O" shape:

export const Mark = (props: { class?: string }) => {
  return (
    <svg viewBox="0 0 16 20" ...>
      <path d="M12 16H4V8H12V16Z" fill="var(--icon-weak-base)" />
      <path d="M12 4H4V16H12V4ZM16 20H0V0H16V20Z" fill="var(--icon-strong-base)" />
    </svg>
  )
}

Sidebar Pattern Reference

Many sidebar implementations use a conditional logo/branding element that can be toggled. In this case, we're simply removing the branding entirely rather than making it configurable. This is a common pattern when forking or white-labeling applications.

Tasks

  • Remove the Mark import from layout.tsx
  • Remove the <Show> block containing the Mark component from SidebarContent
  • Verify sidebar functionality in both desktop and mobile views
  • Test that the sidebar toggle button still works correctly
Originally created by @shuv1337 on GitHub (Jan 1, 2026). Originally assigned to: @adamdotdevin on GitHub. ## Problem/Context After the last merge from upstream, the sidebar menu now displays an OpenCode logo mark ('O') at the top. This branding element was added in commit `a7c4f83ca` ("fix(desktop): remove status bar, new elements in header") and should be removed from the forked version. The logo mark is rendered as an SVG "O" shape using the `Mark` component from `@opencode-ai/ui/logo`. ## Acceptance Criteria - [ ] The OpenCode 'O' logo mark is no longer visible in the sidebar menu - [ ] The sidebar toggle button remains functional and properly positioned - [ ] No visual regressions in the sidebar layout - [ ] The change works correctly in both expanded and collapsed sidebar states ## Implementation Details ### Files to Modify **`packages/app/src/pages/layout.tsx`** Remove the `Mark` import (line 29): ```tsx import { Mark } from "@opencode-ai/ui/logo" ``` Remove the logo mark JSX block (lines 888-891): ```tsx <Show when={!sidebarProps.mobile}> <A href="/" class="shrink-0 h-8 flex items-center justify-start px-2" data-tauri-drag-region> <Mark class="shrink-0" /> </A> </Show> ``` ### Reference The `Mark` component is defined in `packages/ui/src/components/logo.tsx:1-14` and renders a simple SVG "O" shape: ```tsx export const Mark = (props: { class?: string }) => { return ( <svg viewBox="0 0 16 20" ...> <path d="M12 16H4V8H12V16Z" fill="var(--icon-weak-base)" /> <path d="M12 4H4V16H12V4ZM16 20H0V0H16V20Z" fill="var(--icon-strong-base)" /> </svg> ) } ``` ### Sidebar Pattern Reference Many sidebar implementations use a conditional logo/branding element that can be toggled. In this case, we're simply removing the branding entirely rather than making it configurable. This is a common pattern when forking or white-labeling applications. ## Tasks - [ ] Remove the `Mark` import from `layout.tsx` - [ ] Remove the `<Show>` block containing the `Mark` component from `SidebarContent` - [ ] Verify sidebar functionality in both desktop and mobile views - [ ] Test that the sidebar toggle button still works correctly
yindo added the web label 2026-02-16 17:42:25 -05:00
yindo closed this issue 2026-02-16 17:42:25 -05:00
Author
Owner

@shuv1337 commented on GitHub (Jan 1, 2026):

Closing - issue created in wrong repository.

@shuv1337 commented on GitHub (Jan 1, 2026): Closing - issue created in wrong repository.
Sign in to join this conversation.
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: anomalyco/opencode#4050