mirror of
https://github.com/better-auth/better-auth.git
synced 2026-07-31 10:23:24 -05:00
docs: add branding assets (#1900)
* feat: branding with multiple variant --------- Co-authored-by: Bereket Engida <bekacru@gmail.com>
This commit is contained in:
KinfeMichael Tariku
co-authored by
Bereket Engida
Bereket Engida
parent
f21872da13
commit
80d5a5de0b
@@ -8,6 +8,7 @@ import { GeistSans } from "geist/font/sans";
|
||||
import { baseUrl, createMetadata } from "@/lib/metadata";
|
||||
import { Analytics } from "@vercel/analytics/react";
|
||||
import { ThemeProvider } from "@/components/theme-provider";
|
||||
import { Toaster } from "@/components/ui/sonner";
|
||||
|
||||
export const metadata = createMetadata({
|
||||
title: {
|
||||
@@ -53,6 +54,7 @@ export default function Layout({ children }: { children: ReactNode }) {
|
||||
<NavbarProvider>
|
||||
<Navbar />
|
||||
{children}
|
||||
<Toaster />
|
||||
</NavbarProvider>
|
||||
</RootProvider>
|
||||
<Analytics />
|
||||
|
||||
@@ -0,0 +1,205 @@
|
||||
"use client";
|
||||
|
||||
import type React from "react";
|
||||
import { useState, useRef, useEffect } from "react";
|
||||
import { Code, Image, Type } from "lucide-react";
|
||||
import { toast } from "sonner";
|
||||
import { useTheme } from "next-themes";
|
||||
import type { StaticImageData } from "next/image";
|
||||
|
||||
interface LogoAssets {
|
||||
darkSvg: string;
|
||||
whiteSvg: string;
|
||||
darkWordmark: string;
|
||||
whiteWordmark: string;
|
||||
darkPng: StaticImageData;
|
||||
whitePng: StaticImageData;
|
||||
}
|
||||
|
||||
interface ContextMenuProps {
|
||||
logo: React.ReactNode;
|
||||
logoAssets: LogoAssets;
|
||||
}
|
||||
|
||||
export default function LogoContextMenu({
|
||||
logo,
|
||||
logoAssets,
|
||||
}: ContextMenuProps) {
|
||||
const [showMenu, setShowMenu] = useState<boolean>(false);
|
||||
const menuRef = useRef<HTMLDivElement>(null);
|
||||
const logoRef = useRef<HTMLDivElement>(null);
|
||||
const { theme } = useTheme();
|
||||
|
||||
const handleContextMenu = (e: React.MouseEvent<HTMLDivElement>) => {
|
||||
e.preventDefault();
|
||||
const rect = logoRef.current?.getBoundingClientRect();
|
||||
if (rect) {
|
||||
setShowMenu(true);
|
||||
}
|
||||
};
|
||||
|
||||
const copySvgToClipboard = (svgContent: string, type: string) => {
|
||||
navigator.clipboard
|
||||
.writeText(svgContent)
|
||||
.then(() => {
|
||||
toast.success("", {
|
||||
description: `${type} copied to clipboard`,
|
||||
});
|
||||
})
|
||||
.catch((err) => {
|
||||
toast.error("", {
|
||||
description: `Failed to copy ${type} to clipboard`,
|
||||
});
|
||||
});
|
||||
setShowMenu(false);
|
||||
};
|
||||
|
||||
const downloadPng = (pngData: StaticImageData, fileName: string) => {
|
||||
const link = document.createElement("a");
|
||||
link.href = pngData.src;
|
||||
link.download = fileName;
|
||||
|
||||
document.body.appendChild(link);
|
||||
link.click();
|
||||
document.body.removeChild(link);
|
||||
|
||||
toast.success(`Downloading the asset...`);
|
||||
|
||||
setShowMenu(false);
|
||||
};
|
||||
|
||||
const downloadAllAssets = () => {
|
||||
const link = document.createElement("a");
|
||||
link.href = "/branding/better-auth-brand-assets.zip";
|
||||
link.download = "better-auth-branding-assets.zip";
|
||||
|
||||
document.body.appendChild(link);
|
||||
link.click();
|
||||
document.body.removeChild(link);
|
||||
|
||||
toast.success("Downloading all assets...");
|
||||
setShowMenu(false);
|
||||
};
|
||||
useEffect(() => {
|
||||
const handleClickOutside = (event: MouseEvent) => {
|
||||
if (menuRef.current && !menuRef.current.contains(event.target as Node)) {
|
||||
setShowMenu(false);
|
||||
}
|
||||
};
|
||||
|
||||
document.addEventListener("mousedown", handleClickOutside);
|
||||
return () => {
|
||||
document.removeEventListener("mousedown", handleClickOutside);
|
||||
};
|
||||
}, []);
|
||||
|
||||
const getAsset = <T,>(darkAsset: T, lightAsset: T): T => {
|
||||
return theme === "dark" ? darkAsset : lightAsset;
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="relative">
|
||||
<div
|
||||
ref={logoRef}
|
||||
onContextMenu={handleContextMenu}
|
||||
className="cursor-pointer"
|
||||
>
|
||||
{logo}
|
||||
</div>
|
||||
|
||||
{showMenu && (
|
||||
<div
|
||||
ref={menuRef}
|
||||
className="fixed mx-10 z-50 bg-white dark:bg-black border border-gray-200 dark:border-border p-1 rounded-sm shadow-xl w-56 overflow-hidden animate-fd-dialog-in duration-500"
|
||||
>
|
||||
<div className="">
|
||||
<div className="flex p-0 gap-1 flex-col text-xs">
|
||||
<button
|
||||
onClick={() =>
|
||||
copySvgToClipboard(
|
||||
getAsset(logoAssets.darkSvg, logoAssets.whiteSvg),
|
||||
"Logo SVG",
|
||||
)
|
||||
}
|
||||
className="flex items-center gap-3 w-full p-2 text-black dark:text-white hover:bg-gray-100 dark:hover:bg-zinc-900 rounded-md transition-colors cursor-pointer"
|
||||
>
|
||||
<div className="flex items-center">
|
||||
<span className="text-gray-400 dark:text-zinc-400/30">[</span>
|
||||
|
||||
<Code className="h-[13.8px] w-[13.8px] mx-[3px]" />
|
||||
<span className="text-gray-400 dark:text-zinc-400/30">]</span>
|
||||
</div>
|
||||
<span>Copy Logo as SVG </span>
|
||||
</button>
|
||||
<hr className="border-border/[60%]" />
|
||||
<button
|
||||
onClick={() =>
|
||||
copySvgToClipboard(
|
||||
getAsset(logoAssets.darkWordmark, logoAssets.whiteWordmark),
|
||||
"Logo Wordmark",
|
||||
)
|
||||
}
|
||||
className="flex items-center gap-3 w-full p-2 text-black dark:text-white hover:bg-gray-100 dark:hover:bg-zinc-900 rounded-md transition-colors cursor-pointer"
|
||||
>
|
||||
<div className="flex items-center">
|
||||
<span className="text-gray-400 dark:text-zinc-400/30">[</span>
|
||||
|
||||
<Type className="h-[13.8px] w-[13.8px] mx-[3px]" />
|
||||
<span className="text-gray-400 dark:text-zinc-400/30">]</span>
|
||||
</div>
|
||||
<span>Copy Logo as Wordmark </span>
|
||||
</button>
|
||||
|
||||
<hr className="border-border/[60%]" />
|
||||
<button
|
||||
onClick={() =>
|
||||
downloadPng(
|
||||
getAsset(logoAssets.darkPng, logoAssets.whitePng),
|
||||
`better-auth-logo-${theme}.png`,
|
||||
)
|
||||
}
|
||||
className="flex items-center gap-3 w-full p-2 text-black dark:text-white hover:bg-gray-100 dark:hover:bg-zinc-900 rounded-md transition-colors cursor-pointer"
|
||||
>
|
||||
<div className="flex items-center">
|
||||
<span className="text-gray-400 dark:text-zinc-400/30">[</span>
|
||||
|
||||
<Image className="h-[13.8px] w-[13.8px] mx-[3px]" />
|
||||
<span className="text-gray-400 dark:text-zinc-400/30">]</span>
|
||||
</div>
|
||||
<span>Download Logo PNG</span>
|
||||
</button>
|
||||
<hr className="borde-border" />
|
||||
<button
|
||||
onClick={downloadAllAssets}
|
||||
className="flex items-center gap-3 w-full p-2 text-black dark:text-white hover:bg-gray-100 dark:hover:bg-zinc-900 rounded-md transition-colors cursor-pointer"
|
||||
>
|
||||
<div className="flex items-center">
|
||||
<span className="text-gray-400 dark:text-zinc-400/30">[</span>
|
||||
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="1em"
|
||||
height="1em"
|
||||
viewBox="0 0 24 24"
|
||||
className="h-[13.8px] w-[13.8px] mx-[3px]"
|
||||
>
|
||||
<path
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M4 8v8.8c0 1.12 0 1.68.218 2.108a2 2 0 0 0 .874.874c.427.218.987.218 2.105.218h9.606c1.118 0 1.677 0 2.104-.218c.377-.192.683-.498.875-.874c.218-.428.218-.987.218-2.105V8M4 8h16M4 8l1.365-2.39c.335-.585.503-.878.738-1.092c.209-.189.456-.332.723-.42C7.13 4 7.466 4 8.143 4h7.714c.676 0 1.015 0 1.318.099c.267.087.513.23.721.42c.236.213.404.506.74 1.093L20 8m-8 3v6m0 0l3-2m-3 2l-3-2"
|
||||
></path>
|
||||
</svg>
|
||||
<span className="text-gray-400 dark:text-zinc-400/30">]</span>
|
||||
</div>
|
||||
<span>Brand Assets</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -3,20 +3,73 @@ import { ThemeToggle } from "@/components/theme-toggler";
|
||||
import { NavbarMobile, NavbarMobileBtn } from "./nav-mobile";
|
||||
import { NavLink } from "./nav-link";
|
||||
import { Logo } from "./logo";
|
||||
|
||||
import LogoContextMenu from "./logo-context-menu";
|
||||
import DarkPng from "../public/branding/better-auth-logo-dark.png";
|
||||
import WhitePng from "../public/branding/better-auth-logo-light.png";
|
||||
export const Navbar = () => {
|
||||
const logoAssets = {
|
||||
darkSvg: `
|
||||
<svg width="500" height="500" viewBox="0 0 500 500" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect width="500" height="500" fill="black"/>
|
||||
<rect x="69" y="121" width="86.9879" height="259" fill="white"/>
|
||||
<rect x="337.575" y="121" width="92.4247" height="259" fill="white"/>
|
||||
<rect x="427.282" y="121" width="83.4555" height="174.52" transform="rotate(90 427.282 121)" fill="white"/>
|
||||
<rect x="430" y="296.544" width="83.4555" height="177.238" transform="rotate(90 430 296.544)" fill="white"/>
|
||||
<rect x="252.762" y="204.455" width="92.0888" height="96.7741" transform="rotate(90 252.762 204.455)" fill="white"/>
|
||||
</svg>
|
||||
`,
|
||||
whiteSvg: `
|
||||
<svg width="500" height="500" viewBox="0 0 500 500" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect width="500" height="500" fill="white"/>
|
||||
<rect x="69" y="121" width="86.9879" height="259" fill="black"/>
|
||||
<rect x="337.575" y="121" width="92.4247" height="259" fill="black"/>
|
||||
<rect x="427.282" y="121" width="83.4555" height="174.52" transform="rotate(90 427.282 121)" fill="black"/>
|
||||
<rect x="430" y="296.544" width="83.4555" height="177.238" transform="rotate(90 430 296.544)" fill="black"/>
|
||||
<rect x="252.762" y="204.455" width="92.0888" height="96.7741" transform="rotate(90 252.762 204.455)" fill="black"/>
|
||||
</svg>
|
||||
`,
|
||||
darkWordmark: `
|
||||
<svg width="1024" height="256" viewBox="0 0 1024 256" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect width="1024" height="256" fill="black"/>
|
||||
<rect x="96" y="79" width="34.6988" height="97.5904" fill="white"/>
|
||||
<rect x="203.133" y="79" width="36.8675" height="97.5904" fill="white"/>
|
||||
<rect x="238.916" y="79" width="31.4458" height="69.6144" transform="rotate(90 238.916 79)" fill="white"/>
|
||||
<rect x="240" y="145.145" width="31.4458" height="70.6988" transform="rotate(90 240 145.145)" fill="white"/>
|
||||
<rect x="169.301" y="110.446" width="34.6988" height="38.6024" transform="rotate(90 169.301 110.446)" fill="white"/>
|
||||
<path d="M281.832 162V93.84H305.256C313.32 93.84 319.368 95.312 323.4 98.256C327.432 101.2 329.448 105.84 329.448 112.176C329.448 116.016 328.36 119.248 326.184 121.872C324.072 124.432 321.128 126.064 317.352 126.768C322.024 127.408 325.672 129.232 328.296 132.24C330.984 135.184 332.328 138.864 332.328 143.28C332.328 149.488 330.312 154.16 326.28 157.296C322.248 160.432 316.52 162 309.096 162H281.832ZM290.088 123.312H305.256C310.248 123.312 314.088 122.384 316.776 120.528C319.464 118.608 320.808 115.952 320.808 112.56C320.808 105.456 315.624 101.904 305.256 101.904H290.088V123.312ZM290.088 153.936H309.096C313.768 153.936 317.352 152.976 319.848 151.056C322.408 149.136 323.688 146.384 323.688 142.8C323.688 139.216 322.408 136.432 319.848 134.448C317.352 132.4 313.768 131.376 309.096 131.376H290.088V153.936ZM345.301 162V93.84H388.117V101.904H353.557V123.888H386.965V131.76H353.557V153.936H388.885V162H345.301ZM416.681 162V101.904H395.465V93.84H446.153V101.904H424.937V162H416.681ZM470.587 162V101.904H449.371V93.84H500.059V101.904H478.843V162H470.587ZM507.113 162V93.84H549.929V101.904H515.369V123.888H548.777V131.76H515.369V153.936H550.697V162H507.113ZM564.02 162V93.84H589.844C597.012 93.84 602.676 95.696 606.836 99.408C610.996 103.12 613.076 108.144 613.076 114.48C613.076 117.104 612.532 119.504 611.444 121.68C610.356 123.792 608.948 125.584 607.22 127.056C605.492 128.528 603.604 129.552 601.556 130.128C604.564 130.64 606.932 131.856 608.66 133.776C610.452 135.696 611.508 138.416 611.828 141.936L613.748 162H605.396L603.667 142.8C603.412 139.984 602.388 137.904 600.596 136.56C598.868 135.216 596.02 134.544 592.052 134.544H572.276V162H564.02ZM572.276 126.48H590.9C595.06 126.48 598.356 125.424 600.788 123.312C603.22 121.2 604.436 118.192 604.436 114.288C604.436 110.32 603.188 107.28 600.692 105.168C598.196 102.992 594.58 101.904 589.844 101.904H572.276V126.48ZM623.912 137.808V130.224H655.688V137.808H623.912ZM661.826 162L686.402 93.84H697.538L722.114 162H713.09L706.274 142.608H677.666L670.85 162H661.826ZM680.45 134.544H703.49L691.97 101.04L680.45 134.544ZM755.651 163.536C750.403 163.536 745.827 162.512 741.923 160.464C738.083 158.416 735.107 155.504 732.995 151.728C730.947 147.888 729.923 143.376 729.923 138.192V93.744H738.179V138.192C738.179 143.696 739.683 147.952 742.691 150.96C745.763 153.968 750.083 155.472 755.651 155.472C761.155 155.472 765.411 153.968 768.419 150.96C771.491 147.952 773.027 143.696 773.027 138.192V93.744H781.283V138.192C781.283 143.376 780.227 147.888 778.115 151.728C776.067 155.504 773.123 158.416 769.283 160.464C765.443 162.512 760.899 163.536 755.651 163.536ZM811.087 162V101.904H789.871V93.84H840.559V101.904H819.343V162H811.087ZM847.613 162V93.84H855.869V123.696H890.141V93.84H898.397V162H890.141V131.76H855.869V162H847.613ZM911.443 162V151.152H922.291V162H911.443Z" fill="white"/>
|
||||
</svg>
|
||||
`,
|
||||
whiteWordmark: `
|
||||
<svg width="1024" height="256" viewBox="0 0 1024 256" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect width="1024" height="256" fill="#FFEAEA"/>
|
||||
<rect x="96" y="79" width="34.6988" height="97.5904" fill="black"/>
|
||||
<rect x="203.133" y="79" width="36.8675" height="97.5904" fill="black"/>
|
||||
<rect x="238.916" y="79" width="31.4458" height="69.6144" transform="rotate(90 238.916 79)" fill="black"/>
|
||||
<rect x="240" y="145.145" width="31.4458" height="70.6988" transform="rotate(90 240 145.145)" fill="black"/>
|
||||
<rect x="169.301" y="110.446" width="34.6988" height="38.6024" transform="rotate(90 169.301 110.446)" fill="black"/>
|
||||
<path d="M281.832 162V93.84H305.256C313.32 93.84 319.368 95.312 323.4 98.256C327.432 101.2 329.448 105.84 329.448 112.176C329.448 116.016 328.36 119.248 326.184 121.872C324.072 124.432 321.128 126.064 317.352 126.768C322.024 127.408 325.672 129.232 328.296 132.24C330.984 135.184 332.328 138.864 332.328 143.28C332.328 149.488 330.312 154.16 326.28 157.296C322.248 160.432 316.52 162 309.096 162H281.832ZM290.088 123.312H305.256C310.248 123.312 314.088 122.384 316.776 120.528C319.464 118.608 320.808 115.952 320.808 112.56C320.808 105.456 315.624 101.904 305.256 101.904H290.088V123.312ZM290.088 153.936H309.096C313.768 153.936 317.352 152.976 319.848 151.056C322.408 149.136 323.688 146.384 323.688 142.8C323.688 139.216 322.408 136.432 319.848 134.448C317.352 132.4 313.768 131.376 309.096 131.376H290.088V153.936ZM345.301 162V93.84H388.117V101.904H353.557V123.888H386.965V131.76H353.557V153.936H388.885V162H345.301ZM416.681 162V101.904H395.465V93.84H446.153V101.904H424.937V162H416.681ZM470.587 162V101.904H449.371V93.84H500.059V101.904H478.843V162H470.587ZM507.113 162V93.84H549.929V101.904H515.369V123.888H548.777V131.76H515.369V153.936H550.697V162H507.113ZM564.02 162V93.84H589.844C597.012 93.84 602.676 95.696 606.836 99.408C610.996 103.12 613.076 108.144 613.076 114.48C613.076 117.104 612.532 119.504 611.444 121.68C610.356 123.792 608.948 125.584 607.22 127.056C605.492 128.528 603.604 129.552 601.556 130.128C604.564 130.64 606.932 131.856 608.66 133.776C610.452 135.696 611.508 138.416 611.828 141.936L613.748 162H605.396L603.667 142.8C603.412 139.984 602.388 137.904 600.596 136.56C598.868 135.216 596.02 134.544 592.052 134.544H572.276V162H564.02ZM572.276 126.48H590.9C595.06 126.48 598.356 125.424 600.788 123.312C603.22 121.2 604.436 118.192 604.436 114.288C604.436 110.32 603.188 107.28 600.692 105.168C598.196 102.992 594.58 101.904 589.844 101.904H572.276V126.48ZM623.912 137.808V130.224H655.688V137.808H623.912ZM661.826 162L686.402 93.84H697.538L722.114 162H713.09L706.274 142.608H677.666L670.85 162H661.826ZM680.45 134.544H703.49L691.97 101.04L680.45 134.544ZM755.651 163.536C750.403 163.536 745.827 162.512 741.923 160.464C738.083 158.416 735.107 155.504 732.995 151.728C730.947 147.888 729.923 143.376 729.923 138.192V93.744H738.179V138.192C738.179 143.696 739.683 147.952 742.691 150.96C745.763 153.968 750.083 155.472 755.651 155.472C761.155 155.472 765.411 153.968 768.419 150.96C771.491 147.952 773.027 143.696 773.027 138.192V93.744H781.283V138.192C781.283 143.376 780.227 147.888 778.115 151.728C776.067 155.504 773.123 158.416 769.283 160.464C765.443 162.512 760.899 163.536 755.651 163.536ZM811.087 162V101.904H789.871V93.84H840.559V101.904H819.343V162H811.087ZM847.613 162V93.84H855.869V123.696H890.141V93.84H898.397V162H890.141V131.76H855.869V162H847.613ZM911.443 162V151.152H922.291V162H911.443Z" fill="black"/>
|
||||
</svg>
|
||||
`,
|
||||
darkPng: DarkPng,
|
||||
whitePng: WhitePng,
|
||||
};
|
||||
return (
|
||||
<div className="flex flex-col sticky top-0 bg-background backdrop-blur-md z-30 ">
|
||||
<nav className="md:grid grid-cols-12 border-b top-0 flex items-center justify-between">
|
||||
<div className="flex flex-col sticky top-0 bg-background backdrop-blur-md z-30">
|
||||
<nav className="md:grid grid-cols-12 md:border-b top-0 flex items-center justify-between ">
|
||||
<Link
|
||||
href="/"
|
||||
className="md:border-r px-4 py-4 text-foreground md:col-span-2 shrink-0 transition-colors md:px-5 md:w-[268px] lg:w-[286px]"
|
||||
className="md:border-r md:px-5 px-2.5 py-4 text-foreground md:col-span-2 shrink-0 transition-colors md:w-[--fd-sidebar-width]"
|
||||
>
|
||||
<div className="flex flex-col gap-2 w-full">
|
||||
<div className="flex items-center gap-2">
|
||||
<Logo />
|
||||
<p>BETTER-AUTH.</p>
|
||||
</div>
|
||||
<LogoContextMenu
|
||||
logo={
|
||||
<div className="flex items-center gap-2">
|
||||
<Logo />
|
||||
<p className="select-none">BETTER-AUTH.</p>
|
||||
</div>
|
||||
}
|
||||
logoAssets={logoAssets}
|
||||
/>
|
||||
</div>
|
||||
</Link>
|
||||
<div className="md:col-span-10 flex items-center justify-end relative">
|
||||
|
||||
Binary file not shown.
Binary file not shown.
|
After Width: | Height: | Size: 2.2 KiB |
@@ -0,0 +1,8 @@
|
||||
<svg width="500" height="500" viewBox="0 0 500 500" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect width="500" height="500" fill="black"/>
|
||||
<rect x="69" y="121" width="86.9879" height="259" fill="white"/>
|
||||
<rect x="337.575" y="121" width="92.4247" height="259" fill="white"/>
|
||||
<rect x="427.282" y="121" width="83.4555" height="174.52" transform="rotate(90 427.282 121)" fill="white"/>
|
||||
<rect x="430" y="296.544" width="83.4555" height="177.238" transform="rotate(90 430 296.544)" fill="white"/>
|
||||
<rect x="252.762" y="204.455" width="92.0888" height="96.7741" transform="rotate(90 252.762 204.455)" fill="white"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 622 B |
Binary file not shown.
|
After Width: | Height: | Size: 2.2 KiB |
@@ -0,0 +1,8 @@
|
||||
<svg width="500" height="500" viewBox="0 0 500 500" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect width="500" height="500" fill="white"/>
|
||||
<rect x="69" y="121" width="86.9879" height="259" fill="black"/>
|
||||
<rect x="337.575" y="121" width="92.4247" height="259" fill="black"/>
|
||||
<rect x="427.282" y="121" width="83.4555" height="174.52" transform="rotate(90 427.282 121)" fill="black"/>
|
||||
<rect x="430" y="296.544" width="83.4555" height="177.238" transform="rotate(90 430 296.544)" fill="black"/>
|
||||
<rect x="252.762" y="204.455" width="92.0888" height="96.7741" transform="rotate(90 252.762 204.455)" fill="black"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 622 B |
Binary file not shown.
|
After Width: | Height: | Size: 5.4 KiB |
@@ -0,0 +1,9 @@
|
||||
<svg width="1024" height="256" viewBox="0 0 1024 256" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect width="1024" height="256" fill="black"/>
|
||||
<rect x="96" y="79" width="34.6988" height="97.5904" fill="white"/>
|
||||
<rect x="203.133" y="79" width="36.8675" height="97.5904" fill="white"/>
|
||||
<rect x="238.916" y="79" width="31.4458" height="69.6144" transform="rotate(90 238.916 79)" fill="white"/>
|
||||
<rect x="240" y="145.145" width="31.4458" height="70.6988" transform="rotate(90 240 145.145)" fill="white"/>
|
||||
<rect x="169.301" y="110.446" width="34.6988" height="38.6024" transform="rotate(90 169.301 110.446)" fill="white"/>
|
||||
<path d="M281.832 162V93.84H305.256C313.32 93.84 319.368 95.312 323.4 98.256C327.432 101.2 329.448 105.84 329.448 112.176C329.448 116.016 328.36 119.248 326.184 121.872C324.072 124.432 321.128 126.064 317.352 126.768C322.024 127.408 325.672 129.232 328.296 132.24C330.984 135.184 332.328 138.864 332.328 143.28C332.328 149.488 330.312 154.16 326.28 157.296C322.248 160.432 316.52 162 309.096 162H281.832ZM290.088 123.312H305.256C310.248 123.312 314.088 122.384 316.776 120.528C319.464 118.608 320.808 115.952 320.808 112.56C320.808 105.456 315.624 101.904 305.256 101.904H290.088V123.312ZM290.088 153.936H309.096C313.768 153.936 317.352 152.976 319.848 151.056C322.408 149.136 323.688 146.384 323.688 142.8C323.688 139.216 322.408 136.432 319.848 134.448C317.352 132.4 313.768 131.376 309.096 131.376H290.088V153.936ZM345.301 162V93.84H388.117V101.904H353.557V123.888H386.965V131.76H353.557V153.936H388.885V162H345.301ZM416.681 162V101.904H395.465V93.84H446.153V101.904H424.937V162H416.681ZM470.587 162V101.904H449.371V93.84H500.059V101.904H478.843V162H470.587ZM507.113 162V93.84H549.929V101.904H515.369V123.888H548.777V131.76H515.369V153.936H550.697V162H507.113ZM564.02 162V93.84H589.844C597.012 93.84 602.676 95.696 606.836 99.408C610.996 103.12 613.076 108.144 613.076 114.48C613.076 117.104 612.532 119.504 611.444 121.68C610.356 123.792 608.948 125.584 607.22 127.056C605.492 128.528 603.604 129.552 601.556 130.128C604.564 130.64 606.932 131.856 608.66 133.776C610.452 135.696 611.508 138.416 611.828 141.936L613.748 162H605.396L603.667 142.8C603.412 139.984 602.388 137.904 600.596 136.56C598.868 135.216 596.02 134.544 592.052 134.544H572.276V162H564.02ZM572.276 126.48H590.9C595.06 126.48 598.356 125.424 600.788 123.312C603.22 121.2 604.436 118.192 604.436 114.288C604.436 110.32 603.188 107.28 600.692 105.168C598.196 102.992 594.58 101.904 589.844 101.904H572.276V126.48ZM623.912 137.808V130.224H655.688V137.808H623.912ZM661.826 162L686.402 93.84H697.538L722.114 162H713.09L706.274 142.608H677.666L670.85 162H661.826ZM680.45 134.544H703.49L691.97 101.04L680.45 134.544ZM755.651 163.536C750.403 163.536 745.827 162.512 741.923 160.464C738.083 158.416 735.107 155.504 732.995 151.728C730.947 147.888 729.923 143.376 729.923 138.192V93.744H738.179V138.192C738.179 143.696 739.683 147.952 742.691 150.96C745.763 153.968 750.083 155.472 755.651 155.472C761.155 155.472 765.411 153.968 768.419 150.96C771.491 147.952 773.027 143.696 773.027 138.192V93.744H781.283V138.192C781.283 143.376 780.227 147.888 778.115 151.728C776.067 155.504 773.123 158.416 769.283 160.464C765.443 162.512 760.899 163.536 755.651 163.536ZM811.087 162V101.904H789.871V93.84H840.559V101.904H819.343V162H811.087ZM847.613 162V93.84H855.869V123.696H890.141V93.84H898.397V162H890.141V131.76H855.869V162H847.613ZM911.443 162V151.152H922.291V162H911.443Z" fill="white"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 3.4 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 5.8 KiB |
@@ -0,0 +1,9 @@
|
||||
<svg width="1024" height="256" viewBox="0 0 1024 256" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect width="1024" height="256" fill="#FFEAEA"/>
|
||||
<rect x="96" y="79" width="34.6988" height="97.5904" fill="black"/>
|
||||
<rect x="203.133" y="79" width="36.8675" height="97.5904" fill="black"/>
|
||||
<rect x="238.916" y="79" width="31.4458" height="69.6144" transform="rotate(90 238.916 79)" fill="black"/>
|
||||
<rect x="240" y="145.145" width="31.4458" height="70.6988" transform="rotate(90 240 145.145)" fill="black"/>
|
||||
<rect x="169.301" y="110.446" width="34.6988" height="38.6024" transform="rotate(90 169.301 110.446)" fill="black"/>
|
||||
<path d="M281.832 162V93.84H305.256C313.32 93.84 319.368 95.312 323.4 98.256C327.432 101.2 329.448 105.84 329.448 112.176C329.448 116.016 328.36 119.248 326.184 121.872C324.072 124.432 321.128 126.064 317.352 126.768C322.024 127.408 325.672 129.232 328.296 132.24C330.984 135.184 332.328 138.864 332.328 143.28C332.328 149.488 330.312 154.16 326.28 157.296C322.248 160.432 316.52 162 309.096 162H281.832ZM290.088 123.312H305.256C310.248 123.312 314.088 122.384 316.776 120.528C319.464 118.608 320.808 115.952 320.808 112.56C320.808 105.456 315.624 101.904 305.256 101.904H290.088V123.312ZM290.088 153.936H309.096C313.768 153.936 317.352 152.976 319.848 151.056C322.408 149.136 323.688 146.384 323.688 142.8C323.688 139.216 322.408 136.432 319.848 134.448C317.352 132.4 313.768 131.376 309.096 131.376H290.088V153.936ZM345.301 162V93.84H388.117V101.904H353.557V123.888H386.965V131.76H353.557V153.936H388.885V162H345.301ZM416.681 162V101.904H395.465V93.84H446.153V101.904H424.937V162H416.681ZM470.587 162V101.904H449.371V93.84H500.059V101.904H478.843V162H470.587ZM507.113 162V93.84H549.929V101.904H515.369V123.888H548.777V131.76H515.369V153.936H550.697V162H507.113ZM564.02 162V93.84H589.844C597.012 93.84 602.676 95.696 606.836 99.408C610.996 103.12 613.076 108.144 613.076 114.48C613.076 117.104 612.532 119.504 611.444 121.68C610.356 123.792 608.948 125.584 607.22 127.056C605.492 128.528 603.604 129.552 601.556 130.128C604.564 130.64 606.932 131.856 608.66 133.776C610.452 135.696 611.508 138.416 611.828 141.936L613.748 162H605.396L603.667 142.8C603.412 139.984 602.388 137.904 600.596 136.56C598.868 135.216 596.02 134.544 592.052 134.544H572.276V162H564.02ZM572.276 126.48H590.9C595.06 126.48 598.356 125.424 600.788 123.312C603.22 121.2 604.436 118.192 604.436 114.288C604.436 110.32 603.188 107.28 600.692 105.168C598.196 102.992 594.58 101.904 589.844 101.904H572.276V126.48ZM623.912 137.808V130.224H655.688V137.808H623.912ZM661.826 162L686.402 93.84H697.538L722.114 162H713.09L706.274 142.608H677.666L670.85 162H661.826ZM680.45 134.544H703.49L691.97 101.04L680.45 134.544ZM755.651 163.536C750.403 163.536 745.827 162.512 741.923 160.464C738.083 158.416 735.107 155.504 732.995 151.728C730.947 147.888 729.923 143.376 729.923 138.192V93.744H738.179V138.192C738.179 143.696 739.683 147.952 742.691 150.96C745.763 153.968 750.083 155.472 755.651 155.472C761.155 155.472 765.411 153.968 768.419 150.96C771.491 147.952 773.027 143.696 773.027 138.192V93.744H781.283V138.192C781.283 143.376 780.227 147.888 778.115 151.728C776.067 155.504 773.123 158.416 769.283 160.464C765.443 162.512 760.899 163.536 755.651 163.536ZM811.087 162V101.904H789.871V93.84H840.559V101.904H819.343V162H811.087ZM847.613 162V93.84H855.869V123.696H890.141V93.84H898.397V162H890.141V131.76H855.869V162H847.613ZM911.443 162V151.152H922.291V162H911.443Z" fill="black"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 3.4 KiB |
Reference in New Issue
Block a user