External/SnapOtter
1
0
Fork 0
mirror of https://github.com/snapotter-hq/SnapOtter.git synced 2026-08-03 07:46:42 +02:00
Code Issues Packages Projects Releases Wiki Activity

feat(branding): show gem icon in app header as default logo

Browse Source
This commit is contained in:
Siddharth Kumar Sah
2026-03-27 13:50:02 +08:00
parent 036492725e
commit 39dfb93679
1 changed files with 40 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/web/src/components/layout/app-layout.tsx
+40 -6
View File
@@ -11,6 +11,34 @@ import { Footer } from "./footer";
import { Sidebar } from "./sidebar";
import { ToolPanel } from "./tool-panel";
function GemLogo({ className = "h-6 w-6" }: { className?: string }) {
return (
<svg className={className} viewBox="0 0 140 140" fill="none" xmlns="http://www.w3.org/2000/svg">
<polygon points="70,16 100,48 70,60 40,48" fill="currentColor" opacity="1" />
<polygon points="40,48 70,60 70,124 22,60" fill="currentColor" opacity="0.7" />
<polygon points="100,48 70,60 70,124 118,60" fill="currentColor" opacity="0.5" />
<polygon points="70,16 40,48 22,60" fill="currentColor" opacity="0.85" />
<polygon points="70,16 100,48 118,60" fill="currentColor" opacity="0.65" />
<polygon
points="70,16 118,60 70,124 22,60"
fill="none"
stroke="currentColor"
strokeWidth="2.5"
strokeLinejoin="round"
/>
<line
x1="40"
y1="48"
x2="100"
y2="48"
stroke="currentColor"
strokeWidth="1.5"
opacity="0.4"
/>
</svg>
);
}
interface AppLayoutProps {
children?: React.ReactNode;
showToolPanel?: boolean;
@@ -57,9 +85,12 @@ export function AppLayout({ children, showToolPanel = true, onFiles }: AppLayout
alt="Logo"
/>
) : (
<span className="text-sm font-bold text-foreground">
Stirling <span className="text-primary">Image</span>
</span>
<div className="flex items-center gap-2">
<GemLogo className="h-5 w-5 text-primary" />
<span className="text-sm font-bold text-foreground">
Stirling <span className="text-primary">Image</span>
</span>
</div>
)}
<button
type="button"
@@ -102,9 +133,12 @@ export function AppLayout({ children, showToolPanel = true, onFiles }: AppLayout
alt="Logo"
/>
) : (
<span className="text-sm font-bold text-foreground">
Stirling <span className="text-primary">Image</span>
</span>
<div className="flex items-center gap-2">
<GemLogo className="h-5 w-5 text-primary" />
<span className="text-sm font-bold text-foreground">
Stirling <span className="text-primary">Image</span>
</span>
</div>
)}
</div>
)}